*{margin:0;padding:0;box-sizing:border-box}
body{margin:0;padding:0;font-family:'Segoe UI',Tahoma,Geneva,Verdana,sans-serif;background:url('fondo2.webp') no-repeat center center fixed;background-size:cover;min-height:100vh;display:flex;align-items:center;justify-content:center;position:relative;}



.d-none{display:none !important;}

/* Ocultar elementos obsoletos solo en la página principal */
.login-container ~ .login-box {
    display: none !important;
}

.login-container ~ .login-logo:not(.login-card .login-logo):not(.logo-container .login-logo) {
    display: none !important;
}

/* Estilos para página de reset password */
.login-page {
    background: url('fondo2.webp') no-repeat center center fixed !important;
    background-size: cover !important;
    min-height: 100vh;
}

.login-page .login-box {
    position: relative;
    z-index: 10;
    display: block !important;
}

.login-page .login-logo {
    display: block !important;
    text-align: center;
    margin-bottom: 20px;
}

.login-container{display:flex;align-items:center;justify-content:center;min-height:100vh;width:100%;}

.recovery-container{position:absolute;top:0;left:0;width:100%;height:100vh;display:flex;align-items:center;justify-content:center;z-index:20;background:url('fondo2.webp') no-repeat center center fixed;background-size:cover;}


.login-card{background:#ffffff;border-radius:12px;padding:2.5rem;box-shadow:0 4px 12px rgba(0,0,0,0.1);border:1px solid #e2e8f0;width:100%;max-width:400px;transform:translateY(20px);opacity:0;animation:slideUp 0.8s ease-out forwards;}

@keyframes slideUp{to{transform:translateY(0);opacity:1;}}

.login-header{text-align:center;margin-bottom:32px}
.logo-container{margin-bottom:24px;display:flex;justify-content:center;align-items:center}

.login-logo {
    width: 160px;
    height: 90px;
    border-radius: 16px;
    box-shadow: 0 12px 24px rgba(0, 0, 0, 0.2);
    object-fit: contain;
    image-rendering: crisp-edges;
}

.system-title{font-size:24px;font-weight:700;color:#1a202c;margin-bottom:8px;letter-spacing:-.5px}
.system-subtitle{font-size:14px;color:#718096;font-weight:400}
.login-form{display:flex;flex-direction:column;gap:20px}
.input-group{position:relative}

.login-input{width:100%;padding:16px 48px 16px 16px;border:2px solid #e2e8f0;border-radius:12px;font-size:16px;background:#fff;transition:all .3s ease;outline:none}
.login-input:focus{border-color:#ff8c00;box-shadow:0 0 0 3px rgba(255,140,0,.1)}
.login-input::placeholder{color:#a0aec0;font-weight:400}

.input-icon{position:absolute;right:16px;top:50%;transform:translateY(-50%);color:#a0aec0;font-size:16px;pointer-events:none;transition:color .3s ease}
.login-input:focus + .input-icon{color:#ff8c00}
.login-btn{width:100%;padding:16px;background:linear-gradient(135deg,#ff8c00 0%,#ff6b35 100%);border:none;border-radius:12px;color:#fff;font-size:16px;font-weight:600;cursor:pointer;transition:all .3s ease;margin-top:8px}
.login-btn:hover{transform:translateY(-2px);box-shadow:0 8px 25px rgba(255,140,0,.3)}
.login-btn:active{transform:translateY(0)}
.forgot-password{text-align:center;color:#ff8c00;text-decoration:none;font-size:14px;font-weight:500;transition:color .3s ease;margin-top:8px}
.forgot-password:hover{color:#ff6b35;text-decoration:underline}

@media (max-width: 768px) {.login-container{width:100%;padding:1rem;} .login-card{padding:2rem;max-width:100%;margin:0 auto;} .recovery-container{padding:1rem;} .recovery-container .login-card{margin:0 auto;}}
@media (max-width:480px){.login-card{padding:32px 24px;margin:0 16px}.system-title{font-size:22px}.login-input{padding:14px 44px 14px 14px;font-size:16px}.login-btn{padding:14px;font-size:16px}}
@media (max-width:360px){.login-card{padding:24px 20px}.system-title{font-size:20px}}