/* Modlocus Menu · menu design variables (fonts, 10 palettes, light/dark mode).
   Shared by the guest menu (menu.css) and the printable menu (print-sheet.css); the counterpart of ModulerMenu tokens.css. */

/* ModulerMenu · design tokens
   Palette = color family ([data-palette]), mode = light/dark ([data-mode]), theme = structure ([data-theme]).
   A new palette is one line: neutral hue (--h/--s) plus accent hue (--ah/--as). */

@font-face { font-family: "Gloock"; src: url("/fonts/gloock-regular.woff2") format("woff2"); font-display: swap; }
/* Gloock draws one currency sign so it looks like "Ł": only that character comes from Onest (first in the heading font stack). */
@font-face { font-family: "LiraFix"; src: url("/fonts/onest-variable.woff2") format("woff2"); font-weight: 100 900; unicode-range: U+20BA; font-display: swap; }
@font-face { font-family: "Onest"; src: url("/fonts/onest-variable.woff2") format("woff2"); font-weight: 100 900; font-display: swap; }
/* Poppins ("Vivid" theme): downloaded only when that theme is selected. latin-ext is needed for extended Latin letters and currency signs. */
@font-face { font-family: "Poppins"; font-weight: 400; font-display: swap; src: url("/fonts/poppins-latin-ext-400.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: "Poppins"; font-weight: 400; font-display: swap; src: url("/fonts/poppins-latin-400.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: "Poppins"; font-weight: 500; font-display: swap; src: url("/fonts/poppins-latin-ext-500.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: "Poppins"; font-weight: 500; font-display: swap; src: url("/fonts/poppins-latin-500.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: "Poppins"; font-weight: 600; font-display: swap; src: url("/fonts/poppins-latin-ext-600.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: "Poppins"; font-weight: 600; font-display: swap; src: url("/fonts/poppins-latin-600.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: "Poppins"; font-weight: 700; font-display: swap; src: url("/fonts/poppins-latin-ext-700.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: "Poppins"; font-weight: 700; font-display: swap; src: url("/fonts/poppins-latin-700.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; }

/* Palettes */
:root, [data-palette="vellen"]  { --h: 34;  --s: 30%; --ah: 8;   --as: 62%; }   /* cream + cherry red */
[data-palette="gece"]           { --h: 224; --s: 32%; --ah: 41;  --as: 54%; }   /* navy + gold */
[data-palette="zeytin"]         { --h: 84;  --s: 20%; --ah: 96;  --as: 38%; }   /* sage + olive green */
[data-palette="mocha"]          { --h: 24;  --s: 24%; --ah: 24;  --as: 56%; }   /* latte + copper */
[data-palette="okyanus"]        { --h: 200; --s: 30%; --ah: 186; --as: 64%; }   /* sea mist + turquoise */
[data-palette="gul"]            { --h: 346; --s: 28%; --ah: 340; --as: 56%; }   /* powder + rose */
/* The ones below set their own accent lightness (--al light mode, --ad dark mode); text contrast at least 4.5:1 */
[data-palette="lavanta"]        { --h: 268; --s: 22%; --ah: 272; --as: 40%; }                /* lilac + plum */
[data-palette="safran"]         { --h: 42;  --s: 36%; --ah: 40;  --as: 94%; --al: 26%; --ad: 60%; }   /* cream + saffron */
[data-palette="grafit"]         { --h: 215; --s: 9%;  --ah: 17;  --as: 88%; --ad: 64%; }     /* gray + orange */
[data-palette="orman"]          { --h: 150; --s: 16%; --ah: 154; --as: 46%; --al: 30%; --ad: 62%; }   /* mist + forest green */

/* Modes */
:root, [data-mode="light"] {
    color-scheme: light;
    --bg: hsl(var(--h) var(--s) 93%);
    --surface: hsl(var(--h) var(--s) 97%);
    --surface-2: hsl(var(--h) var(--s) 89%);
    --text: hsl(var(--h) 34% 11%);
    --muted: hsl(var(--h) 12% 34%);
    --line: hsl(var(--h) 24% 12% / .13);
    --accent: hsl(var(--ah) var(--as) var(--al, 36%));
    --accent-soft: hsl(var(--ah) var(--as) var(--al, 36%) / .11);
    --on-accent: #fff;
    --ok: #2f6f45;
    --shadow: 0 1px 2px hsl(var(--h) 30% 10% / .06), 0 8px 24px -12px hsl(var(--h) 30% 10% / .22);
    --scrim: hsl(var(--h) 30% 8% / .55);
}

[data-mode="dark"] {
    color-scheme: dark;
    --bg: hsl(var(--h) calc(var(--s) * .75) 7.5%);
    --surface: hsl(var(--h) calc(var(--s) * .75) 11.5%);
    --surface-2: hsl(var(--h) calc(var(--s) * .75) 16%);
    --text: hsl(var(--h) 26% 93%);
    --muted: hsl(var(--h) 12% 68%);
    --line: hsl(var(--h) 26% 92% / .14);
    --accent: hsl(var(--ah) calc(var(--as) * 1.1) var(--ad, 66%));
    --accent-soft: hsl(var(--ah) var(--as) var(--ad, 66%) / .14);
    --on-accent: hsl(var(--h) 40% 8%);
    --ok: #86c796;
    --shadow: 0 1px 2px #0006, 0 12px 28px -14px #000a;
    --scrim: hsl(var(--h) 30% 4% / .7);
}

/* Shared sizes */
:root {
    --font-body: "Onest", system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif;
    --font-display: "LiraFix", "Gloock", "Iowan Old Style", "Palatino Linotype", Georgia, serif;
    --ease: cubic-bezier(.16, 1, .3, 1);
}