/* Design tokens for every booking-site template.

   Both the public page and the editor's live canvas carry
   data-sf-template / data-sf-corners, so the same declarations drive the real
   landing and its preview. Nothing here positions anything: structure lives in
   storefront-public.css (landing) and storefront-studio.css (editor). */

[data-sf-template] {
    --sf-bg: #f5f3ee;
    --sf-surface: #fffefb;
    --sf-surface-2: #f0efe8;
    --sf-ink: #16201c;
    --sf-ink-soft: #5d6b64;
    --sf-line: #e2e0d7;
    --sf-line-strong: #cfcdc2;
    --sf-hero-bg: #13332c;
    --sf-hero-ink: #f6f3ea;
    --sf-hero-soft: #cfd8d1;
    --sf-hero-overlay: linear-gradient(105deg, rgba(8, 22, 18, .82), rgba(8, 22, 18, .18));
    --sf-hero-photo-overlay: var(--sf-hero-overlay);
    --sf-hero-btn-ink: var(--sf-hero-bg);
    --sf-hero-min: 68vh;
    --sf-font-display: 'Playfair Display', Georgia, serif;
    --sf-font-body: Manrope, system-ui, -apple-system, sans-serif;
    --sf-font-mono: 'DM Mono', ui-monospace, monospace;
    --sf-display-weight: 600;
    --sf-display-tracking: -.045em;
    --sf-display-leading: .92;
    --sf-label-tracking: .16em;
    --sf-label-transform: uppercase;
    --sf-radius-lg: 24px;
    --sf-radius: 16px;
    --sf-radius-sm: 10px;
    --sf-radius-pill: 999px;
    --sf-border: 1px;
    --sf-shadow: 0 10px 34px rgba(16, 35, 31, .07);
    --sf-shadow-lift: 0 26px 60px rgba(16, 35, 31, .14);
    --sf-image-filter: saturate(.94);
    --sf-image-ratio: 4 / 3;
    --sf-gap: 26px;
    --sf-scheme: light;
}

/* ── Timeless ─────────────────────────────────────────────────────────── */

/* editorial keeps every base token; its personality is structural. */

[data-sf-template="heritage"] {
    --sf-bg: #fbf9f4; --sf-surface: #fffdf8; --sf-surface-2: #f4efe3;
    --sf-ink: #221c12; --sf-ink-soft: #6e6252; --sf-line: #e7dfce; --sf-line-strong: #d2c5a9;
    --sf-hero-bg: #1c1913; --sf-hero-ink: #f8f1e2; --sf-hero-soft: #cdc2ab;
    --sf-hero-overlay: linear-gradient(180deg, rgba(20, 17, 12, .55), rgba(20, 17, 12, .82));
    --sf-font-display: 'Cormorant Garamond', Garamond, serif;
    --sf-font-body: Lato, system-ui, sans-serif;
    --sf-display-weight: 500; --sf-display-tracking: -.01em; --sf-display-leading: 1;
    --sf-label-tracking: .32em;
    --sf-radius-lg: 0; --sf-radius: 0; --sf-radius-sm: 0;
    --sf-shadow: 0 8px 30px rgba(52, 40, 20, .07); --sf-shadow-lift: 0 22px 54px rgba(52, 40, 20, .14);
    --sf-image-ratio: 3 / 4;
}

[data-sf-template="riviera"] {
    --sf-bg: #fdf5ea; --sf-surface: #fffaf2; --sf-surface-2: #f7e9d6;
    --sf-ink: #38241b; --sf-ink-soft: #7f6053; --sf-line: #efdcc6; --sf-line-strong: #e0c3a2;
    --sf-hero-bg: #b8563a; --sf-hero-ink: #fff6ec; --sf-hero-soft: #f4d9c6;
    --sf-hero-overlay: linear-gradient(110deg, rgba(88, 34, 20, .74), rgba(184, 86, 58, .3));
    --sf-font-display: Fraunces, Georgia, serif;
    --sf-font-body: Karla, system-ui, sans-serif;
    --sf-display-weight: 600; --sf-display-tracking: -.03em; --sf-display-leading: .95;
    --sf-radius-lg: 32px; --sf-radius: 22px; --sf-radius-sm: 14px;
    --sf-shadow: 0 12px 36px rgba(122, 63, 36, .1); --sf-shadow-lift: 0 28px 62px rgba(122, 63, 36, .18);
    --sf-image-filter: saturate(1.05) contrast(1.02);
}

/* ── Quiet ────────────────────────────────────────────────────────────── */

[data-sf-template="minimal"] {
    --sf-hero-photo-overlay: linear-gradient(180deg, rgba(10, 12, 14, .45), rgba(10, 12, 14, .82));
    --sf-bg: #fff; --sf-surface: #fff; --sf-surface-2: #f6f6f4;
    --sf-ink: #111; --sf-ink-soft: #6c6c6c; --sf-line: #e7e7e4; --sf-line-strong: #111;
    --sf-hero-bg: #f4f4f1; --sf-hero-ink: #111; --sf-hero-soft: #6c6c6c;
    --sf-hero-overlay: linear-gradient(180deg, rgba(0, 0, 0, .05), rgba(0, 0, 0, .45));
    --sf-hero-min: 56vh;
    --sf-font-display: Inter, system-ui, sans-serif;
    --sf-font-body: Inter, system-ui, sans-serif;
    --sf-font-mono: 'IBM Plex Mono', ui-monospace, monospace;
    --sf-display-weight: 500; --sf-display-tracking: -.05em; --sf-display-leading: .96;
    --sf-label-tracking: .2em;
    --sf-radius-lg: 0; --sf-radius: 0; --sf-radius-sm: 0;
    --sf-shadow: none; --sf-shadow-lift: none;
    --sf-image-filter: saturate(.9); --sf-gap: 0;
}

[data-sf-template="nordic"] {
    --sf-hero-photo-overlay: linear-gradient(180deg, rgba(10, 12, 14, .45), rgba(10, 12, 14, .82));
    --sf-bg: #fbfaf6; --sf-surface: #fff; --sf-surface-2: #f2efe7;
    --sf-ink: #22251f; --sf-ink-soft: #6c7269; --sf-line: #e9e5da; --sf-line-strong: #d6d0c1;
    --sf-hero-bg: #e6e1d4; --sf-hero-ink: #23271f; --sf-hero-soft: #5f665b;
    --sf-hero-overlay: linear-gradient(180deg, rgba(35, 39, 31, .1), rgba(35, 39, 31, .58));
    --sf-font-display: 'Inter Tight', system-ui, sans-serif;
    --sf-font-body: Inter, system-ui, sans-serif;
    --sf-font-mono: 'IBM Plex Mono', ui-monospace, monospace;
    --sf-display-weight: 600; --sf-display-tracking: -.05em; --sf-display-leading: .95;
    --sf-radius-lg: 30px; --sf-radius: 22px; --sf-radius-sm: 14px;
    --sf-shadow: 0 8px 30px rgba(45, 48, 38, .05); --sf-shadow-lift: 0 22px 52px rgba(45, 48, 38, .1);
    --sf-image-filter: saturate(.86) brightness(1.03); --sf-gap: 32px;
}

[data-sf-template="verdant"] {
    --sf-bg: #f1f5ef; --sf-surface: #fff; --sf-surface-2: #e5eee3;
    --sf-ink: #16241c; --sf-ink-soft: #566b5d; --sf-line: #dde7dc; --sf-line-strong: #c3d4c2;
    --sf-hero-bg: #1d4534; --sf-hero-ink: #eff7ef; --sf-hero-soft: #c3d8c6;
    --sf-hero-overlay: linear-gradient(115deg, rgba(14, 43, 31, .84), rgba(14, 43, 31, .26));
    --sf-font-display: Lora, Georgia, serif;
    --sf-font-body: 'Nunito Sans', system-ui, sans-serif;
    --sf-display-weight: 600; --sf-display-tracking: -.025em; --sf-display-leading: 1;
    --sf-radius-lg: 30px; --sf-radius: 22px; --sf-radius-sm: 14px;
    --sf-shadow: 0 10px 32px rgba(23, 56, 40, .08); --sf-shadow-lift: 0 26px 56px rgba(23, 56, 40, .16);
    --sf-image-filter: saturate(1.02);
}

/* ── Dark ─────────────────────────────────────────────────────────────── */

[data-sf-template="midnight"] {
    --sf-bg: #0c100f; --sf-surface: #151b19; --sf-surface-2: #1c2421;
    --sf-ink: #eef2ee; --sf-ink-soft: #9aa8a1; --sf-line: #273230; --sf-line-strong: #3a4844;
    --sf-hero-bg: #080b0a; --sf-hero-ink: #f5f1e6; --sf-hero-soft: #b3af9f;
    --sf-hero-overlay: linear-gradient(180deg, rgba(6, 9, 8, .5), rgba(6, 9, 8, .88));
    --sf-font-display: 'Cormorant Garamond', Garamond, serif;
    --sf-font-body: Inter, system-ui, sans-serif;
    --sf-display-weight: 500; --sf-display-tracking: -.015em; --sf-display-leading: .98;
    --sf-label-tracking: .3em;
    --sf-radius-lg: 20px; --sf-radius: 14px; --sf-radius-sm: 8px;
    --sf-shadow: 0 12px 40px rgba(0, 0, 0, .45); --sf-shadow-lift: 0 30px 70px rgba(0, 0, 0, .6);
    --sf-image-filter: saturate(.8) brightness(.94); --sf-scheme: dark;
}

[data-sf-template="metropolis"] {
    --sf-bg: #0a0d11; --sf-surface: #11161d; --sf-surface-2: #171e27;
    --sf-ink: #e9eef5; --sf-ink-soft: #8895a6; --sf-line: #1f2732; --sf-line-strong: #33404f;
    --sf-hero-bg: #0a0d11; --sf-hero-ink: #f2f6fb; --sf-hero-soft: #93a1b3;
    --sf-hero-overlay: linear-gradient(100deg, rgba(8, 11, 15, .9), rgba(8, 11, 15, .35));
    --sf-font-display: 'Inter Tight', system-ui, sans-serif;
    --sf-font-body: Inter, system-ui, sans-serif;
    --sf-font-mono: 'JetBrains Mono', ui-monospace, monospace;
    --sf-display-weight: 700; --sf-display-tracking: -.055em; --sf-display-leading: .92;
    --sf-label-tracking: .14em;
    --sf-radius-lg: 6px; --sf-radius: 6px; --sf-radius-sm: 4px;
    --sf-shadow: 0 10px 36px rgba(0, 0, 0, .5); --sf-shadow-lift: 0 26px 64px rgba(0, 0, 0, .65);
    --sf-image-filter: saturate(.85) contrast(1.08); --sf-scheme: dark;
}

[data-sf-template="studio"] {
    --sf-bg: #0a0a0a; --sf-surface: #101010; --sf-surface-2: #171717;
    --sf-ink: #f4f4f4; --sf-ink-soft: #9d9d9d; --sf-line: #1f1f1f; --sf-line-strong: #333;
    --sf-hero-bg: #000; --sf-hero-ink: #fff; --sf-hero-soft: #c9c9c9;
    --sf-hero-overlay: linear-gradient(180deg, rgba(0, 0, 0, .3) 0%, rgba(0, 0, 0, 0) 38%, rgba(0, 0, 0, .86) 100%);
    --sf-hero-min: 92vh;
    --sf-font-display: 'Inter Tight', system-ui, sans-serif;
    --sf-font-body: Inter, system-ui, sans-serif;
    --sf-font-mono: 'JetBrains Mono', ui-monospace, monospace;
    --sf-display-weight: 500; --sf-display-tracking: -.06em; --sf-display-leading: .9;
    --sf-label-tracking: .26em;
    --sf-radius-lg: 0; --sf-radius: 0; --sf-radius-sm: 0;
    --sf-shadow: none; --sf-shadow-lift: none;
    --sf-image-filter: saturate(.78) contrast(1.06); --sf-image-ratio: 3 / 2; --sf-gap: 0; --sf-scheme: dark;
}

/* ── Bold ─────────────────────────────────────────────────────────────── */

[data-sf-template="atelier"] {
    --sf-bg: #f2f1ec; --sf-surface: #fffefa; --sf-surface-2: #e6e4dc;
    --sf-ink: #0d0d0d; --sf-ink-soft: #4d4d4d; --sf-line: #0d0d0d; --sf-line-strong: #0d0d0d;
    --sf-hero-bg: #0d0d0d; --sf-hero-ink: #f7f6f1; --sf-hero-soft: #b5b5ad;
    --sf-hero-overlay: linear-gradient(180deg, rgba(13, 13, 13, .32), rgba(13, 13, 13, .8));
    --sf-font-display: 'Space Grotesk', system-ui, sans-serif;
    --sf-font-body: 'Space Grotesk', system-ui, sans-serif;
    --sf-font-mono: 'IBM Plex Mono', ui-monospace, monospace;
    --sf-display-weight: 700; --sf-display-tracking: -.05em; --sf-display-leading: .88;
    --sf-label-tracking: .18em;
    --sf-radius-lg: 0; --sf-radius: 0; --sf-radius-sm: 0; --sf-border: 2px;
    --sf-shadow: none; --sf-shadow-lift: 10px 10px 0 #0d0d0d;
    --sf-image-filter: grayscale(.25) contrast(1.08); --sf-gap: 0;
}

[data-sf-template="bauhaus"] {
    --sf-hero-photo-overlay: linear-gradient(180deg, rgba(10, 12, 14, .45), rgba(10, 12, 14, .82));
    --sf-bg: #f4f0e6; --sf-surface: #fffdf6; --sf-surface-2: #e9e3d2;
    --sf-ink: #141414; --sf-ink-soft: #52504a; --sf-line: #141414; --sf-line-strong: #141414;
    --sf-hero-bg: #ede7d7; --sf-hero-ink: #141414; --sf-hero-soft: #4a4840;
    --sf-hero-overlay: linear-gradient(180deg, rgba(20, 20, 20, .12), rgba(20, 20, 20, .6));
    --sf-font-display: 'Space Grotesk', system-ui, sans-serif;
    --sf-font-body: Karla, system-ui, sans-serif;
    --sf-font-mono: 'IBM Plex Mono', ui-monospace, monospace;
    --sf-display-weight: 700; --sf-display-tracking: -.045em; --sf-display-leading: .9;
    --sf-radius-lg: 0; --sf-radius: 0; --sf-radius-sm: 0; --sf-border: 2px;
    --sf-shadow: none; --sf-shadow-lift: 9px 9px 0 var(--sf-accent);
    --sf-image-filter: saturate(1.08) contrast(1.04); --sf-gap: 20px;
}

[data-sf-template="sunset"] {
    --sf-bg: #fff5f0; --sf-surface: rgba(255, 255, 255, .72); --sf-surface-2: #ffe8dd;
    --sf-ink: #2a1710; --sf-ink-soft: #7d5748; --sf-line: rgba(255, 255, 255, .8); --sf-line-strong: #f0cdba;
    --sf-hero-bg: #f0603c; --sf-hero-ink: #fff; --sf-hero-soft: #ffe3d6;
    --sf-hero-overlay: linear-gradient(140deg, rgba(240, 96, 60, .86), rgba(146, 47, 122, .72));
    --sf-font-display: Outfit, system-ui, sans-serif;
    --sf-font-body: Outfit, system-ui, sans-serif;
    --sf-display-weight: 700; --sf-display-tracking: -.045em; --sf-display-leading: .94;
    --sf-radius-lg: 34px; --sf-radius: 24px; --sf-radius-sm: 16px;
    --sf-shadow: 0 14px 40px rgba(190, 78, 50, .14); --sf-shadow-lift: 0 30px 70px rgba(190, 78, 50, .24);
    --sf-image-filter: saturate(1.12);
}

/* Corner scale, applied after the template so an operator override wins. */

[data-sf-corners="sharp"] { --sf-radius-lg: 0; --sf-radius: 0; --sf-radius-sm: 0 }
[data-sf-corners="soft"] { --sf-radius-lg: 24px; --sf-radius: 16px; --sf-radius-sm: 10px }
[data-sf-corners="round"] { --sf-radius-lg: 34px; --sf-radius: 24px; --sf-radius-sm: 16px }
