/* Website-only booking. Warm panels, the approved brick accent, and native dialogs. */
.booking-page,.booking-time-sheet { color-scheme:light; }
.genar-one-page-booking { background:#111318; color:#f5efe5; }
.genar-one-page-booking .web-portal { background:#111318; }
.genar-one-page-booking .web-page { max-width:1140px; padding:42px 24px 80px; }
.genar-one-page-booking .web-header-v3 { position:relative; background:#111318; color:#f5efe5; border-bottom:1px solid #ffffff20; }
.genar-one-page-booking .web-header-v3 .web-logo { filter:brightness(0) invert(1); }
.genar-one-page-booking .portal-footer { background:#111318; color:#d8c3a0; }
.booking-page { --booking-accent:var(--genar-brick-orange,#dc9254); --booking-ink:#211c18; color:#f5efe5; }
.booking-heading { margin:0 0 30px; }
.booking-heading .eyebrow { color:#dc9254; font-size:18px; font-weight:600; line-height:1.5; letter-spacing:.08em; }
.booking-heading h1 { font:400 clamp(44px,6vw,68px)/1.1 var(--genar-serif,Georgia); letter-spacing:-.035em; margin:12px 0; }
.booking-heading p { font-size:20px; line-height:1.5; color:#d8c3a0; }
.booking-layout { display:grid; grid-template-columns:minmax(0,1.35fr) minmax(0,1fr); gap:24px; align-items:start; }
.booking-sections { display:grid; gap:18px; min-width:0; }
.booking-panel { background:#f5efe5; color:var(--booking-ink); border:1px solid #ffffff30; border-radius:0; padding:24px; box-shadow:0 8px 28px #0002; min-width:0; }
.booking-panel h2 { display:flex; align-items:center; gap:12px; margin:0 0 22px; font:600 20px/1.25 var(--genar-sans,Arial); letter-spacing:-.035em; }
.booking-panel h2>span { font:11px/1 var(--genar-mono,monospace); color:#8c5b34; border:1px solid #b5a28b; border-radius:0; width:28px; height:28px; display:grid; place-items:center; letter-spacing:0; }
.booking-contact-fields { display:grid; grid-template-columns:1fr 1fr; gap:14px; }
.booking-panel label { display:block; font-size:14px; font-weight:600; line-height:1.6; }
.booking-panel :is(input:not([type=checkbox]):not([type=file]),textarea,select),.booking-time-sheet input { display:block; box-sizing:border-box; width:100%; min-width:0; min-height:48px; padding:12px; margin-top:7px; background:#fffaf3; color:#211c18; border:1px solid #bdaf9b; border-radius:0; font:16px/1.4 var(--genar-sans,Arial); }
.booking-panel textarea { resize:vertical; }
.booking-page button,.booking-time-sheet button { cursor:pointer; -webkit-tap-highlight-color:transparent; touch-action:manipulation; transition:transform 160ms ease,box-shadow 160ms ease,background 160ms ease; }
.booking-page button:active:not(:disabled),.booking-time-sheet button:active:not(:disabled) { transform:scale(.97) translateY(1px); box-shadow:none; }
.booking-page :is(button,input,select,textarea,summary):focus-visible,.booking-time-sheet :is(button,input):focus-visible { outline:3px solid #a65620; outline-offset:3px; }
.booking-page button:disabled { cursor:default; opacity:.5; }
.booking-services { border:1px solid #c9baa5; border-radius:0; margin-top:12px; overflow:hidden; }
.booking-services>summary { display:flex; align-items:center; justify-content:space-between; gap:8px; padding:12px 14px; min-height:48px; list-style:none; cursor:pointer; font-size:14px; font-weight:700; letter-spacing:.04em; }
.booking-services summary::-webkit-details-marker { display:none; }
.booking-services--cut>summary { background:#e9dccb; }
.booking-services--chemical>summary { background:#e0dcd4; }
.booking-services--wash>summary { background:#e5e8dc; }
.booking-services summary small { margin-left:12px; color:#8c481c; }
.booking-chevron { font-size:22px; font-weight:400; transition:transform 160ms; }
.booking-services[open] .booking-chevron { transform:rotate(45deg); }
.booking-service-row { width:100%; padding:14px; text-align:left; display:flex; align-items:center; justify-content:space-between; gap:12px; min-height:66px; border:0; border-top:1px solid #d6c8b6; background:transparent; color:#211c18; }
.booking-service-row strong { font-size:16px; line-height:1.5; }
.booking-service-row small { display:block; margin-top:4px; font-size:14px; line-height:1.6; }
.booking-service-row.selected { background:#f0d4b7; }
.booking-service-row:disabled { opacity:.75; }
.booking-check { width:24px; height:24px; border:1px solid #b19a80; border-radius:0; display:grid; place-items:center; flex-shrink:0; }
.selected .booking-check { background:#211c18; color:#fff; border-color:#211c18; }
.booking-services .booking-hint { padding:0 14px 14px; }
.booking-options { border-top:1px solid #cdbfac; margin-top:18px; padding-top:8px; }
.booking-options summary { min-height:44px; display:flex; align-items:center; cursor:pointer; font-size:15px; gap:10px; }
.booking-options summary::after { content:'＋'; margin-left:auto; font-size:18px; }
.booking-options[open] summary::after { content:'−'; }
.booking-options .booking-ritual { display:flex; gap:10px; align-items:center; min-height:44px; font-weight:400; }
.booking-ritual input { width:20px; height:20px; accent-color:#a65a24; }
.booking-label { font-size:13px; letter-spacing:.08em; }
.booking-tiers { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:8px; margin:12px 0 20px; }
.booking-tiers button { padding:13px 4px; min-height:64px; border:1px solid #bbaa93; border-radius:0; color:#211c18; background:#fffaf3; font-size:12px; }
.booking-tiers button strong { display:block; font-size:14px; }
.booking-tiers button small { display:block; margin-top:6px; font-size:11px; }
.booking-tiers button[aria-pressed=true] { background:#211c18; color:#f5efe5; border-color:#211c18; box-shadow:0 4px 10px #211c1829; }
.booking-people { display:grid; gap:10px; }
.booking-person { display:flex; align-items:center; gap:12px; background:#fffaf3; border:1px solid #c9baa5; border-radius:0; padding:10px; min-width:0; }
.booking-person.selected { border:2px solid #a65a24; padding:9px; background:#f4dfc9; }
.booking-person>img { width:56px; height:68px; border-radius:0; object-fit:cover; flex-shrink:0; }
.booking-person>div { flex:1; min-width:0; }
.booking-person strong { font-size:17px; }
.booking-person small { display:block; font-size:14px; line-height:1.5; margin-top:5px; }
.booking-profile { padding:4px 0; min-height:44px; font-size:14px; text-decoration:underline; border:0; color:#785131; background:transparent; }
.booking-person-select { border:1px solid #bbaa93; background:transparent; color:#211c18; min-width:52px; min-height:44px; padding:8px; border-radius:0; font-size:14px; flex-shrink:0; }
.booking-person-select[aria-pressed=true] { background:#211c18; color:#f5efe5; border-color:#211c18; }
.booking-time-trigger { width:100%; min-height:56px; padding:14px; margin-top:18px; background:#211c18; color:#f5efe5; display:flex; justify-content:space-between; align-items:center; gap:10px; text-align:left; border:0; border-radius:0; font-size:15px; }
.booking-review { position:sticky; top:24px; min-width:0; }
.booking-summary { margin:0; }
.booking-summary>div { padding:13px 0; border-bottom:1px solid #d5c8b8; }
.booking-summary dt { color:#715e4d; font-size:14px; margin-bottom:5px; }
.booking-summary dd { font-size:16px; line-height:1.6; font-weight:600; overflow-wrap:anywhere; margin:0; }
.booking-total { display:flex; align-items:center; justify-content:space-between; gap:12px; }
.booking-total dd { font-size:18px; }
.booking-panel .booking-note { margin-top:22px; font-size:14px; letter-spacing:.02em; }
.booking-hint { font-size:14px; line-height:1.7; color:#725f4d; margin-top:16px; }
.booking-submit-bar { display:flex; align-items:center; gap:12px; padding-top:18px; }
.booking-submit-bar>span { display:none; }
.booking-submit { width:100%; background:var(--booking-accent); color:#211c18; border:1px solid #bb743b; padding:16px 18px; border-radius:0; min-height:56px; display:flex; justify-content:space-between; align-items:center; font:700 13px var(--genar-sans,Arial); letter-spacing:.03em; box-shadow:0 4px 0 #a56432,0 8px 14px #211c1819; }
.booking-submit:hover:not(:disabled) { transform:translateY(-2px); box-shadow:0 6px 0 #a56432,0 10px 18px #211c1826; }
.booking-deposit { border:1px solid #bda284; background:#eadbc6; border-radius:0; padding:14px; margin-top:18px; font-size:12px; line-height:1.7; }
.booking-deposit p { font-size:14px; margin:8px 0; }
.booking-sheet-open { overflow:hidden; }
.booking-time-sheet { box-sizing:border-box; background:#f5efe5; color:#211c18; padding:28px; width:min(560px,calc(100% - 32px)); border:1px solid #c9baa5; border-radius:0; max-height:85dvh; overflow:auto; overscroll-behavior:contain; box-shadow:0 32px 80px #0006; }
.booking-time-sheet::backdrop { background:#080a0db8; backdrop-filter:blur(6px); }
.booking-time-sheet header { display:flex; align-items:center; justify-content:space-between; gap:20px; margin-bottom:20px; }
.booking-time-sheet h2 { font:400 32px/1.2 var(--genar-serif,Georgia); margin:8px 0 0; }
.booking-time-sheet .eyebrow { font-size:12px; color:#8c481c; }
.booking-sheet-close { width:44px; height:44px; border:1px solid #c9baa5; border-radius:0; background:transparent; color:inherit; }
.booking-time-sheet label { font-size:14px; }
.booking-date-strip { display:grid; grid-template-columns:repeat(7,minmax(0,1fr)); gap:6px; margin:18px 0; }
.booking-date-strip button { min-width:0; min-height:50px; border:1px solid #c9baa5; border-radius:0; background:#fffaf3; color:#211c18; font-size:16px; }
.booking-date-strip button[aria-pressed=true] { background:#211c18; color:#f5efe5; border-color:#211c18; }
.booking-date-strip small { display:block; font-size:12px; margin-top:5px; }
.booking-slot-status { font-size:14px; line-height:1.6; margin:18px 0; }
.booking-slot-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:9px; }
.booking-slot-grid button { min-height:48px; padding:10px 4px; font-size:14px; border:1px solid #bd9f7c; border-radius:0; background:#f3d5b6; color:#211c18; }
.booking-slot-grid button:disabled { opacity:.45; background:#e6dfd5; border-color:#ccc4b7; text-decoration:line-through; cursor:default; }
.booking-slot-grid small { display:block; font-size:10px; line-height:1.3; overflow-wrap:anywhere; }
.booking-time-sheet footer { display:flex; justify-content:space-between; gap:20px; margin-top:24px; padding-top:20px; border-top:1px solid #c9baa5; font-size:12px; }
.booking-chemical-grid,.booking-offer-grid { display:grid; gap:10px; padding:12px; }
.booking-service-family,.booking-offer { border:1px solid #d1c0aa; border-radius:0; background:#fffaf3; min-height:76px; padding:16px; box-shadow:0 2px 4px #211c1806; }
.booking-service-family:hover,.booking-offer:hover { border-color:#a87648; background:#fbefdf; }
.booking-service-family.selected,.booking-offer.selected { border-color:#aa6c37; background:#f3ddc5; }
.booking-family-action { display:inline-flex; justify-content:center; align-items:center; flex-shrink:0; min-height:36px; padding:6px 12px; border:1px solid #b99068; border-radius:0; background:#eee0ce; color:#65401f; font-size:14px; font-weight:600; }
.booking-service-family.selected .booking-family-action { background:#fffaf3; border-color:#aa6c37; }
.booking-offer .booking-check { width:30px; height:30px; font-size:18px; }
.booking-panel input[type=file] { max-width:100%; font-size:14px; }
.booking-panel input[type=file]::file-selector-button { padding:10px 12px; margin:8px 8px 8px 0; border:1px solid #bdaf9b; border-radius:0; background:#fffaf3; color:#211c18; font:inherit; }

.booking-service-variants { display:grid; gap:12px; }
.booking-variant { display:flex; align-items:center; justify-content:space-between; gap:16px; width:100%; min-height:88px; padding:18px; border:1px solid #c9baa5; border-radius:0; background:#fffaf3; color:#211c18; text-align:left; }
.booking-variant strong { display:block; font-size:17px; font-weight:650; line-height:1.4; }
.booking-variant small { display:block; margin-top:5px; color:#715e4d; font-size:14px; line-height:1.5; }
.booking-variant[aria-pressed=true] { background:#f0d4b7; border-color:#a65a24; }
.booking-variant[aria-pressed=true] .booking-check { background:#211c18; color:#fff; border-color:#211c18; }
.booking-remove-service { display:block; margin:18px auto 0; padding:12px; min-height:44px; border:0; background:transparent; color:#785131; font-size:14px; text-decoration:underline; }
.booking-profile-detail img { width:120px; height:150px; object-fit:cover; border-radius:0; }
.booking-profile-detail p { margin:16px 0; }
.booking-success { max-width:560px; margin:24px auto; }
.booking-success h1 { font:400 clamp(34px,5vw,48px)/1.2 var(--genar-serif,Georgia); margin:20px 0; }
.booking-success>p { margin:20px 0; line-height:1.7; }
.booking-success-icon { display:grid; place-items:center; width:64px; height:64px; border-radius:0; background:#dc9254; color:#211c18; font-size:28px; margin-bottom:24px; }
.booking-reference { overflow-wrap:anywhere; }
@media(max-width:760px) {
  .genar-one-page-booking .web-page { padding:28px 16px calc(138px + env(safe-area-inset-bottom)); }
  .booking-heading { margin-bottom:24px; }
  .booking-heading h1 { font-size:46px; }
  .booking-layout { grid-template-columns:1fr; gap:18px; }
  .booking-panel { padding:20px 16px; border-radius:0; }
  .booking-contact-fields { grid-template-columns:1fr; gap:14px; }
  .booking-review { position:static; }
  .booking-submit-bar { position:fixed; z-index:100; left:0; right:0; bottom:0; background:#f5efe5; border-top:1px solid #c9baa5; padding:14px 16px calc(18px + env(safe-area-inset-bottom)); box-shadow:0 -6px 30px #0002; }
  .booking-submit-bar>span { display:block; flex:1; font-size:17px; font-weight:600; }
  .booking-submit-bar small { display:block; font-size:12px; margin-top:5px; font-weight:400; }
  .booking-submit { width:auto; min-width:155px; gap:20px; }
  .booking-time-sheet { width:100%; max-width:none; max-height:88dvh; margin:auto 0 0; padding:22px 18px calc(26px + env(safe-area-inset-bottom)); border-radius:0; border-bottom:0; animation:booking-sheet-up 220ms cubic-bezier(.22,.7,.16,1); }
  .booking-time-sheet input { max-width:100%; }
}
@keyframes booking-sheet-up { from { transform:translateY(24px); opacity:.7; } to { transform:translateY(0); opacity:1; } }
@media(prefers-reduced-motion:reduce) {
  .booking-page *,.booking-time-sheet,.booking-time-sheet * { animation:none!important; transition:none!important; scroll-behavior:auto!important; }
}

/* Official brand mark shared with the main GENAR booking CTA. */
.booking-page .genar-button-star { width:21px; height:21px; flex-shrink:0; fill:currentColor; transition:transform 180ms ease; }
.booking-person-select { display:flex; align-items:center; justify-content:center; gap:8px; }
.booking-page button:hover:not(:disabled)>.genar-button-star { transform:rotate(12deg) scale(1.08); }
.booking-panel h2>span { width:auto; height:auto; display:inline; border:0; font:inherit; color:#8c5b34; }

@media(prefers-reduced-motion:reduce) { .booking-page button:hover:not(:disabled),.booking-page button:active:not(:disabled),.booking-time-sheet button:active:not(:disabled),.booking-page button:hover:not(:disabled)>.genar-button-star { transform:none; } }
