/* SOURCE'D Booking — static styles */

* { margin: 0; padding: 0; box-sizing: border-box; }
a { text-decoration: none; color: inherit; }

.topbar { position:sticky;top:0;z-index:100;background:rgb(var(--base)/0.95);backdrop-filter:blur(8px);border-bottom:0.5px solid rgb(var(--dark)/0.1);padding:0 40px;display:flex;align-items:center;justify-content:space-between;height:60px; }
.topbar-logo { font-size:16px;letter-spacing:0.3em;font-weight:300; }
.topbar-back { font-size:11px;letter-spacing:0.2em;color:rgb(var(--accent)); }

.steps-bar { display:flex;align-items:center;justify-content:center;gap:0;padding:32px 24px 0; }
.step-item { display:flex;align-items:center;gap:0; }
.step-circle { width:28px;height:28px;border-radius:50%;border:0.5px solid rgb(var(--dark)/0.2);font-size:10px;letter-spacing:0.05em;display:flex;align-items:center;justify-content:center;color:rgb(var(--dark)/0.35);background:rgb(var(--base));transition:all .3s; }
.step-circle.active { background:rgb(var(--dark));color:rgb(var(--base));border-color:rgb(var(--dark)); }
.step-circle.done { background:rgb(var(--accent));color:rgb(var(--base));border-color:rgb(var(--accent)); }
.step-label { font-size:14px;letter-spacing:0.15em;color:rgb(var(--dark)/0.35);margin-left:6px;white-space:nowrap; }
.step-label.active { color:rgb(var(--dark)); }
.step-line { width:32px;height:0.5px;background:rgb(var(--dark)/0.15);margin:0 8px; }

.wrap { max-width:680px;margin:0 auto;padding:40px 24px 80px; }
.section-label { font-size:14px;letter-spacing:0.5em;color:rgb(var(--accent));margin-bottom:12px; }
.section-title { font-size:24px;font-weight:200;letter-spacing:0.06em;margin-bottom:32px; }

.menu-cards { display:flex;flex-direction:column;gap:12px;margin-bottom:32px; }
.menu-card { border:0.5px solid rgb(var(--dark)/0.12);border-radius:6px;padding:24px;cursor:pointer;transition:all .2s;position:relative; }
.menu-card:hover { border-color:rgb(var(--accent)); }
.menu-card.selected { border-color:rgb(var(--dark));background:rgb(var(--dark)); }
.menu-card.selected .mc-tag,.menu-card.selected .mc-name,.menu-card.selected .mc-desc,.menu-card.selected .mc-price { color:rgb(var(--base)); }
.mc-tag { font-size:9px;letter-spacing:0.4em;color:rgb(var(--accent));margin-bottom:10px; }
.mc-name { font-size:16px;font-weight:200;letter-spacing:0.05em;margin-bottom:8px; }
.mc-desc { font-size:11px;color:rgb(var(--dark)/0.6);line-height:1.8;margin-bottom:12px; }
.mc-price { font-size:12px;letter-spacing:0.1em;color:rgb(var(--dark)); }
.mc-check { position:absolute;top:20px;right:20px;width:20px;height:20px;border-radius:50%;border:0.5px solid rgb(var(--dark)/0.2);display:flex;align-items:center;justify-content:center; }
.menu-card.selected .mc-check { background:rgb(var(--accent));border-color:rgb(var(--accent));color:rgb(var(--base)); }

.duration-row { display:flex;gap:10px;flex-wrap:wrap;margin-bottom:32px; }
.dur-btn { padding:10px 22px;border:0.5px solid rgb(var(--dark)/0.2);border-radius:4px;font-size:12px;letter-spacing:0.1em;cursor:pointer;background:rgb(var(--base));color:rgb(var(--dark));transition:all .2s; }
.dur-btn:hover { border-color:rgb(var(--dark)); }
.dur-btn.active { background:rgb(var(--dark));color:rgb(var(--base));border-color:rgb(var(--dark)); }

.cal-nav { display:flex;align-items:center;justify-content:space-between;margin-bottom:16px; }
.cal-month { font-size:15px;font-weight:200;letter-spacing:0.1em; }
.cal-arrow { font-size:18px;color:rgb(var(--dark)/0.4);padding:6px 12px;border:0.5px solid rgb(var(--dark)/0.15);border-radius:4px;cursor:pointer;text-decoration:none;transition:all .2s; }
.cal-arrow:hover { border-color:rgb(var(--dark));color:rgb(var(--dark)); }
.cal-table { width:100%;border-collapse:collapse;margin-bottom:24px; }
.cal-table th { font-size:10px;letter-spacing:0.15em;color:rgb(var(--dark)/0.4);padding:8px 0;text-align:center;font-weight:400; }
.cal-table th:last-child { color:rgb(var(--accent)/0.6); }
.cal-table td { text-align:center;padding:4px; }
.cal-day { width:36px;height:36px;border-radius:50%;display:inline-flex;align-items:center;justify-content:center;font-size:13px;cursor:pointer;transition:all .2s;border:0.5px solid transparent; }
.cal-day:hover:not(.disabled) { background:rgb(var(--dark)/0.06);border-color:rgb(var(--dark)/0.15); }
.cal-day.disabled { color:rgb(var(--dark)/0.2);cursor:default; }
.cal-day.sunday { color:rgb(var(--accent)/0.5); }
.cal-day.saturday { color:rgb(var(--accent)); }
.cal-day.today { border-color:rgb(var(--dark)/0.3); }
.cal-day.selected { background:rgb(var(--dark));color:rgb(var(--base));border-color:rgb(var(--dark)); }

.slots-wrap { margin-bottom:32px; }
.slots-label { font-size:10px;letter-spacing:0.25em;color:rgb(var(--dark)/0.5);margin-bottom:12px; }
.slots-grid { display:grid;grid-template-columns:repeat(4,1fr);gap:8px; }
.slot-btn { padding:10px 0;border:0.5px solid rgb(var(--dark)/0.2);border-radius:4px;font-size:12px;letter-spacing:0.05em;text-align:center;cursor:pointer;background:rgb(var(--base));transition:all .2s; }
.slot-btn:hover { border-color:rgb(var(--dark)); }
.slot-btn.active { background:rgb(var(--dark));color:rgb(var(--base));border-color:rgb(var(--dark)); }
.slot-empty { font-size:12px;color:rgb(var(--dark)/0.4);padding:16px 0; }

.form-group { margin-bottom:20px; }
.form-label { font-size:10px;letter-spacing:0.2em;color:rgb(var(--dark)/0.55);margin-bottom:6px;display:block; }
.form-label .req { color:rgb(var(--accent)); }
.form-input,.form-textarea { width:100%;padding:12px 16px;border:0.5px solid rgb(var(--dark)/0.15);border-radius:4px;font-size:13px;font-family:inherit;color:rgb(var(--dark));background:rgb(var(--base));outline:none;transition:border-color .2s; }
.form-input:focus,.form-textarea:focus { border-color:rgb(var(--accent)); }
.form-textarea { resize:vertical;min-height:80px;line-height:1.8; }

.confirm-table { width:100%;border-collapse:collapse;margin-bottom:32px; }
.confirm-table tr { border-bottom:0.5px solid rgb(var(--dark)/0.08); }
.confirm-table tr:first-child { border-top:0.5px solid rgb(var(--dark)/0.08); }
.confirm-table th { font-size:10px;letter-spacing:0.2em;color:rgb(var(--dark)/0.45);padding:14px 0;text-align:left;font-weight:400;width:30%; }
.confirm-table td { font-size:13px;padding:14px 0; }

.complete-box { text-align:center;padding:48px 0; }
.complete-icon { font-size:40px;margin-bottom:24px; }
.complete-code { display:inline-block;font-size:22px;letter-spacing:0.3em;padding:16px 40px;border:0.5px solid rgb(var(--dark));margin:16px 0 8px; }
.complete-hint { font-size:11px;color:rgb(var(--dark)/0.45);letter-spacing:0.1em;margin-bottom:40px; }

.btn { display:inline-flex;align-items:center;justify-content:center;gap:8px;width:100%;padding:14px;font-size:11px;letter-spacing:0.25em;border:0.5px solid rgb(var(--dark));background:rgb(var(--dark));color:rgb(var(--base));cursor:pointer;border-radius:4px;font-family:inherit;transition:opacity .2s;margin-top:8px; }
.btn:hover { opacity:.78; }
.btn-ghost { background:transparent;color:rgb(var(--dark));margin-top:0; }
.btn-ghost:hover { background:rgb(var(--dark));color:rgb(var(--base));opacity:1; }
.btn-accent { background:rgb(var(--accent));border-color:rgb(var(--accent)); }

.flash-err { background:#FDECEC;color:#A32020;padding:14px 18px;border-radius:4px;font-size:12px;margin-bottom:20px; }
.note-box { background:rgb(var(--section));border-radius:4px;padding:16px 20px;font-size:11px;line-height:2;color:rgb(var(--dark)/0.6);margin-bottom:24px; }

.wrap-wide { max-width:1440px !important;padding:40px 40px 80px !important; }
.step1-layout { display:grid;grid-template-columns:1fr 1.3fr;gap:48px;align-items:start; }
.step1-left { position:sticky;top:72px; }

.menu-group { margin-bottom:5.0rem; }
.menu-group-label { font-size:20px;letter-spacing:0.45em;color:rgb(var(--accent));margin-bottom:12px;padding-bottom:8px;border-bottom:0.5px solid rgb(var(--dark)/0.08); }
.menu-grid-3 { display:grid;grid-template-columns:repeat(3,1fr);gap:8px; }
.menu-card-bk { border:0.5px solid rgb(var(--dark)/0.8);border-radius:6px;padding:16px 14px;cursor:pointer;transition:all .2s;position:relative;min-height:120px;display:flex;flex-direction:column; }
.menu-card-bk:hover { border-color:rgb(var(--accent));background:rgb(var(--accent)/0.03); }
.menu-card-bk.selected { border-color:rgb(var(--dark));background:rgb(var(--dark)); }
.menu-card-bk.selected .mcb-tag,.menu-card-bk.selected .mcb-name,.menu-card-bk.selected .mcb-price { color:rgb(var(--base)); }
.menu-card-bk.selected .mcb-check { background:rgb(var(--accent));border-color:rgb(var(--accent));color:rgb(var(--base)); }
.mcb-tag { font-size:14px;font-weight:600;letter-spacing:0.35em;color:rgb(var(--accent));margin-bottom:25px; }
.mcb-name { font-size:14px;font-weight:300;line-height:1.5;letter-spacing:0.03em;flex:1; }
.mcb-price { font-size:14px;letter-spacing:0.05em;color:rgb(var(--dark)/0.6);margin-top:8px; }
.mcb-check { position:absolute;top:12px;right:12px;width:18px;height:18px;border-radius:50%;border:0.5px solid rgb(var(--dark)/0.2);display:flex;align-items:center;justify-content:center;font-size:10px; }

.s1-cal-wrap { margin-bottom:0; }
.s1-cal-nav { display:flex;align-items:center;justify-content:space-between;margin-bottom:12px; }
.s1-cal-nav button { background:none;border:0.5px solid rgb(var(--dark)/0.2);border-radius:4px;padding:6px 16px;font-size:18px;cursor:pointer;color:rgb(var(--dark)/0.5); }
.s1-cal-nav button:hover { border-color:rgb(var(--dark));color:rgb(var(--dark)); }
.s1-cal-nav span { font-size:16px;font-weight:200;letter-spacing:0.1em; }
.s1-cal-table { width:100%;border-collapse:collapse; }
.s1-cal-table th { font-size:16px;letter-spacing:0.15em;text-align:center;padding:8px 0;color:rgb(var(--dark)/0.8);font-weight:400; }
.s1-cal-cell { text-align:center;padding:4px; }
.s1-day { width:48px;height:48px;border-radius:50%;display:inline-flex;align-items:center;justify-content:center;font-size:14px;cursor:pointer;transition:all .2s;border:0.5px solid transparent; }
.s1-day.avail:hover { background:rgb(var(--dark)/0.06);border-color:rgb(var(--dark)/0.2); }
.s1-day.unavail { color:rgb(var(--dark)/0.2);cursor:default; }
.s1-day.past { color:rgb(var(--dark)/0.15);cursor:default; }
.s1-day.selected { background:rgb(var(--dark));color:rgb(var(--base));border-color:rgb(var(--dark)); }
.s1-day.today:not(.selected) { border-color:rgb(var(--dark)/0.4);font-weight:500; }
.s1-day.saturday:not(.selected):not(.past) { color:rgb(var(--accent)); }
.s1-selected-date { font-size:13px;color:rgb(var(--dark));letter-spacing:0.05em;margin-top:16px;padding:12px 18px;background:rgb(var(--section));border-radius:4px;display:none; }

.opt-section { border-top:0.5px solid rgb(var(--dark)/0.1);margin-top:28px;padding-top:24px; }
.opt-section-label { font-size:14px;font-weight:600;letter-spacing:0.5em;color:rgb(var(--accent));margin-bottom:20px; }
.opt-card { border:0.5px solid rgb(var(--dark)/0.1);border-radius:6px;padding:20px 24px;margin-bottom:12px; }
.opt-title { font-size:16px;font-weight:400;letter-spacing:0.05em;margin-bottom:4px; }
.opt-note { font-size:11px;color:rgb(var(--dark)/0.45);margin-bottom:14px; }
.opt-dur-row { display:flex;flex-wrap:wrap;gap:8px; }
.opt-dur-label { cursor:pointer; }
.opt-dur-label input { display:none; }
.opt-dur-btn { display:inline-block;padding:8px 16px;border:0.5px solid rgb(var(--dark)/0.2);border-radius:4px;font-size:12px;color:rgb(var(--dark)/0.7);transition:all .2s;text-align:center; }
.opt-dur-label input:checked + .opt-dur-btn { background:rgb(var(--dark));color:rgb(var(--base));border-color:rgb(var(--dark)); }
.opt-dur-btn:hover { border-color:rgb(var(--dark)); }
.opt-check-row { display:flex;flex-direction:column;gap:8px; }
.opt-check-label { display:flex;align-items:center;gap:10px;cursor:pointer;font-size:13px;color:rgb(var(--dark)/0.75); }
.opt-check-label input { width:16px;height:16px;accent-color:rgb(var(--accent)); }
.opt-included { font-size:12px;color:rgb(var(--accent));padding:8px 14px;background:rgb(var(--accent)/0.08);border-radius:4px;letter-spacing:0.05em; }

/* ===== 会員・クーポン ===== */
.member-bar { display:flex;align-items:center;justify-content:space-between;gap:12px;padding:12px 18px;background:rgb(var(--section));border-radius:4px;font-size:12px;margin-bottom:20px;flex-wrap:wrap; }
.member-bar--in { border-left:3px solid rgb(var(--accent)); }
.member-link { background:none;border:none;cursor:pointer;font-size:11px;letter-spacing:0.1em;color:rgb(var(--accent));padding:0;font-family:inherit; }
.member-link:hover { text-decoration:underline; }
.member-details { margin-bottom:20px;border:0.5px solid rgb(var(--dark)/0.12);border-radius:4px;padding:12px 16px; }
.member-summary { cursor:pointer;font-size:12px;letter-spacing:0.08em;color:rgb(var(--accent));list-style:none;padding:2px 0; }
.member-summary::-webkit-details-marker { display:none; }
.member-summary::before { content:'▶ ';font-size:9px; }
details[open] .member-summary::before { content:'▼ '; }
/* 会員ログインバンド */
.member-login-band { display:flex;align-items:center;justify-content:space-between;gap:16px;padding:14px 20px;background:rgb(var(--accent)/0.08);border:0.5px solid rgb(var(--accent)/0.35);border-radius:6px 6px 0 0;margin-bottom:0; }
.mlb-message { display:flex;align-items:center;gap:12px; }
.mlb-icon { font-size:20px; }
.mlb-title { font-size:12px;letter-spacing:0.1em;font-weight:400;color:rgb(var(--accent)); }
.mlb-sub { font-size:11px;letter-spacing:0.06em;color:rgb(var(--dark)/0.6);margin-top:2px; }
.mlb-btn { padding:8px 20px;border:0.5px solid rgb(var(--accent));background:transparent;color:rgb(var(--accent));font-family:inherit;font-size:11px;letter-spacing:0.15em;cursor:pointer;transition:all .2s;white-space:nowrap;border-radius:4px; }
.mlb-btn:hover { background:rgb(var(--accent));color:rgb(var(--base)); }
/* ログインフォーム展開パネル */
.member-login-form { padding:16px 20px;background:rgb(var(--section));border:0.5px solid rgb(var(--accent)/0.35);border-top:none;border-radius:0 0 6px 6px;margin-bottom:0; }
/* クーポンボックス（連結デザイン） */
.coupon-box { padding:16px 20px;background:rgb(var(--section));border-radius:4px;margin-bottom:16px; }
.coupon-box-attached { border-radius:0 0 6px 6px;border-top:none;margin-top:0; }
.register-box { padding:16px 20px;border:0.5px solid rgb(var(--dark)/0.1);border-radius:4px;margin-bottom:16px; }

@media (max-width: 1024px) {
  .step1-layout { grid-template-columns: 1fr; }
  .step1-left { position: static; }
  .menu-grid-3 { grid-template-columns: repeat(2,1fr); }
  .wrap-wide { padding: 32px 24px 80px !important; }
}
@media (max-width: 480px) {
  .topbar { padding: 0 20px; }
  .step-label { display: none; }
  .step-line { width: 20px; }
  .slots-grid { grid-template-columns: repeat(3,1fr); }
  .menu-grid-3 { grid-template-columns: 1fr; }
  .s1-day { width: 40px; height: 40px; font-size: 13px; }
}
