/* Shared standalone-page backdrop. Themes may override any --tp-circuit-* token. */
body[data-circuit-card] {
    --tp-circuit-base: #091521;
    --tp-circuit-accent: #38bdf8;
    --tp-circuit-grid-opacity: .065;
    --tp-circuit-line-opacity: .27;
    position: relative;
    isolation: isolate;
    min-height: 100vh;
    background-color: var(--tp-circuit-base);
    background-image: radial-gradient(ellipse at 50% 0, color-mix(in srgb, var(--tp-circuit-accent) 11%, transparent), transparent 70%);
}
body[data-circuit-card][class*="tp-theme-"] {
    --tp-circuit-base: var(--tp-bg, #091521);
    --tp-circuit-accent: var(--tp-primary, #1576f8);
}
body[data-circuit-card].tp-saas-admin-body {
    --tp-circuit-base: var(--panel-canvas, #0a2415);
    --tp-circuit-accent: var(--panel-accent-ink, #20df4b);
}
body[data-circuit-card].tp-panel-auth {
    --tp-circuit-base: #092718;
    --tp-circuit-accent: var(--panel-green, #20df4b);
}
body[data-circuit-card]::before,
body[data-circuit-card]::after { display: none; }
.tp-circuit-background {
    position: fixed;
    inset: 0;
    z-index: -1;
    overflow: hidden;
    pointer-events: none;
    user-select: none;
    color: var(--tp-circuit-accent);
    contain: strict;
}
.tp-circuit-background::before {
    content: "";
    position: absolute;
    inset: 0;
    opacity: var(--tp-circuit-grid-opacity);
    background-image: linear-gradient(currentColor 1px, transparent 1px), linear-gradient(90deg, currentColor 1px, transparent 1px);
    background-size: 48px 48px;
}
.tp-circuit-background canvas {
    display: block;
    width: 100%;
    height: 100%;
    opacity: var(--tp-circuit-line-opacity);
}
/* Replace the login's final hard-coded blue paint, not its form or layout. */
body[data-circuit-card] .login-card {
    background: var(--tp-surface, #0e1729);
    color: var(--tp-text, #f3f8ff);
    border-color: var(--tp-border, #315276);
}
body[data-circuit-card] .login-title { color: var(--tp-text, #f3f8ff); }
body[data-circuit-card] :is(.login-subtitle, .login-remember-choice) { color: var(--tp-muted, #b8c8dd); }
body[data-circuit-card] .login-central-note { color: var(--tp-text, #f3f8ff); }
body[data-circuit-card] .login-central-access {
    background: var(--tp-primary, #1576f8);
    border-color: var(--tp-primary, #1576f8);
    color: var(--tp-primary-foreground, #fff);
}
body[data-circuit-card] .login-language-switch { background: var(--tp-surface-soft, #192b42); border-color: var(--tp-border, #315276); }
body[data-circuit-card] .login-language-switch :is(a, button) { color: var(--tp-text, #b8c8dd); }
body[data-circuit-card] .login-language-switch .is-active { background: var(--tp-primary, #1576f8); color: var(--tp-primary-foreground, #fff); }
body[data-circuit-card] .tp-portal-shell { background: transparent; }
body[data-circuit-card] .tp-initial-setup-card .form-text { color: var(--tp-muted) !important; }
body[data-circuit-card] .mfa-card {
    --mfa-surface: var(--tp-surface);
    --mfa-text: var(--tp-text);
    --mfa-muted: var(--tp-muted);
    --mfa-accent: var(--tp-primary);
    --mfa-input: var(--tp-surface-soft);
    --mfa-border: var(--tp-border);
}
/* Checkout retains both payment columns and every PayPal control inside a bounded card. */
body[data-circuit-card=".payment-shell"] { padding: clamp(12px, 3vw, 40px); }
body[data-circuit-card] .payment-shell { min-height: calc(100vh - 80px); max-width: 1320px; margin: 0 auto; border-radius: 20px; overflow: hidden; }
@media (max-width: 600px) {
    body[data-circuit-card] { --tp-circuit-grid-opacity: .035; }
    body[data-circuit-card=".payment-shell"] { padding: 12px; }
    body[data-circuit-card] .payment-shell { border-radius: 14px; }
}
@media print {
    body[data-circuit-card] { background: none !important; }
    .tp-circuit-background { display: none !important; }
    body[data-circuit-card=".payment-shell"] { padding: 0; }
}