/* Akcent i typografia czesci publicznej.
 *
 * Wpinany WYLACZNIE w layout/main.jte. admin/admin-layout.jte go nie laduje,
 * wiec panel zachowuje rozowy akcent i krój Material Kit — zmiana dotyczy
 * tylko tego, co widzi klient.
 *
 * Tokeny (--km-akcent*) definiuje klastmed.css, ktory wczytuja obie czesci.
 */

/* Krój pisma.
 * Material Kit czyta rodzine z zmiennych Bootstrapa, wiec podmiana dwoch
 * custom properties wystarcza — nie ma potrzeby nadpisywac dziesiatek selektorow.
 * Archivo ma pelne latin-ext, wiec polskie znaki diakrytyczne sa poprawne.
 */
:root {
    --bs-font-sans-serif: "Archivo", -apple-system, "Segoe UI", system-ui, Roboto, sans-serif;
    --bs-body-font-family: var(--bs-font-sans-serif);
}

body,
h1, h2, h3, h4, h5, h6,
.h1, .h2, .h3, .h4, .h5, .h6,
.btn,
.navbar,
.form-control,
input, textarea, select, button {
    font-family: var(--bs-font-sans-serif);
}

h1, h2, h3, h4, h5, h6,
.h1, .h2, .h3, .h4, .h5, .h6 {
    letter-spacing: -0.022em;
}

/* Klasy "primary" Material Kit.
 * Vendorowy arkusz jest zminifikowany i nie ruszamy go, zeby aktualizacja
 * biblioteki niczego nie cofnela — stad nadpisania z !important.
 */
.bg-gradient-primary {
    background-image: linear-gradient(195deg, var(--km-akcent-jasny) 0%, var(--km-akcent) 100%) !important;
}

.bg-primary {
    background-color: var(--km-akcent) !important;
}

.text-primary {
    color: var(--km-akcent) !important;
}

.border-primary {
    border-color: var(--km-akcent) !important;
}

.shadow-primary {
    box-shadow: 0 4px 20px 0 rgba(var(--km-akcent-rgb), 0.14),
                0 7px 10px -5px rgba(var(--km-akcent-rgb), 0.4) !important;
}

.btn.bg-gradient-primary,
.btn-primary {
    background-image: linear-gradient(195deg, var(--km-akcent-jasny) 0%, var(--km-akcent) 100%) !important;
    background-color: var(--km-akcent) !important;
    border-color: transparent !important;
    color: #fff !important;
    /* Material Kit daje przyciskowi rozowy cien osobna regula — bez tego
       tlo bylo juz czerwone, a poswiata pod przyciskiem dalej rozowa. */
    box-shadow: 0 3px 3px 0 rgba(var(--km-akcent-rgb), 0.15),
                0 3px 1px -2px rgba(var(--km-akcent-rgb), 0.2),
                0 1px 5px 0 rgba(var(--km-akcent-rgb), 0.15) !important;
}

.btn.bg-gradient-primary:hover,
.btn-primary:hover,
.btn.bg-gradient-primary:focus,
.btn-primary:focus,
.btn.bg-gradient-primary:active,
.btn-primary:active {
    background-image: linear-gradient(195deg, var(--km-akcent) 0%, var(--km-akcent-ciemny) 100%) !important;
    box-shadow: 0 4px 12px rgba(var(--km-akcent-rgb), 0.4) !important;
}

.btn-outline-primary {
    border-color: var(--km-akcent) !important;
    color: var(--km-akcent) !important;
    background-image: none !important;
}

.btn-outline-primary:hover,
.btn-outline-primary:focus,
.btn-outline-primary:active {
    background-color: var(--km-akcent) !important;
    border-color: var(--km-akcent) !important;
    color: #fff !important;
}

.badge.bg-gradient-primary {
    background-image: linear-gradient(195deg, var(--km-akcent-jasny) 0%, var(--km-akcent) 100%) !important;
}

/* Fokus klawiatury — widoczny i w kolorze akcentu, na calej czesci publicznej. */
a:focus-visible,
button:focus-visible,
.btn:focus-visible,
summary:focus-visible,
[tabindex]:focus-visible {
    outline: 2px solid var(--km-akcent);
    outline-offset: 2px;
}