/* Line 15916 (upskill-security-1-r2, behind ai.features.security_upskill_1): the account pages and the private-agent
   gate on the Google-path tokens. A page opts in with class="ns-gp" on its own root and loads css/ns-tokens.css first
   (light by default, dark under prefers-color-scheme: dark). Every rule here is scoped to .ns-gp, so a page without
   the class looks exactly as before. The older sheets keep their layout; only their colour variables are re-pointed. */

/* ── /login and /register (.auth-page, the landing layout) ─────────────────────────────────────────────────────── */
.auth-page.ns-gp {
    --auth-bg-primary: var(--ns-bg);
    --auth-bg-secondary: var(--ns-card);
    --auth-bg-tertiary: var(--ns-surface);
    --auth-accent: var(--ns-gold);
    --auth-accent-hover: var(--ns-gold-deep);
    --auth-text-primary: var(--ns-text);
    --auth-text-secondary: var(--ns-text-2);
    --auth-text-muted: var(--ns-text-2);
    --auth-border: var(--ns-border-strong);
    --auth-focus-ring: 0 0 0 3px var(--ns-gold-glow);
    background: var(--ns-bg-deep);
    color: var(--ns-text);
    font-family: var(--ns-font);
}

body.ns-landing-page:has(.auth-page.ns-gp) {
    background: #f8f9fa;
}

@media (prefers-color-scheme: dark) {
    body.ns-landing-page:has(.auth-page.ns-gp) {
        background: #1b1c1f;
    }
}

.auth-page.ns-gp a:not([class*="btn"]) {
    color: var(--ns-gold-light);
}

.auth-page.ns-gp .auth-card {
    background: var(--ns-card);
    border: 1px solid var(--ns-border);
    border-radius: var(--ns-radius);
    box-shadow: 0 1px 2px rgba(60, 64, 67, .12), 0 2px 6px rgba(60, 64, 67, .1);
    color: var(--ns-text);
}

.auth-page.ns-gp :is(.auth-title, .auth-card h1, .auth-card h2, .retainer-title, .plan, .auth-plan-row-name, .auth-onboarding-note strong) {
    color: var(--ns-text);
}

.auth-page.ns-gp :is(.auth-subtitle, .auth-label, .form-text, .register-note, .plan-type, .plan-features li, .retainer-features,
    .auth-onboarding-note, .auth-plan-row-cycle, .auth-plan-row-tagline, .auth-plan-ladder-note, .auth-plan-assurance li,
    .auth-field-hint, .auth-legal-note, .auth-social-icons .fab) {
    color: var(--ns-text-2);
}

.auth-page.ns-gp :is(.form-control, input[type="text"], input[type="email"], input[type="password"]) {
    background: var(--ns-bg);
    border: 1px solid var(--ns-border-strong);
    color: var(--ns-text);
    border-radius: 8px;
}

.auth-page.ns-gp :is(.form-control, input):focus {
    border-color: var(--ns-gold);
    box-shadow: 0 0 0 3px var(--ns-gold-glow);
    outline: none;
}

.auth-page.ns-gp :is(.plan, .retainer-card, .auth-plan-row, .toggle-buttons .toggle-button, .auth-social-btn, .auth-social-btn-full) {
    background: var(--ns-card);
    border-color: var(--ns-border-strong);
    color: var(--ns-text);
}

.auth-page.ns-gp :is(.plan.featured, .toggle-buttons .toggle-button.active, .retainer-card .card-text, .auth-onboarding-note) {
    background: var(--ns-gold-glow) !important;
    border-color: var(--ns-gold-border);
    color: var(--ns-text) !important;
}

.auth-page.ns-gp :is(.plan-cost, .auth-plan-row-price, .plan-features li::before, .retainer-features .fa-circle-check, .auth-plan-assurance i) {
    color: var(--ns-gold-light);
}

.auth-page.ns-gp .auth-divider-line {
    border-color: var(--ns-border);
}

.auth-page.ns-gp :is(.auth-submit, .register-submit-btn, .btn-primary, .retainer-card .btn.btn-primary) {
    background: var(--ns-gold) !important;
    border-color: var(--ns-gold) !important;
    color: var(--ns-on-accent) !important;
    border-radius: 999px;
}

.auth-page.ns-gp :is(.auth-submit, .register-submit-btn, .btn-primary):hover {
    background: var(--ns-gold-deep) !important;
    border-color: var(--ns-gold-deep) !important;
}

.auth-page.ns-gp .invalid-feedback {
    color: #d93025;
}

/* ── /password/reset, /password/reset/{token}, /password/confirm, /email/verify (.auth-v2-page, layouts.app) ───── */
.auth-v2-page.ns-gp {
    --ns-bg-primary: var(--ns-bg-deep);
    --ns-bg-secondary: var(--ns-card);
    --ns-bg-tertiary: var(--ns-surface);
    --ns-accent: var(--ns-gold);
    --ns-accent-hover: var(--ns-gold-deep);
    --ns-text-primary: var(--ns-text);
    --ns-text-secondary: var(--ns-text-2);
    --ns-text-muted: var(--ns-text-2);
    --ns-input-bg: var(--ns-bg);
    --ns-input-border: var(--ns-border-strong);
    --ns-border: var(--ns-border-strong);
    --ns-focus-ring: 0 0 0 3px var(--ns-gold-glow);
    background: var(--ns-bg-deep);
    color: var(--ns-text);
    font-family: var(--ns-font);
}

.auth-v2-page.ns-gp .auth-v2-card {
    background: var(--ns-card);
    border: 1px solid var(--ns-border-strong);
    border-radius: var(--ns-radius);
    box-shadow: 0 1px 2px rgba(60, 64, 67, .12), 0 2px 6px rgba(60, 64, 67, .1);
}

.auth-v2-page.ns-gp :is(.auth-v2-title, label, .auth-v2-section-title) {
    color: var(--ns-text);
}

.auth-v2-page.ns-gp :is(.auth-v2-subtitle, .auth-v2-hint, .auth-v2-copy, .auth-v2-copy p, .auth-v2-list li) {
    color: var(--ns-text-2);
}

.auth-v2-page.ns-gp :is(input[type="text"], input[type="email"], input[type="password"], .form-control, .auth-v2-input, .auth-v2-input[readonly]) {
    background: var(--ns-bg);
    border-color: var(--ns-border-strong);
    color: var(--ns-text);
}

.auth-v2-page.ns-gp a:not([class*="btn"]) {
    color: var(--ns-gold-light);
}

.auth-v2-page.ns-gp :is(.auth-v2-btn, .btn, .btn-primary, .btn-info, .btn-success, .auth-v2-btn-primary) {
    color: var(--ns-on-accent) !important;
    border-radius: 999px;
}

.auth-v2-page.ns-gp :is(.auth-v2-info-box, .auth-v2-chip) {
    background: var(--ns-surface);
    border-color: var(--ns-border);
    color: var(--ns-text-2);
}

.auth-v2-page.ns-gp :is(.invalid-feedback, .alert-danger, .auth-v2-alert-danger, .auth-v2-alert-error) {
    color: #d93025;
}

.auth-v2-page.ns-gp :is(.alert-success, .auth-v2-alert-success) {
    color: #188038;
}

@media (prefers-color-scheme: dark) {
    .auth-page.ns-gp .invalid-feedback,
    .auth-v2-page.ns-gp :is(.invalid-feedback, .alert-danger, .auth-v2-alert-danger, .auth-v2-alert-error) {
        color: #f28b82;
    }

    .auth-v2-page.ns-gp :is(.alert-success, .auth-v2-alert-success) {
        color: #81c995;
    }

    .auth-page.ns-gp .auth-card,
    .auth-v2-page.ns-gp .auth-v2-card {
        box-shadow: 0 1px 3px rgba(0, 0, 0, .4), 0 4px 8px rgba(0, 0, 0, .25);
    }
}

/* ── The private-agent password gate (chats/partials/agent-password-gate) ───────────────────────────────────── */
.ns-agent-gate {
    min-height: 70vh;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 96px 16px 48px;
    background: var(--ns-bg-deep);
    color: var(--ns-text);
    font-family: var(--ns-font);
}

.ns-agent-gate__card {
    width: min(100%, 420px);
    background: var(--ns-card);
    border: 1px solid var(--ns-border);
    border-radius: var(--ns-radius);
    box-shadow: 0 1px 2px rgba(60, 64, 67, .12), 0 2px 6px rgba(60, 64, 67, .1);
    padding: 28px 24px;
}

.ns-agent-gate__title {
    font-size: 1.375rem;
    font-weight: 500;
    margin: 0 0 6px;
    color: var(--ns-text);
}

.ns-agent-gate__lead {
    margin: 0 0 20px;
    color: var(--ns-text-2);
    font-size: .95rem;
}

.ns-agent-gate__error {
    margin: 0 0 16px;
    color: #d93025;
    font-size: .9rem;
}

.ns-agent-gate__form {
    display: grid;
    gap: 10px;
}

.ns-agent-gate__label {
    font-weight: 500;
    font-size: .9rem;
    color: var(--ns-text);
}

.ns-agent-gate__input {
    width: 100%;
    min-height: 44px;
    padding: 10px 12px;
    border-radius: 8px;
    border: 1px solid var(--ns-border-strong);
    background: var(--ns-bg);
    color: var(--ns-text);
    font-size: 1rem;
}

.ns-agent-gate__input:focus {
    outline: none;
    border-color: var(--ns-gold);
    box-shadow: 0 0 0 3px var(--ns-gold-glow);
}

.ns-agent-gate__show {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    font-size: .9rem;
    color: var(--ns-text-2);
}

.ns-agent-gate__submit {
    margin-top: 8px;
    min-height: 44px;
    border: 0;
    border-radius: 999px;
    background: var(--ns-gold);
    color: var(--ns-on-accent);
    font-weight: 600;
    font-size: 1rem;
    cursor: pointer;
}

.ns-agent-gate__submit:hover {
    background: var(--ns-gold-deep);
}

.ns-agent-gate__submit:focus-visible {
    outline: none;
    box-shadow: 0 0 0 3px var(--ns-gold-glow);
}

@media (prefers-color-scheme: dark) {
    .ns-agent-gate__error {
        color: #f28b82;
    }
}