/* Google-path presentation for the signed-in webform family. All color comes from design-system tokens. */
.ns-gp-webforms {
    color-scheme: dark;
    background: var(--ns-bg-primary);
    color: var(--ns-text-primary);
    font-family: var(--ns-font-family, Roboto, "Segoe UI", system-ui, sans-serif);
    font-size: var(--ns-text-base, 16px);
}

html[data-bs-theme="light"] .ns-gp-webforms {
    color-scheme: light;
}

.ns-gp-webforms :is(main, .auth-page, .auth-v2-page, .onb-container, .ns-onboard-shell, .ns-chat-settings-page, .history-container, .ns-bsuccess-page) {
    background-color: var(--ns-bg-primary);
    color: var(--ns-text-primary);
}

.ns-gp-webforms :is(.card, .auth-card, .auth-v2-card, form, .onb-card, .onb-summary-card, .ns-settings-card, .history-card, .phone-enroll__card) {
    background: var(--ns-bg-surface);
    color: var(--ns-text-primary);
    border-color: var(--ns-border);
    border-radius: var(--ns-radius-lg, 12px);
    box-shadow: var(--ns-elev-1);
}

.ns-gp-webforms :is(h1, .auth-title, .auth-v2-title, .onb-title, .history-title) {
    color: var(--ns-text-primary);
    font-size: var(--ns-text-2xl, 32px);
    line-height: 1.2;
    letter-spacing: -0.02em;
}

.ns-gp-webforms :is(h2, .card-title, .ns-section-header) {
    color: var(--ns-text-primary);
    font-size: var(--ns-text-xl, 24px);
}

.ns-gp-webforms :is(p, small, .text-muted, .auth-subtitle, .auth-v2-subtitle, .auth-v2-hint, .form-text) {
    color: var(--ns-text-secondary) !important;
}

.ns-gp-webforms :is(input, select, textarea, .form-control, .form-select) {
    min-height: 44px;
    background: var(--ns-bg-secondary);
    color: var(--ns-text-primary);
    border: 1px solid var(--ns-border-strong);
    border-radius: var(--ns-radius-md, 8px);
}

.ns-gp-webforms :is(input, select, textarea, button, a, .btn):focus-visible {
    outline: var(--ns-focus-ring-width, 2px) solid var(--ns-focus-ring, var(--ns-accent));
    outline-offset: 2px;
}

.ns-gp-webforms :is(button, .btn, [role="button"], input[type="submit"]) {
    min-height: 44px;
    transition: color var(--ns-dur-hover) var(--ns-ease-out), background-color var(--ns-dur-hover) var(--ns-ease-out), border-color var(--ns-dur-hover) var(--ns-ease-out), transform var(--ns-dur-press) var(--ns-ease-out);
}

.ns-gp-webforms :is(.btn-primary, .auth-submit, .auth-v2-submit, button[type="submit"], input[type="submit"]) {
    background: var(--ns-accent);
    border-color: var(--ns-accent);
    color: var(--ns-accent-text);
}

.ns-gp-webforms :is(.table, table) {
    color: var(--ns-text-primary);
    border-color: var(--ns-border);
}

.ns-gp-webforms :is(.table-responsive, .history-table-wrap) {
    overflow-x: auto;
    overscroll-behavior-inline: contain;
}

@media (prefers-color-scheme: light) {
    html:not([data-bs-theme]) .ns-gp-webforms {
        color-scheme: light;
    }
}

@media (max-width: 575.98px) {
    .ns-gp-webforms :is(.auth-card, .auth-v2-card, .card-body, .ns-settings-card-body, .phone-enroll__card) {
        padding: var(--ns-space-5, 20px);
    }

    .ns-gp-webforms :is(h1, .auth-title, .auth-v2-title, .onb-title, .history-title) {
        font-size: var(--ns-text-xl, 24px);
    }

    .ns-gp-webforms :is(.container, .auth-shell, .auth-v2-shell, .onb-container) {
        max-width: 100%;
        padding-inline: var(--ns-space-3, 12px);
    }
}

@media (prefers-reduced-motion: reduce) {
    .ns-gp-webforms :is(button, .btn, [role="button"], input[type="submit"]) {
        transition-duration: 0ms;
    }
}
