/* BROS Hospitality — design tokens.
   Tema light su bianco, superfici calde, inchiostro freddo del brand (#30313B), accento bronzo.
   Tutto il resto del CSS usa SOLO queste variabili: per cambiare faccia al portale si tocca qui. */

@font-face {
  font-family: "Inter";
  src: url("../fonts/inter-var.woff2") format("woff2");
  font-weight: 100 900;
  font-display: swap;
}
@font-face {
  font-family: "Cormorant Garamond";
  src: url("../fonts/cormorant-garamond-500.woff2") format("woff2");
  font-weight: 500;
  font-display: swap;
}
@font-face {
  font-family: "Cormorant Garamond";
  src: url("../fonts/cormorant-garamond-600.woff2") format("woff2");
  font-weight: 600;
  font-display: swap;
}

:root {
  /* colore */
  --bg: #ffffff;
  --surface: #fbf9f4;
  --surface-2: #f4f0e8;
  --line: #e9e4da;
  --line-strong: #d8d1c3;
  --ink: #26272f;
  --ink-2: #5d5c63;
  --ink-3: #8c8a8d;
  --accent: #9a7b4f;
  --accent-strong: #7d6139;      /* testo e bottoni: contrasto AA su bianco */
  --accent-soft: #f5efe4;
  --gold: #c2a36b;               /* solo decorativo */
  --ok: #3f7d58;      --ok-soft: #e8f2ec;
  --warn: #a96f14;    --warn-soft: #fbf1df;
  --danger: #b3412e;  --danger-soft: #f9e9e6;
  --info: #3e6a8a;    --info-soft: #e7eff5;
  --struttura: var(--accent);    /* colore della struttura corrente: lo imposta app.js */

  /* tipografia */
  --font-serif: "Cormorant Garamond", "Iowan Old Style", Georgia, serif;
  --font-sans: "Inter", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  --fs-xs: .75rem;
  --fs-sm: .8125rem;
  --fs-md: .9375rem;
  --fs-lg: 1.0625rem;
  --fs-xl: clamp(1.375rem, 1.2rem + .8vw, 1.625rem);
  --fs-display: clamp(2.125rem, 1.8rem + 1.6vw, 2.75rem);

  /* spazio: scala da 4px */
  --s-1: .25rem; --s-2: .5rem; --s-3: .75rem; --s-4: 1rem;
  --s-5: 1.25rem; --s-6: 1.5rem; --s-7: 2rem; --s-8: 3rem;

  /* forma */
  --r-sm: 8px; --r-md: 14px; --r-lg: 22px; --r-sheet: 26px; --r-pill: 999px;
  --shadow-1: 0 1px 2px rgba(38, 39, 47, .05);
  --shadow-2: 0 4px 16px -4px rgba(38, 39, 47, .10), 0 1px 3px rgba(38, 39, 47, .05);
  --shadow-3: 0 24px 60px -12px rgba(38, 39, 47, .28);

  /* struttura della pagina */
  --topbar-h: 56px;
  --tabbar-h: 62px;
  --sidebar-w: 268px;
  --content-max: 1180px;
  --safe-t: env(safe-area-inset-top, 0px);
  --safe-b: env(safe-area-inset-bottom, 0px);

  --z-topbar: 20; --z-tabbar: 30; --z-sidebar: 25; --z-sheet: 60; --z-toast: 80;
  --ease: cubic-bezier(.2, .8, .2, 1);
}