/* 発注・仕入・在庫管理システム 共通スタイル */
*{box-sizing:border-box}
body{font-family:"Hiragino Kaku Gothic ProN","Yu Gothic","Meiryo",system-ui,sans-serif;
     background:#f4f4f1;color:#191c1f;margin:0;padding:0 20px 80px;line-height:1.6}

/* ---- ナビゲーション ---- */
.navbar{max-width:1080px;margin:0 auto;padding:16px 0 0}
.navbar-inner{display:flex;flex-wrap:wrap;gap:6px}
.nav-item{display:inline-block;padding:9px 16px;border-radius:4px 4px 0 0;font-size:13px;font-weight:600;
          color:#4a524f;text-decoration:none;background:#e7e9e3;border:1px solid #d3d6cf;border-bottom:none}
.nav-item:hover{background:#dfe2da}
.nav-item.current{background:#fff;color:#191c1f;border-color:#d3d6cf}
.nav-item.disabled{color:#b3b7ae;cursor:default;pointer-events:none}
.nav-gap{flex:1 1 0}
.nav-user{text-align:right;font-size:12px;color:#4a524f;margin-bottom:6px}
.nav-user a{margin-left:10px;color:#1f4e8c}

/* ---- ログイン ---- */
.login-card{max-width:420px;margin:60px auto 0}
.login-card .field{margin-bottom:12px}
.login-card .field input{min-width:0;width:100%}
.nav-item.master{background:#e2e4dd;color:#5a6058}
.nav-item.master:hover{background:#d8dbd2}
.nav-item.master.current{background:#fff;color:#191c1f}

/* ---- マスタメンテ ---- */
.subnav{display:flex;flex-wrap:wrap;gap:6px;align-items:center;margin-bottom:20px;padding-bottom:14px;border-bottom:1px solid #eceee8}
.subnav-home{font-size:12px;font-weight:600;color:#7a8078;text-decoration:none;margin-right:8px}
.subnav-home:hover{color:#191c1f}
.subnav-item{padding:6px 12px;border:1px solid #d3d6cf;border-radius:3px;background:#f7f8f4;color:#4a524f;
             text-decoration:none;font-size:12.5px;font-weight:600}
.subnav-item:hover{background:#eceee8}
.subnav-item.current{background:#191c1f;color:#fff;border-color:#191c1f}
.master-tiles{display:flex;flex-wrap:wrap;gap:14px;margin-top:18px}
.master-tile{flex:1 1 240px;border:1px solid #d3d6cf;border-radius:4px;padding:18px 20px;
             background:#fbfbf9;color:#191c1f;text-decoration:none}
.master-tile:hover{background:#f2f3ee;border-color:#b9bdb3}
.master-tile .t{font-size:15px;font-weight:700;margin-bottom:5px}
.master-tile .d{font-size:12.5px;color:#4a524f;line-height:1.5}
.master-tile .c{margin-top:10px;font-size:12px;color:#7a8078}

/* ---- カード ---- */
.card{max-width:1080px;margin:0 auto;background:#fff;border:1px solid #d3d6cf;border-radius:4px;padding:28px}
.navbar + .card{border-radius:0 4px 4px 4px}
h1{font-size:19px;margin:0 0 4px;letter-spacing:.04em}
p.sub{margin:0 0 22px;color:#4a524f;font-size:13px}
h2{font-size:14px;margin:28px 0 12px;padding-bottom:6px;border-bottom:2px solid #191c1f;letter-spacing:.03em}

/* ---- フォーム部品 ---- */
.row{display:flex;flex-wrap:wrap;gap:16px 20px;margin-bottom:4px}
.field{display:flex;flex-direction:column;gap:4px}
.field label{font-size:12px;color:#4a524f;font-weight:600}
.field input[type=text],.field input[type=date],.field input[type=number],.field select{
    font-size:13.5px;padding:7px 9px;border:1px solid #c7cac3;border-radius:3px;background:#fff;min-width:160px}
.field.wide input{min-width:280px}
.radio-group{display:flex;gap:18px;align-items:center;padding:6px 0}
.radio-group label{display:flex;align-items:center;gap:6px;font-size:13.5px;font-weight:600;cursor:pointer}
.hint{font-size:12px;color:#7a8078;margin-top:2px}
.req{color:#9a2b12;margin-left:3px}
input.money-input{text-align:right}
.deal-check{display:flex;align-items:center;gap:6px;font-size:13px;font-weight:normal;color:#191c1f;padding:7px 0;cursor:pointer}
.zaiko-fixed{font-size:13px;background:#f2f3ee;border:1px solid #dcdfd8;border-radius:3px;padding:8px 12px;color:#4a524f}

/* ---- 明細テーブル（入力用） ---- */
table.lines{width:100%;border-collapse:collapse;margin-top:8px;font-size:13px}
table.lines th{background:#f2f3ee;text-align:left;padding:8px 8px;border:1px solid #dcdfd8;white-space:nowrap;font-weight:600;color:#4a524f}
table.lines td{padding:5px 6px;border:1px solid #e4e6e0;vertical-align:top}
table.lines input{width:100%;font-size:13px;padding:6px 7px;border:1px solid #c7cac3;border-radius:3px}
table.lines input.narrow{width:90px}
/* 部材種別は選択肢が長いので、列が広がらないよう幅を固定する（一覧は開けば全文見える） */
table.lines select{width:100%;max-width:140px;font-size:12.5px;padding:5px 4px;
    border:1px solid #c7cac3;border-radius:3px;background:#fff}
table.lines input.money-input{text-align:right}
table.lines td.rm{text-align:center}
/* 見出しクリックで並べ替え */
table.lines th.sortable,table.list th.sortable{cursor:pointer;user-select:none;white-space:nowrap}
table.lines th.sortable:hover,table.list th.sortable:hover{background:#e7e9e3}
table.lines th.sortable::after,table.list th.sortable::after{content:"　";color:#a8ada4;font-size:11px}
table.lines th.sortable.asc::after,table.list th.sortable.asc::after{content:" ▲";color:#191c1f}
table.lines th.sortable.desc::after,table.list th.sortable.desc::after{content:" ▼";color:#191c1f}
/* 呼び出し中の行 */
table.list tbody tr.row-current td,table.list tbody tr.row-current:nth-child(even) td{background:#f2e7ce}
/* チェックを付けた行（④のまとめて納品登録） */
table.list tbody tr.row-checked td,table.list tbody tr.row-checked:nth-child(even) td{background:#e2ecf7}
.field textarea{font-size:13.5px;padding:7px 9px;border:1px solid #c7cac3;border-radius:3px;background:#fff;
    font-family:inherit;line-height:1.4;min-width:360px;resize:vertical}
.rm-btn{border:1px solid #c7cac3;background:#fff;color:#9a2b12;border-radius:3px;padding:5px 9px;cursor:pointer;font-size:13px}
.rm-btn:hover{background:#fbeceb}
.add-btn{margin-top:10px;border:1px solid #4a524f;background:#fff;color:#191c1f;border-radius:3px;padding:8px 16px;cursor:pointer;font-size:13px;font-weight:600}
.add-btn:hover{background:#f2f3ee}
table.lines td.qtyCell{white-space:nowrap}
table.lines td.priceCell,table.lines td.makerCell{white-space:nowrap}
table.lines td.priceCell input,table.lines td.makerCell input{display:block;width:100%}
table.lines td.priceCell input + input,table.lines td.makerCell input + input{margin-top:4px}
table.lines td.remarksCell textarea{width:100%;font-size:13px;padding:6px 7px;border:1px solid #c7cac3;
    border-radius:3px;font-family:inherit;line-height:1.4;resize:vertical}
table.lines .crossWrap input{width:70px}
table.lines .crossWrap input + input{margin-left:4px}
table.lines td.noritsukeCell{white-space:nowrap;font-size:12.5px}
table.lines td.noritsukeCell .noritsuke-check{display:flex;align-items:center;gap:3px;margin-bottom:4px;cursor:pointer;font-weight:normal}
table.lines td.noritsukeCell input[type=date]{width:100%;font-size:12px;padding:4px 5px;border:1px solid #c7cac3;border-radius:3px}

/* ---- マスタ未登録確認 ---- */
.confirm-box{background:#f2e7ce;border-radius:3px;padding:16px 18px;margin-bottom:20px;font-size:13px;color:#5a4410}

/* ---- ボタン・帯 ---- */
.submit-bar{margin-top:26px;padding-top:20px;border-top:1px solid #eceee8;display:flex;align-items:center;gap:16px}
.submit-btn{background:#191c1f;color:#fff;border:none;border-radius:3px;padding:12px 32px;font-size:14.5px;font-weight:700;cursor:pointer;letter-spacing:.03em}
.submit-btn:hover{background:#33383c}
a.submit-btn{display:inline-block;text-decoration:none}
.errors{background:#fbeceb;border:1px solid #e3b4ac;color:#9a2b12;border-radius:3px;padding:14px 16px;margin-bottom:20px;font-size:13px}
.errors ul{margin:4px 0 0;padding-left:20px}
.done{background:#e9f3ee;border:1px solid #b7d9c8;color:#1f5b4b;border-radius:3px;padding:16px 18px;margin-bottom:24px;font-size:13px}
.done table{width:100%;border-collapse:collapse;margin-top:10px;background:#fff;font-size:12.5px}
.done th,.done td{border:1px solid #cfe4d8;padding:6px 8px;text-align:left}
.done th{background:#f2f8f5}
code.kn{font-family:ui-monospace,Consolas,monospace;font-weight:700;background:#dff0e7;padding:1px 6px;border-radius:3px}

/* ---- 一覧テーブル（表示専用） ---- */
.table-wrap{overflow:auto;max-height:70vh;margin-top:10px;border:1px solid #eceee8}
table.list{width:100%;border-collapse:collapse;font-size:12.5px;white-space:nowrap}
table.list th{position:sticky;top:0;z-index:2;background:#f2f3ee;text-align:left;padding:8px 10px;border-bottom:2px solid #dcdfd8;color:#4a524f;font-weight:600}
table.list td{padding:7px 10px;border-bottom:1px solid #eceee8}
table.list tbody tr:nth-child(even) td{background:#f7f8f4}
table.list tr:hover td{background:#eef1e9}
table.list td.num{text-align:right;font-variant-numeric:tabular-nums}
table.list td.ops{white-space:nowrap}
table.list td.ops form{display:inline}
table.list td.ops a{color:#1f4e8c;font-weight:600;margin-right:10px}
/* 操作列は横スクロールしても右端に貼り付けておく */
table.list th.ops-h,table.list td.ops{position:sticky;right:0;background:#fff;border-left:1px solid #e6e8e2}
table.list th.ops-h{background:#f2f3ee;z-index:3}
table.list tbody tr:nth-child(even) td.ops{background:#f7f8f4}
table.list tr:hover td.ops{background:#eef1e9}

/* ---- ステータスバッジ ---- */
.badge{display:inline-block;padding:2px 9px;border-radius:10px;font-size:11.5px;font-weight:700;white-space:nowrap}
.badge.st1{background:#eceee8;color:#4a524f}
.badge.st2{background:#e2ecf7;color:#1f4e8c}
.badge.st3{background:#eee5f7;color:#5b3a8c}
.badge.st4{background:#faf0d8;color:#8a6110}
.badge.st5{background:#e0f0e7;color:#1f5b4b}

/* ---- 準備中プレースホルダ ---- */
.stub{background:#f2f3ee;border:1px dashed #c7cac3;border-radius:4px;padding:36px 24px;text-align:center;color:#4a524f;margin-top:20px}
.stub .big{font-size:15px;font-weight:700;color:#191c1f;margin-bottom:6px}

/* ---- スマホ・タブレット（⑤引渡登録をQRコードから開く想定） ---- */
@media (max-width: 640px) {
  body{padding:0 8px 60px}
  .navbar{padding-top:8px}
  .nav-item{padding:6px 9px;font-size:11.5px}
  .card{padding:16px 14px}
  .row{flex-direction:column;gap:12px}
  .field input[type=text],.field input[type=date],.field input[type=number],.field select,.field textarea{
      min-width:0;width:100%;font-size:16px}   /* 16px未満だとiPhoneで入力時に拡大される */
  .field.wide input{min-width:0}
  .submit-bar{flex-wrap:wrap}
  .submit-btn{width:100%;padding:14px}
  .confirm-box{font-size:14px;line-height:1.8}
}

/* ---- 受領サイン（⑤部材引渡登録） ---- */
.sign-block{margin-top:18px;padding-top:14px;border-top:1px solid #eceee8}
.sign-label{display:block;font-size:12px;color:#4a524f;font-weight:600;margin-bottom:6px}
.sign-pad{width:100%;height:180px;border:1px dashed #9aa096;border-radius:4px;background:#fff;
    touch-action:none;display:block;cursor:crosshair}
.sign-actions{display:flex;align-items:center;gap:12px;margin-top:8px;flex-wrap:wrap}
.sign-saved{max-width:100%;height:auto;border:1px solid #dcdfd8;border-radius:4px;background:#fff;margin-bottom:8px}

/* ---- キャンセルした発注（発注一覧） ---- */
.badge.stx{background:#fbeceb;color:#9a2b12}
table.list tbody tr.row-cancel td,table.list tbody tr.row-cancel:nth-child(even) td{background:#fdf5f4;color:#7a6b68}
table.list tbody tr.row-cancel td code.kn{background:#f3ddda;text-decoration:line-through}

/* ---- 発注一覧：管理番号の列を左に固定し、操作列は固定しない ---- */
table.list.pin-left th.ops-h,table.list.pin-left td.ops{position:static;border-left:none}
table.list.pin-left th:first-child,table.list.pin-left td:first-child{position:sticky;left:0;background:#fff;border-right:1px solid #e6e8e2}
table.list.pin-left td:first-child{z-index:1}
table.list.pin-left th:first-child{z-index:3}
table.list.pin-left tbody tr:nth-child(even) td:first-child{background:#f7f8f4}
table.list.pin-left tbody tr:hover td:first-child{background:#eef1e9}
table.list.pin-left tbody tr.row-cancel td:first-child{background:#fdf5f4}

/* ---- 在庫部材一覧：在庫にある行 ---- */
table.list tbody tr.row-zaiko td,table.list tbody tr.row-zaiko:nth-child(even) td{background:#f2f8f5}

/* ---- 在庫部材一覧：予約済みの行 ---- */
table.list tbody tr.row-yoyaku td,table.list tbody tr.row-yoyaku:nth-child(even) td{background:#eee9f7}

/* ---- テスト環境の帯 ---- */
.env-bar{background:#9a2b12;color:#fff;text-align:center;font-size:12.5px;font-weight:700;
    padding:6px 12px;letter-spacing:.04em}