/* ============================================================================ * themes.css — Temes visuals (5). S'apliquen amb [data-theme] al . * 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:#22d3a8; --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); --cli-bg:#020814; --cli-fg:#c7f9d8; --cli-bar:#0c1526; --cli-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:#0e9f7e; --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); --cli-bg:#0b1220; --cli-fg:#c7f9d8; --cli-bar:#e2e8f0; --cli-border:#cbd5e1; } /* ─── CISCO (blau corporatiu) ────────────────────────────────────────────── */ body[data-theme="cisco"]{ --bg:#071a2f; --bg-bar:rgba(6,26,47,.85); --bg-card:#0c2743; --bg-elev:#0a2038; --border:rgba(120,180,235,.18); --hover:rgba(120,180,235,.10); --text:#eaf3fb; --text-dim:#9fc0dd; --text-muted:#6d90ae; --accent:#049fd9; --accent2:#5bc2e7; --accent-soft:rgba(4,159,217,.16); --code-bg:rgba(4,159,217,.16); --code-fg:#9de3ff; --tip-bg:rgba(91,194,231,.12); --warn-bg:rgba(245,158,11,.12); --cli-bg:#021221; --cli-fg:#bfe9ff; --cli-bar:#0a2038; --cli-border:#123a5c; } /* ─── 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); --cli-bg:#010c06; --cli-fg:#7dffb0; --cli-bar:#082014; --cli-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); --cli-bg:#03101f; --cli-fg:#b6ecff; --cli-bar:#0c1d31; --cli-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} .shelf-item,.tb{font-size:1.4rem} .ex-check{min-height:52px} } /* Zones tàctils mínimes còmodes en qualsevol pantalla gran */ @media (pointer:coarse){ .mainnav a,.tab,.chip,.btn{min-height:44px;display:inline-flex;align-items:center} .accordion-head{min-height:52px} .ex-check{padding:.5rem} }