/*
 * Motyw panelu w barwach ASSET — kolory, font i detale jak na asset.com.pl.
 * Wartości --asset-* przepisane z arkusza strony (27.09.2026).
 *
 * Większość robią zmienne Bootstrapa 5.3: komponenty same biorą z nich kolory.
 * Reguły niżej są tylko tam, gdzie Bootstrap ma niebieski wpisany na sztywno
 * (fokus pól, zaznaczony checkbox, przyciski, pasek postępu).
 */

:root {
    --asset-red: #C0392B;
    --asset-red-hover: #A93226;
    --asset-red-light: #FDEEEC;
    --asset-red-border: #E8B4AF;
    --asset-dark: #1C2B3A;
    --asset-text: #2C3E50;
    --asset-border: #E8E8E8;

    --bs-primary: var(--asset-red);
    --bs-primary-rgb: 192, 57, 43;
    --bs-primary-text-emphasis: #4D1711;
    --bs-primary-bg-subtle: var(--asset-red-light);
    --bs-primary-border-subtle: var(--asset-red-border);

    /* Komunikaty „info” bez błękitu Bootstrapa — w palecie ASSET go nie ma. */
    --bs-info-text-emphasis: var(--asset-dark);
    --bs-info-bg-subtle: #EEF2F6;
    --bs-info-border-subtle: #D6DEE6;

    --bs-body-font-family: "Inter", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
    --bs-body-color: var(--asset-text);
    --bs-body-color-rgb: 44, 62, 80;
    --bs-emphasis-color: var(--asset-dark);
    --bs-emphasis-color-rgb: 28, 43, 58;
    --bs-heading-color: var(--asset-dark);

    /* Szarość ze strony ASSET (#7F8C8D) ma za mały kontrast na drobne opisy pól
       (3,5:1), więc wyciszony tekst to kolor tekstu z przezroczystością — tak
       samo liczy go Bootstrap. */
    --bs-secondary-color: rgba(44, 62, 80, 0.75);
    --bs-secondary-color-rgb: 44, 62, 80;
    --bs-tertiary-color: rgba(44, 62, 80, 0.5);
    --bs-tertiary-color-rgb: 44, 62, 80;

    --bs-link-color: var(--asset-red);
    --bs-link-color-rgb: 192, 57, 43;
    --bs-link-hover-color: var(--asset-red-hover);
    --bs-link-hover-color-rgb: 169, 50, 38;

    --bs-border-radius: 4px;
    --bs-border-radius-lg: 8px;
    --bs-box-shadow-sm: 0 1px 4px rgba(0, 0, 0, 0.06);
    --bs-box-shadow: 0 4px 16px rgba(0, 0, 0, 0.08);
    --bs-box-shadow-lg: 0 8px 32px rgba(0, 0, 0, 0.1);
    --bs-focus-ring-color: rgba(192, 57, 43, 0.25);
}

h1, h2, h3, h4, h5, h6,
.h1, .h2, .h3, .h4, .h5, .h6 {
    font-weight: 700;
    letter-spacing: -0.01em;
}


/* ===================== NAWIGACJA I STOPKA ===================== */

/* Jak nagłówek asset.com.pl: biało, logo po lewej, bieżąca strona
   podkreślona na czerwono. */
.asset-navbar {
    --bs-navbar-padding-y: 0.75rem;
    --bs-navbar-color: var(--asset-text);
    --bs-navbar-hover-color: var(--asset-red);
    --bs-navbar-active-color: var(--asset-red);
    --bs-navbar-nav-link-padding-x: 0.75rem;
    background-color: #fff;
    border-bottom: 1px solid var(--asset-border);
}

.asset-navbar .navbar-brand img {
    display: block;
    height: 38px;
    width: auto;
}

.asset-navbar .nav-link {
    font-size: 0.875rem;
    font-weight: 500;
    border-bottom: 2px solid transparent;
}

.asset-navbar .nav-link:hover,
.asset-navbar .nav-link.active {
    border-bottom-color: var(--asset-red);
}

.nav-link:focus-visible {
    box-shadow: 0 0 0 0.25rem var(--bs-focus-ring-color);
}

.asset-footer {
    background-color: #fff;
    border-top: 1px solid var(--asset-border);
    color: var(--bs-secondary-color);
}

.asset-footer strong {
    color: var(--asset-dark);
    font-weight: 600;
}


/* ===================== PRZYCISKI ===================== */

/* Wersaliki i pogrubienie jak na asset.com.pl. Mniejszy font z wyższą linią
   trzyma wysokość przycisków z Bootstrapa (38 px, małe 31 px), więc nic nie
   rozjeżdża się obok pól formularza. Wersaliki są szersze, a „Usuń” przy
   dziale stoi w wąskiej kolumnie — bez nowrap łamał się na dwie linie. */
.btn {
    --bs-btn-font-size: 0.875rem;
    --bs-btn-line-height: 1.7143;
    --bs-btn-font-weight: 600;
    letter-spacing: 0.01em;
    text-transform: uppercase;
    white-space: nowrap;
}

.btn-sm {
    --bs-btn-font-size: 0.75rem;
    --bs-btn-line-height: 1.75;
}

.btn-primary {
    --bs-btn-bg: var(--asset-red);
    --bs-btn-border-color: var(--asset-red);
    --bs-btn-hover-bg: var(--asset-red-hover);
    --bs-btn-hover-border-color: var(--asset-red-hover);
    --bs-btn-active-bg: var(--asset-red-hover);
    --bs-btn-active-border-color: var(--asset-red-hover);
    --bs-btn-disabled-bg: var(--asset-red);
    --bs-btn-disabled-border-color: var(--asset-red);
    --bs-btn-focus-shadow-rgb: 192, 57, 43;
}

.btn-primary:hover {
    box-shadow: 0 4px 12px rgba(192, 57, 43, 0.3);
}

.btn-outline-primary {
    --bs-btn-color: var(--asset-red);
    --bs-btn-border-color: var(--asset-red);
    --bs-btn-hover-bg: var(--asset-red);
    --bs-btn-hover-border-color: var(--asset-red);
    --bs-btn-active-bg: var(--asset-red-hover);
    --bs-btn-active-border-color: var(--asset-red-hover);
    --bs-btn-disabled-color: var(--asset-red);
    --bs-btn-disabled-border-color: var(--asset-red);
    --bs-btn-focus-shadow-rgb: 192, 57, 43;
}

/* Przyciski pomocnicze zostają neutralne; najazd jak w menu asset.com.pl. */
.btn-outline-secondary {
    --bs-btn-color: var(--asset-text);
    --bs-btn-border-color: #C9CFD6;
    --bs-btn-hover-color: var(--asset-red);
    --bs-btn-hover-bg: var(--asset-red-light);
    --bs-btn-hover-border-color: var(--asset-red-border);
    --bs-btn-active-color: var(--asset-red);
    --bs-btn-active-bg: var(--asset-red-light);
    --bs-btn-active-border-color: var(--asset-red);
    --bs-btn-disabled-color: var(--asset-text);
    --bs-btn-disabled-border-color: #C9CFD6;
    --bs-btn-focus-shadow-rgb: 192, 57, 43;
}

.btn-close {
    --bs-btn-close-focus-shadow: 0 0 0 0.25rem var(--bs-focus-ring-color);
}


/* ===================== FORMULARZE ===================== */

.form-control:focus,
.form-select:focus,
.form-check-input:focus {
    border-color: var(--asset-red);
    box-shadow: 0 0 0 0.25rem rgba(192, 57, 43, 0.15);
}

.form-check-input:checked {
    background-color: var(--asset-red);
    border-color: var(--asset-red);
}

/* Gałka wyłączonego przełącznika w fokusie. Zaznaczony zostaje z białą
   gałką z Bootstrapa, stąd :not(:checked). */
.form-switch .form-check-input:focus:not(:checked) {
    --bs-form-switch-bg: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3e%3ccircle r='3' fill='%23e8b4af'/%3e%3c/svg%3e");
}


/* ===================== KARTY, TABELE, PASEK ===================== */

.card {
    --bs-card-border-color: var(--asset-border);
    --bs-card-border-radius: var(--bs-border-radius-lg);
    --bs-card-inner-border-radius: calc(var(--bs-border-radius-lg) - var(--bs-border-width));
}

/* Nagłówki kolumn jak nagłówki sekcji w stopce asset.com.pl. */
.table > thead th {
    color: var(--bs-secondary-color);
    font-size: 0.75rem;
    font-weight: 700;
    letter-spacing: 0.06em;
    text-transform: uppercase;
}

/* Pasek zużycia w normie jest granatowy. Czerwień zostaje dla przekroczonego
   limitu (bg-danger), żeby zwykły stan nie wyglądał jak alarm. */
.progress {
    --bs-progress-bar-bg: var(--asset-dark);
}