/**
 * sign-in-tabs.css — v1.8.36.8
 *
 * Tab strip styling for the tabbed /sign-in/ page (Sign in / Sign up).
 * Scoped to `.cits-wpel-auth-card [data-cwl-tab]` selectors so it can't
 * bleed into other surfaces.
 *
 * Colour tokens flow through `--cits-wpel-primary-color` (theme
 * inheritance — R48). No hardcoded hex outside the token references.
 */

.cits-wpel-auth-card .cits-wpel-auth-tabs {
    display: flex;
    gap: 0;
    margin: 0 0 24px 0;
    padding: 0;
    border-bottom: 1px solid var(--cits-wpel-border-color, #e5e7eb);
    background: transparent;
}

.cits-wpel-auth-card .cits-wpel-auth-tab {
    flex: 1 1 50%;
    appearance: none;
    -webkit-appearance: none;
    background: transparent;
    border: 0;
    border-bottom: 2px solid transparent;
    margin: 0 0 -1px 0;
    padding: 12px 16px;
    font-size: 15px;
    font-weight: 600;
    color: var(--cits-wpel-text-muted, #6b7280);
    cursor: pointer;
    line-height: 1.4;
    text-align: center;
    transition: color 120ms ease, border-color 120ms ease;
    box-shadow: none;
    border-radius: 0;
}

.cits-wpel-auth-card .cits-wpel-auth-tab:hover {
    color: var(--cits-wpel-text-strong, #111827);
}

.cits-wpel-auth-card .cits-wpel-auth-tab:focus-visible {
    outline: 2px solid var(--cits-wpel-primary-color, #ef4444);
    outline-offset: 2px;
    border-radius: 4px;
}

.cits-wpel-auth-card .cits-wpel-auth-tab[data-active="true"] {
    color: var(--cits-wpel-primary-color, #ef4444);
    border-bottom-color: var(--cits-wpel-primary-color, #ef4444);
}

.cits-wpel-auth-card .cits-wpel-auth-panel {
    /* Panels use hidden attribute for visibility; this is just a hook
       for future transitions or spacing overrides. */
}

.cits-wpel-auth-card .cits-wpel-auth-panel[hidden] {
    display: none;
}

/* When SignUpShortcode renders inside a panel it drops its own wrapper
   card so the tab strip's card provides the chrome. Skip the double
   padding + border in that case. */
.cits-wpel-auth-card--embedded {
    background: transparent;
    padding: 0;
    border: 0;
    box-shadow: none;
    margin: 0;
}