/* =====================================================================
   DG Book Pro — design tokens (single source of truth).
   Light, Stripe-style, matching DGPro / DGBooking / DG Estate.
   Rentals and Services each carry their own colour; the business picks
   one of three palettes and one of two heading fonts in Settings → Styling
   (written to <html data-palette data-font>). Dark mode is opt-in only
   (<html data-theme="dark">), never automatic.
   See design-system/dg-book-pro/MASTER.md.
   ===================================================================== */

@font-face { font-family: 'Inter'; font-style: normal; font-weight: 100 900; font-display: swap; src: url('../fonts/inter-var.woff2') format('woff2'); }
@font-face { font-family: 'Montserrat'; font-style: normal; font-weight: 100 900; font-display: swap; src: url('../fonts/montserrat-var.woff2') format('woff2'); }

/* Customer-facing font choices (Settings → Styling → App\Core\Theme::FONTS). Self-hosted, latin + latin-ext,
   only downloaded when a page uses them. Sources and hashes: ../fonts/README.md */
@font-face { font-family: 'Nunito'; font-style: normal; font-weight: 200 1000; font-display: swap; src: url('../fonts/nunito-latin-ext-wght-normal.woff2') format('woff2'); unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF; }
@font-face { font-family: 'Nunito'; font-style: normal; font-weight: 200 1000; font-display: swap; src: url('../fonts/nunito-latin-wght-normal.woff2') format('woff2'); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family: 'Lora'; font-style: normal; font-weight: 400 700; font-display: swap; src: url('../fonts/lora-latin-ext-wght-normal.woff2') format('woff2'); unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF; }
@font-face { font-family: 'Lora'; font-style: normal; font-weight: 400 700; font-display: swap; src: url('../fonts/lora-latin-wght-normal.woff2') format('woff2'); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family: 'Playfair Display'; font-style: normal; font-weight: 400 900; font-display: swap; src: url('../fonts/playfair-display-latin-ext-wght-normal.woff2') format('woff2'); unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF; }
@font-face { font-family: 'Playfair Display'; font-style: normal; font-weight: 400 900; font-display: swap; src: url('../fonts/playfair-display-latin-wght-normal.woff2') format('woff2'); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family: 'Fraunces'; font-style: normal; font-weight: 100 900; font-display: swap; src: url('../fonts/fraunces-latin-ext-wght-normal.woff2') format('woff2'); unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF; }
@font-face { font-family: 'Fraunces'; font-style: normal; font-weight: 100 900; font-display: swap; src: url('../fonts/fraunces-latin-wght-normal.woff2') format('woff2'); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }

:root {
  /* Demongrafix platform */
  --navy: #29235C;
  --brand-mark: #29235C;

  /* Stripe neutrals (shared with the sibling apps) */
  --bg: #F6F9FC;
  --bg-alt: #EEF1F6;
  --surface: #FFFFFF;
  --surface-2: #F9FBFD;
  --line: #E3E8EE;
  --line-strong: #D9DFE7;
  --ink: #0A2540;
  --ink-2: #425466;
  --ink-3: #697386;
  --scrim: rgba(10, 37, 64, .4);

  /* Sidebar */
  --nav-bg: #FFFFFF;
  --nav-ink: #425466;
  --nav-ink-2: #697386;
  --nav-line: #E3E8EE;
  --nav-hover: #F6F9FC;

  /* Verticals — palette "teal" (default): Rentals = DGBooking teal, Services = DGPro blue */
  --rent: #42B7AA;  --rent-ink-l: #1A7D72;
  --svc:  #1D70B7;  --svc-ink-l:  #1D70B7;
  --plat: #29235C;  --plat-ink-l: #29235C;
  --rent-ink: var(--rent-ink-l);
  --svc-ink: var(--svc-ink-l);
  --plat-ink: var(--plat-ink-l);
  --wash-pct: 12%;
  --pill-mix: black;
  --pill-mix-pct: 12%;
  --btn-text: #FFFFFF;

  /* Status — each pill is colour + icon + word */
  --st-pending: #B45309;
  --st-confirmed: #047857;
  --st-progress: #6D28D9;
  --st-completed: #1E40AF;
  --st-cancelled: #B91C1C;
  --st-noshow: #475569;
  --st-unassigned: #B45309;
  --danger: #B91C1C;
  --success: #047857;
  --warning: #B45309;
  --info: #1D70B7;

  /* Type */
  --font-head: "Montserrat", "Inter", system-ui, sans-serif;
  --font-body: "Inter", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  --head-weight: 700;
  --head-track: -0.01em;
  --fs-xs: 12px; --fs-sm: 13px; --fs-base: 14px; --fs-md: 15px; --fs-lg: 17px; --fs-xl: 22px; --fs-2xl: 26px;

  /* Space (4pt) */
  --s1: 4px; --s2: 8px; --s3: 12px; --s4: 16px; --s5: 20px; --s6: 24px; --s7: 32px; --s8: 48px;

  /* Shape: radius and elevation by role */
  --r-input: 9px; --r-card: 12px; --r-sheet: 16px; --r-pill: 999px;
  --shadow-card: 0 1px 2px rgba(10, 37, 64, .05), 0 1px 3px rgba(50, 50, 93, .06);
  --shadow-pop: 0 18px 40px -12px rgba(50, 50, 93, .22), 0 4px 12px -2px rgba(50, 50, 93, .12);
  --focus: 0 0 0 3px color-mix(in oklab, var(--svc) 40%, transparent);

  /* Layout */
  --sidebar-w: 252px;
  --content-max: none;   /* full width: lists and the calendar use the whole screen; forms and text set their own max widths */
  --z-top: 20; --z-menu: 30; --z-drawer: 50; --z-modal: 80; --z-toast: 100;

  /* Legacy aliases — keep un-migrated views readable during the revamp. */
  --dgp-bg: var(--bg); --dgp-surface: var(--surface); --dgp-surface-2: var(--surface-2);
  --dgp-border: var(--line); --dgp-border-strong: var(--line-strong);
  --dgp-ink: var(--ink); --dgp-ink-soft: var(--ink-2); --dgp-ink-muted: var(--ink-3);
  --dgp-accent: var(--plat-ink); --dgp-accent-hover: var(--plat-ink); --dgp-accent-ink: #FFFFFF;
  --dgp-accent-wash: color-mix(in oklab, var(--plat) 8%, var(--surface));
  --dgp-success: var(--success); --dgp-warning: var(--warning); --dgp-danger: var(--danger); --dgp-info: var(--info);
  --dgp-font: var(--font-body); --dgp-font-mono: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  --dgp-text-xs: 12px; --dgp-text-sm: 13px; --dgp-text-base: 14px; --dgp-text-lg: 16px; --dgp-text-xl: 20px; --dgp-text-2xl: 26px;
  --dgp-s1: 4px; --dgp-s2: 8px; --dgp-s3: 12px; --dgp-s4: 16px; --dgp-s5: 24px; --dgp-s6: 32px; --dgp-s7: 48px; --dgp-s8: 64px;
  --dgp-radius-sm: 6px; --dgp-radius: 10px; --dgp-radius-lg: 14px; --dgp-radius-pill: 999px;
  --dgp-shadow-sm: var(--shadow-card); --dgp-shadow: var(--shadow-card); --dgp-shadow-lg: var(--shadow-pop);
}

/* Palette options (Settings → Styling) */
:root[data-palette="amber"] { --svc: #E59A1A; --svc-ink-l: #A15C07; }
:root[data-palette="berry"] { --rent: #B4457F; --rent-ink-l: #9A2F68; }

/* Heading font options */
:root[data-font="inter"] { --font-head: "Inter", system-ui, sans-serif; --head-weight: 650; --head-track: -0.02em; }

/* Dark mode — opt-in only */
:root[data-theme="dark"] {
  --brand-mark: #ECEBF7;
  --bg: #0F0E1C; --bg-alt: #141325; --surface: #18172B; --surface-2: #1E1D34;
  --line: #2B2A45; --line-strong: #3B3A5A;
  --ink: #ECEBF7; --ink-2: #BDBBD3; --ink-3: #9E9CB8; --scrim: rgba(0, 0, 0, .6);
  --nav-bg: #141325; --nav-ink: #BDBBD3; --nav-ink-2: #9E9CB8; --nav-line: #2B2A45; --nav-hover: #1E1D34;
  --rent-ink: color-mix(in oklab, var(--rent) 70%, white);
  --svc-ink: color-mix(in oklab, var(--svc) 58%, white);
  --plat-ink: color-mix(in oklab, var(--plat) 35%, white);
  --wash-pct: 20%; --pill-mix: white; --pill-mix-pct: 50%; --btn-text: #0F0E1C;
  --shadow-card: 0 0 0 1px rgba(255, 255, 255, .02);
  --shadow-pop: 0 16px 40px -8px rgba(0, 0, 0, .6);
  --dgp-accent-ink: #0F0E1C;
  color-scheme: dark;
}

/* Vertical context: set data-v on any container */
[data-v="rent"] { --v: var(--rent); --v-ink: var(--rent-ink); }
[data-v="svc"]  { --v: var(--svc);  --v-ink: var(--svc-ink); }
:root, [data-v="plat"] { --v: var(--plat); --v-ink: var(--plat-ink); }
:root, [data-v] { --v-wash: color-mix(in oklab, var(--v) var(--wash-pct), var(--surface)); }