/* ============================================================
   管理画面 共通スタイル
   配色はすべてCSS変数（トークン）で管理。ライト = :root ／
   ダーク = [data-theme="dark"]。色のハードコードは置かない
   （新しい色が要るときは必ずトークンを足す）。
   ※ D1：色トークン基盤のみ。レイアウト（横並びナビ）は D2 で刷新。
   ============================================================ */
:root{
  color-scheme: light;        /* ネイティブUI（日付ピッカー・スクロールバー等）をライトに */
  /* アクセント（紫） */
  --accent:#7c5cfc;          /* 主アクセント（主ボタン・見出し・現在地） */
  --accent-hover:#6d4ef0;    /* アクセントhover */
  --accent-bg:#f0eeff;       /* 淡いアクセント背景（ハイライト・バッジ地・AIバブル） */
  --accent-bg-hover:#e4e0fb; /* 淡いアクセント背景hover（サブボタン） */
  --accent-text:#6d5ae6;     /* アクセント文字（バッジ内テキスト等） */
  /* サーフェス */
  --bg:#ffffff;              /* ページ背景 */
  --surface-sidebar:#fafaf9; /* サイドバー背景（D2で使用・今は器） */
  --card:#ffffff;            /* カード背景 */
  --surface-subtle:#fafafa;  /* 検索欄・見出し行・入力の淡い地 */
  /* 罫線 */
  --line:#e8e8ea;            /* 標準罫線 */
  --line-subtle:#f0f0f2;     /* 極薄罫線 */
  --line-sidebar:#eeeeec;    /* サイドバー罫線（D2で使用・今は器） */
  /* 文字 */
  --text:#18181b;            /* 主文字 */
  --text-secondary:#52525b;  /* 副文字（中立バッジ等） */
  --muted:#a1a1aa;           /* 補助・ラベル */
  /* 状態色 */
  --ok:#1e7e34;              /* 成功 */
  --ok-bg:#eef5ee;           /* 成功バッジ地 */
  --ng:#c0392b;              /* エラー・値引き・削除 */
  --ng-hover:#9c2f24;        /* 削除ボタンhover */
  --err-bg:#fdecea;          /* エラーボックス地 */
  --err-line:#f5c6c2;        /* エラーボックス罫線 */
  --warn-bg:#fff7e6;         /* フラッシュ地 */
  --warn-line:#f0c674;       /* フラッシュ罫線 */
  --warn-text:#b26a00;       /* 警告バッジ文字 */
  --warn-badge-bg:#fff3e0;   /* 警告バッジ地 */
  --neutral-badge-bg:#f0f0f2;/* 中立バッジ地（作成中・見込 等） */
  /* トップバー/ナビ（D2でサイドバー化・今は横並びに適用） */
  --nav-text:#ece9ff;        /* ナビ文字（トップバー上） */
  --nav-hover-bg:rgba(255,255,255,.14);
  --nav-active-bg:#ffffff;   /* 現在地の地 */
  --on-accent:#ffffff;       /* アクセント地の上の文字（ボタン・トップバー） */
  /* 影 */
  --shadow-card:0 4px 14px rgba(124,92,252,.12);
  /* レイアウト */
  --radius:8px;              /* ボタン・入力 */
  --radius-card:12px;        /* カード */
  --sidebar-w:190px;
  /* 旧変数名の互換（既存ルールが参照・新値へマップ） */
  --main:var(--accent);
  --main-d:var(--accent-hover);
}
[data-theme="dark"]{
  color-scheme: dark;         /* ネイティブUI（日付ピッカー・スクロールバー等）をダークに追従 */
  --accent:#7c5cfc; --accent-hover:#6d4ef0;
  --accent-bg:#1c1a2e; --accent-bg-hover:#252336; --accent-text:#a894fc;
  --bg:#0e0e11; --surface-sidebar:#131316; --card:#161619; --surface-subtle:#161619;
  --line:#26262b; --line-subtle:#1f1f24; --line-sidebar:#1f1f24;
  --text:#f4f4f5; --text-secondary:#a1a1aa; --muted:#71717a;
  --ok:#3fb950; --ok-bg:#12261a;
  --ng:#f85149; --ng-hover:#da3633; --err-bg:#2a1615; --err-line:#5c2320;
  --warn-bg:#2a2416; --warn-line:#5c4a1e; --warn-text:#e3b341; --warn-badge-bg:#2a2416;
  --neutral-badge-bg:#26262b;
  --nav-text:#a1a1aa; --nav-hover-bg:rgba(255,255,255,.08); --nav-active-bg:#26262b;
  --on-accent:#ffffff;
  --shadow-card:0 4px 14px rgba(0,0,0,.4);
  --main:var(--accent); --main-d:var(--accent-hover);
}
*{box-sizing:border-box;}
body{
  margin:0; background:var(--bg); color:var(--text);
  font-family:system-ui,-apple-system,"Hiragino Kaku Gothic ProN",sans-serif;
  font-size:15px; line-height:1.6;
}
a{color:var(--accent); text-decoration:none;}
a:hover{text-decoration:underline;}

/* 全体レイアウト：左サイドバー ＋ 右メイン */
body{display:flex; min-height:100vh;}
.sidebar{
  flex:0 0 var(--sidebar-w); width:var(--sidebar-w);
  position:sticky; top:0; align-self:flex-start; height:100vh; overflow-y:auto;
  display:flex; flex-direction:column;
  background:var(--surface-sidebar); border-right:1px solid var(--line-sidebar);
  padding:14px 12px;
}
.main{flex:1; min-width:0; display:flex; flex-direction:column;}

/* 画面名バー（メイン最上部） */
.main-head{
  display:flex; align-items:center; height:52px; padding:0 24px;
  border-bottom:1px solid var(--line-subtle);
}
.crumbs{display:flex; align-items:center; gap:8px; min-width:0;}
.crumb{font-size:15px; color:var(--text-secondary); white-space:nowrap;}
.crumb-current{color:var(--text); font-weight:500;}
.crumb-sep{color:var(--muted); font-size:14px;}
.crumb-back{color:var(--muted); font-size:14px; white-space:nowrap; margin-right:14px;}
.crumb-back:hover{color:var(--text); text-decoration:none;}
/* ☰（サイドバー開閉）とその暗幕。スマホ幅でのみ現れる＝PC は非表示（下のメディアクエリで有効化）。 */
.nav-toggle{display:none; align-items:center; justify-content:center; width:36px; height:36px;
  margin:0 8px 0 -8px; background:none; border:0; padding:0; color:var(--text-secondary); cursor:pointer;}
.nav-scrim{display:none;}

/* サイドバー：アイコン共通 */
.ti{width:19px; height:19px; flex:0 0 auto;}

/* サイドバー：ブランド */
.sb-brand{display:flex; align-items:center; gap:9px; padding:6px 8px 14px; color:var(--text);}
.sb-brand:hover{text-decoration:none;}
.sb-brand-mark{
  display:flex; align-items:center; justify-content:center; flex:0 0 auto;
  width:30px; height:30px; border-radius:8px; background:var(--accent); color:var(--on-accent);
}
.sb-brand-mark .ti{width:18px; height:18px;}
.sb-brand-text{font-weight:700; font-size:1rem; color:var(--text);}

/* サイドバー：AIアシスタント（特等席・紫塗り） */
.sb-ai{
  display:flex; align-items:center; gap:9px; padding:9px 12px; margin-bottom:8px;
  border-radius:var(--radius); background:var(--accent); color:var(--on-accent);
  font-weight:600; font-size:.95rem;
}
.sb-ai:hover{background:var(--accent-hover); text-decoration:none; color:var(--on-accent);}
.sb-ai .ti{color:var(--on-accent);}

/* サイドバー：グループ見出し・項目・区切り */
.sb-nav{display:flex; flex-direction:column;}
.sb-group{padding:12px 12px 4px; font-size:.72rem; font-weight:600; color:var(--muted); letter-spacing:.03em;}
.sb-item{
  display:flex; align-items:center; gap:9px; padding:8px 12px;
  border-radius:var(--radius); color:var(--text-secondary); font-size:.92rem;
}
.sb-item .ti{color:var(--muted);}
.sb-item:hover{background:var(--accent-bg); text-decoration:none;}
.sb-item.active{background:var(--accent-bg); color:var(--accent); font-weight:600;}
.sb-item.active .ti{color:var(--accent);}
.sb-sep{height:1px; background:var(--line-sidebar); margin:10px 12px;}
.sb-settings{margin-top:auto;}

/* コンテンツ領域 */
.wrap{width:100%; max-width:1280px; margin:24px auto; padding:0 24px;}
code{background:var(--surface-subtle); padding:2px 6px; border-radius:4px; font-size:.85em;}

/* 入口メニュー（ホーム）のカード */
.menu-grid{
  display:grid; grid-template-columns:repeat(auto-fill, minmax(260px, 1fr));
  gap:16px; margin-bottom:24px;
}
.menu-card{
  display:flex; flex-direction:column; gap:6px;
  background:var(--card); border:1px solid var(--line); border-radius:var(--radius-card);
  padding:18px 20px; color:var(--text); text-decoration:none;
  transition:border-color .15s, box-shadow .15s, transform .15s;
}
.menu-card:hover{
  text-decoration:none; border-color:var(--accent);
  box-shadow:var(--shadow-card); transform:translateY(-2px);
}
.menu-card-title{font-size:1.1rem; font-weight:700; color:var(--main);}
.menu-card-desc{font-size:.88rem; color:var(--muted); line-height:1.5;}
.menu-card-go{margin-top:6px; font-size:.85rem; font-weight:600; color:var(--accent);}

/* フラッシュ */
.flash{
  background:var(--warn-bg); border:1px solid var(--warn-line);
  padding:10px 14px; border-radius:8px; margin-bottom:16px;
}

/* カード */
.card{
  background:var(--card); border:1px solid var(--line);
  border-radius:var(--radius-card); padding:20px; margin-bottom:20px;
}

/* ツールバー（検索・新規ボタン） */
.toolbar{display:flex; gap:12px; align-items:center; flex-wrap:wrap; margin-bottom:16px;}
.toolbar form{display:flex; gap:8px;}
.toolbar input[type=text]{
  padding:8px 11px; border:1px solid var(--line); border-radius:var(--radius);
  font-size:.95rem; font-family:inherit; background:var(--card); color:var(--text);
}
.spacer{flex:1;}

/* ドロップダウン（details/summary・JSなし）。CSV出力/取込の大小選択などに使う */
.dropdown{position:relative; display:inline-block;}
.dropdown>summary{list-style:none; cursor:pointer;}
.dropdown>summary::-webkit-details-marker{display:none;}
.dropdown-menu{
  position:absolute; z-index:100; top:calc(100% + 4px); left:0; min-width:160px;
  display:flex; flex-direction:column; gap:2px; padding:4px;
  background:var(--card); border:1px solid var(--line); border-radius:var(--radius);
  box-shadow:0 6px 18px rgba(0,0,0,.12);
}
.dropdown-menu a{
  display:flex; align-items:center; gap:8px; padding:7px 10px; border-radius:6px;
  color:var(--text); font-size:.9rem;
}
.dropdown-menu a:hover{background:var(--accent-bg); text-decoration:none;}
.dot{width:8px; height:8px; border-radius:999px; flex:0 0 auto;}
.dot-dai{background:var(--accent);}
.dot-sho{background:var(--muted);}

/* ボタン */
.btn{
  display:inline-block; border:none; cursor:pointer;
  padding:8px 16px; border-radius:var(--radius); font-size:.95rem; font-weight:600;
  background:var(--main); color:var(--on-accent);
}
.btn:hover{background:var(--main-d); text-decoration:none;}
.btn-sub{background:var(--accent-bg); color:var(--accent-text);}
.btn-sub:hover{background:var(--accent-bg-hover);}
.btn-danger{background:var(--ng); color:var(--on-accent);}
.btn-danger:hover{background:var(--ng-hover);}
.btn-sm{padding:5px 10px; font-size:.85rem;}

/* テーブル */
table.list{width:100%; border-collapse:collapse; background:var(--card);
  border:1px solid var(--line); border-radius:var(--radius-card); overflow:hidden;}
table.list th,table.list td{padding:10px 12px; border-bottom:1px solid var(--line); text-align:left;}
table.list th{background:var(--surface-subtle); color:var(--main); font-size:.9rem;}
table.list tr:last-child td{border-bottom:none;}
table.list tr:hover td{background:var(--surface-subtle);}
.right{text-align:right;}
.center{text-align:center;}
.muted{color:var(--muted); font-size:.88rem;}
.kana{color:var(--muted); font-size:.82rem; display:block;}

/* バッジ */
.badge{display:inline-block; padding:2px 10px; border-radius:999px; font-size:.8rem; font-weight:600;}
.badge.houjin{background:var(--accent-bg); color:var(--accent-text);}
.badge.kojin{background:var(--ok-bg); color:var(--ok);}
/* ステータス（案件） */
.badge.st-mikomi{background:var(--neutral-badge-bg); color:var(--text-secondary);}
.badge.st-juchu{background:var(--accent-bg); color:var(--accent-text);}
.badge.st-chakkou{background:var(--warn-badge-bg); color:var(--warn-text);}
.badge.st-kanryo{background:var(--ok-bg); color:var(--ok);}
.badge.st-shitsu{background:var(--err-bg); color:var(--ng);}
/* ステータス（見積） */
.badge.ms-sakusei{background:var(--neutral-badge-bg); color:var(--text-secondary);}
.badge.ms-teishutsu{background:var(--warn-badge-bg); color:var(--warn-text);}
.badge.ms-juchu{background:var(--ok-bg); color:var(--ok);}
.badge.ms-shitsu{background:var(--err-bg); color:var(--ng);}

/* 見積 明細テーブル（横スクロール対応） */
.meisai-wrap{overflow-x:auto; margin-bottom:12px;}
table.meisai{width:100%; border-collapse:collapse; min-width:980px; font-size:.9rem;}
table.meisai th,table.meisai td{padding:6px 7px; border-bottom:1px solid var(--line); vertical-align:middle;}
table.meisai th{background:var(--surface-subtle); color:var(--main); font-size:.82rem; white-space:nowrap; text-align:left;}
table.meisai input,table.meisai select{width:100%; padding:6px 7px; border:1px solid var(--line); border-radius:6px; font-size:.88rem; font-family:inherit; background:var(--card); color:var(--text);}
table.meisai input[readonly]{background:var(--surface-subtle); color:var(--muted);}
table.meisai td.m-amount{text-align:right; white-space:nowrap; font-variant-numeric:tabular-nums;}
.col-tanka,.col-genka,.col-suryo{width:96px;}
.col-zei{width:130px;}
.col-himoku{width:210px;}
.col-amount{width:110px;}
.col-del{width:42px;}

/* 費目オートコンプリート（明細行の費目欄） */
.m-combo{position:relative;}
.m-combo-list{
  position:fixed; z-index:3000; max-width:440px; max-height:280px; overflow-y:auto;
  background:var(--card); border:1px solid var(--line); border-radius:8px;
  box-shadow:0 6px 18px rgba(0,0,0,.22); font-size:.88rem;
}
.m-combo-list[hidden]{display:none;}
.m-opt{
  display:grid; grid-template-columns:1fr auto; gap:1px 10px; align-items:baseline;
  padding:6px 10px; cursor:pointer; border-bottom:1px solid var(--line-subtle); background:var(--card);
}
.m-opt:last-child{border-bottom:0;}
.m-opt:hover,.m-opt.is-active{background:var(--accent-bg);}
.m-opt-name{font-weight:600; color:var(--text);}
.m-opt-price{text-align:right; white-space:nowrap; color:var(--main); font-variant-numeric:tabular-nums;}
.m-opt-meta{grid-column:1 / -1; font-size:.78rem; color:var(--muted);}
.m-opt-empty{padding:8px 10px; color:var(--muted); font-size:.85rem;}

/* 見積 合計サマリ */
.ms-summary{margin-left:auto; max-width:380px;}
.ms-summary table{width:100%; border-collapse:collapse;}
.ms-summary td{padding:6px 10px; border-bottom:1px solid var(--line);}
.ms-summary td.lbl{color:var(--muted);}
.ms-summary td.val{text-align:right; font-variant-numeric:tabular-nums;}
.ms-summary tr.total td{font-weight:700; font-size:1.05rem; color:var(--main); border-bottom:none;}
.ms-breakdown{font-size:.82rem; color:var(--muted); margin-top:6px; text-align:right;}

/* フォーム */
.form-row{margin-bottom:16px;}
.form-row label{display:block; font-weight:600; margin-bottom:6px; font-size:.92rem;}
.form-row .req{color:var(--ng); font-size:.8rem; margin-left:4px;}
.form-row input[type=text],
.form-row input[type=email],
.form-row input[type=password],
.form-row input[type=date],
.form-row select,
.form-row textarea{
  width:100%; padding:9px 11px; border:1px solid var(--line);
  border-radius:8px; font-size:1rem; font-family:inherit; background:var(--card); color:var(--text);
}
.form-row textarea{min-height:80px; resize:vertical;}
.form-row .hint{color:var(--muted); font-size:.82rem; margin-top:4px;}
.radio-group{display:flex; gap:16px; align-items:center;}
.radio-item{display:flex; align-items:center; gap:6px; cursor:pointer; color:var(--text);}
.form-grid{display:grid; grid-template-columns:1fr 1fr; gap:0 20px;}
.form-actions{display:flex; gap:12px; margin-top:8px;}

/* エラー */
.errors{background:var(--err-bg); border:1px solid var(--err-line); color:var(--ng);
  padding:12px 16px; border-radius:8px; margin-bottom:16px;}
.errors ul{margin:6px 0 0; padding-left:20px;}

/* 提案書セクション */
.teian-sec{border:1px solid var(--line); border-radius:8px; padding:12px; margin-bottom:12px; background:var(--surface-subtle);}
.teian-sec .sec-head{display:flex; gap:8px; align-items:center; margin-bottom:8px;}
.teian-sec .sec-midashi{flex:1;}
.teian-sec .sec-tools{display:flex; gap:4px; flex-shrink:0;}
.teian-sec .sec-honbun{min-height:90px;}
/* .sec-honbun は .form-row 外の textarea。フォーム欄と同じ色・枠線に揃える（変数参照＝両テーマ対応） */
.sec-honbun{
  width:100%; padding:9px 11px; border:1px solid var(--line);
  border-radius:8px; font-size:1rem; font-family:inherit;
  background:var(--card); color:var(--text); resize:vertical;
}
.teian-amount{font-weight:700; color:var(--main);}

/* 調査写真 */
.chosa-sec .photo-area{margin-top:10px; border-top:1px dashed var(--line); padding-top:10px;}
.photo-grid{display:flex; flex-wrap:wrap; gap:12px; margin-bottom:10px;}
.photo-item{width:150px; position:relative;}
.photo-thumb{width:150px; height:110px; object-fit:cover; border:1px solid var(--line); border-radius:6px; display:block; background:var(--surface-subtle);}
.photo-cap{width:100%; margin-top:4px; padding:5px 7px !important; font-size:.85rem !important;}
.photo-row2{display:flex; justify-content:space-between; align-items:center; margin-top:4px; font-size:.8rem;}
.photo-row2 input[type=number]{padding:3px 5px;}
/* 削除は×ボタンに統一（常時表示＝タッチ端末にホバーが無いため）。
   ★実体の削除フラグは .photo-del-flag（hidden の checkbox）で、DOM には残したまま
     .photo-item ごと display:none で隠す。DOM から remove すると送信されず保存で復活する。 */
.photo-del{position:absolute; top:-8px; right:-8px; width:22px; height:22px; border-radius:50%; border:0; background:var(--ng); color:var(--on-accent); cursor:pointer; line-height:1; font-size:.9rem; padding:0;}
.photo-del:hover{background:var(--ng-hover);}
.photo-item.is-removed{display:none;}
.photo-add{margin-top:4px;}
.photo-newcap-row{display:flex; gap:6px; align-items:center; margin-top:5px;}
.photo-newcap-row input{flex:1; padding:5px 7px; border:1px solid var(--line); border-radius:6px;}

/* 画像拡大モーダル（scrim/影は両テーマ共通の黒） */
.img-modal{position:fixed; inset:0; background:rgba(0,0,0,.8); display:none; align-items:center; justify-content:center; z-index:1000;}
.img-modal.open{display:flex;}
.img-modal img{max-width:92vw; max-height:92vh; box-shadow:0 4px 30px rgba(0,0,0,.5);}

/* レスポンシブ（現場のスマホ用） */
@media (max-width:680px){
  .form-grid{grid-template-columns:1fr;}
  table.list{display:block; overflow-x:auto; white-space:nowrap;}
  /* サイドバーをドロワー化（C-3）。画面外へ退避し、☰ で横から出す＝本文は全幅になる。 */
  .nav-toggle{display:flex;}
  .sidebar{
    position:fixed; top:0; left:0; z-index:1101;
    transform:translateX(-100%); transition:transform .2s ease;
  }
  .sidebar.open{transform:none;}
  .nav-scrim.open{display:block; position:fixed; inset:0; background:rgba(0,0,0,.4); z-index:1100;}
}

/* ── 認証（ログイン認証・A3） ────────────────────────────
   login.php / change_password.php はサイドバー無しの最小カード。既存トークンを流用。 */
.auth-body{display:flex; min-height:100vh; align-items:center; justify-content:center; background:var(--bg); margin:0;}
.auth-card{width:100%; max-width:360px; background:var(--card); border:1px solid var(--line); border-radius:12px; padding:28px 26px; margin:16px;}
.auth-brand{font-weight:700; font-size:1.15rem; margin-bottom:6px; color:var(--text); text-align:center;}
.auth-sub{font-size:.85rem; color:var(--muted); text-align:center; margin-bottom:18px;}
.auth-err{background:var(--ng); color:var(--on-accent); border-radius:8px; padding:9px 12px; font-size:.88rem; margin-bottom:14px;}
.auth-actions{margin-top:18px;}
.auth-actions .btn{width:100%; justify-content:center;}
.auth-foot{margin-top:16px; text-align:center;}
.auth-foot .sb-logout{display:inline-block;}
/* 設定＞アカウント：状態＋「変更」ボタンの行（入力欄は置かず専用画面へ送る） */
.acct-row{display:flex; align-items:center; justify-content:space-between; gap:12px;
  padding:12px 0; border-top:1px solid var(--line);}
/* パスワード欄の表示/非表示トグル（gs_password_toggle_script が JS で挿入） */
.pw-wrap{position:relative;}
.form-row .pw-wrap input{padding-right:42px;}
.pw-toggle{position:absolute; top:0; right:0; height:100%; width:40px; display:flex; align-items:center; justify-content:center;
  background:none; border:0; padding:0; color:var(--muted); cursor:pointer;}
.pw-toggle:hover{color:var(--text);}
/* サイドバー：ログイン中ユーザー名＋ログアウト（A3） */
.sb-user{display:flex; align-items:center; justify-content:space-between; gap:8px; padding:10px 12px 2px; border-top:1px solid var(--line-sidebar); margin-top:8px;}
.sb-user-name{font-size:.82rem; color:var(--muted); overflow:hidden; text-overflow:ellipsis; white-space:nowrap;}
.sb-logout{background:none; border:1px solid var(--line-sidebar); color:var(--muted); border-radius:6px; padding:4px 10px; font:inherit; font-size:.8rem; cursor:pointer;}
.sb-logout:hover{background:var(--accent-bg); color:var(--text);}