/*
 * themes/themes.css
 * Tema se alege prin atributul data-theme pe <html>: "light" sau "dark".
 * Ambele teme definesc același set de variabile, ca nicio culoare să nu lipsească.
 *
 * Sistem de fundal: un singur strat (body::before, în base.css).
 *   - light: pattern hexagonal desenat în CSS (--bg-pattern), estompat radial
 *   - dark:  același pattern, cu linii albastru deschis
 */

/* ---------- Light (implicit) ---------- */
:root,
:root[data-theme="light"] {
  color-scheme: light;

  /* Suprafețe și text */
  --bg-color: #f6f8fb;
  --surface-color: #ffffff;
  --surface-2-color: #eef3f9;
  --text-color: #0f172a;
  --muted-text-color: #526176;
  --border-color: #e2e8f0;
  --border-strong-color: #cbd5e1;

  /* Brand */
  --primary-color: #0b6fd1;          /* albastrul din logo */
  --primary-hover-color: #0a5db0;
  --primary-soft-color: #e4effb;     /* fundal pentru chip-uri / iconițe */
  --secondary-color: #f97316;        /* portocaliul nucleului din logo */
  --accent-color: #0b6fd1;

  --header-bg-color: rgba(255, 255, 255, 0.82);
  --footer-bg-color: transparent;

  --link-color: #0b6fd1;
  --link-hover-color: #0a5db0;

  --logoline1-color: #e62e2e;
  --logoline2-color: #0781d8;

  /* Carduri: umbră neutră, bordură fină, accent doar la hover */
  --card-bg-color: var(--surface-color);
  --card-text-color: var(--text-color);
  --card-border-color: var(--border-color);
  --card-hover-bg-color: var(--surface-color);
  --card-hover-text-color: var(--text-color);
  --card-hover-border-color: #b9d4f3;
  --shadow-sm: 0 1px 2px rgba(15, 23, 42, 0.05), 0 1px 1px rgba(15, 23, 42, 0.04);
  --shadow-md: 0 1px 2px rgba(15, 23, 42, 0.05), 0 12px 32px -16px rgba(15, 23, 42, 0.22);
  --shadow-lg: 0 24px 60px -24px rgba(15, 23, 42, 0.35);

  --button-bg-color: var(--primary-color);
  --button-text-color: #ffffff;
  --button-border-color: var(--primary-color);
  --button-hover-bg-color: var(--primary-hover-color);
  --button-hover-border-color: var(--primary-hover-color);

  --focus-ring-color: rgba(11, 111, 209, 0.35);

  /* Fundal: pattern hexagonal, linii albastre la ~7% opacitate */
  --bg-pattern: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='28' height='49' viewBox='0 0 28 49'%3E%3Cpath fill='%230b6fd1' fill-opacity='0.06' d='M13.99 9.25l13 7.5v15l-13 7.5L1 31.75v-15l12.99-7.5zM3 17.9v12.7l10.99 6.34 11-6.35V17.9l-11-6.34L3 17.9zM0 15l12.98-7.5V0h-2v6.35L0 12.69v2.3zm0 18.5L12.98 41v8h-2v-6.85L0 35.81v-2.3zM15 0v7.5L27.99 15H28v-2.31h-.01L17 6.35V0h-2zm0 49v-8l12.99-7.5H28v2.31h-.01L17 42.15V49h-2z'/%3E%3C/svg%3E");
  --bg-pattern-size: 56px 98px;
  --bg-glow: radial-gradient(ellipse 70% 45% at 50% -5%, rgba(11, 111, 209, 0.14), transparent 70%);
}

/* ---------- Dark ---------- */
:root[data-theme="dark"] {
  color-scheme: dark;

  --bg-color: #0b1120;
  --surface-color: #121a2d;
  --surface-2-color: #182238;
  --text-color: #e6ebf2;
  --muted-text-color: #9aa7bb;
  --border-color: #233049;
  --border-strong-color: #34435f;

  --primary-color: #3b8bf0;
  --primary-hover-color: #5aa0f5;
  --primary-soft-color: rgba(59, 139, 240, 0.14);
  --secondary-color: #fb923c;
  --accent-color: #3b8bf0;

  --header-bg-color: rgba(11, 17, 32, 0.78);
  --footer-bg-color: transparent;

  --link-color: #6fb0ff;
  --link-hover-color: #9cc8ff;

  --logoline1-color: #ff4d4d;
  --logoline2-color: #3b9bf0;

  --card-bg-color: var(--surface-color);
  --card-text-color: var(--text-color);
  --card-border-color: var(--border-color);
  --card-hover-bg-color: #15203a;
  --card-hover-text-color: var(--text-color);
  --card-hover-border-color: #3a5a8c;
  --shadow-sm: 0 1px 2px rgba(0, 0, 0, 0.3);
  --shadow-md: 0 1px 2px rgba(0, 0, 0, 0.3), 0 16px 40px -20px rgba(0, 0, 0, 0.7);
  --shadow-lg: 0 24px 60px -24px rgba(0, 0, 0, 0.8);

  --button-bg-color: var(--primary-color);
  --button-text-color: #ffffff;
  --button-border-color: var(--primary-color);
  --button-hover-bg-color: var(--primary-hover-color);
  --button-hover-border-color: var(--primary-hover-color);

  --focus-ring-color: rgba(111, 176, 255, 0.45);

  /* Fundal: același pattern hexagonal, linii albastru deschis la ~9% opacitate */
  --bg-pattern: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='28' height='49' viewBox='0 0 28 49'%3E%3Cpath fill='%236fb0ff' fill-opacity='0.09' d='M13.99 9.25l13 7.5v15l-13 7.5L1 31.75v-15l12.99-7.5zM3 17.9v12.7l10.99 6.34 11-6.35V17.9l-11-6.34L3 17.9zM0 15l12.98-7.5V0h-2v6.35L0 12.69v2.3zm0 18.5L12.98 41v8h-2v-6.85L0 35.81v-2.3zM15 0v7.5L27.99 15H28v-2.31h-.01L17 6.35V0h-2zm0 49v-8l12.99-7.5H28v2.31h-.01L17 42.15V49h-2z'/%3E%3C/svg%3E");
  --bg-pattern-size: 56px 98px;
  --bg-glow: radial-gradient(ellipse 70% 45% at 50% -5%, rgba(59, 139, 240, 0.18), transparent 70%);
}