/* À Vos Tables — Webfonts
   Display serif: Cormorant Garamond (echoes the engraved serif of the AVT monogram)
   UI / body sans: Manrope (clean, warm, geometric-humanist)
   NOTE: served from Google Fonts. If you need self-hosted binaries, ask the brand owner. */
@import url('https://fonts.googleapis.com/css2?family=Cormorant+Garamond:ital,wght@0,400;0,500;0,600;0,700;1,400;1,500&family=Manrope:wght@400;500;600;700;800&display=swap');

/* ============================================================
   À Vos Tables — Color tokens
   Brand palette sampled from the AVT monogram:
   deep navy ink (#0A172F) + warm brass gold (#B48742),
   set on a warm ivory paper. Premium hospitality.
   ============================================================ */
:root {
  /* ---- Brand: Ink (navy) ---- */
  --ink-900: #0A172F; /* logo navy — deepest */
  --ink-800: #0F1E3A;
  --ink-700: #15294B;
  --ink-600: #1F375E;
  --ink-500: #324A72; /* muted navy */
  --ink-400: #5A6E92;
  --ink-300: #8C9AB6;
  --ink-200: #C2CBDB;
  --ink-100: #E3E8F0;

  /* ---- Brand: Gold (brass) ---- */
  --gold-700: #8A6330; /* engraved / pressed */
  --gold-600: #A1763A;
  --gold-500: #B48742; /* logo gold — primary accent */
  --gold-400: #C6A063;
  --gold-300: #D9BC8B;
  --gold-200: #EAD7B6;
  --gold-100: #F5EBD8;
  --gold-50:  #FBF5EA;

  /* ---- Neutrals: warm ivory paper ---- */
  --paper:    #FBF8F2; /* page background — warm ivory */
  --paper-2:  #F4EDE0; /* alternating section / sunken */
  --paper-3:  #ECE3D2; /* deeper sand */
  --white:    #FFFFFF;
  --cream:    #F6EFDF; /* light mark on dark surfaces */

  /* ---- Warm hairlines & borders ---- */
  --line-soft:   #EBE3D5;
  --line:        #DED4C2;
  --line-strong: #CBBEA6;

  /* ---- Semantic (muted, hospitality-grade) ---- */
  --success-700: #1F5A41;
  --success-500: #2F7D5B; /* table disponible */
  --success-100: #E2F0E8;
  --warning-700: #946616;
  --warning-500: #C0892C; /* attention / en attente */
  --warning-100: #F8EDD6;
  --danger-700:  #8E2F2F;
  --danger-500:  #B23A3A;  /* no-show / annulation */
  --danger-100:  #F6E2E0;
  --info-500:    #324A72;
  --info-100:    #E3E8F0;

  /* ============================================================
     Semantic aliases — reference these in product UI
     ============================================================ */
  /* Surfaces */
  --surface-page:    var(--paper);
  --surface-alt:     var(--paper-2);
  --surface-card:    var(--white);
  --surface-sunken:  var(--paper-3);
  --surface-ink:     var(--ink-900);   /* dark sections / footer */
  --surface-ink-2:   var(--ink-800);

  /* Text */
  --text-strong:   var(--ink-900);
  --text-body:     var(--ink-700);
  --text-muted:    var(--ink-400);
  --text-subtle:   var(--ink-300);
  --text-on-ink:   #EDE7DB;          /* body text on navy */
  --text-on-ink-muted: #9AA7BC;
  --text-gold:     var(--gold-600);
  --text-on-gold:  var(--ink-900);

  /* Accent */
  --accent:        var(--gold-500);
  --accent-hover:  var(--gold-600);
  --accent-press:  var(--gold-700);
  --accent-soft:   var(--gold-100);

  /* Borders */
  --border-card:   var(--line);
  --border-input:  var(--line-strong);
  --border-focus:  var(--gold-500);

  /* Status */
  --status-available: var(--success-500);
  --status-pending:   var(--warning-500);
  --status-taken:     var(--ink-300);
  --status-noshow:    var(--danger-500);

  /* Focus ring */
  --ring: 0 0 0 3px rgba(180, 135, 66, 0.30);
  --ring-ink: 0 0 0 3px rgba(50, 74, 114, 0.28);
}

/* ============================================================
   À Vos Tables — Typography tokens
   Cormorant Garamond (display serif) + Manrope (UI sans)
   ============================================================ */
:root {
  /* Families */
  --font-display: 'Cormorant Garamond', 'Times New Roman', serif;
  --font-sans: 'Manrope', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  --font-mono: 'SFMono-Regular', ui-monospace, 'Menlo', 'Consolas', monospace;

  /* Weights */
  --fw-regular: 400; /* @kind other */
  --fw-medium: 500; /* @kind other */
  --fw-semibold: 600; /* @kind other */
  --fw-bold: 700; /* @kind other */
  --fw-extrabold: 800; /* @kind other */

  /* Type scale (16px root) */
  --text-xs:   0.75rem;   /* 12 */
  --text-sm:   0.8125rem; /* 13 */
  --text-base: 0.9375rem; /* 15 — UI default */
  --text-md:   1rem;      /* 16 */
  --text-lg:   1.125rem;  /* 18 */
  --text-xl:   1.375rem;  /* 22 */
  --text-2xl:  1.75rem;   /* 28 */
  --text-3xl:  2.25rem;   /* 36 */
  --text-4xl:  3rem;      /* 48 */
  --text-5xl:  4rem;      /* 64 */
  --text-6xl:  5.25rem;   /* 84 */
  --text-display: clamp(2.75rem, 6vw, 5.25rem);

  /* Line heights */
  --leading-tight: 1.05;
  --leading-snug: 1.18;
  --leading-normal: 1.5;
  --leading-relaxed: 1.65;

  /* Letter spacing */
  --tracking-tighter: -0.03em;
  --tracking-tight: -0.015em;
  --tracking-normal: 0;
  --tracking-wide: 0.04em;
  --tracking-wider: 0.12em;   /* eyebrows / overlines */
  --tracking-widest: 0.22em;  /* logo-style spaced caps */

  /* ---- Semantic text roles ---- */
  --display-font: var(--font-display);
  --display-weight: var(--fw-semibold);
  --display-leading: var(--leading-tight);
  --display-tracking: var(--tracking-tight);

  --heading-font: var(--font-sans);
  --heading-weight: var(--fw-bold);
  --heading-leading: var(--leading-snug);

  --body-font: var(--font-sans);
  --body-weight: var(--fw-regular);
  --body-leading: var(--leading-relaxed);

  --eyebrow-font: var(--font-sans);
  --eyebrow-weight: var(--fw-semibold);
  --eyebrow-tracking: var(--tracking-wider);
  --eyebrow-size: var(--text-sm);
}

/* ============================================================
   À Vos Tables — Spacing, radii, shadows, borders, motion
   ============================================================ */
:root {
  /* Spacing scale (4px base) */
  --space-0: 0;
  --space-1: 0.25rem;  /* 4 */
  --space-2: 0.5rem;   /* 8 */
  --space-3: 0.75rem;  /* 12 */
  --space-4: 1rem;     /* 16 */
  --space-5: 1.5rem;   /* 24 */
  --space-6: 2rem;     /* 32 */
  --space-7: 2.5rem;   /* 40 */
  --space-8: 3rem;     /* 48 */
  --space-9: 4rem;     /* 64 */
  --space-10: 5rem;    /* 80 */
  --space-11: 6rem;    /* 96 */
  --space-12: 8rem;    /* 128 */

  /* Layout */
  --container-max: 1200px;
  --container-wide: 1320px;
  --container-text: 680px;
  --gutter: clamp(1.25rem, 4vw, 3rem); /* @kind spacing */
  --section-y: clamp(4rem, 9vw, 8rem); /* @kind spacing */

  /* Radii — soft, premium (not pill-everything) */
  --radius-xs: 4px;
  --radius-sm: 8px;
  --radius-md: 12px;   /* inputs, buttons */
  --radius-lg: 18px;   /* cards */
  --radius-xl: 26px;   /* feature panels */
  --radius-2xl: 36px;
  --radius-pill: 999px;

  /* Borders */
  --border-hairline: 1px solid var(--line-soft);
  --border-thin: 1px solid var(--line);
  --border-strong: 1px solid var(--line-strong);

  /* Shadows — soft, warm navy-tinted, low contrast */
  --shadow-xs: 0 1px 2px rgba(10, 23, 47, 0.05);
  --shadow-sm: 0 2px 8px rgba(10, 23, 47, 0.06);
  --shadow-md: 0 10px 28px -10px rgba(10, 23, 47, 0.14);
  --shadow-lg: 0 26px 60px -22px rgba(10, 23, 47, 0.22);
  --shadow-gold: 0 14px 34px -14px rgba(138, 99, 48, 0.42);
  --shadow-inset: inset 0 1px 0 rgba(255, 255, 255, 0.6);

  /* Motion — calm, refined, no bounce */
  --ease-out: cubic-bezier(0.22, 0.61, 0.36, 1); /* @kind other */
  --ease-in-out: cubic-bezier(0.65, 0.05, 0.36, 1); /* @kind other */
  --dur-fast: 140ms; /* @kind other */
  --dur: 240ms; /* @kind other */
  --dur-slow: 420ms; /* @kind other */

  /* Z-index */
  --z-base: 1; /* @kind other */
  --z-sticky: 100; /* @kind other */
  --z-overlay: 800; /* @kind other */
  --z-modal: 900; /* @kind other */
  --z-toast: 1000; /* @kind other */
}