/**
 * assets/css/core/_variables.css
 * DropX Prime System - Globális CSS Változók és Tipográfia
 *
 * Tartalom:
 * 1. Tipográfiai fontcsalád szabályok (Rajdhani, Chakra Petch, JetBrains Mono)
 * 2. Dark téma (alapértelmezett) változói és fényeffektjei
 * 3. Light téma felülírásai
 */

/* ==========================================================================
   1. TIPOGRÁFIA ÉS BETŰTÍPUSOK
   ========================================================================== */

/* Globális alapértelmezett betűtípus: Rajdhani */
*, 
*::before, 
*::after, 
html, 
body, 
input, 
textarea, 
button, 
select, 
a, 
span, 
div, 
p, 
li, 
ul, 
ol, 
th, 
td {
    font-family: 'Rajdhani', sans-serif;
}

/* High-tech fejlécek, logó és modul címkék fontja: Chakra Petch */
.font-chakra-petch,
.logo-main,
.logo-main span,
h1, h2, h3, h4,
.dropdown-header h3,
#lightbox-counter,
.service-tag {
    font-family: 'Chakra Petch', sans-serif;
}

/* Monospace font kódokhoz, számlálókhoz és lábléchez: JetBrains Mono */
.logo-glitch,
#datetime-display,
.typewriter-text,
.footer-grid {
    font-family: 'JetBrains Mono', monospace;
}

/* ==========================================================================
   2. DARK TÉMA VÁLTOZÓK (ALAPÉRTELMEZETT MELEG SÖTÉT TÓNUS)
   ========================================================================== */
:root {
    /* Háttér és üveghatás színek */
    --color-bg-deep: #0a0807; 
    --color-glass-main: rgba(24, 20, 18, 0.85);
    --color-glass-card: rgba(35, 30, 26, 0.75); 

    /* Kiemelő arany és ezüst tónusok */
    --color-gold: #e59e00; 
    --color-gold-glow: rgba(229, 158, 0, 0.5); 
    --color-silver: #c5bdbc; 

    /* Szövegszínek */
    --text-light: #ffffff; 
    --text-muted: #aba29a; 

    /* Keretek és elválasztók */
    --color-border-gold: rgba(229, 158, 0, 0.45); 
    --color-border-subtle: rgba(255, 255, 255, 0.08); 

    /* Navigációs méretek */
    --app-nav-height-desktop: 60px; 
    --app-nav-height-mobile: 55px; 

    /* Rendszer hátterek */
    --bg-gradient: radial-gradient(circle at top center, #1e1915 0%, var(--color-bg-deep) 100%);
    --grid-color: rgba(229, 158, 0, 0.025);
}

/* ==========================================================================
   3. LIGHT TÉMA VÁLTOZÓK FELÜLÍRÁSA
   ========================================================================== */
body.light-mode {
    --color-bg-deep: #ded7ce; 
    --color-glass-main: rgba(248, 245, 240, 0.9); 
    --color-glass-card: rgba(238, 234, 227, 0.85); 
    --color-gold: #b36b00; 
    --color-gold-glow: rgba(179, 107, 0, 0.25); 
    --color-silver: #5c554d; 
    --text-light: #2c2825; 
    --text-muted: #786f65; 
    --color-border-gold: rgba(179, 107, 0, 0.4); 
    --color-border-subtle: rgba(100, 90, 80, 0.12); 
    --bg-gradient: radial-gradient(circle at top center, #fbfaf8 0%, var(--color-bg-deep) 100%);
    --grid-color: rgba(100, 90, 80, 0.06);
}

/* ==========================================================================
   DROPX PREMIUM DESIGN TOKENS — V6
   Palette: BLACK / GRAPHITE / SILVER / GOLD
   ========================================================================== */
:root {
    --dx-black: #050607;
    --dx-black-2: #080a0d;
    --dx-graphite: #0f1216;
    --dx-graphite-2: #15191e;
    --dx-surface: #1a1f25;
    --dx-surface-soft: #20262d;

    --dx-silver: #bfc6ce;
    --dx-silver-hi: #eef2f5;
    --dx-silver-dim: #78828d;

    --dx-gold: #d6a52b;
    --dx-gold-hi: #f2ca63;
    --dx-gold-soft: rgba(214,165,43,.16);
    --dx-gold-glow: rgba(214,165,43,.22);

    --dx-line: rgba(191,198,206,.14);
    --dx-line-soft: rgba(191,198,206,.07);
    --dx-line-focus: rgba(214,165,43,.42);

    --dx-radius-xl: 14px;
    --dx-radius-lg: 11px;
    --dx-radius-md: 8px;
    --dx-radius-sm: 6px;

    --dx-shadow-card: 0 18px 42px rgba(0,0,0,.36);
    --dx-shadow-hover: 0 24px 58px rgba(0,0,0,.44);

    --dx-bg:
        radial-gradient(ellipse 70% 35% at 50% -8%, rgba(214,165,43,.065), transparent 70%),
        linear-gradient(180deg, #090b0e 0%, #050607 100%);
}

body.light-mode {
    --dx-black: #eef1f4;
    --dx-black-2: #f5f7f8;
    --dx-graphite: #ffffff;
    --dx-graphite-2: #e7ebee;
    --dx-surface: #f8fafb;
    --dx-surface-soft: #e1e6ea;

    --dx-silver: #59636d;
    --dx-silver-hi: #20272e;
    --dx-silver-dim: #77818b;

    --dx-gold: #a87512;
    --dx-gold-hi: #c58d1d;
    --dx-gold-soft: rgba(168,117,18,.10);
    --dx-gold-glow: rgba(168,117,18,.14);

    --dx-line: rgba(57,68,78,.15);
    --dx-line-soft: rgba(57,68,78,.08);
    --dx-line-focus: rgba(168,117,18,.34);

    --dx-bg:
        radial-gradient(ellipse 70% 35% at 50% -8%, rgba(168,117,18,.055), transparent 70%),
        linear-gradient(180deg, #eef1f4 0%, #e4e8eb 100%);
}