/* ==========================================================================
   Bambo Booking — book-tenant.css
   Light skin of public/book.php for every business EXCEPT the default one (Barbier Luxe keeps its dark navy/gold look).
   Loaded after the page's own <style> and a11y-fixes.css; every rule is prefixed `html body.book-tenant` (0,2,2) so it wins over
   both without !important. Colours: base-tokens.css / shop-tokens.css variables + the business accent (--brand-*) only.
   No new colour literals. Same markup, same form, same scripts as the default look.
   ========================================================================== */
html body.book-tenant{
  /* re-point the legacy dark-theme variables the page's own CSS uses, so every rule that is not restyled below still reads well */
  --navy-deep: var(--bg); --navy-mid: var(--surface); --navy: var(--surface); --navy-light: var(--surface-muted);
  --cream: var(--text); --cream-dim: var(--text-muted); --muted: var(--text-muted);
  --gold: var(--brand-text); --gold-light: var(--brand-500); --gold-pale: var(--brand-tint); --gold-dark: var(--brand-edge);
  --danger: var(--danger-600); --success: var(--success-600); --warning: var(--warning-600); --info: var(--info-600);
  /* a11y-fixes.css tunes borders, placeholders and the focus ring for dark surfaces: re-point them for the light skin */
  --a11y-border: var(--border-strong); --a11y-placeholder: var(--text-muted);
  --a11y-ring: var(--n-900); --a11y-ring-gap: var(--n-0);
  font-family: var(--font-sans); background: var(--bg); color: var(--text); line-height: var(--lh-base);
}
html body.book-tenant::after{ display: none; }   /* the grain overlay of the dark look */

/* typography: system font, normal case; no letter-spaced capitals */
html body.book-tenant .public-header h1, html body.book-tenant .public-header p, html body.book-tenant .step-label, html body.book-tenant .step-title, html body.book-tenant .step-subtitle, html body.book-tenant .option-name, html body.book-tenant .option-price,
html body.book-tenant .barber-avatar, html body.book-tenant .calendar-header, html body.book-tenant .calendar-day .day-num, html body.book-tenant .slot-option, html body.book-tenant .form-group label, html body.book-tenant .summary h4,
html body.book-tenant .btn-nav, html body.book-tenant .btn-nav-disabled, html body.book-tenant .booking-ref, html body.book-tenant .success-card h2, html body.book-tenant .step-circle, html body.book-tenant .sec-title, html body.book-tenant .summary-value.price{
  font-family: var(--font-sans); text-transform: none; letter-spacing: normal;
}

/* header */
html body.book-tenant .public-header{ margin-bottom: var(--space-6); }
html body.book-tenant .public-header .logo-ring{ background: var(--surface); border: 1px solid var(--border); }
html body.book-tenant .public-header h1{ font-size: var(--fs-2xl); font-weight: var(--fw-bold); color: var(--text); letter-spacing: normal; margin-bottom: var(--space-2); }
html body.book-tenant .public-header p{ font-size: var(--fs-md); color: var(--text-muted); }
html body.book-tenant .back-link{ font-size: var(--fs-sm); color: var(--brand-text); text-decoration: underline; min-height: var(--tap-min); }
html body.book-tenant .back-link:hover{ color: var(--text); }

/* stepper */
html body.book-tenant .stepper{ margin-bottom: var(--space-6); }
html body.book-tenant .step-item::after{ background: var(--border-strong); height: 2px; }
html body.book-tenant .step-item.active::after, html body.book-tenant .step-item.done::after{ background: var(--brand-500); }
html body.book-tenant .step-circle{ background: var(--surface); border: 2px solid var(--border-strong); color: var(--text-muted); font-weight: var(--fw-bold); }
html body.book-tenant .step-item.active .step-circle{ background: var(--brand-tint); border-color: var(--brand-500); color: var(--brand-text); box-shadow: none; }
html body.book-tenant .step-item.done .step-circle{ background: var(--brand-500); color: var(--on-brand); border-color: var(--brand-edge); }
html body.book-tenant .step-label{ font-size: var(--fs-xs); font-weight: var(--fw-medium); color: var(--text-muted); }
html body.book-tenant .step-item.active .step-label, html body.book-tenant .step-item.done .step-label{ color: var(--brand-text); }

/* card */
html body.book-tenant .step-card{ background: var(--surface); border: 1px solid var(--border); border-radius: var(--radius-lg); box-shadow: var(--shadow-1); overflow: hidden; }
html body.book-tenant .step-card::before{ height: 4px; background: var(--brand-500); }
html body.book-tenant .step-title{ font-size: var(--fs-xl); font-weight: var(--fw-bold); color: var(--text); }
html body.book-tenant .step-subtitle{ font-size: var(--fs-sm); color: var(--text-muted); }
html body.book-tenant .sec-title{ font-size: var(--fs-md); font-weight: var(--fw-bold); color: var(--text); }

/* service / team cards */
html body.book-tenant .option-card{ background: var(--surface); border: 1px solid var(--border-strong); border-radius: var(--radius-md); }
html body.book-tenant .option-card:hover{ border-color: var(--brand-500); background: var(--brand-tint); transform: none; box-shadow: var(--shadow-2); }
html body.book-tenant .option-card.selected{ border-color: var(--brand-500); background: var(--brand-tint); }
html body.book-tenant .option-card.selected::after{ background: var(--brand-500); color: var(--on-brand); }
html body.book-tenant .option-name{ font-size: var(--fs-md); font-weight: var(--fw-bold); color: var(--text); }
html body.book-tenant .option-description{ font-size: var(--fs-sm); color: var(--text-muted); }
html body.book-tenant .option-meta{ border-top: 1px solid var(--border); }
html body.book-tenant .option-duration{ font-size: var(--fs-sm); color: var(--text-muted); }
html body.book-tenant .option-price{ font-size: var(--fs-md); font-weight: var(--fw-bold); color: var(--brand-text); }
html body.book-tenant .barber-avatar{ background: var(--brand-500); color: var(--on-brand); }

/* calendar */
html body.book-tenant .calendar-grid{ gap: var(--space-1); }
html body.book-tenant .calendar-header{ font-size: var(--fs-xs); font-weight: var(--fw-medium); color: var(--text-muted); }
html body.book-tenant .calendar-day{ background: var(--surface); border: 1px solid var(--border-strong); border-radius: var(--radius-md); color: var(--text); }
html body.book-tenant .calendar-day:hover{ border-color: var(--brand-500); background: var(--brand-tint); }
html body.book-tenant .calendar-day.selected{ background: var(--brand-500); color: var(--on-brand); border-color: var(--brand-edge); }
html body.book-tenant .calendar-day .day-num{ font-weight: var(--fw-bold); }
html body.book-tenant .calendar-day .day-dow{ color: var(--text-muted); letter-spacing: normal; }
html body.book-tenant .calendar-day.selected .day-dow{ color: var(--on-brand); opacity: 0.9; }
html body.book-tenant .calendar-day.disabled{ opacity: 0.55; background: var(--surface-muted); border-color: var(--border); }
html body.book-tenant .date-warning{ background: var(--warning-tint); border: 1px solid var(--warning-600); border-left-width: 4px; border-radius: var(--radius-md); color: var(--text); }
html body.book-tenant .date-warning i{ color: var(--warning-600); }

/* time slots */
html body.book-tenant .slots-grid{ gap: var(--space-2); }
html body.book-tenant .slot-option{ background: var(--surface); border: 1px solid var(--border-strong); border-radius: var(--radius-md); color: var(--text); font-size: var(--fs-base); }
html body.book-tenant .slot-option:hover{ border-color: var(--brand-500); background: var(--brand-tint); }
html body.book-tenant .slot-option.selected, html body.book-tenant .slot-option:has(input:checked){ background: var(--brand-500); color: var(--on-brand); border-color: var(--brand-edge); box-shadow: none; font-weight: var(--fw-bold); }
html body.book-tenant .slot-option.selected:has(input:focus-visible), html body.book-tenant .slot-option:has(input:checked:focus-visible){ box-shadow: 0 0 0 2px var(--surface); }
html body.book-tenant .slot-option.is-disabled, html body.book-tenant .slot-option:has(input:disabled){ background: var(--surface-muted); border-color: var(--border); }
html body.book-tenant .no-slots{ color: var(--text-muted); }
html body.book-tenant .no-slots i{ color: var(--brand-tint-strong); }

/* form */
html body.book-tenant .form-group label{ font-size: var(--fs-sm); font-weight: var(--fw-medium); color: var(--text); }
html body.book-tenant .form-group input, html body.book-tenant .form-group textarea{ background: var(--surface); border: 1px solid var(--border-strong); border-radius: var(--radius-md); color: var(--text); font-family: var(--font-sans); font-size: var(--fs-base); }
html body.book-tenant .form-group input::placeholder, html body.book-tenant .form-group textarea::placeholder{ color: var(--text-muted); opacity: 1; }
html body.book-tenant .form-group input:focus, html body.book-tenant .form-group textarea:focus{ border-color: var(--brand-500); }
html body.book-tenant .form-group input[aria-invalid="true"], html body.book-tenant .form-group textarea[aria-invalid="true"]{ border-color: var(--danger-600); }
html body.book-tenant .field-error{ color: var(--danger-600); }

/* summary */
html body.book-tenant .summary{ background: var(--surface-muted); border: 1px solid var(--border); border-radius: var(--radius-md); }
html body.book-tenant .summary h4{ font-size: var(--fs-sm); font-weight: var(--fw-bold); color: var(--text); }
html body.book-tenant .summary-row{ border-bottom: 1px solid var(--border); }
html body.book-tenant .summary-label{ color: var(--text-muted); }
html body.book-tenant .summary-value{ color: var(--text); }
html body.book-tenant .summary-value.price{ color: var(--brand-text); }

/* buttons */
html body.book-tenant .btn-nav{ font-size: var(--fs-base); font-weight: var(--fw-medium); border-radius: var(--radius-md); min-height: var(--tap-min); }
html body.book-tenant .btn-nav-primary{ background: var(--brand-500); color: var(--on-brand); border: 1px solid var(--brand-edge); box-shadow: var(--shadow-1); }
html body.book-tenant .btn-nav-primary:hover{ background: var(--brand-hover); transform: none; box-shadow: var(--shadow-1); }
html body.book-tenant .btn-nav-secondary{ background: var(--surface); color: var(--text); border: 1px solid var(--border-strong); }
html body.book-tenant .btn-nav-secondary:hover{ background: var(--surface-muted); border-color: var(--border-strong); }
html body.book-tenant .btn-nav-disabled{ font-size: var(--fs-sm); color: var(--text-muted); border: 1px dashed var(--border-strong); border-radius: var(--radius-md); }

/* messages */
html body.book-tenant .alert-box{ background: var(--danger-tint); border-left: 4px solid var(--danger-600); border-radius: var(--radius-sm); color: var(--text); }
html body.book-tenant .success-icon{ background: var(--success-tint); border-color: var(--success-600); color: var(--success-600); }
html body.book-tenant .success-card h2{ font-size: var(--fs-xl); color: var(--text); }
html body.book-tenant .booking-ref{ color: var(--brand-text); font-weight: var(--fw-bold); }