/* Acceso ARC: estilos propios, independientes de librerias externas. */
.arc-login { margin: 0; color: #203b55; background: #1b1b1b; font-family: 'Spartan', 'Segoe UI', Arial, sans-serif; font-weight: 300; }
.arc-login *, .arc-login *::before, .arc-login *::after { box-sizing: border-box; }
.arc-login [hidden] { display: none !important; }
.arc-login button, .arc-login input { font: inherit; }
.arc-login button { cursor: pointer; touch-action: manipulation; }
.login-layout { display: grid; grid-template-columns: 7fr 5fr; min-height: 100vh; min-height: 100svh; }
.login-showcase { min-width: 0; position: relative; }
.login-slides { position: sticky; top: 0; height: 100vh; height: 100svh; color: #fff; background: #1b1b1b; overflow: hidden; }
.login-slide { position: absolute; inset: 0; }
.slide-image { position: absolute; inset: 0; background-size: cover; background-position: center; filter: brightness(.9); }
.image-one { background-image: url('img-1.jpg'); }
.image-two { background-image: url('img-2.jpg'); }
.image-three { background-image: url('img-3.jpg'); }
.slide-caption { position: absolute; inset: auto 8% 5%; text-align: center; font-size: clamp(16px, 1.45vw, 25px); font-weight: 600; line-height: 1.5; }
.slide-caption p { margin: 4px 0; }
.slide-caption kbd { padding: 3px 6px; background: #212529; border-radius: 2px; }
.slide-arrow { position: absolute; top: 0; bottom: 20%; width: 12%; border: 0; background: transparent; color: #fff; opacity: .65; font: 52px Arial !important; }
.slide-arrow:hover { opacity: 1; }
.previous { left: 0; }
.next { right: 0; }
.slide-controls { position: absolute; bottom: 12px; left: 0; right: 0; display: flex; align-items: center; justify-content: center; gap: 6px; }
.slide-controls button { width: 30px; height: 24px; padding: 0; border: 0; background: linear-gradient(#ffffff70, #ffffff70) center / 100% 3px no-repeat; }
.slide-controls button[aria-current='true'] { background-image: linear-gradient(#fff, #fff); }
.slide-controls .slide-pause { background: transparent; color: white; font-size: 15px; }
.login-area { display: flex; flex-direction: column; min-width: 0; min-height: 100vh; min-height: 100svh; background: linear-gradient(155deg, #bcdcf7 0%, #e5f2fd 48%, #fff 100%); }
.login-header { padding: 24px 48px 16px; text-align: center; margin-bottom: auto; }
.login-brand { display: block; width: min(100%, 260px); height: auto; max-height: 86px; object-fit: contain; margin: auto; filter: brightness(0) saturate(100%) invert(27%) sepia(63%) saturate(1191%) hue-rotate(176deg) brightness(91%) contrast(96%); }
.login-panel { width: 100%; max-width: 560px; padding: 24px 48px; margin: auto; }
.login-panel h1 { font-size: 34px; line-height: 1.2; font-weight: 600; text-align: center; margin: 0 0 24px; }
.remembered-profile { max-width: 390px; margin: 0 auto 24px; overflow: hidden; border-radius: 18px; background: #fff; text-align: center; box-shadow: 0 14px 35px rgba(34,83,127,.13); }
.profile-cover { height: 92px; background: linear-gradient(135deg, #bcdcf7, #6aa9df); }
.profile-avatar-wrap { position: relative; width: 135px; height: 135px; margin: -62px auto 12px; }
.profile-avatar-wrap img { display: block; width: 100%; height: 100%; object-fit: cover; border: 6px solid white; border-radius: 50%; }
.profile-info { padding: 16px 24px 18px; }
.login-button { display: block; width: 100%; min-height: 50px; padding: 12px 16px; border: 1px solid #155b98; border-radius: 4px; color: white; background: #155b98; font-size: 16px !important; font-weight: 600 !important; line-height: 1.5; }
.login-button:hover:not(:disabled) { background: #104a7d; border-color: #104a7d; }
.login-button:disabled { opacity: .7; cursor: wait; }
.arc-login button:focus-visible, .arc-login input:focus-visible { outline: 3px solid #418ecf; outline-offset: 3px; }
.remembered-change { display: inline-block; border: 0; padding: 12px 4px; min-height: 44px; color: #315c80; background: transparent; text-decoration: underline; font-size: 14px !important; font-weight: 600 !important; }
.profile-auth-active { margin-bottom: 16px; }
.field-group { margin-bottom: 24px; }
.field-group label { display: block; margin-bottom: 8px; line-height: 1.5; }
.field-group input { display: block; width: 100%; min-height: 50px; padding: 10px 12px; border: 1px solid #dce8f3; border-radius: 4px; color: #203b55; background: #f2f7fc; font-size: 16px; font-weight: 600; line-height: 1.5; }
.field-group input::placeholder { color: #677f94; opacity: 1; }
.field-group input:focus { background: #fff; border-color: #6aa9df; box-shadow: 0 0 0 3px rgba(65,142,207,.16); outline: none; }
.login-message { padding: 12px 16px; margin: 0 0 20px; border: 1px solid #efb9bf; border-radius: 4px; color: #842029; background: #f8d7da; font-size: 14px; font-weight: 600; line-height: 1.6; overflow-wrap: anywhere; }
.login-status { margin: 12px 0 0; color: #315c80; font-size: 13px; line-height: 1.6; }
.login-footer { margin-top: auto; padding: 24px 32px; text-align: center; font-size: 16px; line-height: 1.5; color: #315c80; }
.login-footer p { margin: 0; }
@media (max-width: 991px) {
    .login-layout { grid-template-columns: 1fr; }
    .login-showcase { display: none; }
    .login-header { padding: 24px; }
    .login-panel { padding: 24px 32px; }
}
@media (max-width: 767px) {
    .login-brand { width: 190px; max-width: 78vw; max-height: 64px; }
    .login-panel { padding: 24px 20px; }
    .login-panel h1 { font-size: clamp(24px, 6.5vw, 32px); margin-bottom: 20px; }
    .remembered-profile { max-width: 340px; margin-bottom: 18px; }
    .profile-cover { height: 76px; }
    .profile-avatar-wrap { width: 88px; height: 88px; margin-top: -42px; }
    .profile-info { padding-left: 18px; padding-right: 18px; }
    .login-footer { padding: 24px 20px max(24px, env(safe-area-inset-bottom)); font-size: 12px; }
}
@media (prefers-reduced-motion: reduce) { .arc-login { scroll-behavior: auto; } }