/* FEMA Solar & Picchio Luce e Gas (distributori ufficiali Midea) — design tokens.
   Each block maps 1:1 to settings_schema.json: Liquid prints the same names in :root
   (snippets/theme-styles-variables.liquid). Setting id in the comment → CSS variable. */
:root {
  /* color_palette (settings.color_palette.*) */
  --color-background: #ffffff;          /* palette.background */
  --color-surface: #f7f7f7;             /* palette.surface — grey sections, tiles, footer */
  --color-surface-2: #f1f1f1;           /* palette.studio — Midea studio photo background (K6) */
  --color-border: #e6e7e8;              /* palette.border */
  --color-border-strong: #d6d6d6;       /* palette.border_strong — inputs, disabled */
  --color-foreground: #222222;          /* palette.foreground */
  --color-foreground-2: #333333;        /* palette.foreground_secondary */
  --color-muted: #707070;               /* palette.muted — 4.95:1 on white */
  --color-primary: #0092d8;             /* palette.primary — Midea Blue (brand book). White text only ≥18.66px bold / 24px */
  --color-primary-hover: oklch(0.56 0.14 241); /* palette.primary_hover */
  --color-primary-active: oklch(0.51 0.13 241);
  --color-link: #0077b6;                /* palette.link — derived, 4.87:1 */
  --color-deep: #00284c;
  --color-midgrey: #808080;            /* palette.midgrey — Midea Mid-Grey (brand book), co-brand divider only */                /* palette.deep — Midea Deep Blue */
  --color-deep-hover: oklch(0.34 0.09 248);
  --color-tint: #e9f4fb;                /* palette.tint — notification bars, tags */
  --color-gradient-start: #cce9f7;      /* palette.gradient_start — brand book light blue */
  --color-gradient: linear-gradient(90deg, var(--color-gradient-start), var(--color-primary));
  --color-overlay: rgb(0 40 76 / 0.42); /* palette.overlay — dialog backdrop (Deep Blue) */

  /* semantic */
  --color-success: oklch(0.52 0.13 150);   /* palette.success — "Disponibile" */
  --color-warning: oklch(0.55 0.13 60);    /* palette.warning — "Scorte ridotte" (text-safe amber) */
  --color-error: oklch(0.53 0.2 28);       /* palette.error — form errors, 422 */
  --color-error-tint: oklch(0.96 0.02 28);

  /* energy label (EU) — step 1 = best class of the scale.
     A+++…D scale: A+++ 1 · A++ 2 · A+ 3 · A 4 · B 5 · C 6 · D 7
     A…G scale:    A 1 · B 2 · C 3 · D 4 · E 5 · F 6 · G 7 */
  --color-energy-1: #00a651;
  --color-energy-2: #50b848;
  --color-energy-3: #bfd730;
  --color-energy-4: #fff200;
  --color-energy-5: #fdb913;
  --color-energy-6: #f37021;
  --color-energy-7: #ed1c24;
  --color-energy-ink-dark: #1a1a1a;     /* on light green / yellow */
  --color-energy-ink-light: #ffffff;

  /* typography (settings.type_body_font / type_heading_font) */
  --font-body--family: "Montserrat", "Noto Sans", system-ui, -apple-system, "Segoe UI", sans-serif;
  --font-heading--family: var(--font-body--family);
  --font-weight-light: 300;
  --font-weight-regular: 400;
  --font-weight-medium: 500;
  --font-weight-semibold: 600;
  /* type scale (≈1.25) */
  --font-size-display: clamp(2.75rem, 5vw, 4.5rem);   /* 44 → 72 */
  --font-size-h1: clamp(2.125rem, 3.6vw, 3rem);       /* 34 → 48 */
  --font-size-h2: clamp(1.625rem, 2.4vw, 2rem);       /* 26 → 32 */
  --font-size-h3: clamp(1.25rem, 1.6vw, 1.5rem);      /* 20 → 24 */
  --font-size-lg: 1.125rem;   /* 18 */
  --font-size-body: 1rem;     /* 16 */
  --font-size-sm: 0.875rem;   /* 14 */
  --font-size-xs: 0.75rem;    /* 12 */
  --line-height-tight: 1.08;
  --line-height-heading: 1.2;
  --line-height-body: 1.6;
  --letter-spacing-display: -0.03em;
  --letter-spacing-heading: -0.02em;
  --letter-spacing-caps: 0.08em;
  --letter-spacing-ui: 0.01em;

  /* spacing (4px base) — settings: section padding ranges */
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-5: 20px;
  --space-6: 24px;
  --space-8: 32px;
  --space-10: 40px;
  --space-12: 48px;
  --space-16: 64px;
  --space-20: 80px;
  --space-section: clamp(72px, 9vw, 136px);  /* section.settings.padding-block */
  --gutter: clamp(20px, 4.2vw, 60px);        /* settings.page_margin */
  --grid-gap: 24px;                          /* settings.grid_gap */

  /* layout (settings.page_width) */
  --page-width: 1320px;
  --page-width-narrow: 880px;
  --page-width-text: 65ch;
  --header-height: 76px;       /* set live by site-header */
  --header-height-compact: 60px;
  --drawer-width: 440px;

  /* radii (settings.button_radius / card_radius / input_radius) */
  --radius-xs: 4px;
  --radius-sm: 8px;
  --radius-md: 12px;
  --radius-tile: 16px;
  --radius-card: 20px;
  --radius-pill: 999px;

  /* shadows — tinted with Deep Blue, never grey-black */
  --shadow-sm: 0 1px 2px rgb(0 40 76 / 0.06), 0 2px 8px -4px rgb(0 40 76 / 0.12);
  --shadow-md: 0 22px 40px -28px rgb(0 40 76 / 0.35);
  --shadow-lg: 0 24px 60px -30px rgb(0 40 76 / 0.45);
  --shadow-drawer: -24px 0 64px -32px rgb(0 40 76 / 0.4);
  --shadow-focus: 0 0 0 2px var(--color-background), 0 0 0 4px var(--color-primary); /* solid 2 px ring, ≥ 3:1 */

  /* z-index */
  --z-base: 1;
  --z-sticky: 50;
  --z-header: 60;
  --z-overlay: 90;   /* dialogs live in the top layer; kept for non-dialog overlays */
  --z-toast: 100;
  --toast-offset: 0px; /* pages with a sticky bottom bar lift toasts by its height */

  /* motion (settings.animations_enabled) */
  --duration-fast: 160ms;
  --duration-base: 280ms;
  --duration-slow: 600ms;
  --duration-reveal: 900ms;
  --ease-out: cubic-bezier(0.2, 0.7, 0.2, 1);
  --ease-in-out: cubic-bezier(0.65, 0, 0.35, 1);
  --ease-spring: cubic-bezier(0.34, 1.4, 0.64, 1);

  /* controls */
  --control-height: 48px;
  --control-height-sm: 40px;
  --control-height-lg: 56px;
  --touch-target: 44px;
}