/* ==========================================================================
   Owner workspace (ownerdashboard.html) on the one design system.
   The page's older visual declarations (colours, gradients, borders, shadows,
   font styling) were removed at the source, so this file is its whole look;
   the page's layout rules are unchanged. Scope: body.ownerdashboard-page (the
   dialogs sit outside .od). Loaded after the page's styles, before spl-ui.css.
   ========================================================================== */

body.ownerdashboard-page { background: var(--spl-ground); color: var(--spl-ink-2); font-family: var(--spl-font); }
body.ownerdashboard-page :where(h1, h2, h3, h4) { font-family: var(--spl-font); color: var(--spl-ink-1); letter-spacing: -0.015em; }

/* ---- Shell ------------------------------------------------------------- */
.od { max-width: 1120px; margin: 0 auto; padding: var(--spl-s-5) var(--spl-gutter) var(--spl-s-9); }
@media (min-width: 1024px) { .od { padding-top: var(--spl-s-7); } }
.od .od-top { display: flex; align-items: center; justify-content: space-between; gap: var(--spl-s-3); flex-wrap: wrap; margin: 0 0 var(--spl-s-5); padding: 0; background: none; border: 0; box-shadow: none; }
.od .od-title { margin: 0; font-size: var(--spl-t-h2); font-weight: 700; letter-spacing: -0.02em; line-height: 1.2; color: var(--spl-ink-1); overflow-wrap: anywhere; }
.od .od-title .dash-suffix { display: none; }
.od .od-account { display: flex; align-items: center; gap: var(--spl-s-2); min-width: 0; }
/* Business logo beside the account controls: same 44px disc as the Home greeting (2026-09-23). */
.od .od-avatar { flex: none; width: 44px; height: 44px; border-radius: 50%; background: var(--spl-accent); color: #fff; display: grid; place-items: center; font-weight: 700; font-size: 1.0625rem; overflow: hidden; text-decoration: none; }
.od .od-avatar img { width: 100%; height: 100%; object-fit: cover; }
.od .od-avatar:focus-visible { outline: none; box-shadow: var(--spl-focus); }
.od .od-user { font-size: var(--spl-t-helper); color: var(--spl-ink-3); max-width: 240px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
@media (max-width: 479px) { .od .od-user { max-width: 170px; } }
body.ownerdashboard-page summary { min-height: 44px; display: flex; align-items: center; cursor: pointer; }
body.ownerdashboard-page :is(input[type="checkbox"], input[type="radio"]) { accent-color: var(--spl-accent); }

/* ---- Sections: one card level; anything inside is a flat tile ---------- */
body.ownerdashboard-page .od .dashboard-section {
  background: var(--spl-surface); border: 1px solid var(--spl-border); border-radius: var(--spl-r-xl); box-shadow: var(--spl-e-1);
}
body.ownerdashboard-page .od .dashboard-section :is(.card, .dashboard-section, .services-main-panel, .services-side-panel, .services-link-strip,
  .services-settings-card, .custom-links-card, .custom-links-panel, .custom-links-hero, .ai-owner-panel, .owner-timeoff-summary,
  .custom-links-choice-card, .custom-links-fact) {
  background: var(--spl-surface); border: 1px solid var(--spl-border); border-radius: var(--spl-r-lg); box-shadow: none;
}
/* Wrappers that only group content inside a section carry no chrome of their own. */
body.ownerdashboard-page .od :is(.services-premium-shell, #tab-custom-links .custom-links-shell) { background: none; border: 0; box-shadow: none; }
@media (min-width: 861px) {
  body.ownerdashboard-page .od .bookings-table td:nth-child(6) { min-width: 300px; }
  body.ownerdashboard-page .od .bookings-table :is(th, td):nth-child(6) { text-align: right; }
}

/* Tiles inside a panel are flat ground tiles (no third border level). */
body.ownerdashboard-page .od .dashboard-section :is(.custom-links-fact, .custom-links-choice-card) { background: var(--spl-ground); border-color: transparent; }
body.ownerdashboard-page .od :is(.custom-links-fact, .custom-links-choice-card) :is(p, span, div):not([class*="title"]):not([class*="label"]):not([class*="kicker"]) { font-size: var(--spl-t-helper); line-height: 1.5; }
body.ownerdashboard-page .od :is(.custom-links-fact, .custom-links-choice-card) :is(strong, h3, h4) { font-size: var(--spl-t-label); font-weight: 600; color: var(--spl-ink-1); }
/* Business settings: groups stack from the top instead of spreading over the panel's height. */
body.ownerdashboard-page .od .services-settings-card { justify-content: flex-start; min-height: 0; }
/* Optional disclosures ("Calendar sync (optional)"): a left-aligned row with a chevron. */
body.ownerdashboard-page .spl-advanced { border: 0; border-top: 1px solid var(--spl-border); border-radius: 0; background: none; padding: 0 !important; margin: var(--spl-s-2) 0 0 !important; }
body.ownerdashboard-page .spl-advanced > summary {
  list-style: none; justify-content: space-between; gap: var(--spl-s-3); text-align: left; padding: 10px 0;
  font-size: var(--spl-t-label); font-weight: 600; color: var(--spl-ink-1);
}
body.ownerdashboard-page .spl-advanced > summary::-webkit-details-marker { display: none; }
body.ownerdashboard-page .spl-advanced > summary::after {
  content: ""; width: 10px; height: 10px; flex: none; border-right: 2px solid var(--spl-ink-3); border-bottom: 2px solid var(--spl-ink-3);
  transform: rotate(45deg) translateY(-3px); transition: transform var(--spl-fast) var(--spl-ease);
}
body.ownerdashboard-page .spl-advanced[open] > summary::after { transform: rotate(-135deg) translateY(-2px); }

/* Booking totals: quiet stat tiles, not cards inside the card. */
body.ownerdashboard-page .od #bookingSummary { display: grid !important; grid-template-columns: repeat(auto-fit, minmax(140px, 1fr)) !important; gap: var(--spl-s-3) !important; margin-top: var(--spl-s-4) !important; }
body.ownerdashboard-page .od #bookingSummary > .card {
  background: var(--spl-ground); border: 0; border-radius: var(--spl-r-lg); box-shadow: none; padding: var(--spl-s-4) !important; margin: 0 !important; min-height: 0 !important;
}
body.ownerdashboard-page .od #bookingSummary .subtle { font-size: var(--spl-t-helper); color: var(--spl-ink-3); margin: 0 0 4px; }
body.ownerdashboard-page .od #bookingSummary .text-2xl { font-size: var(--spl-t-h3); font-weight: 650; color: var(--spl-ink-1); font-variant-numeric: tabular-nums; line-height: 1.25; }
@media (max-width: 599px) {
  body.ownerdashboard-page .od #bookingSummary > .card:nth-child(2) { grid-column: 1 / -1; order: 3; }
  body.ownerdashboard-page .od #tab-bookings-overview .dash-actions > .btn { flex: 1 1 140px; }
  body.ownerdashboard-page .od #bookingSearch, body.ownerdashboard-page .od #bookingStatusFilter { width: 100% !important; }
  body.ownerdashboard-page .od #bookingSearch { min-width: 0; }
  body.ownerdashboard-page .od div:has(> #bookingSearch), body.ownerdashboard-page .od div:has(> #bookingSearch) + #bookingStatusFilter { flex: 1 1 100%; }
  body.ownerdashboard-page .od div:has(> div > #bookingSearch) { width: 100%; }
}
body.ownerdashboard-page .od :is(.custom-links-fact, .timeoff-soft-panel) { background: var(--spl-ground); border-color: transparent; }
body.ownerdashboard-page .od :is(.dashboard-title, .services-actions-title, .services-settings-title, .custom-links-title) {
  font-size: var(--spl-t-h2); font-weight: 650; letter-spacing: -0.02em; line-height: 1.2; color: var(--spl-ink-1);
}
body.ownerdashboard-page .od .custom-links-panel-title { font-size: var(--spl-t-h3); font-weight: 650; color: var(--spl-ink-1); }
body.ownerdashboard-page .od h2 { font-size: var(--spl-t-h2); font-weight: 650; }
body.ownerdashboard-page .od h3 { font-size: var(--spl-t-h3); font-weight: 600; }
body.ownerdashboard-page :is(.services-actions-kicker, .services-settings-eyebrow, .custom-links-kicker, .ai-owner-kicker, .settings-group-title, .owner-timeoff-summary-title, .services-link-label) {
  background: none; border: 0; box-shadow: none;
  font-size: var(--spl-t-caption) !important; font-weight: 600; letter-spacing: .06em; text-transform: uppercase; color: var(--spl-accent-strong);
}
body.ownerdashboard-page :is(.services-actions-sub, .services-settings-sub, .custom-links-sub, .custom-links-panel-sub, .custom-links-soft-note,
  .ai-owner-note, .subtle, .subtle-small, .custom-link-type-sub, .timeoff-mode-sub, .custom-links-row-note, .owner-timeoff-summary-line) {
  font-size: var(--spl-t-helper); line-height: 1.5; color: var(--spl-ink-3); font-weight: 400;
}
body.ownerdashboard-page :is(.custom-links-choice-label, .custom-link-type-title, .timeoff-mode-title, .custom-links-row-title) { font-size: var(--spl-t-label); font-weight: 600; color: var(--spl-ink-1); }
body.ownerdashboard-page p { color: inherit; }

/* ---- Buttons ------------------------------------------------------------ */
body.ownerdashboard-page :where(.btn, button.view-btn, .action-link, .mark-complete-btn, .owner-timeoff-btn, .services-copy-btn, .services-qr-btn,
  .custom-copy-link-btn, .add-package-session-btn, .pl-close-btn, .owner-modal-close, .mobile-card :is(a, button)[class^="mobile-"]) {
  font-family: var(--spl-font); font-size: var(--spl-t-helper); font-weight: 600; line-height: 1.2; letter-spacing: 0; text-transform: none;
  min-height: 44px; border-radius: var(--spl-r); border: 1px solid var(--spl-border-strong); background: var(--spl-surface); color: var(--spl-ink-1);
  box-shadow: none; cursor: pointer; text-decoration: none; transform: none;
  transition: background-color var(--spl-fast) var(--spl-ease), border-color var(--spl-fast) var(--spl-ease), color var(--spl-fast) var(--spl-ease);
}
body.ownerdashboard-page :where(.btn, button.view-btn, .action-link, .mark-complete-btn, .owner-timeoff-btn, .services-copy-btn, .services-qr-btn,
  .custom-copy-link-btn, .add-package-session-btn, .pl-close-btn, .owner-modal-close, .mobile-card :is(a, button)[class^="mobile-"]):hover {
  background: var(--spl-surface-sunken); border-color: var(--spl-ink-3); transform: none; box-shadow: none;
}
body.ownerdashboard-page :is(button, a, summary, input, select, textarea, [tabindex]):focus-visible { outline: none; box-shadow: var(--spl-focus); }
body.ownerdashboard-page :where(.btn, button.view-btn, .action-link, .mark-complete-btn):disabled { opacity: .5; cursor: not-allowed; }
body.ownerdashboard-page .btn { padding-inline: var(--spl-s-4); display: inline-flex; align-items: center; justify-content: center; gap: 8px; }
body.ownerdashboard-page .btn.btn-sm { min-height: 40px; }
body.ownerdashboard-page :is(.btn.primary, .btn.btn-primary, button.primary, .btn.danger-solid) {
  background: var(--spl-accent); border-color: var(--spl-accent); color: #fff;
}
body.ownerdashboard-page :is(.btn.primary, .btn.btn-primary, button.primary):hover { background: var(--spl-accent-strong); border-color: var(--spl-accent-strong); color: #fff; }
body.ownerdashboard-page :is(.btn.danger, .btn.btn-danger) { background: var(--spl-danger); border-color: var(--spl-danger); color: #fff; }
body.ownerdashboard-page :is(.btn.danger, .btn.btn-danger):hover { background: var(--spl-danger-strong); border-color: var(--spl-danger-strong); color: #fff; }
body.ownerdashboard-page .btn .spl-icon { width: 18px; height: 18px; flex: none; }
body.ownerdashboard-page .od-btn-tag { display: inline-flex; align-items: center; min-height: 22px; padding: 0 8px; margin-left: 8px; border-radius: var(--spl-r-pill); background: var(--spl-accent-strong); color: #fff; font-size: var(--spl-t-caption); font-weight: 600; letter-spacing: .04em; }

/* Booking row actions: one wrapping row; money actions green, risky ones quiet red. */
body.ownerdashboard-page .od-row-actions { display: flex; flex-wrap: wrap; gap: 8px; justify-content: flex-end; align-items: center; }
body.ownerdashboard-page button.view-btn { min-height: 40px; padding: 0 12px; white-space: nowrap; }
body.ownerdashboard-page :is(button.cancel-btn, button.refund-btn, .action-link.red, .mobile-cancel-link, .mobile-refund-link) { color: var(--spl-danger); border-color: #e2b4ad; }
body.ownerdashboard-page :is(button.cancel-btn, button.refund-btn, .action-link.red, .mobile-cancel-link, .mobile-refund-link):hover { background: var(--spl-danger-wash); border-color: var(--spl-danger); }
body.ownerdashboard-page :is(.mark-complete-btn, .mobile-mark-complete-link) { color: var(--spl-money); border-color: #b9dccd; background: var(--spl-money-wash); }
body.ownerdashboard-page .mark-complete-btn { margin-top: 8px; min-height: 40px; padding: 0 12px; }
body.ownerdashboard-page :is(.reschedule-access-btn, .mobile-reschedule-access-link).is-on { color: var(--spl-money); border-color: #b9dccd; background: var(--spl-money-wash); }
body.ownerdashboard-page .action-link { display: inline-flex; align-items: center; justify-content: center; min-height: 40px; padding: 0 12px; }
body.ownerdashboard-page .action-link.blue { color: var(--spl-accent-strong); }
body.ownerdashboard-page .mobile-card :is(a, button)[class^="mobile-"] { display: flex; align-items: center; justify-content: center; text-align: center; padding: 0 12px; }
body.ownerdashboard-page .btn-spinner { width: 16px; height: 16px; border-radius: 50%; border: 2px solid currentColor; border-right-color: transparent; animation: spl-spin .7s linear infinite; }

/* ---- Badges (sentence case, no gradients) ------------------------------ */
body.ownerdashboard-page :is(.badge, .rescheduled-pill, .days-chip) {
  display: inline-flex; align-items: center; justify-content: center; gap: 6px; min-height: 26px; padding: 3px 10px; border-radius: var(--spl-r-pill);
  font-family: var(--spl-font); font-size: var(--spl-t-caption); font-weight: 600; letter-spacing: 0; text-transform: none; white-space: nowrap;
  color: var(--spl-ink-2); background: var(--spl-surface-sunken); border: 0; box-shadow: none;
}
body.ownerdashboard-page .badge.badge-green { color: var(--spl-money); background: var(--spl-money-wash); }
body.ownerdashboard-page .badge.badge-blue { color: var(--spl-accent-strong); background: var(--spl-accent-wash); }
body.ownerdashboard-page .badge.badge-purple { color: #56359a; background: #f1ecfb; }
body.ownerdashboard-page .badge.badge-red { color: var(--spl-danger); background: var(--spl-danger-wash); }
body.ownerdashboard-page .rescheduled-pill { color: var(--spl-warn); background: var(--spl-warn-wash); }

/* ---- Tables (plain header, hairline rows) ------------------------------- */
body.ownerdashboard-page .od :is(.table-container, .custom-links-table-wrap) { border: 1px solid var(--spl-border); border-radius: var(--spl-r-lg); background: var(--spl-surface); box-shadow: none; }
body.ownerdashboard-page .od table { border-collapse: collapse; font-size: var(--spl-t-helper); color: var(--spl-ink-2); background: none; }
body.ownerdashboard-page .od :is(#tab-links, #tab-bookings, #tab-custom-links, #tab-bookings-overview) th,
body.ownerdashboard-page .od th {
  font-size: var(--spl-t-caption) !important; font-weight: 600 !important; letter-spacing: .04em !important; text-transform: uppercase !important;
  color: var(--spl-ink-3) !important; background: var(--spl-ground) !important; border: 0 !important; border-bottom: 1px solid var(--spl-border) !important;
  box-shadow: none !important; text-align: left;
}
body.ownerdashboard-page .od td { border: 0; border-bottom: 1px solid var(--spl-border); background: none; font-variant-numeric: tabular-nums; color: var(--spl-ink-2); }
body.ownerdashboard-page .od td strong, body.ownerdashboard-page .od td b { color: var(--spl-ink-1); font-weight: 600; }
body.ownerdashboard-page .od tbody tr:last-child td { border-bottom: 0; }
body.ownerdashboard-page .od tbody tr:hover td { background: #fbfaf7; }
body.ownerdashboard-page .od :is(.empty, td.empty) { color: var(--spl-ink-3); font-size: var(--spl-t-helper); }
body.ownerdashboard-page .od-empty-icon { display: block; margin: 0 auto 8px; width: 28px; height: 28px; color: var(--spl-ink-3); }

/* ---- Mobile booking cards ---------------------------------------------- */
body.ownerdashboard-page .mobile-card { background: var(--spl-surface); border: 1px solid var(--spl-border); border-radius: var(--spl-r-lg); box-shadow: none; }
body.ownerdashboard-page .mobile-card-title { font-size: var(--spl-t-label); font-weight: 600; color: var(--spl-ink-1); }
body.ownerdashboard-page .mobile-card-subtitle { font-size: var(--spl-t-helper); color: var(--spl-ink-3); overflow-wrap: anywhere; }
body.ownerdashboard-page .mobile-kv-item { background: none; border: 0; }
body.ownerdashboard-page .mobile-kv-label { font-size: var(--spl-t-caption); font-weight: 600; letter-spacing: .04em; text-transform: uppercase; color: var(--spl-ink-3); }
body.ownerdashboard-page .mobile-kv-value { font-size: var(--spl-t-helper); font-weight: 600; color: var(--spl-ink-1); overflow-wrap: anywhere; }
body.ownerdashboard-page :is(.mobile-card, .details-content, .od) a:not([class]) { color: var(--spl-accent-strong); }

/* ---- Inputs ------------------------------------------------------------- */
body.ownerdashboard-page :is(.input, input[type="text"], input[type="email"], input[type="tel"], input[type="number"], input[type="date"],
  input[type="time"], input[type="url"], input[type="search"], input:not([type]), select, textarea) {
  font-family: var(--spl-font); font-size: 1rem; color: var(--spl-ink-1); background-color: var(--spl-surface);
  border: 1.5px solid var(--spl-border-strong); border-radius: var(--spl-r); box-shadow: none; min-height: 44px;
}
body.ownerdashboard-page textarea { min-height: 88px; line-height: 1.5; }
body.ownerdashboard-page :is(.input, input, select, textarea):focus { outline: none; border-color: var(--spl-accent); box-shadow: 0 0 0 4px var(--spl-accent-wash); }
body.ownerdashboard-page :is(input, select, textarea)[aria-invalid="true"] { border-color: var(--spl-danger); }
body.ownerdashboard-page ::placeholder { color: var(--spl-placeholder); opacity: 1; }
body.ownerdashboard-page :is(label, .details-label) { font-size: var(--spl-t-label); font-weight: 500; color: var(--spl-ink-1); }
body.ownerdashboard-page #bookingSearch { padding-left: 44px; }
body.ownerdashboard-page .od-search-icon { position: absolute; left: 14px; top: 50%; transform: translateY(-50%); width: 18px; height: 18px; color: var(--spl-ink-3); pointer-events: none; }
body.ownerdashboard-page .spl-owner-note { font-size: var(--spl-t-helper); min-height: 64px; }
body.ownerdashboard-page .spl-owner-note-msg { font-size: var(--spl-t-caption); color: var(--spl-ink-3); }

/* ---- Dialogs ----------------------------------------------------------- */
body.ownerdashboard-page .details-modal { background: rgba(20, 27, 38, .48); }
body.ownerdashboard-page .details-content {
  background: var(--spl-surface); color: var(--spl-ink-2); border: 1px solid var(--spl-border); border-radius: var(--spl-r-xl);
  box-shadow: var(--spl-e-overlay); max-height: calc(100dvh - 24px); overflow-y: auto; overscroll-behavior: contain;
}
body.ownerdashboard-page .details-content :is(h2, h3) { font-size: var(--spl-t-h3); font-weight: 650; line-height: 1.25; color: var(--spl-ink-1); }
/* A focused field always scrolls clear of the sticky header and action row. */
body.ownerdashboard-page .details-content { scroll-padding-top: 96px; scroll-padding-bottom: 112px; }
body.ownerdashboard-page #pl-time-mode-wrap > label {
  min-height: 44px; border: 1.5px solid var(--spl-border-strong); border-radius: var(--spl-r); background: var(--spl-surface);
  font-size: var(--spl-t-helper); font-weight: 600; color: var(--spl-ink-1);
}
body.ownerdashboard-page #pl-time-mode-wrap > label:has(input:checked) { border-color: var(--spl-accent); background: var(--spl-accent-wash); }
body.ownerdashboard-page #pl-time-mode-wrap input[type="radio"] { width: 18px; height: 18px; margin: 0; flex: none; }
body.ownerdashboard-page label.details-row:has(> input[type="checkbox"]) { flex-direction: row; align-items: flex-start; }
body.ownerdashboard-page .details-header { background: var(--spl-surface); border-bottom: 1px solid var(--spl-border); }
body.ownerdashboard-page .details-header p { font-size: var(--spl-t-helper); color: var(--spl-ink-3); }
body.ownerdashboard-page .details-row { border-bottom: 1px solid var(--spl-border); background: none; }
body.ownerdashboard-page :is(form.details-grid .details-row, .details-row:has(input:not([type="hidden"]), select, textarea)) { border-bottom: 0; }
body.ownerdashboard-page .details-value { font-size: var(--spl-t-helper); font-weight: 600; color: var(--spl-ink-1); overflow-wrap: anywhere; }
body.ownerdashboard-page .details-row > .details-label:not(label) { font-size: var(--spl-t-helper); color: var(--spl-ink-3); }
body.ownerdashboard-page .reschedule-history-box { background: var(--spl-warn-wash); border: 0; border-radius: var(--spl-r); }
/* Close buttons: a real 44px round target that never crowds the title. */
body.ownerdashboard-page .details-header > :is(button, .pl-close-btn, .owner-modal-close):last-child,
body.ownerdashboard-page :is(.pl-close-btn, .owner-modal-close, #customLinkCloseBtn) {
  width: 44px; height: 44px; min-width: 44px; min-height: 44px; padding: 0; flex: none; border-radius: 50%;
  display: inline-grid; place-items: center; font-size: 1.125rem; line-height: 1; color: var(--spl-ink-2);
  background: var(--spl-surface); border: 1px solid var(--spl-border-strong); box-shadow: none;
}
body.ownerdashboard-page .details-content :is(.owner-modal-actions, .business-profile-actions) { border-top: 1px solid var(--spl-border); background: var(--spl-surface); }

/* ---- Choice cards, slots, day pills ------------------------------------ */
body.ownerdashboard-page :is(.timeoff-mode-btn, .custom-link-type-card, .custom-links-choice-card) {
  font-family: var(--spl-font); text-align: left; background: var(--spl-surface); color: var(--spl-ink-1);
  border: 1.5px solid var(--spl-border-strong); border-radius: var(--spl-r-lg); box-shadow: none; cursor: pointer;
}
body.ownerdashboard-page :is(.timeoff-mode-btn, .custom-link-type-card, .custom-links-choice-card):is(.active, .selected, [aria-pressed="true"], :has(input:checked)) {
  border-color: var(--spl-accent); background: var(--spl-accent-wash); box-shadow: inset 0 0 0 1px var(--spl-accent);
}
body.ownerdashboard-page :is(.premium-slot-pill, .day-pill) {
  font-family: var(--spl-font); font-size: var(--spl-t-helper); font-weight: 600; font-variant-numeric: tabular-nums;
  min-height: 44px; border-radius: var(--spl-r); background: var(--spl-surface); color: var(--spl-accent-strong);
  border: 1.5px solid var(--spl-border-strong); box-shadow: none; cursor: pointer;
}
/* Service day pills are <label>s around a visually hidden checkbox: the checked state is the selected state. */
body.ownerdashboard-page .day-pill { display: inline-flex; align-items: center; justify-content: center; user-select: none; }
body.ownerdashboard-page :is(.premium-slot-pill, .day-pill):is(.selected, .active, [aria-pressed="true"], :has(input:checked)) { background: var(--spl-accent); border-color: var(--spl-accent); color: #fff; }
body.ownerdashboard-page .day-pill:hover { border-color: var(--spl-accent); }
body.ownerdashboard-page .day-pill:has(input:focus-visible) { outline: 2px solid var(--spl-accent-strong); outline-offset: 2px; }
body.ownerdashboard-page .day-pill:has(input:disabled) { opacity: .55; cursor: not-allowed; }
body.ownerdashboard-page .premium-slot-pill.booked { background: var(--spl-surface-sunken); color: var(--spl-ink-3); border-color: transparent; cursor: not-allowed; }
body.ownerdashboard-page .premium-slot-pill.available-slot:hover { border-color: var(--spl-accent); }
body.ownerdashboard-page .od-timeoff-slot {
  display: block; width: 100%; min-height: 56px; padding: 10px 14px; text-align: left; font-family: var(--spl-font); cursor: pointer;
  background: var(--spl-surface); color: var(--spl-ink-1); border: 1.5px solid var(--spl-border-strong); border-radius: var(--spl-r);
  transition: border-color var(--spl-fast) var(--spl-ease), background-color var(--spl-fast) var(--spl-ease);
}
body.ownerdashboard-page .od-timeoff-slot:hover { border-color: var(--spl-accent); }
body.ownerdashboard-page .od-timeoff-slot.is-selected { background: var(--spl-accent-wash); border-color: var(--spl-accent); box-shadow: inset 0 0 0 1px var(--spl-accent); }
body.ownerdashboard-page .od-timeoff-slot__time { display: block; font-size: var(--spl-t-label); font-weight: 600; line-height: 1.25; font-variant-numeric: tabular-nums; }
body.ownerdashboard-page .od-timeoff-slot__meta { display: block; margin-top: 2px; font-size: var(--spl-t-caption); color: var(--spl-ink-3); }
body.ownerdashboard-page .od-timeoff-slot.is-selected .od-timeoff-slot__meta { color: var(--spl-accent-strong); }
body.ownerdashboard-page .custom-links-progress-bar { border-radius: var(--spl-r-pill); background: var(--spl-accent); }

/* ---- Business tab link strip ------------------------------------------- */
body.ownerdashboard-page .services-link-url { font-family: var(--spl-font-mono); font-size: var(--spl-t-helper); color: var(--spl-accent-strong); overflow-wrap: anywhere; }
body.ownerdashboard-page .owner-timeoff-btn { color: var(--spl-accent-strong); }

/* ---- AI helper (Tools) ------------------------------------------------- */
body.ownerdashboard-page .ai-owner-disclosure > summary { list-style: none; }
body.ownerdashboard-page .ai-owner-disclosure > summary::-webkit-details-marker { display: none; }
body.ownerdashboard-page .ai-owner-output { background: var(--spl-ground); border: 1px solid var(--spl-border); border-radius: var(--spl-r); font-size: var(--spl-t-helper); line-height: 1.55; color: var(--spl-ink-2); }
body.ownerdashboard-page #aiOwnerStatus { border-radius: var(--spl-r); font-size: var(--spl-t-helper); }

/* ---- Account closure: the shared danger-zone look ---------------------- */
body.ownerdashboard-page .danger-accordion { border: 1.5px solid #e2b4ad; border-radius: var(--spl-r-lg); background: var(--spl-surface); box-shadow: none; }
body.ownerdashboard-page .danger-accordion > summary { color: var(--spl-danger); font-weight: 600; font-size: var(--spl-t-label); }
body.ownerdashboard-page .danger-stripe { display: none; }
body.ownerdashboard-page .od-disclosure-hint { font-size: var(--spl-t-helper); font-weight: 500; color: var(--spl-ink-3); }
body.ownerdashboard-page .danger-content { color: var(--spl-ink-2); font-size: var(--spl-t-helper); }

/* ---- Status messages / toast ------------------------------------------ */
body.ownerdashboard-page .status-message { border-radius: var(--spl-r); font-size: var(--spl-t-helper); }
body.ownerdashboard-page #dashboard-notification { border-radius: var(--spl-r); font-family: var(--spl-font); font-size: var(--spl-t-helper); font-weight: 500; box-shadow: var(--spl-e-overlay); color: #fff; }

/* ---- Footer ------------------------------------------------------------- */
body.ownerdashboard-page .footer { background: none; border-top: 1px solid var(--spl-border); color: var(--spl-ink-3); font-size: var(--spl-t-helper); }
body.ownerdashboard-page .footer a { color: var(--spl-ink-2); }
body.ownerdashboard-page .footer a:hover { color: var(--spl-accent-strong); }

/* Mobile booking cards: the email and date links are real 44px targets. */
body.ownerdashboard-page .mobile-card :is(.mobile-card-subtitle, .mobile-kv-value) a { display: inline-flex; align-items: center; min-height: 44px; }

/* Short windows (and phones with the keyboard open): dialog actions sit at the end of the form
   instead of sticking over it, so a focused field is never covered. */
@media (max-height: 600px) {
  body.ownerdashboard-page .details-content :is(.owner-modal-actions, .business-profile-actions) { position: static; }
}

/* With the side rail open (1024–1279px) the bookings table has under ~900px and its columns crush,
   so booking cards are used until the table has room (≥1280px). */
@media (min-width: 861px) and (max-width: 1279px) {
  body.ownerdashboard-page #tab-bookings .table-container { display: none !important; }
  body.ownerdashboard-page #bookingsCards { display: grid !important; grid-template-columns: repeat(auto-fill, minmax(320px, 1fr)); }
}

/* Sticky dialog header and action row: fill the dialog's padding strip with their own surface, so
   form content scrolling underneath never shows above the header or below the actions. */
body.ownerdashboard-page .details-content .details-header { box-shadow: 0 -40px 0 0 var(--spl-surface); }
body.ownerdashboard-page .details-content :is(.owner-modal-actions, .business-profile-actions) { box-shadow: 0 40px 0 0 var(--spl-surface); }

/* ---- Business panel views (2026-09-22): Business · Services · Availability share #tab-links ----
   Only blocks tagged data-view-group are filtered; everything else (dialogs, wrappers) stays shared.
   The doubled #tab-links outranks the page's own "#tab-links #id { display: … !important }" layout rules. */
body.ownerdashboard-page #tab-links#tab-links[data-view="links"] [data-view-group]:not([data-view-group~="links"]),
body.ownerdashboard-page #tab-links#tab-links[data-view="services"] [data-view-group]:not([data-view-group~="services"]),
body.ownerdashboard-page #tab-links#tab-links[data-view="availability"] [data-view-group]:not([data-view-group~="availability"]) { display: none !important; }
/* Each view now uses one of the two panels, so the grid is always a single column. */
body.ownerdashboard-page #tab-links .services-premium-grid { grid-template-columns: minmax(0, 1fr) !important; }
body.ownerdashboard-page #tab-links[data-view="availability"] .services-side-panel { order: -1; }
body.ownerdashboard-page .od-view-head { margin: 0 0 var(--spl-s-4, 16px); }
body.ownerdashboard-page .od-view-head h2 { margin: 0; font-size: var(--spl-t-h2, 22px); font-weight: 700; letter-spacing: -0.02em; color: var(--spl-ink-1); }
body.ownerdashboard-page .od-view-head p { margin: 4px 0 0; color: var(--spl-ink-3); font-size: var(--spl-t-body); max-width: 62ch; }