/* 予約②（時間枠型）公開フロー。配色はテーマ変数（--color-*）を参照。 */
.bk-root{max-width:760px;margin:0 auto}
.bk-h1{font-size:22px;line-height:1.3;margin:0 0 6px}
.bk-step{font-size:13px;color:var(--color-sub,#6b7280);margin:0 0 18px;font-weight:600;letter-spacing:.02em}

/* 選択中のキャスト見出し */
.bk-chosen{display:flex;align-items:center;gap:10px;margin:0 0 16px;padding:10px 14px;background:rgba(0,0,0,.04);border-radius:8px}
.bk-chosen__label{font-size:12px;color:var(--color-sub,#6b7280)}
.bk-chosen__name{font-weight:700;font-size:16px}
.bk-change{margin-left:auto;font-size:13px;text-decoration:underline}

/* STEP1 キャストグリッド */
.bk-staff-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}
.bk-staff{display:flex;flex-direction:column;text-align:center;text-decoration:none;color:inherit;border:1px solid rgba(0,0,0,.1);border-radius:10px;overflow:hidden;background:#fff;transition:box-shadow .15s}
.bk-staff:hover{box-shadow:0 4px 14px rgba(0,0,0,.12)}
.bk-staff__photo{display:block;aspect-ratio:3/4;overflow:hidden;background:rgba(0,0,0,.05)}
.bk-staff__photo img,.bk-staff__photo picture{width:100%;height:100%;object-fit:cover}
.bk-staff__photo--none{background:repeating-linear-gradient(45deg,#f0f0f0,#f0f0f0 8px,#e8e8e8 8px,#e8e8e8 16px)}
.bk-staff__name{padding:9px 6px;font-weight:600;font-size:14px}

/* STEP2 メニュー */
.bk-menu-list{display:flex;flex-direction:column;gap:10px;margin-bottom:20px}
.bk-menu{display:flex;align-items:flex-start;gap:12px;padding:14px 16px;border:1px solid rgba(0,0,0,.12);border-radius:10px;background:#fff;cursor:pointer}
.bk-menu:has(input:checked){border-color:var(--color-accent,#c2185b);box-shadow:0 0 0 1px var(--color-accent,#c2185b)}
.bk-menu input{margin-top:3px;width:18px;height:18px;flex-shrink:0}
.bk-menu__main{display:flex;flex-direction:column;gap:2px}
.bk-menu__name{font-weight:700;font-size:15px}
.bk-menu__meta{font-size:14px;color:var(--color-sub,#555)}
.bk-menu__desc{font-size:13px;color:var(--color-sub,#6b7280);margin-top:2px}
.bk-next{width:100%;text-align:center;font-size:16px;padding:13px}

/* STEP3 カレンダー */
.bk-sel{border:1px solid rgba(0,0,0,.1);border-radius:10px;padding:12px 16px;margin:0 0 16px;background:#fff}
.bk-sel__k{display:inline-block;font-size:12px;color:var(--color-sub,#6b7280);min-width:5em}
.bk-nav{display:flex;align-items:center;justify-content:space-between;gap:8px;margin:6px 0 10px}
.bk-nav__label{font-weight:700}
.bk-nav__btn{display:inline-block;padding:8px 12px;border:1px solid rgba(0,0,0,.15);border-radius:8px;text-decoration:none;font-size:13px;white-space:nowrap}
.bk-nav__btn.is-disabled{opacity:.35;pointer-events:none}
.bk-cal-wrap{overflow-x:auto;-webkit-overflow-scrolling:touch}
.bk-cal{border-collapse:separate;border-spacing:0;width:100%;min-width:520px;background:#fff;border:1px solid rgba(0,0,0,.1);border-radius:10px;overflow:hidden}
.bk-cal th,.bk-cal td{border-bottom:1px solid rgba(0,0,0,.07);border-right:1px solid rgba(0,0,0,.05);text-align:center;padding:7px 4px}
.bk-cal th:last-child,.bk-cal td:last-child{border-right:0}
.bk-cal tbody tr:last-child th,.bk-cal tbody tr:last-child td{border-bottom:0}
.bk-cal__time{background:rgba(0,0,0,.03);font-size:12px;color:var(--color-sub,#555);font-weight:600;white-space:nowrap;position:sticky;left:0;z-index:1}
.bk-cal__day{background:rgba(0,0,0,.03);font-weight:700}
.bk-cal__d{display:block;font-size:15px}
.bk-cal__wd{display:block;font-size:11px;color:var(--color-sub,#6b7280)}
.bk-cal .bk-sun .bk-cal__d,.bk-cal .bk-sun{color:#d33}
.bk-cal .bk-sat .bk-cal__d,.bk-cal .bk-sat{color:#2b6cd4}
.bk-cell{font-size:16px;line-height:1.1}
.bk-cell.c-ok{padding:0}
.bk-cell.c-ok a{display:block;padding:9px 4px;color:var(--color-accent,#c2185b);font-weight:700;text-decoration:none}
.bk-cell.c-ok a:hover{background:var(--color-accent,#c2185b);color:#fff}
.bk-cell.c-full{color:#bbb}
.bk-cell.c-na{color:#ddd}
.bk-cell.c-closed{color:#ccc;background:rgba(0,0,0,.02)}
.bk-legend{font-size:12px;color:var(--color-sub,#6b7280);margin:10px 0}
.bk-legend span{font-weight:700;margin-right:2px}
.bk-legend .c-ok{color:var(--color-accent,#c2185b)}
.bk-back{font-size:13px;text-decoration:underline}
.bk-error{background:#fdecec;border:1px solid #f5c2c2;color:#a12626;padding:10px 14px;border-radius:8px;margin:0 0 14px;font-size:14px}

/* 確認・完了・キャンセル */
.bk-form{margin-top:8px}
.bk-form label{display:block;margin:12px 0;font-size:14px;font-weight:600}
.bk-form input,.bk-form textarea{display:block;width:100%;max-width:420px;padding:10px 12px;margin-top:5px;border:1px solid rgba(0,0,0,.2);border-radius:8px;font-size:15px;font-family:inherit}
.bk-hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.bk-submit{display:flex;align-items:center;gap:16px;margin-top:20px;flex-wrap:wrap}
.bk-dl{margin:0;display:grid;grid-template-columns:auto 1fr;gap:6px 16px}
.bk-dl dt{font-size:12px;color:var(--color-sub,#6b7280);align-self:center}
.bk-dl dd{margin:0;font-weight:600}
.bk-done .bk-dl{margin:12px 0}
.bk-cancel-link{margin-top:14px;font-size:13px}
.bk-cancel-link a{text-decoration:underline}
.bk-danger{background:#c0392b}

@media(max-width:640px){
  .bk-staff-grid{grid-template-columns:repeat(2,1fr)}
  .bk-cal__time{font-size:11px}
}