.secondary-auth-mask {
    position: fixed;
    inset: 0;
    z-index: 200000;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 16px;
    overflow-y: auto;
    background: rgba(15, 23, 42, .58);
    backdrop-filter: blur(2px);
}

.secondary-auth-dialog {
    width: min(480px, calc(100vw - 32px));
    max-height: calc(100vh - 32px);
    max-height: calc(100dvh - 32px);
    overflow-y: auto;
    box-sizing: border-box;
    padding: 0;
    color: #172033;
    background: #fff;
    border: 1px solid rgba(208, 213, 221, .78);
    border-radius: 8px;
    box-shadow: 0 24px 64px rgba(15, 23, 42, .28);
}

.secondary-auth-heading {
    display: grid;
    grid-template-columns: 36px minmax(0, 1fr);
    gap: 12px;
    align-items: start;
    padding: 24px 24px 20px;
    border-bottom: 1px solid #eaecf0;
}

.secondary-auth-heading-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 36px;
    color: #2563eb;
    font-size: 18px;
    font-weight: 700;
    line-height: 1;
    background: #eff6ff;
    border-radius: 50%;
}

.secondary-auth-dialog--setup .secondary-auth-heading-icon {
    color: #b54708;
    background: #fffaeb;
}

.secondary-auth-dialog--setup .secondary-auth-heading {
    padding-bottom: 18px;
    border-bottom: 0;
}

.secondary-auth-dialog--setup .secondary-auth-actions {
    margin-top: 0;
}

.secondary-auth-dialog h2 {
    margin: 1px 0 5px;
    color: #172033;
    font-size: 20px;
    font-weight: 650;
    line-height: 1.4;
    letter-spacing: 0;
}

.secondary-auth-dialog p {
    margin: 0;
    color: #667085;
    font-size: 14px;
    line-height: 1.65;
    letter-spacing: 0;
}

.secondary-auth-form {
    padding: 20px 24px 0;
}

.secondary-auth-dialog label {
    display: block;
    margin: 14px 0 7px;
    color: #344054;
    font-size: 13px;
    font-weight: 600;
    line-height: 1.4;
    letter-spacing: 0;
}

.secondary-auth-form > label:first-child {
    margin-top: 0;
}

.secondary-auth-control {
    position: relative;
}

.secondary-auth-control__prefix,
.secondary-auth-control__suffix {
    position: absolute;
    top: 50%;
    z-index: 1;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 20px;
    height: 20px;
    color: #667085;
    font-size: 14px;
    line-height: 1;
    pointer-events: none;
    transform: translateY(-50%);
}

.secondary-auth-control__prefix {
    left: 12px;
}

.secondary-auth-control__suffix {
    right: 12px;
    font-size: 16px;
}

.secondary-auth-control:focus-within .secondary-auth-control__prefix,
.secondary-auth-control:focus-within .secondary-auth-control__suffix {
    color: #2563eb;
}

.secondary-auth-dialog select,
.secondary-auth-dialog input {
    width: 100%;
    min-height: 44px;
    box-sizing: border-box;
    margin: 0;
    padding: 10px 12px 10px 42px;
    color: #101828;
    font: inherit;
    font-size: 14px;
    line-height: 22px;
    letter-spacing: 0;
    background: #fff;
    border: 0;
    border-radius: 7px;
    box-shadow: 0 0 0 1px #d0d5dd inset;
    transition: box-shadow .18s ease, background-color .18s ease;
}

.secondary-auth-dialog select {
    padding-right: 42px;
    cursor: pointer;
    appearance: none;
    -webkit-appearance: none;
}

.secondary-auth-dialog input::placeholder {
    color: #98a2b3;
}

.secondary-auth-dialog select:hover,
.secondary-auth-dialog input:hover {
    box-shadow: 0 0 0 1px #98a2b3 inset;
}

.secondary-auth-dialog select:focus-visible,
.secondary-auth-dialog input:focus-visible {
    outline: none;
    box-shadow: 0 0 0 1px #528bff inset, 0 0 0 3px rgba(37, 99, 235, .1);
}

.secondary-auth-dialog input.is-invalid {
    box-shadow: 0 0 0 1px #f04438 inset, 0 0 0 3px rgba(240, 68, 56, .1);
}

.secondary-auth-email-row {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 8px;
}

.secondary-auth-email-row .secondary-auth-control {
    min-width: 0;
}

.secondary-auth-email-row button {
    min-width: 108px;
    min-height: 44px;
    padding: 0 13px;
    color: #344054;
    font-size: 13px;
    font-weight: 600;
    white-space: nowrap;
    background: #fff;
    border: 1px solid #d0d5dd;
    border-radius: 7px;
    cursor: pointer;
}

.secondary-auth-email-row button:hover:not(:disabled) {
    color: #175cd3;
    border-color: #84adff;
    background: #f5f8ff;
}

.secondary-auth-email-row button:disabled,
.secondary-auth-actions button:disabled {
    opacity: .55;
    cursor: not-allowed;
}

.secondary-auth-error {
    margin-top: 10px;
    color: #b42318;
    font-size: 13px;
    line-height: 1.5;
}

.secondary-auth-error:empty {
    display: none;
}

.secondary-auth-sr-only {
    position: absolute !important;
    width: 1px !important;
    height: 1px !important;
    padding: 0 !important;
    margin: -1px !important;
    overflow: hidden !important;
    clip: rect(0, 0, 0, 0) !important;
    white-space: nowrap !important;
    border: 0 !important;
}

.secondary-auth-link {
    margin-top: 13px;
    color: #667085;
    font-size: 13px;
    line-height: 1.6;
}

.secondary-auth-link a {
    color: #175cd3;
    font-weight: 600;
    text-decoration: none;
}

.secondary-auth-link a:hover {
    text-decoration: underline;
}

.secondary-auth-actions {
    display: flex;
    justify-content: flex-end;
    gap: 10px;
    margin-top: 22px;
    padding: 16px 24px;
    border-top: 1px solid #eaecf0;
    background: #f8fafc;
}

.secondary-auth-actions button,
.secondary-auth-actions a {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 96px;
    min-height: 42px;
    box-sizing: border-box;
    padding: 0 16px;
    color: #344054;
    font-size: 14px;
    font-weight: 600;
    line-height: 1;
    letter-spacing: 0;
    text-decoration: none;
    background: #fff;
    border: 1px solid #d0d5dd;
    border-radius: 7px;
    cursor: pointer;
}

.secondary-auth-actions button i,
.secondary-auth-actions a i {
    font-size: 13px;
    line-height: 1;
}

.secondary-auth-actions button i {
    margin-right: 7px;
}

.secondary-auth-actions a i {
    margin-left: 8px;
}

.secondary-auth-actions button:hover:not(:disabled),
.secondary-auth-actions a:hover {
    background: #f9fafb;
    border-color: #98a2b3;
}

.secondary-auth-actions button.primary,
.secondary-auth-actions a.primary {
    color: #fff;
    background: #2563eb;
    border-color: #2563eb;
}

.secondary-auth-actions button.primary:hover:not(:disabled),
.secondary-auth-actions a.primary:hover {
    background: #1d4ed8;
    border-color: #1d4ed8;
}

.secondary-auth-dialog button:focus-visible,
.secondary-auth-dialog a:focus-visible {
    outline: 3px solid rgba(37, 99, 235, .22);
    outline-offset: 2px;
}

.swal2-container.secondary-auth-toast {
    z-index: 200100 !important;
}

@media (max-width: 480px) {
    .secondary-auth-mask {
        align-items: flex-end;
        padding: 12px;
    }

    .secondary-auth-dialog {
        width: 100%;
        max-height: calc(100vh - 24px);
        max-height: calc(100dvh - 24px);
    }

    .secondary-auth-heading {
        grid-template-columns: 32px minmax(0, 1fr);
        gap: 10px;
        padding: 20px 18px 17px;
    }

    .secondary-auth-heading-icon {
        width: 32px;
        height: 32px;
        font-size: 16px;
    }

    .secondary-auth-dialog h2 {
        font-size: 18px;
    }

    .secondary-auth-form {
        padding: 17px 18px 0;
    }

    .secondary-auth-actions {
        display: grid;
        grid-template-columns: 1fr 1fr;
        padding: 14px 18px 18px;
    }

    .secondary-auth-actions button,
    .secondary-auth-actions a {
        width: 100%;
        min-width: 0;
    }

    .secondary-auth-email-row {
        grid-template-columns: 1fr;
    }

    .secondary-auth-email-row button {
        width: 100%;
    }
}