/* --------------------------------------------------------------------------
   MJS Develop Chat - custom stylesheet

   ServerModule.CustomFiles に 'files/app.css' を登録してあるので、
   uniGUI(Ext JS) 側の CSS より後に読み込まれ、ここでの指定が勝つ。
   基調色 #1f5f8b（紺青）は仮置き。
   -------------------------------------------------------------------------- */

/* ==== ログイン ============================================================= */
.login-title { font-size: 20px !important; font-weight: bold; color: #1f5f8b; }
.login-sub   { font-size: 14px !important; color: #555; }
.login-error { color: #c0392b !important; font-weight: bold; }

/* ==== ヘッダ =============================================================== */
.app-header { background: #1f5f8b !important; }
.app-header .x-autocontainer-innerCt { background: #1f5f8b; }
.app-title { font-size: 18px !important; font-weight: bold; color: #fff !important; }
.hdr-text  { color: #fff !important; }
/* 一般モード（管理者が一般ユーザーの見た目を確かめている。2026-11-05 #1） */
.app-header.app-preview { background: #b35c00 !important; }
.app-header.app-preview .x-autocontainer-innerCt { background: #b35c00; }

/* ==== 左メニュー =========================================================== */
.nav-side { background: #f4f6f8; border-right: 1px solid #d8dde3; }
.nav { padding: 8px 0; font-size: 13px; }
.nav-head { margin: 14px 12px 4px; color: #7a8590; font-size: 11px; font-weight: bold; letter-spacing: 0.1em; }
.nav-item { padding: 8px 14px; cursor: pointer; border-left: 3px solid transparent; }
.nav-item:hover { background: #e6edf3; }
.nav-item.active { background: #dce8f2; border-left-color: #1f5f8b; font-weight: bold; }
.nav-item i { width: 18px; color: #1f5f8b; }
/* 左メニューの ＋（ルーム作成メニュー）と ✎（ルーム名の変更）。2026-10-27 #2 */
.nav-plus { float: right; width: 20px; height: 18px; line-height: 18px; text-align: center; border-radius: 4px; color: #7a8590; cursor: pointer; }
.nav-plus i { width: auto !important; color: inherit !important; font-size: 11px; }
.nav-plus:hover { background: #1f5f8b; color: #fff; }
.nav-head .nav-plus { margin-right: -4px; letter-spacing: 0; }
.nav-item { position: relative; }
.nav-edit { display: none; position: absolute; right: 6px; top: 50%; transform: translateY(-50%); width: 22px; height: 20px; line-height: 20px;
  text-align: center; border-radius: 4px; background: #fff; color: #7a8590; box-shadow: 0 0 0 1px #d8dde3; }
.nav-edit i { width: auto !important; color: inherit !important; font-size: 11px; }
.nav-item:hover .nav-edit { display: block; }
.nav-edit:hover { background: #1f5f8b; color: #fff; }
.nav-menu { position: fixed; z-index: 30000; min-width: 230px; background: #fff; border: 1px solid #c9d3dc; border-radius: 6px;
  box-shadow: 0 6px 18px rgba(0,0,0,0.18); padding: 4px 0; font-size: 13px; }
.nav-menu-head { padding: 6px 12px 4px; font-size: 11px; font-weight: bold; color: #7a8590; letter-spacing: 0.1em; }
.nav-menu-item { padding: 7px 12px; cursor: pointer; }
.nav-menu-item i { width: 18px; color: #1f5f8b; }
.nav-menu-item:hover { background: #dce8f2; }
.nav-menu-sub { margin-left: 22px; font-size: 11px; color: #8a96a2; }
.nav-menu-foot { margin-top: 4px; padding: 6px 12px 4px; border-top: 1px solid #edf0f3; font-size: 11px; color: #8a96a2; }
/* ルームのグループと DnD（2026-10-27 #3） */
.nav-grp { position: relative; margin: 8px 6px 2px; padding: 5px 8px; border-radius: 4px; background: #e9eef3; color: #34495e;
  font-size: 12px; font-weight: bold; cursor: pointer; user-select: none; }
.nav-grp:hover { background: #dce5ee; }
.nav-grp .nav-fold-icon { color: #7a8590; }
.nav-gtools { display: none; position: absolute; right: 6px; top: 50%; transform: translateY(-50%); }
.nav-grp:hover .nav-gtools { display: inline-block; }
.nav-gbtn { display: inline-block; width: 20px; height: 18px; line-height: 18px; text-align: center; margin-left: 2px; border-radius: 4px;
  background: #fff; color: #7a8590; box-shadow: 0 0 0 1px #d8dde3; font-weight: normal; }
.nav-gbtn i { font-size: 10px; }
.nav-gbtn:hover { background: #1f5f8b; color: #fff; }
.nav-in-grp { padding-left: 22px; }
.nav-grp-empty { padding-left: 22px; font-style: italic; }
.nav-badge { display: inline-block; min-width: 16px; padding: 0 5px; border-radius: 9px; background: #c0392b; color: #fff;
  font-size: 10px; font-weight: bold; line-height: 16px; text-align: center; letter-spacing: 0; }
.nav-badge-room { float: right; margin-right: 6px; margin-top: 1px; }
.nav [draggable="true"] { -webkit-user-drag: element; }
.nav .dragging { opacity: 0.4; }
.nav .drop-before { box-shadow: inset 0 2px 0 #1f5f8b; }
.nav .drop-after { box-shadow: inset 0 -2px 0 #1f5f8b; }
.nav .drop-into { outline: 2px dashed #1f5f8b; outline-offset: -2px; }
/* 要件ツリーのドラッグ（2026-10-27 #6） */
.treebox [draggable="true"] { -webkit-user-drag: element; }
.treebox .dragging { opacity: 0.4; }
.treebox .drop-before { box-shadow: inset 0 2px 0 #1f5f8b; }
.treebox .drop-after { box-shadow: inset 0 -2px 0 #1f5f8b; }
.treebox .drop-into { outline: 2px dashed #1f5f8b; outline-offset: -2px; background: #eef4fa; }
/* 自分の設定の QR（2026-10-27 #9） */
.my-qr-btn { padding: 7px 14px; border: 0; border-radius: 4px; background: #2e86c1; color: #fff; font-size: 13px; cursor: pointer; }
.my-qr-btn:hover { background: #1f5f8b; }
.my-qr-btn i { margin-right: 4px; }
.my-qr-info { font-size: 13px; line-height: 1.7; text-align: center; }
.my-qr-info b { color: #c0392b; }
/* メール設定（2026-10-28 #3） */
.ml-page { padding: 18px 24px; max-width: 1200px; font-size: 13px; }
.ml-page > .muted { max-width: 640px; }
.ml-head { margin: 18px 0 8px; }
.ml-tools { display: flex; gap: 6px; margin-bottom: 6px; }
.ml-btn { width: 32px; height: 28px; border: 1px solid #c9d3dc; border-radius: 4px; background: #fff; color: #1f5f8b; cursor: pointer; }
.ml-btn:hover { background: #dce8f2; }
.ml-list { display: inline-block; max-width: 100%; box-sizing: border-box; overflow-x: auto; border: 1px solid #dde3e9; border-radius: 4px; padding: 6px; background: #fafbfc; }
/* アドレス × 会社のチェック（2026-11-05 #3）。会社名は縦書きの見出し */
.ml-grid { border-collapse: collapse; }
.ml-grid th { font-weight: normal; color: #555; vertical-align: bottom; }
.ml-ah { text-align: left; padding: 4px 6px; }
.ml-co { width: 30px; padding: 4px 2px 6px; border-left: 1px solid #e6eaee; }
.ml-co span { writing-mode: vertical-rl; display: inline-block; max-height: 140px; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; font-size: 12px; line-height: 1.2; }
.ml-ac { width: 300px; padding: 3px; }
.ml-cc { text-align: center; border-left: 1px solid #e6eaee; }
.ml-chk { width: 16px; height: 16px; margin: 0; cursor: pointer; vertical-align: middle; }
.ml-row.sel td { background: #dce8f2; }
.ml-row:hover td.ml-cc { background: #eef3f8; }
.ml-addr { width: 100%; box-sizing: border-box; padding: 6px 8px; border: 1px solid #c9d3dc; border-radius: 3px; font-size: 13px; }
.ml-act { margin-top: 12px; display: flex; gap: 8px; }
.ml-save, .ml-test { padding: 7px 14px; border: 0; border-radius: 4px; color: #fff; font-size: 13px; cursor: pointer; }
.ml-save { background: #2e86c1; }
.ml-test { background: #7f8c8d; }
.ml-save i, .ml-test i { margin-right: 4px; }
/* 畳める見出し（会社一覧。app.js の appNavFold） */
.nav-fold { cursor: pointer; user-select: none; }
.nav-fold:hover { color: #1f5f8b; }
.nav-fold-icon { width: 12px; transition: transform 0.15s; }
.nav-co { max-height: 40vh; overflow-y: auto; }
.nav-type { float: right; font-size: 10px; color: #8a96a2; }
.nav-bar { display: flex; justify-content: flex-end; padding: 0 6px 2px; }
.nav-close { width: 26px; height: 22px; display: flex; align-items: center; justify-content: center; border-radius: 4px; color: #7a8590; cursor: pointer; }
.nav-close:hover { background: #e6edf3; color: #1f5f8b; }
/* 左メニューを閉じている間の「メニューを開く」（画面左上に浮かせる。ヘッダ 48px の下） */
.nav-open-btn { position: fixed; top: 56px; left: 8px; z-index: 50; width: 34px; height: 34px; display: none; align-items: center; justify-content: center;
  border-radius: 50%; background: #1f5f8b; color: #fff; font-size: 15px; cursor: pointer; box-shadow: 0 2px 6px rgba(0,0,0,0.3); opacity: 0.9; }
.nav-open-btn:hover { opacity: 1; background: #174a6d; }
.nav-note { padding: 6px 14px; color: #8a96a2; font-size: 12px; line-height: 1.5; }

/* ==== 共通 ================================================================= */
.toolbar { background: #fafbfc; border-bottom: 1px solid #e3e7eb; }
.room-title { font-size: 15px !important; font-weight: bold; }
.page { padding: 16px 20px; font-size: 13px; }
.page-title { font-size: 17px; font-weight: bold; margin-bottom: 12px; }
.muted { color: #8a96a2 !important; }
.empty { color: #8a96a2; padding: 16px; text-align: center; }
.box { border: 1px solid #d8dde3; border-radius: 6px; padding: 10px 14px; margin-bottom: 16px; background: #fafcfe; }
.box-head { font-weight: bold; margin-bottom: 6px; }
.url code { background: #eef2f5; padding: 2px 6px; border-radius: 4px; font-size: 12px; word-break: break-all; }
.pw-show input { font-family: Consolas, monospace !important; font-size: 16px !important; letter-spacing: 0.08em; }

table.grid { border-collapse: collapse; width: 100%; font-size: 13px; }
table.grid th { background: #eef2f5; text-align: left; padding: 6px 8px; border-bottom: 1px solid #d0d7de; white-space: nowrap; }
table.grid td { padding: 6px 8px; border-bottom: 1px solid #edf0f3; vertical-align: top; }
table.grid td.num { text-align: right; }
table.grid td.acts { white-space: nowrap; }
table.grid.click tr:not(:first-child) { cursor: pointer; }
table.grid.click tr:not(:first-child):hover { background: #f3f8fc; }

.st { white-space: nowrap; display: inline-block; padding: 0 7px; border-radius: 10px; font-size: 11px; line-height: 18px; color: #fff; }
.st0 { background: #c0392b; }   /* 未対応 */
.st1 { background: #d68910; }   /* 対応中 */
.st2 { background: #27ae60; }   /* 完了 */
.st3 { background: #7d3c98; }   /* 要件化（要望） */
/* ダッシュボードの新着チャット（2026-10-26 #6） */
.dash-head.new { background: #2471a3; }
.m-sec.new { border-left-color: #2471a3; }
.dash-group { margin: 10px 4px 4px; padding: 2px 6px; font-size: 12px; font-weight: bold; color: #1f5f8b; border-bottom: 1px solid #c9d6e2; }
.card.new { border-left: 3px solid #2471a3; }
.dash-col-wide { grid-column: span 3; }
/* 要望 ⇔ 要件のリンク */
.req-link { margin: 8px 0; padding: 6px 10px; background: #f4ecf7; border-left: 3px solid #7d3c98; font-size: 13px; }
.req-link a { color: #5b2c6f; }
/* ルーム移動（uDlgMove） */
.mv { display: flex; flex-direction: column; height: 100%; box-sizing: border-box; padding: 10px 12px; font-size: 13px; }
.mv-tabs { display: flex; gap: 4px; border-bottom: 2px solid #1f5f8b; }
.mv-tab { padding: 7px 12px; cursor: pointer; border-radius: 4px 4px 0 0; background: #e8edf2; color: #34495e; }
.mv-tab:hover { background: #dce8f2; }
.mv-tab.on { background: #1f5f8b; color: #fff; font-weight: bold; }
.mv-tab i { margin-right: 2px; }
.mv-body { flex: 1; overflow-y: auto; padding-top: 8px; }
.mv-note { color: #5d6d7e; line-height: 1.6; margin-bottom: 8px; }
.mv-head { margin: 10px 0 4px; font-weight: bold; color: #1f5f8b; }
.mv .pick { border: 1px solid #dde3e9; border-radius: 4px; max-height: 150px; overflow-y: auto; }
.mv .pick.mv-tree { max-height: 290px; }
.mv-node i { width: 16px; color: #1f5f8b; }
.pick-row.sel { background: #1f5f8b; color: #fff; }
.pick-row.sel i { color: #fff; }
.mv-act { padding-top: 10px; text-align: right; }
.mv-where { margin-right: 12px; color: #5b2c6f; font-weight: bold; }
.mv-btn { padding: 7px 18px; border: 0; border-radius: 4px; background: #2e86c1; color: #fff; font-size: 13px; cursor: pointer; }
.mv-btn:disabled { background: #b8c4cf; cursor: default; }
.rst { white-space: nowrap; display: inline-block; padding: 0 6px; border-radius: 10px; font-size: 10px; line-height: 16px; color: #fff; }
.rst0 { background: #95a5a6; } .rst1 { background: #d68910; } .rst2 { background: #2e86c1; } .rst3 { background: #27ae60; }
.badge { display: inline-block; padding: 0 6px; border-radius: 9px; font-size: 11px; line-height: 17px; }
.badge.need { background: #fdecea; color: #c0392b; border: 1px solid #f5b7b1; }
/* 未読の投稿（要件のツリー・ISSUE 一覧。2026-10-27 #5）。未完了 ISSUE の数（.badge.need）と見分けるため塗りつぶし＋吹き出し */
.badge-unread { display: inline-block; padding: 0 6px; border-radius: 9px; background: #c0392b; color: #fff; font-size: 11px; font-weight: bold; line-height: 17px; white-space: nowrap; }
.badge-unread i { font-size: 9px; color: #fff !important; width: auto !important; }
td.nowrap { white-space: nowrap; }
.badge.done { background: #eafaf1; color: #1e8449; border: 1px solid #a9dfbf; }
.role-9 { color: #8e44ad; font-weight: bold; } .role-2 { color: #1f5f8b; font-weight: bold; }

/* ==== ダッシュボード ======================================================= */
.dash { background: #f4f6f8; }
.dash-title { font-size: 17px; font-weight: bold; padding: 14px 18px 0; }
.dash-cols { display: grid; grid-template-columns: repeat(4, minmax(220px, 1fr)); gap: 14px; padding: 12px 18px 18px; }
.dash-col { min-width: 0; }
.dash-head { font-weight: bold; padding: 6px 10px; border-radius: 6px 6px 0 0; color: #fff; }
.dash-head.need { background: #c0392b; } .dash-head.open { background: #d68910; } .dash-head.done { background: #27ae60; }
/* 完了の期間（2026-11-05 #2） */
.dash-range { float: right; font-size: 12px; padding: 0 2px; border: none; border-radius: 4px; color: #1e6b3d; background: #fff; cursor: pointer; }
.dash-empty { text-align: center; color: #8a96a2; padding: 80px 20px; font-size: 14px; line-height: 2; }
.dash-empty i { font-size: 40px; }
.card { background: #fff; border: 1px solid #dde3e8; border-radius: 6px; padding: 8px 10px; margin-top: 8px; cursor: pointer; }
.card:hover { border-color: #1f5f8b; box-shadow: 0 1px 4px rgba(0,0,0,0.08); }
.card-room { font-size: 11px; color: #5d6d7e; }
.card-body { margin: 4px 0; font-size: 13px; word-break: break-all; }
.card-foot { font-size: 11px; color: #8a96a2; }

/* ==== 一覧（要望）・ツリー（要件） ========================================= */
.items .item { padding: 8px 12px; border-bottom: 1px solid #edf0f3; cursor: pointer; font-size: 13px; }
.items .item:hover { background: #f3f8fc; }
.items .item.sel { background: #dce8f2; }
.item-foot { font-size: 11px; color: #8a96a2; margin-top: 2px; }
.treebox { padding: 4px 0; font-size: 13px; }
.node { padding: 5px 8px; cursor: pointer; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.node:hover { background: #f3f8fc; }
.node.sel { background: #dce8f2; font-weight: bold; }
.node.root { color: #1f5f8b; border-bottom: 1px dashed #d8dde3; }
.node i { color: #7f8c8d; width: 16px; }

.detail { padding: 14px 18px; font-size: 13px; }
.detail-title { font-size: 17px; font-weight: bold; margin-bottom: 6px; }
.detail-meta { color: #5d6d7e; margin-bottom: 10px; }
.detail-body { line-height: 1.7; white-space: normal; word-break: break-all; }
.crumb { color: #8a96a2; font-size: 12px; margin-bottom: 6px; }
.sec-head { font-weight: bold; margin: 16px 0 6px; padding-bottom: 3px; border-bottom: 2px solid #1f5f8b; }
.report { margin-top: 12px; background: #eafaf1; border: 1px solid #a9dfbf; border-radius: 6px; padding: 8px 12px; line-height: 1.6; }

/* ==== 添付 ================================================================= */
.att-list { margin-top: 10px; }
.att img { max-width: 160px; max-height: 110px; border: 1px solid #d8dde3; border-radius: 4px; margin: 0 6px 6px 0; vertical-align: top; }
.att-edit { font-size: 12px; }
.att-chip { display: inline-block; background: #eef2f5; border-radius: 12px; padding: 2px 10px; margin: 0 6px 6px 0; }
.att-chip.att-new { background: #e8f6ef; }
.att-chip a { color: #c0392b; text-decoration: none; font-weight: bold; }

/* ==== チャット ============================================================= */
.chat-root { border-left: 1px solid #d8dde3; }
.chat-title { font-weight: bold; }
.chat { padding: 8px 10px; font-size: 13px; }
.msg { margin: 6px 0; padding: 7px 10px; border-radius: 8px; max-width: 88%; background: #fff; border: 1px solid #e3e7eb; }
.msg.staff { background: #eef5fb; border-color: #cfe0ee; }
.msg.mine { margin-left: auto; border-color: #1f5f8b; }
.msg-head { font-size: 11px; color: #5d6d7e; margin-bottom: 3px; }
.msg-head .role { color: #1f5f8b; }
.msg-head .time { color: #8a96a2; margin-left: 4px; }
.msg-head a { margin-left: 6px; font-size: 11px; }
.msg-head a.del { color: #a0a0a0; }
.msg-body { line-height: 1.6; word-break: break-all; }
.chat-input { border-top: 1px solid #e3e7eb; background: #fafbfc; }

/* ==== 選択ダイアログ ======================================================= */
.pick-row { padding: 8px 10px; border-bottom: 1px solid #edf0f3; cursor: pointer; font-size: 13px; }
.pick-row:hover { background: #dce8f2; }

/* ==== ISSUE ================================================================ */
.issue-head { font-size: 13px; line-height: 1.7; }
.issue-no { font-size: 16px; font-weight: bold; }

/* ==== 地の色 ===============================================================
   Neptune テーマは border レイアウトの地とスプリッタが濃い青。業務画面では目が疲れるので淡色にする */
.x-border-layout-ct { background-color: #e9edf1 !important; }
.x-splitter { background-color: #dfe4e9 !important; }
.x-panel-body-default, .x-autocontainer-outerCt { background-color: transparent; }

/* ==== 添付ファイル（uFiles） ================================================ */
.file-list { margin-top: 10px; }
a.file { display: inline-block; margin: 0 8px 6px 0; padding: 3px 10px; border: 1px solid #c8d3dd; border-radius: 14px;
         background: #f7fafc; color: #1f5f8b; text-decoration: none; font-size: 12px; word-break: break-all; }
a.file:hover { background: #e6eef5; }
.file-size { color: #8a96a2; font-size: 11px; }
.file-edit { font-size: 12px; }
.file-chip { display: inline-block; margin: 0 4px 4px 0; }
.file-chip.file-new a.file { background: #e8f6ef; border-color: #a9dfbf; }
a.file-del { color: #c0392b; text-decoration: none; font-weight: bold; }
.msg-files { margin-top: 4px; }

/* ==== スマホ（Loginm / Mainm） =============================================== */
.m-login-head { padding: 20px 16px 8px; }
.m-login-title { font-size: 22px; font-weight: bold; color: #1f5f8b; }
.m-login-sub { font-size: 14px; color: #555; margin-top: 4px; }
.m-login-error { color: #c0392b; font-weight: bold; padding: 8px 16px; line-height: 1.6; }
.m-field { padding-left: 12px !important; padding-right: 12px !important; box-sizing: border-box !important; }
.m-head { display: flex; align-items: center; height: 48px; padding: 0 10px; background: #1f5f8b; color: #fff; box-sizing: border-box; }
.m-head a { color: #fff; text-decoration: none; font-size: 14px; white-space: nowrap; }
.m-back, .m-back-none { min-width: 64px; }
.m-title { flex: 1; text-align: center; font-weight: bold; font-size: 15px; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; padding: 0 6px; }
.m-logout { min-width: 64px; text-align: right; font-size: 12px !important; }
.m-body { padding: 8px 10px 16px; font-size: 14px; }
.m-company { padding: 8px 4px; font-size: 14px; }
.m-sec { margin: 14px 0 6px; padding: 4px 8px; font-weight: bold; border-left: 4px solid #1f5f8b; background: #eef2f5; }
.m-sec.need { border-left-color: #c0392b; } .m-sec.open { border-left-color: #d68910; } .m-sec.done { border-left-color: #27ae60; }
.m-list { background: #fff; border: 1px solid #e3e7eb; border-radius: 8px; overflow: hidden; }
.m-item { padding: 12px; border-bottom: 1px solid #edf0f3; cursor: pointer; }
.m-item:last-child { border-bottom: none; }
.m-item i { color: #1f5f8b; width: 20px; }
/* スマホのルームのグループと未読（2026-10-27 #7） */
.m-grp { margin: 10px 0 4px; padding: 8px 10px; border-radius: 6px; background: #e9eef3; color: #34495e; font-weight: bold; font-size: 14px; cursor: pointer; }
.m-grp .nav-fold-icon { color: #7a8590; width: 14px; transition: transform 0.15s; }
.m-badge { float: right; min-width: 18px; padding: 0 6px; border-radius: 10px; background: #c0392b; color: #fff; font-size: 11px; font-weight: bold;
  line-height: 18px; text-align: center; margin-left: 6px; margin-right: 8px; }
.m-grp .m-badge { margin-right: 0; }
.m-item .badge-unread i { color: #fff; width: auto; }
.m-card { background: #fff; border: 1px solid #e3e7eb; border-radius: 8px; padding: 10px 12px; }
.m-label { font-weight: bold; margin-top: 8px; }
.m-pad { padding: 10px; }
.m-input { border-top: 1px solid #d8dde3; background: #fafbfc; }
.m-body .chat { padding: 4px 0; }
.m-body .msg { max-width: 94%; }
.m-body .att img { max-width: 120px; max-height: 90px; }
/* スマホの「添付」（TUnimFileUploadButton）は ラベル＋ファイル名欄＋ボタン の 3 段構え。ボタンだけを見せる */
.m-upload .x-label-el, .m-upload .x-before-input-el, .m-upload .x-cleartrigger { display: none !important; }
.m-upload .x-input-el { width: 0 !important; min-width: 0 !important; padding: 0 !important; flex: 0 0 0 !important; }
.m-upload .x-input-wrap-el { border: none !important; background: transparent !important; }
.m-upload .x-filetrigger { flex: 1 1 auto !important; width: 100% !important; }
.m-upload .x-filetrigger .x-button { width: 100% !important; height: 38px; }

/* 押すとログイン URL をコピーするリンク（ユーザー管理の所属会社） */
a.copy-link { color: inherit; text-decoration: none; border-bottom: 1px dashed #8aa4bb; }
a.copy-link:hover { color: #1f5f8b; border-bottom-color: #1f5f8b; }
a.copy-link .x-fa { font-size: 11px; color: #8aa4bb; margin-left: 2px; }

/* スクリーンショットの貼り付けの案内 */
.att-paste-hint { font-size: 11px; margin-top: 4px; }

/* チャットの画像（吹き出しの中・送る前の一覧）とドロップ中の枠 */
.msg-imgs { margin-top: 4px; }
.chat-img img { max-width: 240px; max-height: 180px; border: 1px solid #d8dde3; border-radius: 6px; margin: 0 6px 4px 0; vertical-align: top; cursor: zoom-in; }
.m-body .chat-img img { max-width: 160px; max-height: 140px; }
.chat-pend { background: #f7f9fb; border-top: 1px solid #e3e7eb; overflow: hidden; }
.chat-pend .x-autocontainer-innerCt, .chat-pend .x-panel-body { overflow: hidden !important; }
.chat-pend-hint { font-size: 11px; color: #8a96a3; padding: 0 2px; line-height: 34px; white-space: nowrap; }
.chat-pend-list { padding: 4px 8px; white-space: nowrap; overflow-x: auto; overflow-y: hidden; font-size: 11px; height: 36px; }
.chat-pend-item { position: relative; display: inline-block; margin-right: 8px; vertical-align: middle; }
.chat-pend-item img { height: 34px; max-width: 80px; border: 1px solid #c8d3dd; border-radius: 4px; vertical-align: middle; }
.chat-pend-item a { position: absolute; top: -4px; right: -6px; background: #c0392b; color: #fff; border-radius: 8px; width: 15px; height: 15px;
  line-height: 14px; text-align: center; font-size: 11px; text-decoration: none; font-weight: bold; }
.app-drop { outline: 3px dashed #3a8fd6 !important; outline-offset: -3px; }

/* スマホの返信欄: 送る前の写真と「写真」ボタン */
.m-input .chat-pend-list { padding: 5px 8px; }
.m-photo { display: inline-block; padding: 6px 12px; margin-right: 8px; border: 1px solid #3a8fd6; border-radius: 16px; color: #1f5f8b;
  text-decoration: none; font-size: 13px; background: #fff; vertical-align: middle; }
.m-input .chat-pend-hint { display: inline; padding: 0; font-size: 11px; color: #8a96a3; }

/* 自分の設定 */
.my-page { background: #fff; }
.my-head { font-weight: bold; font-size: 14px; color: #1f5f8b; border-bottom: 2px solid #1f5f8b; padding-bottom: 2px; }

/* 画像のポップアップ（Main.ShowImagePopup。2026-11-02 #1）。押すと別タブで原寸 */
.img-pop { width: 100%; height: 100%; display: flex; align-items: center; justify-content: center; box-sizing: border-box; padding: 6px; }
.img-pop a { display: flex; width: 100%; height: 100%; align-items: center; justify-content: center; cursor: zoom-in; }
.img-pop img { max-width: 100%; max-height: 100%; object-fit: contain; background: #fff; }

/* 投稿へのリンク（2026-11-07 #1）。投稿の「リンク」、本文に貼ったリンク、リンクで開いた投稿を目立たせる */
.msg-head a.lnk { color: #7a8794; }
.chat-link { color: #1f5f8b; background: #e8f1f8; border: 1px solid #cfe0ee; border-radius: 4px; padding: 0 5px; text-decoration: none; cursor: pointer; }
.chat-link:hover { background: #d6e7f4; text-decoration: underline; }
.chat-link .x-fa { font-size: 11px; margin-right: 1px; }
.chat-link.bad { color: #a33; background: #fbeeee; border-color: #efcaca; }
.msg.msg-hit { animation: msgHit 3s ease-out; }
@keyframes msgHit {
  0%, 50% { background: #fff4c2; box-shadow: 0 0 0 3px #f2c94c; }
  100% { box-shadow: 0 0 0 0 rgba(242, 201, 76, 0); }
}


/* ==== 書類共有チャット（SharedocChat）で足したもの ==================================== */
.note { margin: 10px 4px; }
.admin-list { padding: 8px 12px; }
.admin-list h3 { margin: 14px 4px 6px; font-size: 14px; color: #1f5f8b; }
.admin-list table.grid td.acts a { margin-right: 8px; white-space: nowrap; }
.nav-badge.warn { background: #d9822b; }
.nav-lock { font-size: 10px; color: #8a96a3; }
.totp-key { font-family: Consolas, monospace; font-size: 15px; letter-spacing: 1px; color: #1f5f8b; }
.my-row { margin-top: 8px; }
.my-row button, .pick-btns button, .memo-add button { padding: 4px 12px; cursor: pointer; }

/* ダッシュボード */
.dash-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(340px, 1fr)); gap: 14px; padding: 14px; }
.dash-sec { background: #fff; border: 1px solid #dfe5ec; border-radius: 6px; padding: 10px 12px; min-height: 120px; }
.dash-head { font-weight: bold; color: #1f5f8b; margin-bottom: 8px; }
.dash-item { padding: 5px 2px; border-bottom: 1px dashed #e6eaef; }
.dash-item:last-child { border-bottom: none; }
.dash-room { font-weight: bold; color: #1f5f8b; text-decoration: none; }
.dash-snip { color: #555; font-size: 12px; margin-top: 2px; word-break: break-all; }
.dash-empty { padding: 6px 2px; }

/* ルームの表紙 */
.room-side { border-left: 1px solid #dfe5ec; background: #f7f9fb; }
.room-cover .cover { padding: 10px 12px; }
.cover-title { font-size: 15px; font-weight: bold; color: #1f5f8b; }
.cover-tools { margin: 6px 0 2px; }
.cover-sec { margin-top: 14px; background: #fff; border: 1px solid #dfe5ec; border-radius: 6px; padding: 8px 10px; }
.cover-head { font-weight: bold; margin-bottom: 6px; color: #333; }
.cover-file { padding: 4px 0; border-bottom: 1px dashed #e6eaef; }
.cover-file:last-child { border-bottom: none; }
.memo { display: flex; align-items: center; justify-content: space-between; gap: 6px; padding: 4px 0; border-bottom: 1px dashed #e6eaef; }
.memo-title { flex: 1; word-break: break-all; }
.memo.ms1 .memo-title { color: #6b7785; text-decoration: line-through; }
.memo.ms2 .memo-title { color: #9aa4ae; }
.memo-btns { white-space: nowrap; }
.memo-st { display: inline-block; padding: 1px 6px; margin-left: 2px; border: 1px solid #cfd7df; border-radius: 3px; color: #555; text-decoration: none; font-size: 12px; }
.memo-st.on.s0 { background: #d9822b; border-color: #d9822b; color: #fff; }
.memo-st.on.s1 { background: #3a8f5b; border-color: #3a8f5b; color: #fff; }
.memo-st.on.s2 { background: #8a96a3; border-color: #8a96a3; color: #fff; }
.memo-del { margin-left: 6px; color: #b54a4a; text-decoration: none; }
.memo-add { display: flex; gap: 6px; margin-top: 8px; }
.memo-add input { flex: 1; padding: 4px 6px; border: 1px solid #cfd7df; border-radius: 3px; }
.member { padding: 3px 0; }
.personal-sec { border-color: #e2b8b8; background: #fff8f8; }
.personal-link { color: #b54a4a; font-weight: bold; }
.file.personal { color: #b54a4a; }
.file-wrap .pin { margin-left: 4px; color: #9aa4ae; text-decoration: none; }
.file-wrap .pin.on { color: #d9822b; }
.personal-page { padding: 8px 4px; }
.pick-btns { padding: 10px; border-top: 1px solid #e6eaef; text-align: right; }
label.pick-row { display: block; cursor: pointer; }
.msg-imgs .img-pin { vertical-align: top; margin: 0 8px 0 2px; color: #9aa4ae; text-decoration: none; }
.msg-imgs .img-pin.on { color: #d9822b; }

/* 書類共有チャットの下の人のフォルダ（2026-11-12 #6） */
.nav-person { font-weight: bold; color: #34495e; }
.nav-person .nav-fold-icon { color: #7a8590; width: 12px; }
.nav-item.nav-sub { padding-left: 34px; }

/* 左メニュー 書類共有チャット の人員の絞り込み・検索（2026-11-13） */
.nav-pf { display: flex; align-items: center; gap: 4px; margin: 2px 10px 4px 14px; }
.nav-pf input { flex: 1; min-width: 0; height: 24px; box-sizing: border-box; padding: 2px 6px; border: 1px solid #c8d0d8; border-radius: 4px; font-size: 12px; }
.nav-pf input:focus { outline: none; border-color: #1f5f8b; }
.nav-pf .nav-plus { float: none; flex: none; }
.psr { padding: 0 12px 12px; }
.psr .grid { width: 100%; }
.psr tr.psr-row { cursor: pointer; }
.psr tr.psr-row:hover td { background: #eef5fb; }
.psr td.num { text-align: right; white-space: nowrap; }
.psr .zero { color: #c0392b; font-weight: bold; }
.psr-count { margin: 8px 0; color: #7a8590; }
.psr-kana { font-size: 11px; }

/* 未読だった更新（ルームの表紙の一番上。2026-11-13） */
.unread-sec { border-color: #f0c36d; background: #fffaf0; }
.unread-sec .cover-head { color: #8a5a00; }
.ur-close { float: right; color: #999; text-decoration: none; font-weight: normal; padding: 0 4px; }
.ur-close:hover { color: #333; }
.ur-item { padding: 4px 0; border-top: 1px solid #f3e3c0; font-size: 12px; }
.ur-item:first-of-type { border-top: none; }
.ur-kind { display: inline-block; padding: 0 6px; border-radius: 8px; font-size: 11px; color: #fff; background: #1f5f8b; }
.ur-kind.k2, .ur-kind.k3 { background: #c77700; }
.ur-kind.k4, .ur-kind.k5, .ur-kind.k6 { background: #2e8b57; }
.ur-sum { margin-top: 2px; color: #333; word-break: break-all; }
.ur-more { margin-top: 4px; font-size: 11px; }

/* 備忘録のテンプレートから追加（2026-11-13） */
.memo-tpl select { flex: 1; min-width: 0; height: 26px; border: 1px solid #c8d0d8; border-radius: 4px; font-size: 12px; }
.h3-add { margin-left: 12px; font-size: 12px; font-weight: normal; }