/* NewsroomIN Design Tokens & Variables */

:root {
  /* Brand Palettes */
  --nrin-navy-950: #070d17;
  --nrin-navy-900: #0b1526;
  --nrin-navy-800: #132238;
  --nrin-navy-700: #1e355b;

  /* Universal Accents */
  --accent-breaking: #dc2626; /* Crimson for Breaking News Badge */
  --accent-breaking-glow: rgba(220, 38, 38, 0.35);

  --brand-accent: #dc2626; /* Dynamic brand accent (RU #dc2626, EN #2563eb, LT #059669) */
  --brand-accent-subtle: rgba(220, 38, 38, 0.1);
  --brand-accent-border: rgba(220, 38, 38, 0.22);
  --brand-badge-bg: var(--nrin-navy-900);

  /* Typography Families */
  --font-display: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
  --font-body: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
  --font-mono: "JetBrains Mono", Consolas, monospace;
  --font-sans: var(--font-body);

  /* Typographical Scale & Tracking Hierarchy */
  --fs-logo: 2.125rem;
  --lh-logo: 1.0;
  --track-logo: -0.04em;

  --fs-hero-lead: 2.25rem;
  --lh-hero-lead: 1.15;
  --track-hero-lead: -0.025em;

  --fs-article-title: 2.5rem;
  --lh-article-title: 1.2;
  --track-article-title: -0.02em;

  --fs-card-headline: 1.125rem;
  --lh-card-headline: 1.35;
  --track-card-headline: -0.015em;

  --fs-widget-title: 0.9375rem;
  --lh-widget-title: 1.2;
  --track-widget-title: 0.05em;

  --fs-category-pill: 0.6875rem;
  --lh-category-pill: 1.0;
  --track-category-pill: 0.06em;

  --fs-body: 1.125rem;
  --lh-body: 1.75;

  --fs-meta: 0.8125rem;
  --lh-meta: 1.4;

  --fs-table-cell: 0.9375rem;
  --lh-table-cell: 1.5;

  /* Elevation & Borders */
  --radius-sm: 4px;
  --radius-md: 8px;
  --radius-lg: 12px;
  --radius-full: 9999px;

  --transition-fast: 0.15s ease;
  --transition-default: 0.25s cubic-bezier(0.4, 0, 0.2, 1);
  --transition-card: transform 0.35s cubic-bezier(0.2, 0, 0.2, 1), box-shadow 0.35s ease, border-color 0.25s ease;

  /* Layout */
  --max-width: 1240px;
  --content-narrow: 760px;
  --sidebar-width: 340px;
  --gap: 2rem;

  /* ========================================================================
     THEME TOKENS: LIGHT MODE (Default)
     ======================================================================== */
  --bg-canvas: #f8fafc;
  --bg-card: #ffffff;
  --bg-card-hover: #f1f5f9;
  --border-subtle: #e2e8f0;
  --border-strong: #cbd5e1;

  --text-title: #0f172a;
  --text-body: #334155;
  --text-muted: #64748b;
  --text-secondary: var(--text-muted);
  --text-inverse: #ffffff;

  --shadow-sm: 0 1px 2px 0 rgba(0, 0, 0, 0.04);
  --shadow-md: 0 4px 6px -1px rgba(15, 23, 42, 0.06), 0 2px 4px -2px rgba(15, 23, 42, 0.03);
  --shadow-lg: 0 10px 20px -3px rgba(15, 23, 42, 0.08), 0 4px 8px -4px rgba(15, 23, 42, 0.04);
  --shadow-hover: 0 14px 28px -4px rgba(15, 23, 42, 0.12), 0 6px 12px -4px rgba(15, 23, 42, 0.05);

  /* Header & Navigation in Light Mode */
  --bg-top-bar: #f8fafc;
  --text-top-bar: #64748b;
  --text-top-bar-hover: #0f172a;
  --border-top-bar: #e2e8f0;

  --brand-header-bg: #ffffff;
  --brand-header-text: #0f172a;
  --brand-header-border: #e2e8f0;
  --brand-header-shadow: 0 1px 4px rgba(0, 0, 0, 0.04);

  --bg-widget-bar: #f1f5f9;
  --border-widget-bar: #e2e8f0;
  --text-widget-time: #0f172a;
  --text-widget-date: #64748b;
  --text-widget-rate: #0f172a;
  --text-widget-symbol: #64748b;

  --bg-lang-nav: #f1f5f9;
  --border-lang-nav: #e2e8f0;
  --text-lang-btn: #64748b;
  --text-lang-btn-hover: #0f172a;

  --bg-nav-primary: #ffffff;
  --bg-nav-primary-stuck: #ffffff;
  --border-nav-primary: #e2e8f0;
  --shadow-nav-stuck: 0 4px 20px rgba(0, 0, 0, 0.07);
  --text-nav-link: #475569;
  --text-nav-link-hover: #0f172a;
  --text-nav-link-active: #0f172a;

  --bg-ticker: #ffffff;
  --border-ticker: #e2e8f0;
  --text-ticker: #1e293b;
  --text-ticker-time: #64748b;

  --bg-footer: #f1f5f9;
  --text-footer: #475569;
  --text-footer-muted: #64748b;
  --border-footer: #e2e8f0;

  --bg-table-th: #f1f5f9;
  --text-table-th: #0f172a;

  /* Modals in Light Mode */
  --bg-modal: #ffffff;
  --bg-modal-overlay: rgba(15, 23, 42, 0.5);
  --border-modal: #e2e8f0;
  --text-modal-title: #0f172a;
  --text-modal-muted: #64748b;
  --bg-modal-header: #f8fafc;
  --border-modal-subtle: #e2e8f0;
  --bg-modal-row-hover: #f1f5f9;
  --bg-modal-card: #f8fafc;
  --border-modal-card: #e2e8f0;
  --text-modal-value: #0f172a;
  --shadow-modal: 0 20px 45px -4px rgba(15, 23, 42, 0.16), 0 0 1px rgba(15, 23, 42, 0.2);
}

/* ==========================================================================
   THEME TOKENS: DARK MODE ([data-theme="dark"])
   ========================================================================== */
[data-theme="dark"] {
  --bg-canvas: #070d17;
  --bg-card: #0d1524;
  --bg-card-hover: #141f34;
  --border-subtle: rgba(255, 255, 255, 0.08);
  --border-strong: rgba(255, 255, 255, 0.18);

  --text-title: #f8fafc;
  --text-body: #cbd5e1;
  --text-muted: #94a3b8;
  --text-secondary: var(--text-muted);
  --text-inverse: #ffffff;

  --shadow-sm: 0 1px 3px rgba(0, 0, 0, 0.5);
  --shadow-md: 0 4px 14px rgba(0, 0, 0, 0.65);
  --shadow-lg: 0 10px 24px rgba(0, 0, 0, 0.75);
  --shadow-hover: 0 14px 28px rgba(0, 0, 0, 0.85);

  /* Header & Navigation in Dark Mode */
  --bg-top-bar: #050a12;
  --text-top-bar: #94a3b8;
  --text-top-bar-hover: #ffffff;
  --border-top-bar: rgba(255, 255, 255, 0.08);

  --brand-header-bg: #070d17;
  --brand-header-text: #ffffff;
  --brand-header-border: rgba(255, 255, 255, 0.08);
  --brand-header-shadow: 0 4px 6px -1px rgba(7, 13, 23, 0.4);

  --bg-widget-bar: #0b111a;
  --border-widget-bar: rgba(255, 255, 255, 0.08);
  --text-widget-time: #ffffff;
  --text-widget-date: #788292;
  --text-widget-rate: #ffffff;
  --text-widget-symbol: #788292;

  --bg-lang-nav: #0b111a;
  --border-lang-nav: rgba(255, 255, 255, 0.08);
  --text-lang-btn: #94a3b8;
  --text-lang-btn-hover: #ffffff;

  --bg-nav-primary: #070d17;
  --bg-nav-primary-stuck: #070d17;
  --border-nav-primary: rgba(255, 255, 255, 0.08);
  --shadow-nav-stuck: 0 4px 20px rgba(0, 0, 0, 0.5);
  --text-nav-link: #94a3b8;
  --text-nav-link-hover: #ffffff;
  --text-nav-link-active: #ffffff;

  --bg-ticker: #070d17;
  --border-ticker: rgba(255, 255, 255, 0.08);
  --text-ticker: #e2e8f0;
  --text-ticker-time: #94a3b8;

  --bg-footer: #070d17;
  --text-footer: #94a3b8;
  --text-footer-muted: #64748b;
  --border-footer: rgba(255, 255, 255, 0.08);

  --bg-table-th: #0b1526;
  --text-table-th: #ffffff;

  /* Modals in Dark Mode */
  --bg-modal: #0d1421;
  --bg-modal-overlay: rgba(4, 7, 13, 0.78);
  --border-modal: rgba(255, 255, 255, 0.12);
  --text-modal-title: #ffffff;
  --text-modal-muted: #788292;
  --bg-modal-header: rgba(255, 255, 255, 0.02);
  --border-modal-subtle: rgba(255, 255, 255, 0.08);
  --bg-modal-row-hover: rgba(255, 255, 255, 0.04);
  --bg-modal-card: rgba(255, 255, 255, 0.03);
  --border-modal-card: rgba(255, 255, 255, 0.1);
  --text-modal-value: #ffffff;
  --shadow-modal: 0 28px 70px rgba(0, 0, 0, 0.85), 0 2px 12px rgba(0, 0, 0, 0.5);
}

/* ==========================================================================
   Multi-Language Regional Accents (RU #dc2626, EN #2563eb, LT #059669)
   ========================================================================== */
:root:lang(en),
html[lang^="en"],
body.lang-en,
body.site-en,
[data-lang="en"] {
  --brand-accent: #2563eb; /* Cobalt Blue for English Edition */
  --brand-accent-subtle: rgba(37, 99, 235, 0.1);
  --brand-accent-border: rgba(37, 99, 235, 0.22);
}

:root:lang(lt),
html[lang^="lt"],
body.lang-lt,
body.site-lt,
[data-lang="lt"] {
  --brand-accent: #059669; /* Emerald Green for Lithuanian Edition */
  --brand-accent-subtle: rgba(5, 150, 105, 0.1);
  --brand-accent-border: rgba(5, 150, 105, 0.22);
}

:root:lang(ru),
html[lang^="ru"],
body.lang-ru,
body.site-ru,
[data-lang="ru"] {
  --brand-accent: #dc2626; /* Crimson Red for Russian Edition */
  --brand-accent-subtle: rgba(220, 38, 38, 0.1);
  --brand-accent-border: rgba(220, 38, 38, 0.22);
}

/* Top Themed Space & Ad Banner Tokens */
:root {
  --top-banner-radius: 8px;
  --top-banner-bg: #ffffff;
  --top-banner-border: #e2e8f0;
  --top-banner-shadow: none;
  --top-banner-label-color: #94a3b8;
  --festive-christmas-bg: linear-gradient(135deg, #7f1d1d 0%, #991b1b 50%, #450a0a 100%);
  --festive-pine-bg: linear-gradient(135deg, #064e3b 0%, #065f46 50%, #022c22 100%);
  --festive-navy-bg: linear-gradient(135deg, #0f172a 0%, #1e293b 50%, #070d17 100%);
  --festive-gold: #fbbf24;
}

[data-theme="dark"] {
  --top-banner-bg: #0d1524;
  --top-banner-border: rgba(255, 255, 255, 0.08);
  --top-banner-shadow: none;
  --top-banner-label-color: #64748b;
}
