/* ============================================================
   assets/css/theme.css — v10.5.1 (F2) THEMING LAYER
   Brand tokens mapped onto Bootstrap 5.3 CSS-variable API.
   Load order (page_open.php): bootstrap.min.css -> theme.css -> app.css -> pages/<page>.css
   No cascade layers on purpose: the Bootstrap dist is unlayered, and unlayered
   styles always beat layered author styles — layering this file would invert
   the override direction. Order + specificity carry the cascade instead.
   ============================================================ */

/* ---------- brand tokens (single source of truth) ----------
   Hindu spiritual identity (Paavan Chintan Dhara Ashram): kesariya
   saffron = renunciation/auspiciousness, maroon = devotion, cream =
   purity. Carried over from the legacy palette on purpose — do not
   "modernise" these into generic SaaS colours. Content/identity
   reference: pawansinhaguruji.com. */
:root {
    --pcd-primary: #F26522;        /* kesariya saffron */
    --pcd-primary-dark: #D94E0F;
    --pcd-primary-rgb: 242, 101, 34;
    --pcd-secondary: #800000;      /* maroon */
    --pcd-secondary-dark: #600000;
    --pcd-secondary-rgb: 128, 0, 0;
    --pcd-gold: #C9A227;           /* devotional accent — use sparingly (dividers, highlights) */
    --pcd-bg: #FFF5E6;             /* light cream */
    --pcd-surface: #FFFFFF;
    --pcd-text: #333333;
    --pcd-text-muted: #666666;
    --pcd-border: #E0E0E0;
    --pcd-shadow: 0 4px 20px rgba(0, 0, 0, 0.08);
    --pcd-radius: 0.5rem;          /* 8px  — inputs, buttons */
    --pcd-radius-lg: 0.9375rem;    /* 15px — cards, modals */
    --pcd-font: "Outfit", system-ui, -apple-system, "Segoe UI", Roboto, "Noto Sans", sans-serif;
}

/* ---------- Bootstrap root remap (light = brand default) ---------- */
:root,
[data-bs-theme="light"] {
    --bs-primary: var(--pcd-primary);
    --bs-primary-rgb: var(--pcd-primary-rgb);
    --bs-secondary: var(--pcd-secondary);
    --bs-secondary-rgb: var(--pcd-secondary-rgb);
    --bs-body-bg: var(--pcd-bg);
    --bs-body-color: var(--pcd-text);
    --bs-body-color-rgb: 51, 51, 51;
    --bs-secondary-color: var(--pcd-text-muted);
    --bs-border-color: var(--pcd-border);
    --bs-body-font-family: var(--pcd-font);
    --bs-border-radius: var(--pcd-radius);
    --bs-border-radius-lg: var(--pcd-radius-lg);
    --bs-heading-color: var(--pcd-secondary);
    --bs-link-color: var(--pcd-primary);
    --bs-link-color-rgb: var(--pcd-primary-rgb);
    --bs-link-hover-color: var(--pcd-primary-dark);
    --bs-link-hover-color-rgb: 217, 78, 15;
    --bs-focus-ring-color: rgba(var(--pcd-primary-rgb), 0.25);
}

/* ---------- dark scaffold (opt-in only; html keeps data-bs-theme="light"
     until a deliberate slice enables switching — flipping existing pages
     dark automatically would be a visual flow change) ---------- */
[data-bs-theme="dark"] {
    --pcd-bg: #1B1310;
    --pcd-surface: #261B16;
    --pcd-text: #ECE5DF;
    --pcd-text-muted: #B3A89F;
    --pcd-border: #43352C;
    --pcd-shadow: 0 4px 20px rgba(0, 0, 0, 0.45);
    --bs-body-bg: var(--pcd-bg);
    --bs-body-color: var(--pcd-text);
    --bs-body-color-rgb: 236, 229, 223;
    --bs-secondary-color: var(--pcd-text-muted);
    --bs-border-color: var(--pcd-border);
    --bs-heading-color: #F2A37C; /* maroon is unreadable on dark; lifted saffron */
    --bs-link-color: #F58A50;
    --bs-link-color-rgb: 245, 138, 80;
    --bs-link-hover-color: #F7A375;
    --bs-link-hover-color-rgb: 247, 163, 117;
}

/* ============================================================
   Component re-skins. The Bootstrap dist compiles component colours
   at build time, so without Sass each component is themed through its
   own CSS-variable API — this is the documented no-build path.
   ============================================================ */

/* Buttons: primary = saffron (CTAs), secondary = maroon (form submits) */
.btn-primary {
    --bs-btn-bg: var(--pcd-primary);
    --bs-btn-border-color: var(--pcd-primary);
    --bs-btn-hover-bg: var(--pcd-primary-dark);
    --bs-btn-hover-border-color: var(--pcd-primary-dark);
    --bs-btn-active-bg: var(--pcd-primary-dark);
    --bs-btn-active-border-color: var(--pcd-primary-dark);
    --bs-btn-disabled-bg: #9CA3AF;
    --bs-btn-disabled-border-color: #9CA3AF;
    --bs-btn-focus-shadow-rgb: var(--pcd-primary-rgb);
}

.btn-secondary {
    --bs-btn-bg: var(--pcd-secondary);
    --bs-btn-border-color: var(--pcd-secondary);
    --bs-btn-hover-bg: var(--pcd-secondary-dark);
    --bs-btn-hover-border-color: var(--pcd-secondary-dark);
    --bs-btn-active-bg: var(--pcd-secondary-dark);
    --bs-btn-active-border-color: var(--pcd-secondary-dark);
    --bs-btn-disabled-bg: #9CA3AF;
    --bs-btn-disabled-border-color: #9CA3AF;
    --bs-btn-focus-shadow-rgb: var(--pcd-secondary-rgb);
}

.btn-outline-primary {
    --bs-btn-color: var(--pcd-primary);
    --bs-btn-border-color: var(--pcd-primary);
    --bs-btn-hover-bg: var(--pcd-primary);
    --bs-btn-hover-border-color: var(--pcd-primary);
    --bs-btn-active-bg: var(--pcd-primary-dark);
    --bs-btn-active-border-color: var(--pcd-primary-dark);
    --bs-btn-focus-shadow-rgb: var(--pcd-primary-rgb);
}

.btn-outline-secondary {
    --bs-btn-color: var(--pcd-secondary);
    --bs-btn-border-color: var(--pcd-secondary);
    --bs-btn-hover-bg: var(--pcd-secondary);
    --bs-btn-hover-border-color: var(--pcd-secondary);
    --bs-btn-active-bg: var(--pcd-secondary-dark);
    --bs-btn-active-border-color: var(--pcd-secondary-dark);
    --bs-btn-focus-shadow-rgb: var(--pcd-secondary-rgb);
}

/* Forms: saffron focus treatment carried over from the legacy stylesheet */
.form-control:focus,
.form-select:focus {
    border-color: var(--pcd-primary);
    box-shadow: 0 0 0 0.25rem rgba(var(--pcd-primary-rgb), 0.12);
}

.form-check-input:checked {
    background-color: var(--pcd-primary);
    border-color: var(--pcd-primary);
}

.form-check-input:focus {
    border-color: var(--pcd-primary);
    box-shadow: 0 0 0 0.25rem rgba(var(--pcd-primary-rgb), 0.12);
}

input[type="checkbox"],
input[type="radio"] {
    accent-color: var(--pcd-primary);
}

/* Nav pills / pagination pick up the brand */
.nav-pills {
    --bs-nav-pills-link-active-bg: var(--pcd-primary);
}

.pagination {
    --bs-pagination-active-bg: var(--pcd-primary);
    --bs-pagination-active-border-color: var(--pcd-primary);
}

/* Progress + spinners default to saffron */
.progress-bar {
    background-color: var(--pcd-primary);
}

.spinner-border,
.spinner-grow {
    color: var(--pcd-primary);
}

/* Modals inherit the card treatment (top accent, large radius) */
.modal-content {
    --bs-modal-border-radius: var(--pcd-radius-lg);
    border-top: 5px solid var(--pcd-primary);
}