/* SmartDID V4.10 security login and logout controls */
.secure-login-page { margin: 0; min-height: 100vh; background: radial-gradient(circle at 15% 15%, #dbeafe 0, transparent 34%), radial-gradient(circle at 85% 10%, #dcfce7 0, transparent 30%), #f8fafc; color: #0f172a; }
.secure-login-shell { min-height: 100vh; display: grid; place-items: center; padding: 24px; }
.secure-login-card { width: min(100%, 440px); padding: clamp(25px, 5vw, 40px); border: 1px solid #dbe3ef; border-radius: 22px; background: rgba(255,255,255,.96); box-shadow: 0 24px 70px rgba(15,23,42,.14); }
.secure-login-brand { display: grid; width: 54px; height: 54px; place-items: center; margin-bottom: 17px; border-radius: 16px; background: linear-gradient(135deg,#1d4ed8,#0f766e); color: #fff; font-weight: 900; }
.security-status { display: inline-flex; align-items: center; gap: 8px; margin-bottom: 12px; color: #166534; font-size: 12px; font-weight: 800; }
.security-status span { width: 8px; height: 8px; border-radius: 50%; background: #22c55e; box-shadow: 0 0 0 4px rgba(34,197,94,.14); }
.secure-login-card h1 { margin-bottom: 8px; font-size: clamp(1.55rem,4vw,2rem); }
.secure-login-copy { margin-bottom: 22px; color: #64748b; line-height: 1.55; }
.secure-login-form { display: grid; gap: 15px; }
.secure-login-form label { display: block; margin-bottom: 6px; font-size: 13px; font-weight: 800; }
.secure-login-form input { box-sizing: border-box; width: 100%; min-height: 48px; padding: 11px 13px; border: 1px solid #cbd5e1; border-radius: 11px; background: #fff; font-size: 16px; }
.secure-login-form input:focus { outline: none; border-color: #2563eb; box-shadow: 0 0 0 4px rgba(37,99,235,.13); }
.secure-login-button { min-height: 49px; border: 0; border-radius: 11px; background: linear-gradient(135deg,#1d4ed8,#0f766e); color: #fff; font-size: 15px; font-weight: 850; cursor: pointer; }
.secure-login-button:hover { filter: brightness(1.04); }
.secure-login-foot { display: flex; flex-wrap: wrap; gap: 7px; margin-top: 20px; }
.secure-login-foot span { padding: 5px 8px; border-radius: 999px; background: #f1f5f9; color: #475569; font-size: 10px; font-weight: 750; }
.login-trap { position: absolute !important; left: -10000px !important; width: 1px !important; height: 1px !important; overflow: hidden !important; }
.logout-form { margin: 0; }
.logout-button { display: block; width: 100%; padding: 11px 14px; border: 0; background: #fff; color: #b91c1c; text-align: left; font: inherit; font-size: 12px; font-weight: 750; cursor: pointer; }
.logout-button:hover { background: #fef2f2; }
@media (max-width: 520px) { .secure-login-shell { padding: 14px; } .secure-login-card { border-radius: 17px; } }
