/* IDENTYCZNY UKŁAD TŁA ORAZ ZABLOKOWANY SCROLL */
        html, body {
            height: 100%;
            margin: 0;
            padding: 0;
            overflow: hidden;
        }

        body { 
            font-family: 'Inter', sans-serif; 
            /* Dokładnie ten sam nasycony, zielono-niebieski gradient */
        background: linear-gradient(135deg, #021f38 30%, #052e64 50%, #0b5334 100%);
            color: #e1e1e6; 
            display: flex; 
            flex-direction: column;
            justify-content: center; 
            align-items: center; 
            box-sizing: border-box; 
			padding: 15px; /* Dodany minimalny padding dla bezpieczeństwa */
        }
.lang-switcher {
    position: absolute;
    top: 15px;
    right: 20px;
    display: flex;
    gap: 10px;
    font-size: 20px;
}
.lang-switcher a {
            font-size: 12px; 
            color: #8a949d; /* Zmiana na nieco jaśniejszy, stary #586570 był za ciemny na ciemnym tle */
            text-transform: uppercase;
            letter-spacing: 1px;
            margin-bottom: 25px;
            font-weight: 800;
            border-bottom: 1px solid rgba(255,255,255,0.06);
            padding-bottom: 10px;
}
.lang-switcher a:hover {
    opacity: 1;
    transform: scale(1.1);
}    
        /* IDENTYCZNA KARTA DIV CARD */
        .card { 
             
            padding: 35px; 
            border-radius: 24px; 
            max-width: 420px; 
			width: 100%; /* Zmieniono z 90% na 100% dla lepszej kontroli z max-width */
            border: 2px solid rgba(255, 255, 255, 0.1); 
            box-sizing: border-box;
            text-align: center;
			background: rgba(28, 30, 40, 0.6); /* Dodano delikatne tło tarczy, żeby tekst był czytelny */
        }

        h2 { 
            margin: 0 0 6px 0; 
            color: #fff; 
            font-size: 28px; 
            font-weight: 800;
            letter-spacing: -0.5px;
        }

        .login-subtitle {
            font-size: 12px; 
            color: #8a949d; /* Zmiana na nieco jaśniejszy, stary #586570 był za ciemny na ciemnym tle */
            text-transform: uppercase;
            letter-spacing: 1px;
            margin-bottom: 25px;
            font-weight: 800;
            border-bottom: 1px solid rgba(255,255,255,0.06);
            padding-bottom: 10px;
        }

        /* STYL KOMUNIKATU O BŁĘDZIE */
        .error {
            background: rgba(230, 0, 18, 0.15);
            color: #e60012;
            border: 1px solid rgba(230, 0, 18, 0.3);
            padding: 12px;
            border-radius: 12px;
            margin-bottom: 20px;
            font-size: 14px;
            font-weight: 600;
            text-align: left;
        }

        /* INPUTY PASUJĄCE DO RESZTY SYSTEMU */
        form {
            display: flex;
            flex-direction: column;
            gap: 16px;
        }

        input[type="text"],
        input[type="password"] {
            width: 100%;
            padding: 14px 15px; /* Delikatnie powiększone pod dotyk mobilny */
            border-radius: 12px;
            background: #1c1e28;
            border: 1px solid rgba(255,255,255,0.08);
            color: #ffffff;
            font-family: 'Inter', sans-serif;
            font-size: 16px; /* 16px zapobiega automatycznemu zoomowaniu formularza na iOS (Safari) */
            font-weight: 600;
            box-sizing: border-box;
            transition: border-color 0.2s;
        }

        input[type="password"]:focus {
            outline: none;
            border-color: #f7f7f7;
        }

        /* PRZYCISK SUBMIT */
        button[type="submit"] {
            width: 100%;
            padding: 14px;
            border-radius: 12px;
            background: #f7f7f7; 
            border: none;
            color: #000000;
            font-size: 15px;
            font-weight: 800;
            cursor: pointer;
            text-transform: uppercase;
            letter-spacing: 0.5px;
            box-shadow: 0 4px 15px rgba(16, 124, 16, 0.3);
            transition: transform 0.2s, background-color 0.2s;
            margin-top: 4px;
        }

        button[type="submit"]:hover {
            background: #159215;
            transform: scale(1.02);
        }


		/* Kontener na opcje */
.radio-group {
    display: flex;
    flex-direction: column;
    gap: 12px;
    margin: 10px 0;
    text-align: left;
}

/* Karta opcji (cała jest klikalna) */
.radio-card {
    position: relative;
    display: block;
    cursor: pointer;
}

/* Ukrywamy domyślne systemowe kółko */
.radio-card input[type="radio"] {
    position: absolute;
    opacity: 0;
    width: 0;
    height: 0;
}

/* Wygląd zawartości karty */
.radio-content {
    display: flex;
    align-items: center;
    padding: 14px 16px;
    background: #1c1e28;
    border: 1px solid rgba(255, 255, 255, 0.08);
    border-radius: 14px;
    transition: all 0.2s ease;
}

/* Nasze własne, ładne kółeczko */
.radio-circle {
    width: 18px;
    height: 18px;
    border: 2px solid rgba(255, 255, 255, 0.3);
    border-radius: 50%;
    margin-right: 14px;
    display: inline-block;
    position: relative;
    flex-shrink: 0;
    transition: all 0.2s ease;
}

/* Teksty wewnątrz karty */
.radio-text {
    display: flex;
    flex-direction: column;
}

.radio-title {
    color: #ffffff;
    font-size: 14px;
    font-weight: 700;
}

.radio-desc {
    color: #f7f7f7;
    font-size: 11px;
    margin-top: 2px;
}

/* --- EFEKTY HOVER I ACTIVE (Po najechaniu i zaznaczeniu) --- */

/* Hover na kartę */
.radio-card:hover .radio-content {
    border-color: rgba(255, 255, 255, 0.2);
    background: #222531;
}

/* Styl karty, gdy radio jest ZAZNACZONE */
.radio-card input[type="radio"]:checked + .radio-content {
    background: #192b2a; /* Delikatny zielonkawy odcień pasujący do Twojego tła */
    border-color: #28a745; /* Zielona ramka */
}

/* Styl kółeczka, gdy radio jest ZAZNACZONE */
.radio-card input[type="radio"]:checked + .radio-content .radio-circle {
    border-color: #28a745;
    background: #28a745;
}

/* Kropka w środku zaznaczonego kółeczka */
.radio-card input[type="radio"]:checked + .radio-content .radio-circle::after {
    content: '';
    position: absolute;
    width: 6px;
    height: 6px;
    background: #12141d;
    border-radius: 50%;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}
		    
        .footer { margin-top: 25px; font-size: 12px; color: rgba(255, 255, 255, 0.4); text-align: center; flex-shrink: 0;}
        .footer a { color: #8a949d; text-decoration: none; transition: color 0.2s; }
        .footer a:hover { color: #fff; }

/* RESPONSYWNOŚĆ (Poprawione błędy składniowe) */
        @media (max-width: 480px) {
            html, body { 
                overflow-y: auto; /* Pozwalamy na scroll na małych telefonach, jeśli ekran jest bardzo niski */
                height: auto; 
                min-height: 100%; 
            }
            body { 
                padding: 20px 10px; 
                justify-content: flex-start; 
            }
            .card { 
                padding: 25px 20px; 
                border-radius: 16px; /* Zamiast 0px dajemy ładne, nowoczesne zaokrąglenie na telefonie */
                width: 100%; 
                max-width: 100%; 
                border: 1px solid rgba(255, 255, 255, 0.1);
            }
        }