/* ==========================================================================
   Grada Nuevo 2026 — Design tokens

   Χρήση:  <html data-theme="light"> ή "dark" (ορίζεται στο App.razor / appsettings FrontTheme)
   Τα ονόματα μεταβλητών είναι ΣΥΜΒΑΤΑ με το :root του
   wwwroot/frontUI/css/gradanuevo.css (--bg, --text-primary, --accent,
   --navy, --font-head, --font-body ...). Φόρτωσέ το ΜΕΤΑ το gradanuevo.css
   για να κάνει override χωρίς αλλαγή στα υπάρχοντα selectors.
   Νέες μεταβλητές: --surface-*, --on-dark, --step-*, --space-*, --dur-*, --ease-*.
   ========================================================================== */

:root {
    /* ---- Typographic scale (fluid, 360px → 1440px) ---- */
    --step--1: clamp(0.83rem, 0.80rem + 0.15vw, 0.94rem);
    --step-0:  clamp(1.00rem, 0.95rem + 0.25vw, 1.13rem);
    --step-1:  clamp(1.25rem, 1.15rem + 0.50vw, 1.60rem);
    --step-2:  clamp(1.56rem, 1.35rem + 1.00vw, 2.25rem);
    --step-3:  clamp(1.95rem, 1.55rem + 2.00vw, 3.40rem);
    --step-4:  clamp(2.44rem, 1.70rem + 3.60vw, 5.20rem);
    --step-5:  clamp(3.05rem, 1.80rem + 6.00vw, 7.50rem);
    --tracking-caps: 0.18em;
    --leading-tight: 1.05;
    --leading-body: 1.65;
    --measure: 62ch;

    /* ---- Space ---- */
    --space-1: 0.25rem; --space-2: 0.5rem; --space-3: 0.75rem; --space-4: 1rem;
    --space-6: 1.5rem;  --space-8: 2rem;   --space-12: 3rem;   --space-16: 4rem;
    --space-section: clamp(4rem, 3rem + 6vw, 9rem);
    --gutter: clamp(1rem, 0.5rem + 2.5vw, 3rem);
    --container: 1280px;

    /* ---- Shape ---- */
    --radius: 2px;
    --radius-sm: 0px;
    --hairline: 1px solid var(--border);

    /* ---- Motion (το motion.js διαβάζει αυτές τις τιμές) ---- */
    --dur-fast: 180ms;
    --dur-base: 600ms;
    --dur-slow: 1100ms;
    --ease-out: cubic-bezier(0.16, 1, 0.3, 1);      /* expo-out */
    --ease-in-out: cubic-bezier(0.65, 0, 0.35, 1);
    --reveal-distance: 20px;
    --parallax-max: 0.10;                           /* ≤10% */
    --font-head: 'EB Garamond', 'Georgia', serif;
    --font-body: 'Inter', 'Segoe UI', sans-serif;
}

@media (prefers-reduced-motion: reduce) {
    :root { --dur-fast: 0ms; --dur-base: 0ms; --dur-slow: 0ms; --reveal-distance: 0px; }
}

/* ==========================================================================
   Header / menu variables — default = dark navy (theme A)
   ========================================================================== */
:root {
    --header-bg: rgba(0, 0, 0, 0.35);
    --header-bg-scrolled: rgba(0, 0, 0, 0.96);
    --header-border-scrolled: rgba(176, 141, 87, 0.35);
    --header-fg: #f5efe3;
    --header-fg-scrolled: #f5efe3;
    --header-menu-bg: rgba(0, 0, 0, 0.98);
    --header-menu-fg: #f5efe3;
}
.top-bar-logo.logo-on-light { display: none; }

/* ==========================================================================
   LIGHT · Φωτεινό (cream + χρυσό) — συνέχεια του legacy gradanuevo.gr
   Ενεργοποίηση: appsettings "FrontTheme": "light"  ή  ?theme=light
   ========================================================================== */
[data-theme="light"] {
    --navy: #232323;
    --navy-light: #3a3a3a;
    --bg: #FAF7F2;
    --bg-alt: #F1EBE1;
    --bg-card: #FFFFFF;
    --bg-card-hover: #F8F3EA;
    --bg-surface: #EDE6DA;
    --surface-dark: #232323;
    --surface-dark-2: #2E2E2E;
    --text-primary: #232323;
    --text-secondary: #3F3F3F;
    --text-muted: #6B6B6B;
    --on-dark: #F1ECE3;
    --on-dark-muted: #B5B0A6;
    --border: #E4DCCD;
    --border-hover: #CDB27E;
    --accent: #B8893F;
    --accent-light: #D9B26E;
    --accent-dark: #8A6420;
    --accent-soft: rgba(184, 137, 63, 0.10);
    --accent-glow: rgba(184, 137, 63, 0.18);
    --sea: #8A8A82;
    --font-head: 'EB Garamond', 'Georgia', serif;
    --font-body: 'Inter', 'Segoe UI', sans-serif;
    --head-weight: 400;

    --header-bg: rgba(0, 0, 0, 0.18);
    --header-bg-scrolled: rgba(255, 255, 255, 0.97);
    --header-border-scrolled: #E4DCCD;
    --header-fg: #FFFFFF;
    --header-fg-scrolled: #232323;
    --header-menu-bg: rgba(255, 255, 255, 0.99);
    --header-menu-fg: #232323;
}
[data-theme="light"] .top-bar.scrolled .logo-on-dark,
[data-theme="light"] .top-bar.menu-open .logo-on-dark { display: none; }
[data-theme="light"] .top-bar.scrolled .logo-on-light,
[data-theme="light"] .top-bar.menu-open .logo-on-light { display: block; }
[data-theme="light"] .top-bar.menu-open { background: var(--header-bg-scrolled); }
[data-theme="light"] .top-bar.scrolled { box-shadow: 0 1px 12px rgba(0, 0, 0, 0.06); }
[data-theme="light"] .site-footer-logo { opacity: 1; }


/* ==========================================================================
   DARK · Μαύρο + ζεστός χρυσός (κύριο θέμα του 2026)
   Ενεργοποίηση: appsettings "FrontTheme": "dark"  ή  ?theme=dark
   ========================================================================== */
[data-theme="dark"] {
    --navy: #000000;
    --navy-light: #141414;
    --bg: #050505;
    --bg-alt: #0D0D0D;
    --bg-card: #121212;
    --bg-card-hover: #1A1A1A;
    --bg-surface: #161616;
    --surface-dark: #000000;
    --surface-dark-2: #111111;
    --text-primary: #EFEAE0;
    --text-secondary: #CFC9BD;
    --text-muted: #A09A8E;
    --on-dark: #EFEAE0;
    --on-dark-muted: #A09A8E;
    --border: #2A2A2A;
    --border-hover: #8C7240;
    --accent: #C9A45C;
    --accent-light: #E2C284;
    --accent-dark: #A8873F;
    --accent-soft: rgba(201, 164, 92, 0.10);
    --accent-glow: rgba(201, 164, 92, 0.18);
    --sea: #8A8A82;
    --head-weight: 400;

    --header-bg: rgba(0, 0, 0, 0.35);
    --header-bg-scrolled: rgba(0, 0, 0, 0.96);
    --header-border-scrolled: rgba(201, 164, 92, 0.30);
    --header-fg: #EFEAE0;
    --header-fg-scrolled: #EFEAE0;
    --header-menu-bg: rgba(0, 0, 0, 0.98);
    --header-menu-fg: #EFEAE0;
}