/*
 * Sign-in popup (components/frontend/auth-modal.blade.php, driven by auth.js).
 * Fields, notices and buttons come from forms.css.
 */

.zl-am .modal-dialog { max-width: 480px; }
.zl-am .modal-content { border: 0; border-radius: 24px; overflow: hidden; box-shadow: 0 30px 80px -30px rgba(10, 22, 51, .55); }
.zl-am [hidden] { display: none !important; }

.zl-am__head {
    display: flex; align-items: flex-start; justify-content: space-between; gap: 16px; padding: 22px 28px 18px; color: #fff;
    background: radial-gradient(420px 220px at 95% 0%, rgba(61, 139, 255, .4), transparent 60%), linear-gradient(150deg, #06102b 0%, #0a1d55 60%, #0d2f8a 100%);
}
.zl-am__kicker { display: block; margin-bottom: 6px; font-size: .72rem; font-weight: 600; letter-spacing: .08em; text-transform: uppercase; color: #9cc5ff; }
.zl-am__title { margin: 0; font-family: var(--zl-display); font-size: 1.45rem; font-weight: 700; letter-spacing: -.02em; color: #fff; }
.zl-am__head .btn-close { flex-shrink: 0; margin-top: 2px; filter: invert(1) grayscale(1) brightness(2); opacity: .8; }
.zl-am__head .btn-close:hover { opacity: 1; }

/* Sign in | Create account */
.zl-am__tabs { display: grid; grid-template-columns: 1fr 1fr; gap: 4px; margin: 18px 28px 0; padding: 4px; border-radius: 14px; background: var(--zl-soft); }
.zl-am__tab {
    height: 40px; border: 0; border-radius: 10px; background: transparent; color: var(--zl-muted);
    font-size: .92rem; font-weight: 600; cursor: pointer; transition: background-color .15s, color .15s, box-shadow .15s;
}
.zl-am__tab:hover { color: var(--zl-ink); }
.zl-am__tab.is-active { background: #fff; color: var(--zl-blue); box-shadow: 0 1px 3px rgba(15, 23, 42, .12); }
.zl-am__tab:focus-visible { outline: 2px solid var(--zl-blue); outline-offset: 2px; }

.zl-am__body { padding: 20px 28px 26px; }
.zl-am__body > .zl-notice, .zl-am .zl-form > .zl-notice { margin-bottom: 16px; }
.zl-am__lead { margin: 0 0 16px; color: var(--zl-muted); font-size: .92rem; line-height: 1.5; }
.zl-am__switch { margin: 18px 0 0; text-align: center; color: var(--zl-muted); font-size: .9rem; }
.zl-am__link { padding: 0; border: 0; background: none; color: var(--zl-blue); font-size: inherit; font-weight: 600; cursor: pointer; }
.zl-am__link:hover { text-decoration: underline; }
.zl-am__link:disabled { color: var(--zl-muted); text-decoration: none; cursor: default; }
.zl-label .zl-am__link { font-size: .82rem; }
.zl-am .zl-btn .spinner-border { width: 1rem; height: 1rem; border-width: .15em; }

/* Switching between sign in, create account and forgot password */
.zl-am [data-am-form] { animation: zl-am-in .2s ease; }
@keyframes zl-am-in { from { opacity: 0; transform: translateY(6px); } to { opacity: 1; transform: none; } }
@media (prefers-reduced-motion: reduce) { .zl-am [data-am-form] { animation: none; } }

/* Phones: the popup fills the screen (modal-fullscreen-sm-down) */
@media (max-width: 575.98px) {
    .zl-am .modal-content { border-radius: 0; }
    .zl-am__head { padding: 18px 20px 14px; }
    .zl-am__tabs { margin: 14px 20px 0; }
    .zl-am__body { padding: 16px 20px 28px; }
}
