/**
 * CSS Design Tokens / Variabler
 * Bergen Private Gymnas - Fagvalg 2026-2027
 *
 * Dette dokumentet inneholder alle CSS custom properties (variabler)
 * som brukes gjennom prosjektet for konsistent styling.
 */

:root {
    /* ============================================
       TYPOGRAFI
       ============================================ */
    --font-family: helvetica, arial, sans-serif;
    --font-family-heading: 'Jubilat', georgia, serif;

    /* ============================================
       BPG FARGEPALETT
       Hentet fra bergenprivategymnas.no
       ============================================ */
    --bpg-dark: #1a3a3a;
    --bpg-teal: #2a5a5a;
    --bpg-green: #5fa550;
    --bpg-peach: #f5d5c8;
    --bpg-peach-light: #faf0eb;

    /* ============================================
       HOVEDFARGER
       Semantiske fargevariabler basert på BPG-paletten
       ============================================ */
    --primary-dark: var(--bpg-dark);
    --primary-teal: var(--bpg-teal);
    --primary-light: #3d7a7a;
    --accent: var(--bpg-peach);
    --accent-light: var(--bpg-peach-light);

    /* ============================================
       BAKGRUNN OG TEKST
       Nøytrale farger for innhold og bakgrunner
       ============================================ */
    --bg-light: #faf9f8;
    --bg-white: #ffffff;
    --text-dark: #1a1a1a;
    --text-medium: #4a4a4a;
    --text-light: #5a5a5a;

    /* ============================================
       PROGRAMOMRADE-FARGER
       Justert for BPG-stil
       ============================================ */

    /* Realfag - Gront tema */
    --realfag: #5fa550;
    --realfag-light: #e8f5e6;
    --realfag-dark: #4a8a40;

    /* Sprak, Samfunnsfag og Okonomi (SSA) - Gult tema */
    --ssa: #e8c547;
    --ssa-light: #fdf6e3;
    --ssa-dark: #c4a63a;

    /* Medier og Kommunikasjon (MK) - Blatt tema */
    --mk: #4a9eb8;
    --mk-light: #e5f3f7;
    --mk-dark: #3a8098;

    /* Musikk - Oransje/fersken tema */
    --musikk: #e8a87c;
    --musikk-light: #fdf3ed;
    --musikk-dark: #c88a60;

    /* ============================================
       SKYGGER
       Fra fagkatalog - subtile, moderne skygger
       ============================================ */
    --shadow-xs: 0 1px 2px rgba(0, 0, 0, 0.04);
    --shadow-sm: 0 2px 4px rgba(0, 0, 0, 0.05);
    --shadow-md: 0 2px 8px rgba(0, 0, 0, 0.06);
    --shadow-lg: 0 8px 20px rgba(31, 71, 57, 0.15);
    --shadow-card: 0 1px 3px rgba(0, 0, 0, 0.08);
    --shadow-card-hover: 0 4px 16px rgba(31, 71, 57, 0.15);

    /* ============================================
       OVERGANGER / TRANSITIONS
       Konsistente animasjonstider
       ============================================ */
    --transition-fast: 0.2s ease;
    --transition-medium: 0.4s ease;
    --transition-slow: 0.6s ease;
}