/* Landing-page typography and surfaces for Pro. Presentation only: calendar
   coordinates, virtual rows, scroll ownership and dialog lifecycles stay intact. */
body.pro-mode,
body.pro-mode :is(.dashboard-content, .business-modal-layer, .business-team-drawer-layer,
  .business-service-inspector-layer, .business-onboarding-dialog-layer,
  .business-salon-deletion-layer, .business-modal, .business-team-drawer,
  .business-salon-deletion-dialog, .prelook-select-popover, .prelook-menu-popover,
  .prelook-persona-popover, .salon-photo-manager-panel) {
  --pro-ui-font: "Refinelook UI", Inter, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  --pro-ui-ink: #0b0e17;
  --pro-ui-muted: #626b79;
  --pro-ui-line: #e9edf0;
  --pro-ui-canvas: #f8fafb;
  --pro-ui-accent: #e4f7f0;
  --pro-ui-accent-ink: #125e51;
  --pro-ui-accent-soft: #eff9f5;
  --pro-ui-accent-line: #d1e9df;
  --pro-ui-violet: #125e51;
  --pro-ui-violet-soft: #eff9f5;
  --ops-ink: #0b0e17;
  --ops-text: #444e5c;
  --ops-muted: #626b79;
  --ops-faint: #78838e;
  --ops-line: #e9edf0;
  --ops-line-strong: #dce3e8;
  --ops-canvas: #f8fafb;
  --ops-surface-subtle: #fafcfc;
  --ops-radius-lg: 22px;
  --ops-radius-md: 14px;
  --ops-radius-sm: 10px;
  --ops-shadow-panel: 0 2px 8px rgb(11 21 35 / 2%);
  --ops-shadow-raised: 0 24px 70px rgb(11 21 35 / 14%);
}
body.pro-mode {
  --pro-text: #0b0e17;
  --pro-muted: #626b79;
  --pro-line: #e9edf0;
  --pro-bg: #f8fafb;
  --pro-accent: #e4f7f0;
  --pro-accent-strong: #125e51;
  --pro-accent-soft: #eff9f5;
  color: var(--pro-ui-ink);
  background: var(--pro-ui-canvas);
  font-family: var(--pro-ui-font);
  -webkit-font-smoothing: antialiased;
}
body.pro-mode .dashboard-shell .dashboard-main,
body.pro-mode .dashboard-shell .dashboard-content { background: var(--pro-ui-canvas); }

/* Preserve the edge-to-edge editing surfaces and their viewport calculations. */
@media (min-width: 821px) {
  body.pro-mode .dashboard-shell .dashboard-content:not(:has(.salon-home-inline-editor, .communication-inbox, .ai-agent-page)) {
    padding-inline: calc(var(--dashboard-rail-width) + clamp(24px, 2.5vw, 42px)) clamp(24px, 2.5vw, 42px);
  }
  body.pro-mode .dashboard-shell .dashboard-content:not(:has(.business-bookings-page, .business-crm-page, .business-schedule-page, .salon-home-inline-editor, .communication-inbox, .ai-agent-page)) {
    padding-top: 30px;
    padding-bottom: 40px;
  }
}
body.pro-mode .dashboard-shell .dashboard-content .business-workspace-page { font-family: var(--pro-ui-font); }
body.pro-mode .dashboard-shell .dashboard-content :is(.business-page-title-row h1, .business-page-title-row h2, .business-today-hero h2) {
  font-size: clamp(24px, 2.2vw, 32px);
  font-weight: 650;
  letter-spacing: -.055em;
  line-height: 1.18;
}
body.pro-mode .dashboard-shell .dashboard-content .business-page-description {
  color: var(--pro-ui-muted);
  font-size: 13px;
  line-height: 1.65;
}
body.pro-mode .dashboard-shell .dashboard-content :is(.business-workspace-page, .business-today-page) > .business-page-header { padding-bottom: 8px; }
body.pro-mode .dashboard-shell .dashboard-content .business-today-hero { padding: 6px 0 14px; gap: 20px; }
body.pro-mode .dashboard-shell .dashboard-content :is(.pro-eyebrow, .business-today-hero .eyebrow) {
  color: var(--pro-ui-muted);
  font-size: 10px;
  font-weight: 600;
  letter-spacing: .12em;
  line-height: 1.5;
}
body.pro-mode .dashboard-shell .dashboard-content .business-today-hero .pro-today-heading > p:last-child {
  margin-top: 9px;
  color: var(--pro-ui-muted);
  font-size: 12px;
}
body.pro-mode .dashboard-shell .dashboard-content .pro-section-icon { color: var(--pro-ui-accent-ink); background: var(--pro-ui-accent-soft); }

/* Dense collection internals and measured data rows retain their native sizes. */
body.pro-mode .dashboard-shell .dashboard-content :is(.business-panel, .business-settings-card,
  .business-language-settings-card, .business-settings-search-visibility, .business-team-card,
  .business-calendar-surface, .business-empty, .business-inventory-product) {
  border-color: var(--pro-ui-line);
  border-radius: 20px;
  background-color: #fff;
  box-shadow: 0 2px 8px rgb(11 21 35 / 2%);
}
body.pro-mode .dashboard-shell .dashboard-content :is(.business-panel, .business-settings-card,
  .business-language-settings-card) { padding: clamp(18px, 1.8vw, 26px); }
body.pro-mode .dashboard-shell .dashboard-content .business-today-page .business-panel { padding: 20px; }
body.pro-mode .dashboard-shell .dashboard-content :is(.business-today-overview.is-owner, .business-settings-grid, .business-team-grid) { gap: 18px; }
body.pro-mode .dashboard-shell .dashboard-content .business-today-page { gap: 18px; }
body.pro-mode .dashboard-shell .dashboard-content .business-today-page .business-page-title-row h2 { font-size: 16px; letter-spacing: -.035em; line-height: 1.35; }
body.pro-mode .dashboard-shell .dashboard-content :is(.business-panel > h3, .business-settings-card h3, .business-settings-search-visibility h3) {
  font-size: 16px;
  font-weight: 600;
  letter-spacing: -.035em;
  line-height: 1.4;
}
body.pro-mode .dashboard-shell .dashboard-content :is(.business-metric, .business-today-metric) { border-color: var(--pro-ui-line); border-radius: 18px; background: #fff; box-shadow: none; }
body.pro-mode .dashboard-shell .dashboard-content :is(.business-metric, .business-today-metric) > strong { color: var(--pro-ui-ink); font-weight: 600; letter-spacing: -.05em; }
body.pro-mode .dashboard-shell .dashboard-content :is(.business-metric, .business-today-metric) > span { color: #444e5c; }
body.pro-mode .dashboard-shell .dashboard-content .business-empty { padding: 32px 20px; }
body.pro-mode .dashboard-shell .dashboard-content .business-empty p { font-size: 13px; line-height: 1.65; }

/* Main actions echo the landing page. Destructive control semantics are retained. */
body.pro-mode :is(.dashboard-content, .business-modal, .business-team-drawer,
  .business-salon-deletion-dialog, .salon-photo-manager-panel) :is(.solid-button, .outline-button, .ghost-button) {
  border-radius: 999px;
  font-weight: 550;
  letter-spacing: -.015em;
}
body.pro-mode :is(.dashboard-content, .business-modal, .business-team-drawer, .salon-photo-manager-panel) :is(.outline-button, .ghost-button):not(.danger):not(.is-danger) { color: #444e5c; border-color: var(--pro-ui-line); }
body.pro-mode .dashboard-shell .dashboard-content .business-workspace-page :is(
  .business-field > input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="color"]):not([type="file"]):not([type="hidden"]),
  .business-field > textarea, .business-field > select:not(.prelook-native-select),
  .prelook-select-trigger, .search-field, .business-search-field) {
  border-color: #e3e8ed;
  border-radius: 11px;
  color: var(--pro-ui-ink);
  background-color: #fff;
}
body.pro-mode .dashboard-shell .dashboard-content .business-field > span:first-child { color: #444e5c; }
body.pro-mode :is(.dashboard-content, .business-modal, .business-team-drawer) :is(.solid-button, .outline-button, .ghost-button, .icon-button, .prelook-select-trigger):focus-visible { outline: 3px solid #7d6bd1; outline-offset: 3px; }

/* Include popups portaled outside the shell, without changing their positioning. */
body.pro-mode :is(.business-modal-backdrop, .business-team-drawer-backdrop, .business-onboarding-dialog-backdrop, .business-salon-deletion-backdrop) {
  background: rgb(11 14 23 / 24%);
  backdrop-filter: blur(6px);
  -webkit-backdrop-filter: blur(6px);
}
body.pro-mode :is(.business-modal, .business-team-drawer, .business-salon-deletion-dialog, .salon-photo-manager-panel) { border-color: var(--pro-ui-line); border-radius: 24px; background: #fff; box-shadow: 0 24px 80px rgb(11 21 35 / 16%); }
body.pro-mode :is(.business-team-drawer-header h2, .business-service-inspector-header h3, .business-modal > header h2) {
  color: var(--pro-ui-ink);
  font-size: clamp(24px, 2vw, 28px);
  font-weight: 650;
  letter-spacing: -.05em;
}
body.pro-mode :is(.business-team-drawer-header p, .business-modal > header p) { color: var(--pro-ui-muted); font-size: 13px; line-height: 1.65; }
body.pro-mode :is(.business-team-drawer-header, .business-service-inspector-header, .business-modal > header) > .icon-button { border-radius: 50%; background: #f8fafb; box-shadow: none; }
body.pro-mode :is(.business-modal, .business-team-drawer) .business-modal-section { border-radius: 16px; box-shadow: none; }
body.pro-mode :is(.prelook-select-popover, .prelook-persona-popover, .prelook-menu-popover) { border-color: var(--pro-ui-line); border-radius: 14px; color: var(--pro-ui-ink); box-shadow: 0 14px 44px rgb(11 21 35 / 12%); }

/* Account management retains all three existing tabs and their motion. */
body.pro-mode .rl-sub-root { --sub-ink: #0b0e17; --sub-muted: #626b79; --sub-line: #e9edf0; --sub-green: #125e51; --sub-soft: #eff9f5; font-family: var(--pro-ui-font); }
body.pro-mode .rl-sub-dialog { border-radius: 24px; box-shadow: 0 24px 80px rgb(11 21 35 / 16%); }
body.pro-mode .rl-sub-modal-nav { background: #fafcfc; }
body.pro-mode .rl-sub-tab-indicator { background: #e4f7f0; box-shadow: none; }
body.pro-mode .rl-sub-modal-nav [role="tab"][aria-selected="true"] { color: #125e51; }
body.pro-mode .rl-sub-heading h2 { letter-spacing: -.055em; font-weight: 650; }
body.pro-mode .rl-sub-close { border-radius: 50%; }
body.pro-mode .rl-sub-button:not(.is-current):not(.rl-sub-button-secondary):not(.rl-sub-button-danger) { background: #0d1019; border-radius: 999px; font-weight: 550 !important; }

/* Hover feedback never shifts calendar appointments or drag targets. */
@media (prefers-reduced-motion: no-preference) {
  body.pro-mode :is(.dashboard-content, .business-modal, .business-team-drawer) :is(.solid-button, .outline-button, .ghost-button, .icon-button, .prelook-select-trigger) { transition-duration: 220ms; transition-timing-function: cubic-bezier(.22, 1, .36, 1); }
  body.pro-mode .dashboard-shell .dashboard-content :is(.business-team-card, .business-settings-card, .business-inventory-product) { transition: border-color 220ms ease, box-shadow 220ms ease; }
  body.pro-mode .dashboard-shell .dashboard-content :is(.business-team-card, .business-inventory-product:not(.low-stock)):hover { border-color: #d1e9df; box-shadow: 0 6px 22px rgb(11 21 35 / 5%); }
}
@media (max-width: 820px) {
  body.pro-mode .dashboard-shell .dashboard-content :is(.business-page-title-row h1, .business-page-title-row h2, .business-today-hero h2) { font-size: 25px; }
  body.pro-mode .dashboard-shell .dashboard-content :is(.business-panel, .business-settings-card, .business-language-settings-card, .business-today-page .business-panel) { padding: 16px; }
  body.pro-mode .dashboard-shell .dashboard-content :is(.business-panel, .business-settings-card, .business-team-card, .business-calendar-surface, .business-empty, .business-inventory-product) { border-radius: 16px; }
  body.pro-mode .dashboard-shell .dashboard-content :is(.business-today-page, .business-today-overview.is-owner, .business-settings-grid, .business-team-grid) { gap: 14px; }
  body.pro-mode .dashboard-shell .dashboard-content .business-today-hero { padding-block: 0 6px; }
  body.pro-mode :is(.business-modal, .business-team-drawer, .business-salon-deletion-dialog) { border-radius: 20px; }
}
@media (max-width: 480px) {
  body.pro-mode .dashboard-shell .dashboard-content :is(.business-panel, .business-settings-card, .business-language-settings-card, .business-today-page .business-panel) { padding: 14px; }
  body.pro-mode .dashboard-shell .dashboard-content .business-empty { padding: 24px 16px; }
  body.pro-mode .rl-sub-dialog { border-radius: 20px 20px 0 0; }
}
@media (prefers-reduced-motion: reduce) {
  body.pro-mode :is(.rl-sub-modal, .rl-sub-root) *, body.pro-mode .sidebar.dashboard-bottom-dock { animation: none !important; transition: none !important; scroll-behavior: auto !important; }
}

/* Stock warnings remain distinct from the neutral product surface. */
body.pro-mode .dashboard-shell .dashboard-content .business-inventory-product.low-stock { border-color: #eee1c9; }

/* Match the existing header specificity, leaving nested Today panels compact. */
body.pro-mode .dashboard-shell .dashboard-content :is(.business-workspace-page:not(.business-today-page), .business-crm-page-top) > .business-page-header .business-page-title-row > :is(h1, h2) {
  font-size: clamp(25px, 2.2vw, 32px);
  letter-spacing: -.055em;
  line-height: 1.18;
}
body.pro-mode .dashboard-shell .dashboard-content :is(.business-workspace-page, .business-crm-page-top) > .business-page-header .business-page-description { line-height: 1.65; }

/* Header actions previously carried local mint/button radius overrides. */
body.pro-mode .dashboard-shell .dashboard-content .business-workspace-page .business-page-header .business-header-actions :is(.solid-button, .outline-button, .ghost-button) {
  border-radius: 999px;
  font-weight: 550;
  letter-spacing: -.015em;
}

/* Keep the state layer's native/ARIA-disabled and semantic color guards. */
html body.pro-mode :is(.dashboard-shell .dashboard-content, .business-modal, .business-team-drawer,
  .business-service-inspector, .business-onboarding-dialog, .business-onboarding-cancel-dialog,
  .business-salon-deletion-dialog, .salon-photo-manager-panel) :is(.solid-button.pro, .outline-button, .ghost-button) {
  border-radius: 999px;
  font-weight: 550;
}
html body.pro-mode :is(.dashboard-shell .dashboard-content, .business-modal, .business-team-drawer,
  .business-service-inspector, .business-onboarding-dialog, .business-onboarding-cancel-dialog,
  .business-salon-deletion-dialog, .salon-photo-manager-panel)
  .solid-button.pro:not(.danger, .is-danger, .warning, .is-warning, [data-tone="danger"], [data-tone="warning"]):not(:disabled):not([aria-disabled="true"]) {
  color: #fff;
  border-color: #0d1019;
  background: #0d1019;
  box-shadow: 0 2px 3px rgb(3 7 18 / 5%);
}
html body.pro-mode :is(.dashboard-shell .dashboard-content, .business-modal, .business-team-drawer,
  .business-service-inspector, .business-onboarding-dialog, .business-onboarding-cancel-dialog,
  .business-salon-deletion-dialog, .salon-photo-manager-panel)
  .solid-button.pro:not(.danger, .is-danger, .warning, .is-warning, [data-tone="danger"], [data-tone="warning"]):not(:disabled):not([aria-disabled="true"]):hover {
  color: #fff;
  background: #252936;
  border-color: #252936;
  box-shadow: 0 5px 16px rgb(11 21 35 / 12%);
}
html body.pro-mode :is(.dashboard-shell .dashboard-content, .business-modal, .business-team-drawer,
  .business-service-inspector, .business-onboarding-dialog, .business-onboarding-cancel-dialog,
  .business-salon-deletion-dialog, .salon-photo-manager-panel)
  .solid-button.pro:not(.danger, .is-danger, .warning, .is-warning, [data-tone="danger"], [data-tone="warning"]):not(:disabled):not([aria-disabled="true"]):active {
  color: #fff;
  background: #0b0e17;
  border-color: #0b0e17;
  box-shadow: inset 0 1px 3px rgb(0 0 0 / 12%);
}