header{padding-bottom:14px;}


/* 画面名。h1（20px）より一回り小さく、頭の1文字だけ赤くする。
   base.css に置くと dashboard/vendor の h1 まで縮むので各画面に持つ
   （理由は base.css の .head-in h1 のコメント）。 */
.head-in h1{font-size:19px; margin:0; letter-spacing:.02em;}


.head-in h1::first-letter{color:var(--red);}


footer{max-width:var(--page-max); margin:0 auto; padding:0 24px 40px; color:var(--muted); font-size:12px; line-height:1.7;}


/* ── 施設の検索 ── */
.fk-search{
  width:100%; box-sizing:border-box; font-family:inherit; font-size:14px;
  padding:10px 14px; margin-bottom:16px;
  border:1.5px solid var(--line); border-radius:8px; color:var(--ink); background:#fff;
}


.fk-search:focus{outline:none; border-color:var(--red);}


.summary .big{font-size:24px; font-weight:800; color:var(--red); line-height:1;}


.summary .lbl{color:var(--muted); font-size:13px;}


.summary .sep{width:1px; height:16px; background:var(--red-line);}


.empty{
  text-align:center; color:var(--muted); padding:40px 20px;
  border:1px dashed var(--line); border-radius:10px;
}


/* ── 施設のカード ──
   ダッシュボード設定の手配先ブロック（.co-block）と同じ「1件ぶんを箱に
   まとめて、見出しに色を敷いて区切る」作り。片方を直したら見た目が
   ずれていないか見ること。
   （自社清掃員管理も以前は同じカードだったが、清掃員が30人規模になり
   一覧性が要るので表 .sa-table に変えてある。もう仲間ではない） */
.fk-card{
  border:1px solid var(--line); border-radius:12px; background:#fff;
  box-shadow:0 1px 3px rgba(0,0,0,.07); margin-bottom:14px; overflow:hidden;
}


.fk-head{
  display:flex; align-items:center; gap:10px; padding:14px 16px;
  background:#f6f6f7; border-bottom:1px solid var(--line);
}


.fk-head .code{
  flex:none; font-family:var(--font-mono); font-size:11.5px; font-weight:700;
  color:var(--red-dark); border:1px solid var(--red-line); border-radius:4px; padding:2px 6px;
}


.fk-name{font-weight:700; font-size:14.5px;}


.fk-state{
  margin-left:auto; flex:none; padding:3px 11px; border-radius:99px;
  font-size:11.5px; font-weight:700; color:var(--muted); background:#f2f2f2;
}


.fk-state.ok{background:#ecfdf5; color:#059669;}


.fk-open{
  flex:none; border:1px solid var(--line); background:#fff; color:var(--muted);
  padding:5px 13px; border-radius:99px;
  font-family:inherit; font-size:12px; font-weight:700; cursor:pointer;
}


.fk-open:hover{border-color:var(--red); color:var(--red);}


.fk-body{padding:14px 16px 16px; display:flex; flex-direction:column; gap:16px;}


.fk-sec{display:flex; flex-direction:column; gap:8px;}


.fk-lbl{color:var(--muted); font-size:12px; font-weight:700;}


.hint{color:var(--muted); font-size:11px; font-weight:400; margin-left:8px;}


/* ── エントランスの入力欄 ── */
.fk-row{display:flex; gap:8px; flex-wrap:wrap;}


.fk-method, .fk-code{
  font-family:inherit; font-size:13px; padding:8px 10px; color:var(--ink);
  border:1px solid var(--line); border-radius:6px; background:#fff;
}


.fk-method:focus, .fk-code:focus{outline:none; border-color:var(--red);}


.fk-row .fk-method{flex:2; min-width:200px;}


.fk-row .fk-code{flex:1; min-width:120px;}


/* ── 部屋の鍵の表 ── */
.fk-table{width:100%; border-collapse:collapse;}


.fk-table th{
  text-align:left; font-size:11px; font-weight:700; color:var(--muted);
  padding:4px 8px; border-bottom:1px solid var(--line); white-space:nowrap;
}


.fk-table td{padding:6px 8px; font-size:12.5px; border-bottom:1px solid var(--line); vertical-align:middle;}


.fk-table tr:last-child td{border-bottom:none;}


/* クラス名を単に「room」にすると base.css のチップ用 .room（赤枠）と
   衝突して、末尾行だけ枠の下辺が消える壊れた赤枠になっていた
   （2026-08-30、ユーザー指摘で発覚）。専用クラス名にして切り離す。 */
.fk-table td.fk-roomno{font-weight:700; white-space:nowrap; width:1%;}

/* Beds24 にもう無い部屋番号の鍵。**この行の鍵は清掃員の画面に出ていない。**
   Beds24 側で部屋名を変えると引き当てが外れるので、赤くして付け替えを促す。 */
.fk-table tr.is-stray td{background:#fff5f5;}
.fk-stray{display:flex; flex-wrap:wrap; align-items:center; gap:6px; margin-top:5px; white-space:normal;}
.fk-stray-note{color:var(--red); font-weight:700; font-size:11.5px;}
.fk-relink{font-size:12px; padding:3px 6px; border:1px solid var(--line); border-radius:6px; background:#fff;}
.fk-relink-go{font-size:12px; padding:3px 9px; border:1px solid var(--red); border-radius:6px;
  background:#fff; color:var(--red); font-weight:700; cursor:pointer;}
.fk-relink-go:disabled{opacity:.45; cursor:default;}


.fk-table td.act{width:1%; text-align:right;}


.fk-table td.empty{color:var(--muted); text-align:center; padding:10px 8px;}


.fk-table .fk-method, .fk-table .fk-code{width:100%; box-sizing:border-box; padding:6px 8px; font-size:12.5px;}


/* 削除の×。押すと確認ポップアップ（js/lib/confirmdialog.js）が出て、そこで確定する。 */
.fk-table .x{
  border:none; background:none; cursor:pointer; color:var(--muted);
  font-family:inherit; font-weight:800; font-size:13px; padding:0 4px;
}


.fk-table .x:hover{color:var(--red);}


.fk-add-row{display:flex; align-items:center; gap:8px; flex-wrap:wrap; margin-top:8px;}


.fk-room-input{
  flex:1; min-width:140px; max-width:220px; box-sizing:border-box;
  font-family:inherit; font-size:12.5px; padding:6px 28px 6px 9px; color:var(--ink);
  border:1px solid var(--line); border-radius:6px; background-color:#fff;
}


.fk-room-input:focus{outline:none; border-color:var(--red);}


.fk-add{
  flex:none; border:1.5px dashed var(--red); background:#fff; color:var(--red);
  padding:6px 14px; border-radius:99px;
  font-family:inherit; font-size:12.5px; font-weight:700; cursor:pointer;
}


.fk-add:hover:not(:disabled){background:var(--red); color:#fff; border-style:solid;}


.fk-add:disabled{opacity:.4; cursor:default; border-style:solid;}


/* ── 施設ごとのオプション ──
   説明（.hint）はチェックボックスの右の列に折り返して入れる。
   .hint 既定の margin-left は、行頭が揃わなくなるので打ち消す。 */
.fk-opt{display:flex; align-items:flex-start; gap:8px; font-size:13px; cursor:pointer;}


.fk-opt input{margin:2px 0 0; flex:none; width:16px; height:16px; accent-color:var(--red); cursor:pointer;}


.fk-opt .hint{display:block; margin-left:0; margin-top:2px; line-height:1.5;}