/* entraEd auth — split brand panel + high-contrast form shell */
.sl-auth, .sl-auth-verify {
    --a-navy: #111C44;
    --a-royal: #3657A4;
    --a-gold: #F4C542;
    --a-gold-hover: #E9B92F;
    --a-ice: #D5DEEE;
    --a-shell: #FFFFFF;
    --a-field-bg: #E6ECF5;
    --a-line: #C0CCE0;
    --a-field: #5F7294;
    --a-muted: #4F5D75;
    --a-text: #111C44;
    font-family: var(--font-body, "Inter", system-ui, sans-serif);
    color: var(--a-text);
}

.sl-auth {
    display: grid !important;
    grid-template-columns: minmax(0, 0.95fr) minmax(0, 1.05fr) !important;
    background: var(--a-ice) !important;
}
/* Always: brand image left, form right (desktop) */
.sl-auth > .sl-auth-panel,
.sl-auth > .right { order: 1; }
.sl-auth > .left,
.sl-auth > .sl-auth-form-side { order: 2; }

/* ---------- Brand panel ---------- */
.sl-auth .sl-auth-panel {
    position: sticky;
    top: 0;
    height: 100vh;
    min-height: 0 !important;
    padding: 40px clamp(40px, 4vw, 72px) 32px;
    text-align: left;
    background:
        radial-gradient(760px 420px at 12% -8%, rgba(118, 146, 214, 0.5), rgba(118, 146, 214, 0) 70%),
        radial-gradient(680px 420px at 105% 105%, rgba(17, 28, 68, 0.65), rgba(17, 28, 68, 0) 70%),
        linear-gradient(160deg, #2F4F9E 0%, var(--a-royal) 48%, #243F86 100%) !important;
    color: #fff;
    overflow: hidden;
    isolation: isolate;
}
.sl-auth-panel-rings {
    position: absolute;
    z-index: -1;
    right: -180px;
    top: 18%;
    width: 560px;
    height: 560px;
    border-radius: 50%;
    pointer-events: none;
    border: 1px solid rgba(255, 255, 255, 0.10);
    box-shadow:
        0 0 0 70px rgba(255, 255, 255, 0.025),
        0 0 0 71px rgba(255, 255, 255, 0.08),
        0 0 0 150px rgba(255, 255, 255, 0.02),
        0 0 0 151px rgba(255, 255, 255, 0.06);
}
.sl-auth-panel-inner {
    display: grid;
    grid-template-rows: auto minmax(0, 1fr) auto;
    height: 100%;
    width: 100%;
    max-width: 600px;
    margin: 0 auto;
}
.sl-auth-panel-logo { display: inline-flex; align-self: start; justify-self: start; }
.sl-auth-panel-logo img { height: 38px; width: auto; }
.sl-auth-panel-main {
    display: flex;
    flex-direction: column;
    justify-content: center;
    gap: clamp(24px, 4vh, 44px);
    min-height: 0;
    padding: clamp(20px, 3vh, 36px) 0;
}
.sl-auth-panel-copy { display: flex; flex-direction: column; gap: 16px; }
.sl-auth-eyebrow {
    display: inline-flex;
    align-self: flex-start;
    align-items: center;
    gap: 8px;
    margin: 0;
    padding: 6px 14px;
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.12);
    border: 1px solid rgba(255, 255, 255, 0.2);
    font-size: 13px;
    font-weight: 700;
    letter-spacing: 0.12em;
    text-transform: uppercase;
}
.sl-auth-eyebrow::before {
    content: "";
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: var(--a-gold);
}
.sl-auth-title {
    margin: 0;
    font-family: var(--font-heading, "Plus Jakarta Sans", system-ui, sans-serif);
    font-size: clamp(30px, 1rem + 1.6vw, 44px);
    font-weight: 700;
    line-height: 1.15;
    letter-spacing: -0.02em;
    color: #fff;
    text-wrap: balance;
}
.sl-auth-points {
    list-style: none;
    margin: 4px 0 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: 12px;
}
.sl-auth-points li {
    display: flex;
    align-items: center;
    gap: 12px;
    font-size: 16px;
    font-weight: 500;
    line-height: 1.4;
    color: rgba(255, 255, 255, 0.94);
}
.sl-auth-points .sl-icon {
    flex: 0 0 auto;
    width: 36px;
    height: 36px;
    padding: 9px;
    border-radius: 11px;
    background: rgba(255, 255, 255, 0.14);
    color: var(--a-gold);
}

.sl-auth-photo { position: relative; margin: 0; padding: 0 18px 18px 0; min-height: 0; }
.sl-auth-photo-frame { position: relative; display: block; isolation: isolate; }
.sl-auth-photo-frame::after {
    content: "";
    position: absolute;
    z-index: -1;
    inset: 18px -18px -18px 18px;
    border: 3px solid var(--a-gold);
    border-radius: 24px;
}
.sl-auth-photo img {
    display: block;
    width: 100%;
    height: clamp(220px, 38vh, 420px);
    object-fit: cover;
    object-position: center 30%;
    border-radius: 24px;
    box-shadow: 0 28px 56px rgba(8, 18, 56, 0.38);
}
.sl-auth-chip {
    position: absolute;
    display: inline-flex;
    align-items: center;
    gap: 8px;
    max-width: 62%;
    padding: 10px 14px;
    border-radius: 14px;
    background: rgba(255, 255, 255, 0.96);
    color: var(--a-navy);
    font-size: 14px;
    font-weight: 600;
    line-height: 1.3;
    box-shadow: 0 14px 30px rgba(8, 18, 56, 0.28);
}
.sl-auth-chip .sl-icon {
    flex: 0 0 auto;
    width: 28px;
    height: 28px;
    padding: 6px;
    border-radius: 9px;
    background: #E7EEFB;
    color: var(--a-royal);
}
.sl-auth-chip-1 { top: -16px; right: -4px; }
.sl-auth-chip-2 { left: -14px; bottom: 34px; }
.sl-auth-photo figcaption { padding-top: 26px; font-size: 12px; color: rgba(255, 255, 255, 0.72); }
.sl-auth-photo figcaption a { color: inherit; text-decoration: underline; }

.sl-auth-assure {
    display: flex;
    flex-wrap: wrap;
    gap: 10px 24px;
    list-style: none;
    margin: 0;
    padding: 18px 0 0;
    border-top: 1px solid rgba(255, 255, 255, 0.16);
}
.sl-auth-assure li {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    font-size: 14px;
    font-weight: 500;
    color: rgba(255, 255, 255, 0.86);
}
.sl-auth-assure .sl-icon { color: var(--a-gold); }

@media (max-height: 820px) {
    .sl-auth-title { font-size: clamp(26px, 0.8rem + 1.3vw, 36px); }
    .sl-auth-points { gap: 8px; }
    .sl-auth-points li { font-size: 15px; }
    .sl-auth-photo img { height: clamp(180px, 32vh, 300px); }
    .sl-auth-chip-2 { display: none; }
}
@media (max-height: 760px) {
    .sl-auth .sl-auth-panel { padding-top: 32px; padding-bottom: 24px; }
    .sl-auth-panel-main { gap: 20px; padding: 18px 0 22px; }
    .sl-auth-panel-copy { gap: 12px; }
    .sl-auth-photo img { height: clamp(150px, 25vh, 220px); }
    .sl-auth-assure { padding-top: 14px; }
}
@media (max-height: 640px) {
    .sl-auth-photo { display: none; }
}

/* ---------- Form side ---------- */
.sl-auth .left,
.sl-auth .sl-auth-form-side {
    background: var(--a-ice) !important;
    padding: 40px clamp(28px, 4vw, 56px) !important;
    display: flex;
    align-items: center;
}
.sl-auth .left .wrap {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
}
.sl-auth .zMain-signLog-content,
.sl-auth .sl-auth-form-shell {
    width: 100%;
    max-width: 480px;
    margin: 0 auto;
    padding: clamp(28px, 3.5vw, 40px);
    border: 1.5px solid var(--a-line);
    border-radius: 22px;
    background: var(--a-shell);
    box-shadow: 0 22px 48px rgba(17, 28, 68, 0.10);
}

.sl-auth-mobile-logo { display: none; margin-bottom: 22px; }
.sl-auth-mobile-logo img { height: 34px; width: auto; }

.sl-auth-form-head { margin-bottom: 28px; }
.sl-auth-h1,
.sl-auth-verify .sl-auth-h1 {
    margin: 0 0 10px !important;
    font-family: var(--font-heading, "Plus Jakarta Sans", system-ui, sans-serif);
    font-size: clamp(1.75rem, 1.5rem + 0.8vw, 2rem);
    font-weight: 700;
    line-height: 1.2;
    letter-spacing: -0.02em;
    color: var(--a-navy);
}
.sl-auth-lead,
.sl-auth .text-para-text,
.sl-auth-verify .text-para-text {
    margin: 0;
    font-size: 15.5px !important;
    font-weight: 500 !important;
    line-height: 1.55 !important;
    color: var(--a-muted) !important;
}
.sl-auth-inline-link,
.sl-auth .text-brand-primary,
.sl-auth-verify .text-brand-primary {
    color: var(--a-royal) !important;
    font-weight: 650;
    text-decoration: underline;
    text-underline-offset: 3px;
}

/* Audience switch */
.sl-auth-switch {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 4px;
    width: 100%;
    margin-bottom: 26px;
    padding: 5px;
    border: 1px solid var(--a-line);
    border-radius: 14px;
    background: #EEF2F8;
}
.sl-auth-switch a {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 42px;
    padding: 0 14px;
    border-radius: 10px;
    font-size: 14px;
    font-weight: 650;
    color: #4A5878;
    text-decoration: none;
    text-align: center;
    line-height: 1.25;
    transition: background-color 0.15s ease, color 0.15s ease, box-shadow 0.15s ease;
}
.sl-auth-switch a:hover { color: var(--a-navy); }
.sl-auth-switch a[aria-current="page"] {
    background: #fff;
    color: var(--a-navy);
    box-shadow: 0 2px 8px rgba(20, 28, 70, 0.12);
}
.sl-auth-switch a:focus-visible {
    outline: 2px solid var(--a-royal);
    outline-offset: 2px;
}

/* Fields — deliberately un-blended */
.sl-auth-form { display: flex; flex-direction: column; gap: 22px; }
.sl-auth-fields { display: flex; flex-direction: column; gap: 18px; }
.sl-auth-field-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 14px;
}
.sl-auth-field {
    display: flex;
    flex-direction: column;
    gap: 8px;
}
.sl-auth-label,
.sl-auth .zForm-label {
    margin: 0;
    padding: 0 !important;
    font-size: 13.5px !important;
    font-weight: 700 !important;
    letter-spacing: 0.01em;
    color: var(--a-navy) !important;
}
.sl-auth-label-row {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 12px;
}
.sl-auth-forgot {
    font-size: 13.5px;
    font-weight: 650;
    color: var(--a-royal) !important;
    text-decoration: underline;
    text-underline-offset: 2px;
    white-space: nowrap;
}

.sl-auth .zForm-control,
.sl-auth .sl-auth-input,
.sl-auth input.form-control,
.sl-auth select.form-control,
.sl-auth .sl-select-trigger {
    width: 100%;
    height: 54px !important;
    min-height: 54px !important;
    padding: 0 16px !important;
    border: 2px solid var(--a-field) !important;
    border-radius: 12px !important;
    background: var(--a-field-bg) !important;
    font-family: inherit;
    font-size: 16px !important;
    color: var(--a-text) !important;
    box-shadow: none !important;
    transition: border-color 0.15s, box-shadow 0.15s, background-color 0.15s;
}
.sl-auth .sl-select.is-open .sl-select-trigger,
.sl-auth .sl-select-trigger:focus-visible {
    border-color: var(--a-navy) !important;
    background: #fff !important;
    box-shadow: 0 0 0 4px rgba(54, 87, 164, 0.16) !important;
}
.sl-auth .zForm-control::placeholder,
.sl-auth .sl-auth-input::placeholder {
    color: #6B7A91 !important;
    opacity: 1;
}
.sl-auth .zForm-control:hover,
.sl-auth .sl-auth-input:hover {
    border-color: #6F82A0 !important;
}
.sl-auth .zForm-control:focus,
.sl-auth .sl-auth-input:focus,
.sl-auth .zForm-control:focus-visible,
.sl-auth .sl-auth-input:focus-visible {
    outline: none !important;
    border-color: var(--a-navy) !important;
    background: #fff !important;
    box-shadow: 0 0 0 4px rgba(54, 87, 164, 0.16) !important;
}
.sl-auth .zForm-control[aria-invalid="true"],
.sl-auth .sl-auth-input[aria-invalid="true"] {
    border-color: #C2410C !important;
}

.sl-auth-pass,
.sl-auth .passShowHide {
    position: relative;
}
.sl-auth-pass .sl-auth-input,
.sl-auth .passShowHide .zForm-control {
    padding-right: 48px !important;
}
.sl-auth .passShowHide .toggle-password {
    position: absolute;
    right: 14px;
    top: 50%;
    transform: translateY(-50%);
    border: 0;
    background: transparent;
    color: var(--a-muted) !important;
    cursor: pointer;
    padding: 6px;
    line-height: 1;
}
.sl-auth .passShowHide .toggle-password:hover,
.sl-auth .passShowHide .toggle-password:focus-visible {
    color: var(--a-navy) !important;
}

.sl-auth-error,
.sl-auth .text-danger {
    display: block;
    margin: 0;
    padding-top: 0 !important;
    font-size: 13px !important;
    font-weight: 600;
    color: #B42318 !important;
}
.sl-auth-hint {
    display: block;
    margin: 0;
    font-size: 13px;
    line-height: 1.45;
    color: var(--a-muted);
}

.sl-auth-agree { margin-top: -4px; }
.sl-auth-check {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    margin: 0;
    font-size: 14px;
    line-height: 1.5;
    color: var(--a-muted);
    cursor: pointer;
}
.sl-auth-check input {
    flex: 0 0 auto;
    width: 18px;
    height: 18px;
    margin-top: 2px;
    accent-color: var(--a-royal);
}
.sl-auth-check a {
    color: var(--a-royal);
    font-weight: 650;
    text-decoration: underline;
    text-underline-offset: 2px;
}

.sl-auth .sl-auth-submit,
.sl-auth-verify .sl-auth-submit {
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    width: 100%;
    min-height: 54px;
    padding: 0 22px !important;
    border: 0 !important;
    border-radius: 12px !important;
    background: var(--a-gold) !important;
    color: var(--a-navy) !important;
    font-family: inherit;
    font-size: 16px !important;
    font-weight: 750 !important;
    letter-spacing: 0.01em;
    cursor: pointer;
    box-shadow: 0 10px 22px rgba(244, 197, 66, 0.32);
    transition: background-color 0.15s;
}
.sl-auth .sl-auth-submit:hover {
    background: var(--a-gold-hover) !important;
}
.sl-auth .sl-auth-submit:focus-visible {
    outline: none;
    box-shadow: 0 0 0 3px #fff, 0 0 0 6px var(--a-navy);
}

.sl-auth-recaptcha { margin-top: -4px; }

/* Social */
.sl-auth .otherAuthWrap,
.sl-auth-social {
    padding-top: 8px;
    margin-top: 4px;
    border-top: 1px solid var(--a-line);
}
.sl-auth .otherAuthWrap .text {
    margin: 18px 0 14px;
    font-size: 13.5px !important;
    color: var(--a-muted) !important;
    text-align: center;
}
.sl-auth .authList {
    display: flex;
    justify-content: center;
    gap: 12px;
    list-style: none;
    margin: 0;
    padding: 0;
}
.sl-auth .authList .item {
    width: 52px !important;
    height: 52px !important;
    border: 1.5px solid var(--a-field) !important;
    border-radius: 14px !important;
    background: var(--a-field-bg) !important;
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    transition: border-color 0.15s, box-shadow 0.15s, background-color 0.15s;
}
.sl-auth .authList .item:hover {
    border-color: var(--a-navy) !important;
    background: #fff !important;
    box-shadow: 0 6px 16px rgba(17, 28, 68, 0.08);
}

.sl-auth-partner-help {
    margin-top: 8px;
    padding: 16px 18px;
    border-radius: 14px;
    background: var(--a-field-bg);
    border: 1.5px solid var(--a-line);
    font-size: 14.5px;
    line-height: 1.55;
    color: var(--a-muted);
}
.sl-auth-partner-help p { margin: 0; }
.sl-auth-partner-help p + p { padding-top: 10px; }
.sl-auth-partner-help strong { color: var(--a-navy); }
.sl-auth-partner-help a {
    color: var(--a-royal);
    font-weight: 650;
    text-decoration: underline;
    text-underline-offset: 2px;
}

.sl-auth-demo { margin-top: 18px; }
.sl-auth-demo-title {
    margin: 0 0 8px;
    font-size: 12.5px;
    font-weight: 700;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    color: var(--a-muted);
}
.sl-auth .login-info-table {
    border: 1.5px dashed var(--a-field);
    border-radius: 12px;
    padding: 6px;
    background: var(--a-field-bg);
}
.sl-auth .login-info-table .table { margin: 0; font-size: 13.5px; }
.sl-auth .login-info-table td {
    border: 0 !important;
    border-bottom: 1px solid var(--a-line) !important;
    padding: 9px 10px !important;
    cursor: pointer;
    color: var(--a-muted);
    background: transparent !important;
}
.sl-auth .login-info-table tr:last-child td { border-bottom: 0 !important; }
.sl-auth .login-info-table td:hover { color: var(--a-navy); background: #fff !important; }
.sl-auth .login-info-table td b { color: var(--a-navy); font-weight: 650; }

/* Verify email */
.sl-auth-verify {
    max-width: 560px;
    margin: 72px auto;
    padding: 40px;
    border: 1px solid var(--a-line);
    border-radius: 20px;
    background: #fff;
    box-shadow: 0 12px 32px rgba(17, 28, 68, 0.06);
}
.sl-auth-verify button {
    background: none;
    padding: 0;
    font: inherit;
    color: var(--a-royal);
    font-weight: 650;
    text-decoration: underline;
}

@media (max-width: 1199px) {
    .sl-auth .sl-auth-panel { padding: 36px 40px 28px; }
}
@media (max-width: 991px) {
    .sl-auth { grid-template-columns: minmax(0, 1fr) !important; }
    .sl-auth .sl-auth-panel { display: none; }
    .sl-auth .left,
    .sl-auth .sl-auth-form-side {
        min-height: 100vh;
        padding: 28px 20px !important;
        align-items: flex-start !important;
    }
    .sl-auth-mobile-logo { display: inline-flex; }
}
@media (max-width: 575px) {
    .sl-auth .zMain-signLog-content,
    .sl-auth .sl-auth-form-shell {
        padding: 22px 18px;
        border-radius: 18px;
    }
    .sl-auth-field-grid { grid-template-columns: 1fr; }
    .sl-auth-h1 { font-size: 1.6rem; }
    .sl-auth-verify { margin: 32px 16px; padding: 28px 20px; }
}