/* ============================================================
   PanaROXY — Intake & Welcome Styles
   panama-intake.css
   ============================================================ */

/* --- Fonts -------------------------------------------------- */
@import url('https://fonts.googleapis.com/css2?family=Lora:ital,wght@0,400;0,500;1,400&family=DM+Sans:wght@300;400;500&display=swap');

/* --- Variables --------------------------------------------- */
:root {
    --pr-teal:        #0F6E56;
    --pr-teal-mid:    #1D9E75;
    --pr-teal-light:  #E1F5EE;
    --pr-teal-border: #9FE1CB;
    --pr-warm:        #F7F3EE;
    --pr-warm-mid:    #EDE8E0;
    --pr-warm-border: #D9D2C7;
    --pr-text:        #1C1C1A;
    --pr-text-mid:    #5A564F;
    --pr-text-muted:  #9B9590;
    --pr-concern:     #993C1D;
    --pr-concern-bg:  #FAECE7;
    --pr-concern-bdr: #F0997B;
    --pr-white:       #FFFFFF;
    --pr-radius-sm:   6px;
    --pr-radius-md:   12px;
    --pr-radius-lg:   20px;
    --pr-radius-xl:   32px;
    --pr-font-display: 'Lora', Georgia, serif;
    --pr-font-body:    'DM Sans', sans-serif;
    --pr-transition:   0.18s ease;
}

/* --- Base --------------------------------------------------- */
.panama-intake-wrap,
.panama-welcome-wrap {
    font-family: var(--pr-font-body);
    color: var(--pr-text);
    max-width: 560px;
    margin: 1rem auto 2rem;
    padding: 1.5rem 2.25rem 2rem;
    background: #ffffff;
    border-radius: var(--pr-radius-lg);
    box-shadow: 0 4px 24px rgba(0,0,0,0.08), 0 1px 4px rgba(0,0,0,0.05);
}

/* --- Brand header ------------------------------------------ */
.pr-brand-header {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 1.25rem;
}

.pr-brand-header--logo-only {
    margin-bottom: 1.5rem;
}

/* Logo image already includes the wordmark — hide duplicate label (old JS too). */
.pr-brand-header .pr-brand-logo + .pr-brand-name {
    display: none;
}

.pr-brand-mark {
    font-size: 1.2rem;
    line-height: 1;
}

.pr-brand-logo {
    display: block;
    width: auto;
    max-width: 240px;
    height: auto;
    max-height: 48px;
}

body.panama-dark .pr-brand-logo {
    max-width: 260px;
    max-height: 52px;
}

.pr-brand-name {
    font-family: var(--pr-font-display);
    font-size: 1rem;
    font-weight: 500;
    color: var(--pr-teal);
    letter-spacing: 0.01em;
}

/* --- Progress bar ------------------------------------------ */
.pr-progress {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 1.75rem;
}

.pr-progress-bar {
    flex: 1;
    height: 4px;
    background: var(--pr-warm-mid);
    border-radius: 2px;
    overflow: hidden;
}

.pr-progress-fill {
    height: 100%;
    background: var(--pr-teal-mid);
    border-radius: 2px;
    transition: width 0.4s ease;
}

.pr-progress-label {
    font-size: 11px;
    color: var(--pr-text-muted);
    font-weight: 500;
    white-space: nowrap;
    min-width: 40px;
    text-align: right;
    letter-spacing: 0.03em;
    text-transform: uppercase;
}

/* --- Step card --------------------------------------------- */
.pr-step {
    display: none;
    animation: prFadeUp 0.3s ease forwards;
}

.pr-step.active {
    display: block;
}

@keyframes prFadeUp {
    from { opacity: 0; transform: translateY(12px); }
    to   { opacity: 1; transform: translateY(0); }
}

/* --- Optional intro/framing line (Río voice) -------------- */
.pr-intro {
    font-size: 0.95rem;
    line-height: 1.55;
    color: var(--pr-text-muted);
    font-style: italic;
    margin: 0 0 1.25rem 0;
    padding-left: 0.75rem;
    border-left: 2px solid var(--pr-teal);
}

/* --- Question text ----------------------------------------- */
.pr-question {
    font-family: var(--pr-font-display);
    font-size: 1.5rem;
    font-weight: 400;
    line-height: 1.3;
    color: var(--pr-text);
    margin-bottom: 0.35rem;
}

.pr-subtext {
    font-size: 0.875rem;
    color: var(--pr-text-muted);
    margin-bottom: 1.25rem;
    line-height: 1.5;
}

/* --- Text inputs ------------------------------------------- */
.pr-input {
    width: 100%;
    font-family: var(--pr-font-body);
    font-size: 1rem;
    font-weight: 300;
    color: var(--pr-text);
    background: #ffffff !important;
    border: 1.5px solid var(--pr-warm-border) !important;
    border-radius: var(--pr-radius-md);
    padding: 0.875rem 1.125rem;
    outline: none;
    transition: border-color var(--pr-transition), box-shadow var(--pr-transition);
    -webkit-appearance: none;
    box-shadow: 0 1px 3px rgba(0,0,0,0.06);
}

.pr-input:focus {
    border-color: var(--pr-teal-mid) !important;
    box-shadow: 0 0 0 3px rgba(29, 158, 117, 0.12) !important;
    outline: none !important;
}

.pr-input::placeholder {
    color: var(--pr-text-muted);
    font-weight: 300;
}

/* --- Chip grid --------------------------------------------- */
.pr-chips {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-bottom: 0.5rem;
}

.pr-chip {
    font-family: var(--pr-font-body);
    font-size: 0.875rem;
    font-weight: 400;
    padding: 0.5rem 1rem;
    border-radius: var(--pr-radius-lg);
    border: 1.5px solid var(--pr-warm-border);
    background: var(--pr-white);
    color: var(--pr-text-mid);
    cursor: pointer;
    transition: border-color var(--pr-transition),
                background var(--pr-transition),
                color var(--pr-transition),
                transform 0.1s ease;
    user-select: none;
    -webkit-tap-highlight-color: transparent;
}

.pr-chip:hover {
    border-color: var(--pr-teal-border);
    color: #ffffff;
}

.pr-chip:active {
    transform: scale(0.97);
}

.pr-chip.selected {
    background: var(--pr-teal);
    border-color: var(--pr-teal);
    color: #ffffff;
    font-weight: 500;
}

.pr-chip.selected::before {
    content: '✓ ';
    font-weight: 700;
}

/* Concern chips — warm palette */
.pr-chip.concern {
    border-color: var(--pr-concern-bdr);
    color: var(--pr-concern);
    background: var(--pr-concern-bg);
}

.pr-chip.concern:hover {
    border-color: var(--pr-concern);
    background: #f5d8d0;
}

.pr-chip.concern.selected {
    background: var(--pr-concern);
    border-color: var(--pr-concern);
    color: #ffffff;
    font-weight: 500;
}

.pr-chip.concern.selected::before {
    content: '✓ ';
    font-weight: 700;
}

/* Max-select hint */
.pr-chip-hint {
    font-size: 0.75rem;
    color: var(--pr-text-muted);
    margin-top: 6px;
    margin-bottom: 1.25rem;
    min-height: 1rem;
    transition: color var(--pr-transition);
}

.pr-chip-hint.warn {
    color: var(--pr-concern);
}

/* --- Textarea ---------------------------------------------- */
.pr-textarea {
    width: 100%;
    font-family: var(--pr-font-body);
    font-size: 0.9375rem;
    font-weight: 300;
    color: var(--pr-text);
    background: var(--pr-white);
    border: 1.5px solid var(--pr-warm-border);
    border-radius: var(--pr-radius-md);
    padding: 0.875rem 1.125rem;
    outline: none;
    resize: none;
    min-height: 90px;
    line-height: 1.6;
    transition: border-color var(--pr-transition), box-shadow var(--pr-transition);
    margin-top: 1.25rem;
}

.pr-textarea:focus {
    border-color: var(--pr-teal-mid);
    box-shadow: 0 0 0 3px rgba(29, 158, 117, 0.12);
}

.pr-textarea::placeholder {
    color: var(--pr-text-muted);
    font-weight: 300;
}

.pr-textarea-label {
    font-size: 0.875rem;
    color: var(--pr-text-mid);
    margin-top: 1.5rem;
    margin-bottom: 0.4rem;
    display: block;
}

/* --- Navigation buttons ------------------------------------ */
.pr-nav {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-top: 1.5rem;
    gap: 12px;
}

.pr-btn-next {
    font-family: var(--pr-font-body);
    font-size: 0.9375rem;
    font-weight: 500;
    color: var(--pr-white);
    background: var(--pr-teal);
    border: none;
    border-radius: var(--pr-radius-md);
    padding: 0.75rem 1.75rem;
    cursor: pointer;
    transition: background var(--pr-transition), transform 0.1s ease;
    margin-left: auto;
}

.pr-btn-next:hover {
    background: var(--pr-teal-mid);
}

.pr-btn-next:active {
    transform: scale(0.98);
}

.pr-btn-next:disabled {
    background: var(--pr-warm-mid);
    color: var(--pr-text-muted);
    cursor: not-allowed;
    transform: none;
}

.pr-btn-back {
    font-family: var(--pr-font-body);
    font-size: 0.875rem;
    font-weight: 400;
    color: var(--pr-text-muted);
    background: none;
    border: none;
    cursor: pointer;
    padding: 0.5rem 0;
    transition: color var(--pr-transition);
}

.pr-btn-back:hover {
    color: var(--pr-text-mid);
}

/* --- Error message ----------------------------------------- */
.pr-error {
    font-size: 0.8125rem;
    color: var(--pr-concern);
    margin-top: 0.5rem;
    min-height: 1.2rem;
}

/* --- Submit spinner ---------------------------------------- */
.pr-btn-next .pr-spinner {
    display: inline-block;
    width: 14px;
    height: 14px;
    border: 2px solid rgba(255,255,255,0.35);
    border-top-color: #fff;
    border-radius: 50%;
    animation: prSpin 0.7s linear infinite;
    vertical-align: middle;
    margin-right: 6px;
}

@keyframes prSpin {
    to { transform: rotate(360deg); }
}

/* --- Divider ----------------------------------------------- */
.pr-divider {
    border: none;
    border-top: 1px solid var(--pr-warm-mid);
    margin: 1.5rem 0;
}

/* --- Account fields (Q8, Q9) ------------------------------- */
.pr-account-note {
    font-size: 0.8125rem;
    color: var(--pr-teal);
    background: var(--pr-teal-light);
    border-radius: var(--pr-radius-md);
    padding: 0.75rem 1rem;
    margin-bottom: 1.5rem;
    line-height: 1.6;
    border: 1px solid var(--pr-teal-border);
    text-align: center;
    font-weight: 500;
}

/* --- Welcome page ------------------------------------------ */
.panama-welcome-wrap {
    text-align: center;
    padding-top: 1.5rem;
}

.pr-welcome-icon {
    font-size: 2.5rem;
    margin-bottom: 1.25rem;
    display: block;
}

.pr-welcome-heading {
    font-family: var(--pr-font-display);
    font-size: 2rem;
    font-weight: 400;
    line-height: 1.25;
    margin-bottom: 1rem;
    color: var(--pr-text);
}

.pr-welcome-heading em {
    font-style: italic;
    color: var(--pr-teal);
}

.pr-welcome-greeting {
    font-size: 1rem;
    color: var(--pr-text-mid);
    line-height: 1.7;
    max-width: 420px;
    margin: 0 auto 0.5rem;
    min-height: 2rem;
}

.pr-welcome-dots {
    display: inline-flex;
    gap: 6px;
    align-items: center;
    height: 1.5rem;
}

.pr-welcome-dots span {
    display: inline-block;
    width: 8px;
    height: 8px;
    background: var(--pr-teal-border);
    border-radius: 50%;
    animation-name: prDotPulse !important;
    animation-duration: 1.2s !important;
    animation-timing-function: ease-in-out !important;
    animation-iteration-count: infinite !important;
    animation-play-state: running !important;
}

.pr-welcome-dots span:nth-child(2) { animation-delay: 0.2s !important; }
.pr-welcome-dots span:nth-child(3) { animation-delay: 0.4s !important; }

@keyframes prDotPulse {
    0%, 80%, 100% { transform: scale(0.65); opacity: 0.35; }
    40%           { transform: scale(1);    opacity: 1;    }
}

.pr-welcome-sub {
    font-size: 0.875rem;
    color: var(--pr-text-muted);
    margin-bottom: 2.5rem;
}

.pr-btn-start {
    display: inline-block;
    font-family: var(--pr-font-body);
    font-size: 1rem;
    font-weight: 500;
    color: var(--pr-white);
    background: var(--pr-teal);
    border: none;
    border-radius: var(--pr-radius-md);
    padding: 0.875rem 2.5rem;
    cursor: pointer;
    text-decoration: none;
    transition: background var(--pr-transition), transform 0.1s ease;
}

.pr-btn-start:hover {
    background: var(--pr-teal-mid);
    text-decoration: none;
    color: var(--pr-white);
}

.pr-btn-start:active {
    transform: scale(0.98);
}

.pr-welcome-redirect {
    font-size: 0.75rem;
    color: var(--pr-text-muted);
    margin-top: 1rem;
}

/* --- Mobile ------------------------------------------------ */
@media (max-width: 480px) {
    .panama-intake-wrap,
    .panama-welcome-wrap {
        padding: 0.75rem 1rem 2.5rem;
    }

    .pr-question {
        font-size: 1.3rem;
    }

    .pr-chip {
        font-size: 0.8125rem;
        padding: 0.45rem 0.875rem;
    }

    .pr-btn-next {
        width: 100%;
        text-align: center;
    }

    .pr-nav {
        flex-direction: column-reverse;
        align-items: stretch;
    }

    .pr-btn-back {
        text-align: center;
    }
}

/* Hide chat widget on intake, welcome, and login pages */
.page-id-40 #panama-chat-widget,
.page-id-40 #panama-mobile-trigger,
.page-id-43 #panama-chat-widget,
.page-id-43 #panama-mobile-trigger,
.page-id-45 #panama-chat-widget,
.page-id-45 #panama-mobile-trigger {
    display: none !important;
}

/* ── Login page ─────────────────────────────────────────── */
.pr-login-wrap {
    display: flex;
    justify-content: center;
    padding: 1rem 1rem 2rem;
}

.pr-login-card {
    background: #ffffff;
    border-radius: 16px;
    border: 1px solid #E8E4DC;
    padding: 2.5rem 2rem;
    width: 100%;
    max-width: 420px;
    display: flex;
    flex-direction: column;
    gap: 1rem;
}

.pr-login-icon {
    font-size: 2rem;
    text-align: center;
}

.pr-login-heading {
    font-family: 'DM Sans', sans-serif;
    font-size: 1.6rem;
    font-weight: 600;
    color: #2C2C2A;
    text-align: center;
    margin: 0;
}

.pr-login-sub {
    font-family: 'DM Sans', sans-serif;
    font-size: 0.95rem;
    color: #7C7870;
    text-align: center;
    margin: 0;
}

.pr-login-error {
    background: #FEF2F2;
    border: 1px solid #FCA5A5;
    border-radius: 8px;
    color: #991B1B;
    font-size: 0.9rem;
    padding: 0.75rem 1rem;
    font-family: 'DM Sans', sans-serif;
}

.pr-remember-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    font-family: 'DM Sans', sans-serif;
    font-size: 0.9rem;
    color: #5A564F;
}

.pr-remember-label {
    display: flex;
    align-items: center;
    gap: 6px;
    cursor: pointer;
}

.pr-forgot-link {
    background: none;
    border: none;
    color: #0F6E56;
    font-family: 'DM Sans', sans-serif;
    font-size: 0.9rem;
    cursor: pointer;
    padding: 0;
    text-decoration: underline;
}

.pr-forgot-link:hover {
    color: #085041;
}

.pr-login-register {
    font-family: 'DM Sans', sans-serif;
    font-size: 0.9rem;
    color: #7C7870;
    text-align: center;
    margin: 0;
}

.pr-login-register a {
    color: #0F6E56;
    text-decoration: none;
}

.pr-login-register a:hover {
    text-decoration: underline;
}

.pr-login-card .pr-btn-primary {
    font-family: var(--pr-font-body);
    font-size: 0.9375rem;
    font-weight: 500;
    color: #ffffff !important;
    background: #0F6E56 !important;
    border: none !important;
    border-radius: 12px;
    padding: 0.75rem 1.75rem;
    width: 100%;
    cursor: pointer;
    transition: background 0.18s ease;
}

.pr-login-card .pr-btn-primary:hover {
    background: #1D9E75 !important;
}

.pr-login-card .pr-btn-primary:disabled {
    background: #EDE8E0 !important;
    color: #9B9590 !important;
    cursor: not-allowed;
}

/* ── Suppress WooCommerce footer credit on intake/login/welcome pages ── */
.site-info a[href*="woocommerce"],
.site-info a[href*="WooCommerce"] { display: none !important; }

/* ── Storefront theme overrides ──────────────────────────────────────────
   This stylesheet is ONLY loaded on register / login / welcome pages,
   so these global-looking rules are safe — they won't affect the rest
   of the site.
   ─────────────────────────────────────────────────────────────────────── */

/* 1. Hide the theme page title ("Register", "Login", "Welcome") */
.entry-header {
    display: none !important;
}

/* 2. Hide breadcrumb ("Home > Login" etc.) */
.woocommerce-breadcrumb,
.storefront-breadcrumb,
nav.breadcrumb,
.breadcrumb-trail {
    display: none !important;
}

/* 3. Remove the generous top padding Storefront adds above page content */
.site-content .col-full {
    padding-top: 0 !important;
}

/* 3b. Astra — same fix (site uses Astra, not Storefront) */
body #content,
body .site-content,
body .site-content > .ast-container,
body .ast-separate-container .ast-article-single,
body .ast-container,
body #primary {
    padding-top: 0 !important;
    margin-top: 0 !important;
}

/* 4. Strip the big bottom margin WordPress adds to page articles */
.hentry {
    margin-bottom: 0 !important;
}

/* 5. Pull the entry-content flush — our form/card supplies its own spacing */
.entry-content {
    padding-top: 0 !important;
    margin-top: 0 !important;
}

/* 6. Cream page background so the white card floats on it */
body {
    background-color: #F5F0E6 !important;
}

/* 7. Constrain the card width — Astra stretches entry-content to full width,
      so we need to force max-width on the wrap itself with higher specificity */
.entry-content .panama-intake-wrap,
.entry-content .panama-welcome-wrap,
body .panama-intake-wrap,
body .panama-welcome-wrap {
    max-width: 560px !important;
    width: 100% !important;
    box-sizing: border-box !important;
}

/* 8. Hide "Powered by Astra WordPress Theme" footer credit */
.site-info,
.site-footer .site-info,
[class*="ast-footer-copyright"],
.footer-widget-area + .site-info {
    display: none !important;
}

/* ============================================================
   DARK MODE — intake / register / login (v1, 2026-05-10)
   ============================================================
   Activated by body.panama-dark (set by the wp_body_open inline
   script in panama-assistant.php — same bootstrap used by the
   chat page). Toggle for the intake surface is not visible
   here; users carry their dark choice over from the chat page
   via localStorage, or arrive with OS prefers-color-scheme:dark.

   Strategy: override the existing CSS custom properties under
   body.panama-dark. The :root variables at the top of this
   file are wired into nearly every rule via var(--pr-*), so
   redefining them lights up the entire flow without touching
   any individual rule. A handful of hardcoded values (page
   bg !important, login card colors, login error block) need
   targeted overrides too.

   Palette mirrors the chat page so visual identity carries
   over from registration into the chat experience.
   ------------------------------------------------------------ */

body.panama-dark {
    /* Surfaces */
    --pr-warm:        #1a2d27;   /* was beige #F7F3EE — secondary surface */
    --pr-warm-mid:    #13201c;   /* progress bar track */
    --pr-warm-border: #345a51;   /* input + chip border */
    --pr-white:       #13201c;   /* the "card" bg used by many rules */

    /* Accent (brand teal, brightened for AA contrast on dark) */
    --pr-teal:        #37c19e;
    --pr-teal-mid:    #25a17e;
    --pr-teal-light:  #13201c;   /* account-note bg — keep dark */
    --pr-teal-border: #2a6a55;

    /* Text */
    --pr-text:        #e6efea;
    --pr-text-mid:    #a8b9b2;
    --pr-text-muted:  #6a7b75;

    /* Concern (the orange warning chips) — desaturated for dark */
    --pr-concern:     #f0a888;
    --pr-concern-bg:  #2a1814;
    --pr-concern-bdr: #6a3a28;
}

/* Page background — the !important rule at line 694 needs an !important to win */
body.panama-dark { background-color: #0e1614 !important; }

/* Intake + welcome card wrappers — hardcoded #ffffff in the base rule */
body.panama-dark .panama-intake-wrap,
body.panama-dark .panama-welcome-wrap {
    background: #13201c;
    color: var(--pr-text);
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.45);
}

/* Input fields — base rule has `background: #ffffff !important` so we need !important too */
body.panama-dark .pr-input,
body.panama-dark .pr-textarea {
    background: #1a2d27 !important;
    color: var(--pr-text);
    border-color: var(--pr-warm-border);
}
body.panama-dark .pr-input::placeholder,
body.panama-dark .pr-textarea::placeholder { color: var(--pr-text-muted); }
body.panama-dark .pr-input:focus,
body.panama-dark .pr-textarea:focus {
    border-color: var(--pr-teal);
    box-shadow: 0 0 0 3px rgba(55, 193, 158, 0.18);
}

/* Date / select inputs (browser-native chrome) */
body.panama-dark .pr-input[type="date"],
body.panama-dark select.pr-input {
    color-scheme: dark;
}
body.panama-dark .pr-input[type="date"]::-webkit-calendar-picker-indicator {
    filter: invert(0.85);
}

/* Chip rows — neutral state */
body.panama-dark .pr-chip {
    background: #1a2d27;
    border-color: var(--pr-warm-border);
    color: var(--pr-text-mid);
}
body.panama-dark .pr-chip:hover {
    background: #243a32;
    border-color: var(--pr-teal-border);
    color: var(--pr-text);
}
body.panama-dark .pr-chip.selected {
    background: var(--pr-teal);
    border-color: var(--pr-teal);
    color: #0e1614;
}

/* Worries step — warm concern palette (not brand teal) */
body.panama-dark .pr-chip.concern {
    border-color: var(--pr-concern-bdr);
    color: var(--pr-concern);
    background: var(--pr-concern-bg);
}
body.panama-dark .pr-chip.concern:hover {
    border-color: var(--pr-concern);
    background: #3a2218;
    color: #f0c0a8;
}
body.panama-dark .pr-chip.concern.selected {
    background: #b85a38;
    border-color: #b85a38;
    color: #fff;
}

/* Account-note callout — keep teal accent but on dark bg */
body.panama-dark .pr-account-note {
    background: rgba(55, 193, 158, 0.08);
    color: #7fdcc1;
    border-color: var(--pr-teal-border);
}

/* Skip / back link */
body.panama-dark .pr-btn-back { color: var(--pr-text-muted); }
body.panama-dark .pr-btn-back:hover { color: var(--pr-teal); }

/* Primary CTA — make the teal bg → near-black text for legibility */
body.panama-dark .pr-btn-next,
body.panama-dark .pr-btn-start {
    background: var(--pr-teal);
    color: #0e1614;
}
body.panama-dark .pr-btn-next:hover,
body.panama-dark .pr-btn-start:hover {
    background: var(--pr-teal-mid);
    color: #0e1614;
}
body.panama-dark .pr-btn-next:disabled {
    background: #243a32;
    color: var(--pr-text-muted);
}

/* Error helper text */
body.panama-dark .pr-error { color: #f08070; }

/* Welcome-card icon / heading / sub */
body.panama-dark .pr-welcome-heading { color: var(--pr-text); }
body.panama-dark .pr-welcome-heading em { color: var(--pr-teal); }
body.panama-dark .pr-welcome-greeting,
body.panama-dark .pr-welcome-sub { color: var(--pr-text-mid); }
body.panama-dark .pr-welcome-dots span { background: var(--pr-teal-border); }

/* Brand mark in header */
body.panama-dark .pr-brand-name { color: var(--pr-teal); }

/* ── Login card (panama-login.php) ─────────────────────────
   The login card uses hardcoded #ffffff bg + #E8E4DC border
   rather than the var(--pr-*) tokens, so it needs its own
   override block. */
body.panama-dark .pr-login-card {
    background: #13201c;
    border-color: var(--pr-warm-border);
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.45);
}
body.panama-dark .pr-login-heading { color: var(--pr-text); }
body.panama-dark .pr-login-error {
    background: #2a1414;
    border-color: #6a3030;
    color: #f08070;
}
body.panama-dark .pr-login-sub,
body.panama-dark .pr-login-link { color: var(--pr-text-mid); }
body.panama-dark .pr-login-link:hover { color: var(--pr-teal); }

/* Page chrome below the theme header — card sits on dark field
   (header/footer/header logo: panama-chat.css site-wide block). */
body.panama-dark .entry-content,
body.panama-dark .site-content,
body.panama-dark .ast-container,
body.panama-dark #content,
body.panama-dark #page {
    background: transparent;
    color: var(--pr-text);
}