/* ============================================================================
 *  themes.css — Temes visuals (4). S'apliquen amb [data-theme] al <body>.
 *  ORBYS: mides tàctils còmodes en pantalla gran (secció final).
 * ==========================================================================*/

/* ─── FOSC (per defecte) ─────────────────────────────────────────────────── */
body[data-theme="dark"]{
  --bg:#0a0f1c; --bg-bar:rgba(11,17,32,.82); --bg-card:#111a2e; --bg-elev:#0d1524;
  --border:rgba(148,163,184,.14); --hover:rgba(148,163,184,.08);
  --text:#eef2f8; --text-dim:#9aa8bd; --text-muted:#64748b;
  --accent:#2b9dff; --accent2:#f2c94c; --accent-soft:rgba(43,157,255,.14);
  --code-bg:rgba(148,163,184,.14); --code-fg:#8fd3ff;
  --tip-bg:rgba(34,211,168,.10); --warn-bg:rgba(245,158,11,.10); --info-bg:rgba(43,157,255,.10);
  --code-block-bg:#020814; --code-block-fg:#e6edf3; --code-border:#1e2b45;
}

/* ─── CLAR ───────────────────────────────────────────────────────────────── */
body[data-theme="light"]{
  --bg:#f4f7fb; --bg-bar:rgba(255,255,255,.85); --bg-card:#ffffff; --bg-elev:#eef2f8;
  --border:rgba(15,23,42,.10); --hover:rgba(15,23,42,.045);
  --text:#0f1b2d; --text-dim:#54627a; --text-muted:#8592a6;
  --accent:#0a72d6; --accent2:#c9971e; --accent-soft:rgba(10,114,214,.10);
  --code-bg:rgba(10,114,214,.10); --code-fg:#0a5bb0;
  --tip-bg:rgba(14,159,126,.10); --warn-bg:rgba(217,119,6,.12); --info-bg:rgba(10,114,214,.08);
  --code-block-bg:#0b1220; --code-block-fg:#e6edf3; --code-border:#cbd5e1;
}

/* ─── TERMINAL (verd fòsfor) ─────────────────────────────────────────────── */
body[data-theme="terminal"]{
  --bg:#04160c; --bg-bar:rgba(4,22,12,.86); --bg-card:#082014; --bg-elev:#061a10;
  --border:rgba(80,220,140,.18); --hover:rgba(80,220,140,.10);
  --text:#c6f7d8; --text-dim:#79c99a; --text-muted:#4e8f6a;
  --accent:#28e07a; --accent2:#a3e635; --accent-soft:rgba(40,224,122,.14);
  --code-bg:rgba(40,224,122,.16); --code-fg:#7dffb0;
  --tip-bg:rgba(40,224,122,.10); --warn-bg:rgba(245,200,60,.12); --info-bg:rgba(40,224,122,.08);
  --code-block-bg:#010c06; --code-block-fg:#7dffb0; --code-border:#124a2c;
  --font:'JetBrains Mono',var(--mono);
}

/* ─── OCEÀ ───────────────────────────────────────────────────────────────── */
body[data-theme="ocean"]{
  --bg:#0a1626; --bg-bar:rgba(10,22,38,.84); --bg-card:#10233b; --bg-elev:#0c1d31;
  --border:rgba(120,190,220,.15); --hover:rgba(120,190,220,.08);
  --text:#e6f1fb; --text-dim:#93b6d0; --text-muted:#5e839f;
  --accent:#38bdf8; --accent2:#2dd4bf; --accent-soft:rgba(56,189,248,.14);
  --code-bg:rgba(56,189,248,.14); --code-fg:#a5e5ff;
  --tip-bg:rgba(45,212,191,.10); --warn-bg:rgba(245,158,11,.10); --info-bg:rgba(56,189,248,.08);
  --code-block-bg:#03101f; --code-block-fg:#e6edf3; --code-border:#123a55;
}

/* ─── ORBYS 4K / pantalla tàctil d'aula ──────────────────────────────────── */
@media (min-width:2000px){
  :root{--maxw:1600px}
  html{font-size:20px}
  .btn{padding:.9rem 1.6rem}
  .mainnav a{padding:.7rem 1.05rem;font-size:1rem}
  .tab{padding:.9rem 1.4rem}
  .ex-level{font-size:1rem}
}
/* Zones tàctils mínimes còmodes en qualsevol pantalla gran */
@media (pointer:coarse){
  .mainnav a,.tab,.btn,.os-tab{min-height:44px;display:inline-flex;align-items:center}
  .accordion-head{min-height:52px}
}

/* ─── Moviment reduït: apaga animacions GSAP i deixa l'estat final ───────── */
@media (prefers-reduced-motion: reduce){
  *{animation-duration:0.001ms !important;animation-iteration-count:1 !important;
    transition-duration:0.001ms !important;scroll-behavior:auto !important}
}