/* d:\Zasoby\xampp\htdocs\prntd.pl\prntd.pl\assets\css\styles.css */

/* === Style globalne === */
:root {
    /* Kolory dla przycisków w Modalach (i przycisku Zaloguj w nagłówku) */
    /* Zmieniono nazwy i kolejność zgodnie z prośbą */
    --BtnBg: #4CAF50;         /* Tło przycisku */
    --BtnBgHover: #2E8B57;   /* Tło przycisku po najechaniu */
    --BtnText: white;         /* Kolor tekstu przycisku */
    --BtnTextHover: white;   /* Kolor tekstu przycisku po najechaniu */

    /* Kolory dla Modali */
    --ModBack: #e0ffe0;                     /* Główne tło modala */
    --ModStripe: #f0f0f0;                   /* Tło pasków/sekcji w modalu */
    --ModHead: rgba(128, 128, 128, 0.5);    /* Tło nagłówka modala */
    --ModStripeTxt: #333;                   /* Tekst na paskach/sekcjach */
    --ModHeadTxt: black;                    /* Tekst w nagłówku modala */
    --ModReq: #555;                         /* Tekst podpowiedzi/wymagań */
    --ModErr: red;                          /* Tekst błędu */
    --ModSeparator: black;                  /* Kolor separatora w modalach (tymczasowo czarny dla testów) */

    /* Kolory dla Header */
    --HdrBackground: white;                 /* Tło nagłówka */
    --LgdUsrMail: var(--BtnBgHover);        /* Kolor tekstu e-mail zalogowanego użytkownika (ciemnozielony) */

    /* Kolory dla Navbar */
    --NavBackground: #f0f0f0;              /* Jasnoszare tło dla całego navbara */
    --NavBtn: var(--BtnBg);                 /* Tło przycisku nawigacji (jak przycisk logowania) */
    --NavBtnHover: var(--BtnBgHover);       /* Tło przycisku nawigacji po najechaniu */
    --NavSep: #666666;                      /* Ciemnoszary dla separatorów między przyciskami */
    --NavBtnText: white;                    /* Kolor tekstu na przyciskach nawigacji */
    --NavBtnTextHover: white;               /* Kolor tekstu na przyciskach nawigacji po najechaniu */

    /* Kolory dla LinkBlock */
    --LnkBlkBackground: #f9f9f9;            /* Tło dla całego bloku linków */
    --LnkBlkTitleText: #000000;             /* Kolor tekstu nagłówków kolumn (czarny) */
    --LnkBlkTitleBorder: #bbbbbb;           /* Kolor linii pod nagłówkiem kolumny i dla separatorów (ciemniejszy szary) */
    --LnkBlkLinkText: #000000;              /* Kolor linków (czarny) */
    --LnkBlkLinkTextHover: #000000;         /* Kolor linków po najechaniu (czarny) */

    /* Kolory dla LinkBlock - wersja mobilna */
    --LnkBlkMobileBackgnd: #666666;         /* Ciemnoszary tło dla przycisków/linków mobilnych */
    --LnkBlkMobileBackgndHov: #444444;      /* Ciemniejszy szary dla hover mobilnych */
    --LnkBlkMobileTxt: #ffffff;             /* Biały tekst dla mobilnych */

    /* Globalne Breakpointy dla responsywności */
    --breakpoint-medium: 768px;             /* Główny breakpoint dla tabletów/mniejszych ekranów */
    --breakpoint-small: 480px;              /* Breakpoint dla mniejszych smartfonów */
    /* Tutaj będą dodawane kolejne globalne zmienne kolorów */
}

body {
    font-family: Arial, Helvetica, sans-serif;
    margin: 0;
    display: flex; /* Umożliwia przyklejenie stopki na dole */
    flex-direction: column; /* Elementy układane w kolumnie */
    min-height: 100vh; /* Minimalna wysokość body to cała wysokość okna */
}

/* Dodatkowe style dla przyklejonego nagłówka i stopki */
.site-header-sticky-wrapper {
    position: sticky;
    top: 0;
    left: 0;
    width: 100%;
    z-index: 1020; /* Wysoki z-index, aby był nad treścią */
    /* Tło jest ważne, aby przewijana treść nie prześwitywała */
    /* Użyj koloru tła Headera lub Navbara */
    background-color: var(--HdrBackground, white); /* Domyślnie tło Headera */
}

main {
    flex-grow: 1; /* Pozwala main zająć dostępną przestrzeń, wypychając stopkę */
    /* margin-top: 0; usunięte, bo może być niepotrzebne lub konfliktować */
    /* padding: 0; usunięte, bo może być niepotrzebne lub konfliktować */
    overflow-y: auto; /* Włącza pionowy pasek przewijania tylko dla <main> */
    width: 100%; /* Upewnij się, że main zajmuje pełną szerokość */
    box-sizing: border-box; /* Aby padding nie wpływał na szerokość */
}

.site-footer-sticky-wrapper {
    position: sticky;
    bottom: 0;
    left: 0;
    width: 100%;
    z-index: 1010; /* Wysoki z-index, ale niższy niż header */
    background-color: var(--LnkBlkBackground, #f9f9f9); /* Domyślnie tło LinkBlocka */
}


hr {
    border: 0;
    height: 2px; /* Grubość linii na 2px */
    background-color: #aaa; /* Nieco ciemniejszy kolor separatora */
    margin-top: 2px; /* Margines górny 2px */
    margin-bottom: 2px; /* Margines dolny 2px */
    width: 100%; /* Separator na całą szerokość */
}

/* Style dla modali są w dedykowanych plikach CSS w assets/modals/ */
/* np. ModCommon.css, loginModal.css itd. */

/* Style dla feedbacku hasła (jeśli używane globalnie, inaczej przenieść do odpowiedniego modala) */
/* Te style są prawdopodobnie używane w modalach resetowania hasła i rejestracji */
/* Jeśli są tylko tam, można je przenieść do odpowiednich plików CSS modali */
.password-feedback {
    font-size: 0.8em;
    margin-top: 5px;
    padding-left: 5px;
}
.feedback-valid {
    color: green;
}
.feedback-invalid {
    color: red;
}
.feedback-valid::before {
    content: "✔ ";
}
.feedback-invalid::before {
    content: "✖ ";
}

/* Style dla przełącznika widoczności hasła (jeśli używane globalnie) */
/* Te style są prawdopodobnie używane w modalach resetowania hasła i rejestracji */
/* Jeśli są tylko tam, można je przenieść do odpowiednich plików CSS modali */
.toggle-password {
    position: absolute;
    right: 8px;
    top: 50%;
    transform: translateY(-50%);
    cursor: pointer;
    width: 16px;
    height: 16px;
    opacity: 0.6;
    transition: opacity 0.2s;
}

.toggle-password:hover {
    opacity: 1;
}

/* Styl dla ukrytego pola honeypot */
.hp-field {
    position: absolute !important;
    height: 1px;
    width: 1px;
    overflow: hidden;
    clip: rect(1px, 1px, 1px, 1px);
    white-space: nowrap; /* zapobiega zawijaniu linii, co mogłoby uczynić element widocznym */
    margin: -1px;
    border: 0;
    padding: 0;
}