/**
 * TeluguName.com — Luxury Editorial Theme Tokens
 * High-contrast, warm heritage light mode + deep obsidian/gold dark mode.
 */

/* ==========================================================================
   Base Tokens & Typography Scale
   ========================================================================== */
:root {
  --font-serif: 'Cinzel', 'Playfair Display', Georgia, serif;
  --font-sans: 'Plus Jakarta Sans', system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
  --font-telugu: 'Noto Sans Telugu', 'Gautami', 'Vani', sans-serif;

  --text-2xs:  0.6875rem; /* 11px */
  --text-xs:   0.75rem;   /* 12px */
  --text-sm:   0.875rem;  /* 14px */
  --text-base: 1rem;      /* 16px */
  --text-lg:   1.125rem;  /* 18px */
  --text-xl:   1.25rem;   /* 20px */
  --text-2xl:  1.5rem;    /* 24px */
  --text-3xl:  1.875rem;  /* 30px */
  --text-4xl:  2.375rem;  /* 38px */
  --text-5xl:  3.125rem;  /* 50px */

  --leading-tight:   1.15;
  --leading-snug:    1.3;
  --leading-normal:  1.6;
  --leading-relaxed: 1.75;

  --space-1:  0.25rem;
  --space-2:  0.5rem;
  --space-3:  0.75rem;
  --space-4:  1rem;
  --space-5:  1.25rem;
  --space-6:  1.5rem;
  --space-8:  2rem;
  --space-10: 2.5rem;
  --space-12: 3rem;
  --space-16: 4rem;
  --space-20: 5rem;

  --radius-sm:   0.375rem;
  --radius-md:   0.625rem;
  --radius-lg:   1rem;
  --radius-xl:   1.375rem;
  --radius-full: 9999px;

  --container-max-w: 74rem; /* 1184px */

  --transition-fast: 160ms cubic-bezier(0.4, 0, 0.2, 1);
  --transition-base: 260ms cubic-bezier(0.4, 0, 0.2, 1);
  --transition-slow: 400ms cubic-bezier(0.16, 1, 0.3, 1);
}

/* ==========================================================================
   Light Mode (Warm Heritage Luxury)
   Parchment canvas, crisp espresso typography, royal vermilion & brass gold
   ========================================================================== */
:root,
[data-theme="light"] {
  --color-bg-base:        #faf8f5;
  --color-bg-surface:     #ffffff;
  --color-bg-subtle:      #f3eee7;
  --color-bg-card:        #ffffff;
  --color-bg-overlay:     rgba(24, 19, 16, 0.55);

  --color-text-main:      #181310;
  --color-text-muted:     #5e544c;
  --color-text-faint:     #968a7f;
  --color-text-inverse:   #faf8f5;

  --color-border-subtle:  rgba(140, 110, 80, 0.15);
  --color-border-strong:  rgba(140, 110, 80, 0.35);

  --color-primary:        #b33927; /* Imperial Vermilion */
  --color-primary-hover:  #942d1e;
  --color-primary-subtle: rgba(179, 57, 39, 0.08);
  --color-primary-contrast: #ffffff;

  --color-gold:           #c69238; /* Andhra Brass / Gold */
  --color-gold-hover:     #ab7a28;
  --color-gold-subtle:    rgba(198, 146, 56, 0.12);

  --color-accent-teal:    #1c6b61;
  --color-accent-teal-bg: rgba(28, 107, 97, 0.09);

  --color-focus-ring:     rgba(179, 57, 39, 0.4);

  --shadow-sm: 0 1px 2px rgba(24, 19, 16, 0.04);
  --shadow-md: 0 6px 18px -4px rgba(24, 19, 16, 0.06), 0 2px 6px -2px rgba(24, 19, 16, 0.04);
  --shadow-lg: 0 16px 36px -8px rgba(24, 19, 16, 0.09), 0 6px 12px -4px rgba(24, 19, 16, 0.04);
  --shadow-glow: 0 0 30px rgba(198, 146, 56, 0.15);

  --glass-bg: rgba(255, 255, 255, 0.88);
  --glass-border: rgba(140, 110, 80, 0.18);
}

/* ==========================================================================
   Dark Mode (Regal Obsidian & Gold)
   Deep dark canvas, velvet cards, amber glows, high-contrast readable type
   ========================================================================== */
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    --color-bg-base:        #0b0d10;
    --color-bg-surface:     #13171d;
    --color-bg-subtle:      #191e26;
    --color-bg-card:        #141921;
    --color-bg-overlay:     rgba(0, 0, 0, 0.78);

    --color-text-main:      #f5ede2;
    --color-text-muted:     #b0a598;
    --color-text-faint:     #6f665b;
    --color-text-inverse:   #0b0d10;

    --color-border-subtle:  rgba(220, 195, 165, 0.12);
    --color-border-strong:  rgba(220, 195, 165, 0.28);

    --color-primary:        #e05742;
    --color-primary-hover:  #ec6b57;
    --color-primary-subtle: rgba(224, 87, 66, 0.16);
    --color-primary-contrast: #0b0d10;

    --color-gold:           #e2b45f;
    --color-gold-hover:     #edd088;
    --color-gold-subtle:    rgba(226, 180, 95, 0.15);

    --color-accent-teal:    #4ec2b2;
    --color-accent-teal-bg: rgba(78, 194, 178, 0.14);

    --color-focus-ring:     rgba(226, 180, 95, 0.45);

    --shadow-sm: 0 1px 2px rgba(0, 0, 0, 0.5);
    --shadow-md: 0 6px 18px -4px rgba(0, 0, 0, 0.65), 0 2px 6px -2px rgba(0, 0, 0, 0.4);
    --shadow-lg: 0 18px 40px -8px rgba(0, 0, 0, 0.85);
    --shadow-glow: 0 0 35px rgba(226, 180, 95, 0.12);

    --glass-bg: rgba(19, 23, 29, 0.88);
    --glass-border: rgba(220, 195, 165, 0.16);
  }
}

[data-theme="dark"] {
  --color-bg-base:        #0b0d10;
  --color-bg-surface:     #13171d;
  --color-bg-subtle:      #191e26;
  --color-bg-card:        #141921;
  --color-bg-overlay:     rgba(0, 0, 0, 0.78);

  --color-text-main:      #f5ede2;
  --color-text-muted:     #b0a598;
  --color-text-faint:     #6f665b;
  --color-text-inverse:   #0b0d10;

  --color-border-subtle:  rgba(220, 195, 165, 0.12);
  --color-border-strong:  rgba(220, 195, 165, 0.28);

  --color-primary:        #e05742;
  --color-primary-hover:  #ec6b57;
  --color-primary-subtle: rgba(224, 87, 66, 0.16);
  --color-primary-contrast: #0b0d10;

  --color-gold:           #e2b45f;
  --color-gold-hover:     #edd088;
  --color-gold-subtle:    rgba(226, 180, 95, 0.15);

  --color-accent-teal:    #4ec2b2;
  --color-accent-teal-bg: rgba(78, 194, 178, 0.14);

  --color-focus-ring:     rgba(226, 180, 95, 0.45);

  --shadow-sm: 0 1px 2px rgba(0, 0, 0, 0.5);
  --shadow-md: 0 6px 18px -4px rgba(0, 0, 0, 0.65), 0 2px 6px -2px rgba(0, 0, 0, 0.4);
  --shadow-lg: 0 18px 40px -8px rgba(0, 0, 0, 0.85);
  --shadow-glow: 0 0 35px rgba(226, 180, 95, 0.12);

  --glass-bg: rgba(19, 23, 29, 0.88);
  --glass-border: rgba(220, 195, 165, 0.16);
}