/* ==========================================
   ShootingDiary - Teljes Stíluslap (style.css)
   v12.0.26 - Restored Fullscreen App View (Uncompressed)
========================================== */

html, body {
    background-color: #F1F5F9; 
    margin: 0; 
    padding: 0;
    width: 100%;
    height: 100%;
}

#authContainer {
    background-color: #0F172A; 
    background-image: linear-gradient(rgba(15, 23, 42, 0.75), rgba(15, 23, 42, 0.95)), url('bg-login.webp');
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    width: 100%;
}

@media (min-width: 768px) {
    #authContainer {
        background-image: linear-gradient(rgba(15, 23, 42, 0.75), rgba(15, 23, 42, 0.95)), url('bg-login-desktop.webp');
    }
}

/* Az iPhone alulról felhúzható sávjának (Safe Area) tiszteletben tartása */
#navShooter, #navCoach {
    padding-bottom: max(1.5rem, env(safe-area-inset-bottom) + 0.5rem) !important;
}

/* --- HARDVERES GYORSÍTÁS AZ ÜVEGHATÁSNAK (Gyorsabb, azonnali betöltés) --- */
#loginBox > div, 
#registerBox > div, 
#forgotRequestBox > div, 
#forgotResetBox > div {
    background-color: rgba(255, 255, 255, 0.05);
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
    border: 1px solid rgba(255, 255, 255, 0.1);
    
    /* A GPU gyorsítás kódjai */
    will-change: transform, backdrop-filter;
    transform: translateZ(0);
    backface-visibility: hidden;
}

/* Tiszta, olvasható szövegszínek az üveglapon */
#loginBox .text-textSub, 
#registerBox .text-textSub, 
#forgotRequestBox .text-textSub, 
#forgotResetBox .text-textSub {
    color: rgba(255, 255, 255, 0.7);
}

#loginBox input, 
#registerBox input, 
#registerBox select, 
#forgotRequestBox input, 
#forgotResetBox input {
    color: #ffffff;
}

/* Töltő ikon animációja */
.loader {
    border: 3px solid rgba(0, 122, 255, 0.1);
    border-radius: 50%;
    border-top: 3px solid #007AFF;
    width: 24px;
    height: 24px;
    -webkit-animation: spin 1s linear infinite;
    animation: spin 1s linear infinite;
}

@-webkit-keyframes spin { 
    0% { -webkit-transform: rotate(0deg); } 
    100% { -webkit-transform: rotate(360deg); } 
}

@keyframes spin { 
    0% { transform: rotate(0deg); } 
    100% { transform: rotate(360deg); } 
}