/* =============================================================================
   GLOBAL.CSS — Wspólne zmienne i style dla szablonów 2026
   ============================================================================= */
html {
    font-size: 62.5% !important;
}

/* 1rem = 10px */


:root {
    /* Kolory podstawowe */
    --color-primary: #199ACC;
    --color-primary-hover: #1580b0;
    --color-primary-light: #22B3E8;
    --color-primary-dark: #125F81;
    --color-white: #FFFFFF;
    --color-background: #F9F8F7;
    --color-text: #505050;

    /* Tekst */
    --color-heading: #050709;
    --color-body: #374151;
    --color-muted: #626573;

    /* Cienie */
    --shadow-primary: rgba(25, 154, 204, 0.3);

    /* Kurs — schematy kolorów (5 wariantów) */

    /* 1 — Niebieski */
    --kurs-1-surface-light: #e8f4fa;
    --kurs-1-surface-dim: #dcedf5;
    --kurs-1-surface-base: #f0f7fb;
    --kurs-1-dot: #3b82f6;

    /* 2 — Zielony */
    --kurs-2-surface-light: #e5f5f0;
    --kurs-2-surface-dim: #d8ede8;
    --kurs-2-surface-base: #eef7f4;
    --kurs-2-dot: #22c55e;

    /* 3 — Indygo */
    --kurs-3-surface-light: #eae6f4;
    --kurs-3-surface-dim: #ddd8ed;
    --kurs-3-surface-base: #f0edf6;
    --kurs-3-dot: #8b5cf6;

    /* 4 — Żółty */
    --kurs-4-surface-light: #faf5e4;
    --kurs-4-surface-dim: #f0ead6;
    --kurs-4-surface-base: #f8f5eb;
    --kurs-4-dot: #eab308;

    /* 5 — Domyślny (neutralny) */
    --kurs-5-surface-light: #f9fafc;
    --kurs-5-surface-dim: #f2f4fa;
    --kurs-5-surface-base: #ffffff;
    --kurs-5-dot: #374151;

    /* akcent (eyebrow, linki) per schemat */
    --kurs-1-accent: #199acc;
    --kurs-2-accent: #188d78;
    --kurs-3-accent: #4338ca;
    --kurs-4-accent: #a16207;
    --kurs-5-accent: #626573;

    /* surface-inverse (ciemna karta) per schemat */
    --kurs-1-surface-inverse: #0d405a;
    --kurs-2-surface-inverse: #093627;
    --kurs-3-surface-inverse: #2a2768;
    --kurs-4-surface-inverse: #422a0f;
    --kurs-5-surface-inverse: #0A0E14;

    /* tekst na ciemnej karcie per schemat */
    --kurs-1-text-secondary-inverse: #d6f3fc;
    --kurs-2-text-secondary-inverse: #e0f7f4;
    --kurs-3-text-secondary-inverse: #e0e7ff;
    --kurs-4-text-secondary-inverse: #e4e7f0;
    --kurs-5-text-secondary-inverse: #cbd5e1;

    /* Typografia */
    --font-family: 'Poppins', sans-serif;
}

/* Klasy schematów kolorów — mapowanie na lokalne zmienne bloków */
.kurs-color-1 {
    --kurs-surface-light: var(--kurs-1-surface-light);
    --kurs-surface-dim: var(--kurs-1-surface-dim);
    --kurs-surface-base: var(--kurs-1-surface-base);
    --kurs-dot: var(--kurs-1-dot);
    --kurs-accent: var(--kurs-1-accent);
    --kurs-surface-inverse: var(--kurs-1-surface-inverse);
    --kurs-text-secondary-inverse: var(--kurs-1-text-secondary-inverse);
}

.kurs-color-2 {
    --kurs-surface-light: var(--kurs-2-surface-light);
    --kurs-surface-dim: var(--kurs-2-surface-dim);
    --kurs-surface-base: var(--kurs-2-surface-base);
    --kurs-dot: var(--kurs-2-dot);
    --kurs-accent: var(--kurs-2-accent);
    --kurs-surface-inverse: var(--kurs-2-surface-inverse);
    --kurs-text-secondary-inverse: var(--kurs-2-text-secondary-inverse);
}

.kurs-color-3 {
    --kurs-surface-light: var(--kurs-3-surface-light);
    --kurs-surface-dim: var(--kurs-3-surface-dim);
    --kurs-surface-base: var(--kurs-3-surface-base);
    --kurs-dot: var(--kurs-3-dot);
    --kurs-accent: var(--kurs-3-accent);
    --kurs-surface-inverse: var(--kurs-3-surface-inverse);
    --kurs-text-secondary-inverse: var(--kurs-3-text-secondary-inverse);
}

.kurs-color-4 {
    --kurs-surface-light: var(--kurs-4-surface-light);
    --kurs-surface-dim: var(--kurs-4-surface-dim);
    --kurs-surface-base: var(--kurs-4-surface-base);
    --kurs-dot: var(--kurs-4-dot);
    --kurs-accent: var(--kurs-4-accent);
    --kurs-surface-inverse: var(--kurs-4-surface-inverse);
    --kurs-text-secondary-inverse: var(--kurs-4-text-secondary-inverse);
}

.kurs-color-5 {
    --kurs-surface-light: var(--kurs-5-surface-light);
    --kurs-surface-dim: var(--kurs-5-surface-dim);
    --kurs-surface-base: var(--kurs-5-surface-base);
    --kurs-dot: var(--kurs-5-dot);
    --kurs-accent: var(--kurs-5-accent);
    --kurs-surface-inverse: var(--kurs-5-surface-inverse);
    --kurs-text-secondary-inverse: var(--kurs-5-text-secondary-inverse);
}

/* ============================================================
   Wyrównanie nagłówków — klasy globalne dla bloków kurs
   ============================================================ */

.kurs-align-left {
    text-align: left;
}

.kurs-align-center {
    text-align: center;
}