/* Covearth SleepOS Admin v1.0  ---------------------------------- */
:root{
  --bg:#f5f7fa; --panel:#ffffff; --ink:#1f2733; --sub:#6b7684;
  --line:#e3e8ef; --brand:#1f3864; --brand2:#2e5aac; --accent:#2e5aac;
  --shadow:0 1px 3px rgba(16,24,40,.06),0 1px 2px rgba(16,24,40,.04);
}
*{box-sizing:border-box}
html,body{margin:0;padding:0}
body{
  font-family:"Yu Gothic","Hiragino Sans","Noto Sans JP",-apple-system,"Segoe UI",sans-serif;
  background:var(--bg); color:var(--ink); font-size:14px; line-height:1.6;
}
a{color:var(--accent); text-decoration:none}
a:hover{text-decoration:underline}
code{background:#eef1f6;padding:1px 5px;border-radius:4px;font-size:.9em}

/* ===== レイアウト ===== */
.layout{display:flex; min-height:100vh}
.sidebar{
  width:220px; flex:0 0 220px; background:var(--brand); color:#dfe6f2;
  display:flex; flex-direction:column; position:sticky; top:0; height:100vh;
}
.brand{padding:20px 20px 16px; font-weight:700; font-size:18px; line-height:1.25; color:#fff;
  border-bottom:1px solid rgba(255,255,255,.12)}
.brand span{font-size:11px; font-weight:400; color:#a9bbdd; letter-spacing:.02em}
.sidebar nav{display:flex; flex-direction:column; padding:10px 0; flex:1}
.sidebar nav a{color:#c6d2e8; padding:11px 20px; font-size:14px; border-left:3px solid transparent}
.sidebar nav a:hover{background:rgba(255,255,255,.06); text-decoration:none; color:#fff}
.sidebar nav a.on{background:rgba(255,255,255,.10); color:#fff; border-left-color:#7aa2e3; font-weight:600}
.side-foot{padding:14px 20px; border-top:1px solid rgba(255,255,255,.12); font-size:12px;
  display:flex; justify-content:space-between; align-items:center; color:#a9bbdd}
.side-foot a{color:#c6d2e8}

.main{flex:1; padding:26px 30px; min-width:0}
.page-title{margin:0 0 20px; font-size:22px; font-weight:700}
.foot{padding:16px 30px; color:var(--sub); font-size:12px; text-align:center; border-top:1px solid var(--line)}

/* ===== ダッシュボードカード ===== */
.cards{display:grid; grid-template-columns:repeat(4,1fr); gap:14px; margin-bottom:22px}
.card{background:var(--panel); border:1px solid var(--line); border-radius:10px; padding:16px 18px; box-shadow:var(--shadow)}
.card-label{font-size:13px; color:var(--sub)}
.card-num{font-size:30px; font-weight:700; line-height:1.2; margin:4px 0}
.card-sub{font-size:11px; color:#9aa4b2; font-family:ui-monospace,monospace}

.grid2{display:grid; grid-template-columns:1fr 1fr; gap:18px}
.panel{background:var(--panel); border:1px solid var(--line); border-radius:10px; padding:18px 20px;
  box-shadow:var(--shadow); margin-bottom:18px}
.panel h2{margin:0 0 12px; font-size:15px; font-weight:700; color:var(--brand)}
.quick-links{margin-top:16px; display:flex; gap:10px; flex-wrap:wrap}

/* ===== フィルター ===== */
.filters{display:flex; gap:10px; align-items:center; flex-wrap:wrap; margin-bottom:16px;
  background:var(--panel); border:1px solid var(--line); border-radius:10px; padding:12px 14px; box-shadow:var(--shadow)}
.filters input[type=text], .filters select{
  padding:8px 10px; border:1px solid #cdd5e0; border-radius:7px; font-size:14px; background:#fff}
.filters input[type=text]{min-width:260px; flex:1}
.filters button{background:var(--brand2); color:#fff; border:0; padding:8px 18px; border-radius:7px; cursor:pointer; font-size:14px}
.filters button:hover{background:#264a8f}
.filters .reset{color:var(--sub); font-size:13px}
.result-count{margin-left:auto; color:var(--sub); font-size:13px; white-space:nowrap}

/* ===== テーブル ===== */
.table-wrap{overflow-x:auto; background:var(--panel); border:1px solid var(--line);
  border-radius:10px; box-shadow:var(--shadow)}
table.grid{width:100%; border-collapse:collapse; font-size:13px}
table.grid thead th{
  position:sticky; top:0; background:#eef2f8; color:#41506a; text-align:left;
  padding:10px 12px; font-weight:600; border-bottom:1px solid var(--line); white-space:nowrap}
table.grid td{padding:9px 12px; border-bottom:1px solid #eef1f5; vertical-align:top}
table.grid tbody tr:hover{background:#f7f9fc}
.mono{font-family:ui-monospace,"SFMono-Regular",Consolas,monospace}
.sub{color:var(--sub)}
.num{text-align:right; font-variant-numeric:tabular-nums}
.nowrap{white-space:nowrap}
.empty{text-align:center; color:var(--sub); padding:30px 0!important}
.link{font-size:12px; padding:3px 10px; border:1px solid #cdd5e0; border-radius:6px; white-space:nowrap}
.link:hover{background:#eef2f8; text-decoration:none}
.hint{color:var(--sub); font-size:12px; margin-top:10px}

table.mini{width:100%; border-collapse:collapse}
table.mini td{padding:6px 4px; border-bottom:1px solid #eef1f5}
table.mini td.num{text-align:right; font-weight:600}

/* ===== バッジ ===== */
.badge{display:inline-block; padding:2px 9px; border-radius:999px; font-size:11.5px; font-weight:600; white-space:nowrap; border:1px solid transparent}
.badge--green{background:#e6f6ec; color:#1a7f43; border-color:#bfe6cd}
.badge--blue{background:#e8f0fe; color:#1c50a8; border-color:#c6dafc}
.badge--amber{background:#fff4e0; color:#a35b00; border-color:#f6dcac}
.badge--red{background:#fdeaea; color:#b3261e; border-color:#f4c7c4}
.badge--purple{background:#f1eafd; color:#6b30bf; border-color:#ddc9f7}
.badge--gray{background:#eef1f5; color:#5a6675; border-color:#dde3ec}
.badge--slate{background:#e9edf3; color:#3a4759; border-color:#d3dae4}
.type-badge,.role-badge{display:inline-block; padding:1px 8px; border-radius:6px; font-size:11px;
  background:#eef2f8; color:#41506a; border:1px solid #dbe3ef; font-family:ui-monospace,monospace}
.tag{display:inline-block; padding:1px 8px; margin:1px 2px 1px 0; border-radius:6px; font-size:11.5px;
  background:#eef4ff; color:#2a4a86; border:1px solid #d6e2fb}

/* ===== 詳細ページ ===== */
.detail-head{display:flex; align-items:center; gap:14px; flex-wrap:wrap; margin-bottom:14px}
.back{font-size:13px}
.detail-title{margin:0; font-size:20px}
.detail-cn{font-size:14px; color:var(--sub); font-weight:400; margin-left:6px}
.detail-badges{margin-left:auto; display:flex; align-items:center; gap:8px; font-size:12px; color:var(--sub)}
table.kv{width:100%; border-collapse:collapse}
table.kv th{width:120px; text-align:left; color:var(--sub); font-weight:600; padding:7px 10px 7px 0;
  vertical-align:top; white-space:nowrap; font-size:12.5px}
table.kv td{padding:7px 16px 7px 0; vertical-align:top}
.note-box{background:#fbfcfe; border:1px solid var(--line); border-radius:8px; padding:12px 14px; margin:0; color:#3a4759}

/* スコアバー */
.score{display:flex; align-items:center; gap:10px; margin:7px 0}
.score-label{width:150px; font-size:12.5px; color:var(--sub)}
.score-track{flex:1; height:9px; background:#eef1f5; border-radius:6px; overflow:hidden}
.score-fill{display:block; height:100%; background:linear-gradient(90deg,#5b8def,#2e5aac); border-radius:6px}
.score-val{width:26px; text-align:right; font-weight:700; font-variant-numeric:tabular-nums}

/* 層構成の役割で薄く色分け */
tr.role-core{background:#fbfbf4}
tr.role-core:hover{background:#f6f6ea}
tr.role-ticking td, tr.role-bottom td{color:#55617a}

/* ボタン */
.btn{display:inline-block; background:#fff; border:1px solid #cdd5e0; color:var(--brand2);
  padding:8px 16px; border-radius:7px; font-size:13px; margin-top:6px}
.btn:hover{background:#eef2f8; text-decoration:none}

/* ページャ */
.pager{display:flex; gap:14px; align-items:center; justify-content:center; margin:16px 0 4px}
.pager a{padding:6px 14px; border:1px solid #cdd5e0; border-radius:7px; background:#fff}
.pager a:hover{background:#eef2f8; text-decoration:none}
.pager-info{color:var(--sub); font-size:13px}

/* ===== ログイン ===== */
.login-body{display:flex; align-items:center; justify-content:center; min-height:100vh; background:#eef1f6}
.login-card{background:#fff; border:1px solid var(--line); border-radius:12px; padding:30px 30px 24px;
  width:340px; box-shadow:0 10px 30px rgba(16,24,40,.10); display:flex; flex-direction:column; gap:12px}
.login-brand{font-size:20px; font-weight:700; color:var(--brand); line-height:1.25; text-align:center; margin-bottom:6px}
.login-brand span{font-size:12px; font-weight:400; color:var(--sub)}
.login-card label{display:flex; flex-direction:column; font-size:12.5px; color:var(--sub); gap:5px}
.login-card input{padding:10px 12px; border:1px solid #cdd5e0; border-radius:8px; font-size:15px}
.login-card button{margin-top:6px; background:var(--brand2); color:#fff; border:0; padding:11px; border-radius:8px;
  font-size:15px; cursor:pointer}
.login-card button:hover{background:#264a8f}
.login-error{background:#fdeaea; color:#b3261e; border:1px solid #f4c7c4; padding:8px 12px; border-radius:8px; font-size:13px}
.login-note{text-align:center; color:#9aa4b2; font-size:12px; margin:4px 0 0}

/* ===== レスポンシブ ===== */
@media (max-width:900px){
  .cards{grid-template-columns:repeat(2,1fr)}
  .grid2{grid-template-columns:1fr}
  .sidebar{width:64px; flex-basis:64px}
  .brand{font-size:0; padding:16px 0; text-align:center}
  .brand span{display:none}
  .sidebar nav a{padding:12px 0; text-align:center; font-size:11px; border-left:0}
  .side-foot{flex-direction:column; gap:6px; font-size:10px}
}

/* ===================================================================
 * v1.1 追加: 編集フォーム / フラッシュ / ツールバー / メーカー回答 / 監査
 * =================================================================== */

/* フラッシュメッセージ */
.flash{padding:11px 15px; border-radius:8px; margin-bottom:16px; font-size:13.5px; border:1px solid}
.flash--ok{background:#e6f6ec; color:#1a7f43; border-color:#bfe6cd}
.flash--error{background:#fdeaea; color:#b3261e; border-color:#f4c7c4}
.flash--warn{background:#fff4e0; color:#a35b00; border-color:#f6dcac}
.flash ul{margin:6px 0 0; padding-left:20px}
.flash li{margin:2px 0}

/* 編集ツールバー */
.toolbar{display:flex; gap:10px; align-items:center; flex-wrap:wrap; margin:0 0 18px}

/* 見出し内アクション */
.h2-action{float:right; font-size:12px; font-weight:400; padding:2px 12px; border:1px solid #cdd5e0;
  border-radius:6px; background:#fff}
.h2-action:hover{background:#eef2f8; text-decoration:none}

/* ボタン(v1.1) */
.btn-primary{display:inline-block; background:var(--brand2); color:#fff; border:1px solid var(--brand2);
  padding:9px 22px; border-radius:8px; font-size:14px; cursor:pointer}
.btn-primary:hover{background:#264a8f; color:#fff; text-decoration:none}
button.btn-primary{font-family:inherit}
.link--edit{color:#a35b00; border-color:#f0d9ad; margin-left:4px}
.link--edit:hover{background:#fff6e8}

/* 編集フォーム */
.edit-form .panel{margin-bottom:16px}
.req-note{float:right; font-size:11.5px; font-weight:400; color:var(--sub)}
.fgrid{display:grid; grid-template-columns:repeat(3,1fr); gap:12px 16px}
.fgrid label{display:flex; flex-direction:column; font-size:12.5px; color:var(--sub); gap:5px}
.fgrid label.col2{grid-column:span 2}
.fgrid label.col3{grid-column:span 3}
.fgrid input[type=text], .fgrid input[type=number], .fgrid input[type=date], .fgrid select, .fgrid textarea{
  padding:8px 10px; border:1px solid #cdd5e0; border-radius:7px; font-size:14px; color:var(--ink); background:#fff;
  font-family:inherit}
.fgrid textarea{resize:vertical}
.fgrid label.ro input, input[readonly]{background:#eef1f5; color:#5a6675; cursor:not-allowed; border-style:dashed}
.fgrid label.ro{color:#9aa4b2}

.form-actions{display:flex; gap:12px; align-items:center; margin:6px 0 10px}

/* メーカー回答パネル */
.panel--supplier{border-left:4px solid #d9a441}
.resp-card{border:1px solid var(--line); border-radius:8px; padding:12px 14px; margin-bottom:10px; background:#fffdf8}
.resp-head{display:flex; align-items:center; gap:10px; flex-wrap:wrap; margin-bottom:8px; font-weight:600}

/* 層編集テーブル */
table.layers-edit td{padding:5px 6px}
table.layers-edit input[type=text], table.layers-edit select{width:100%; padding:6px 8px;
  border:1px solid #cdd5e0; border-radius:6px; font-size:13px}
table.layers-edit .w-sort{width:48px; text-align:center}
table.layers-edit .w-th{width:64px}
table.layers-edit td.center{text-align:center}

/* 監査ログのJSON表示 */
.jsonbox{font-size:11.5px; max-width:320px}
.jsonbox .jk{color:#2a4a86; font-family:ui-monospace,monospace}
.jsonbox div{padding:1px 0; border-bottom:1px dashed #eef1f5}

@media (max-width:900px){
  .fgrid{grid-template-columns:1fr}
  .fgrid label.col2, .fgrid label.col3{grid-column:span 1}
}