/*
 * Wallahs Academy brand type: Poppins, no serif anywhere.
 * Loaded LAST on every page so it wins over the prototype's stylesheets,
 * which used Figtree for text and Newsreader (a serif) for headings, figures
 * and the logo mark. Change the school's typeface here and nowhere else.
 */
:root {
  --wa-font: 'Poppins', system-ui, -apple-system, 'Segoe UI', Arial, sans-serif;
  --bs-body-font-family: var(--wa-font);
}

body,
h1, h2, h3, h4, h5, h6,
.page-title, .section-title, .brand-name, .brand-mark,
.step-num, .step h3, .fee, .pay-card .fee-big, .modal-ref,
.ref-card .ref-id, .doc-preview .doc-title, .summary-head h2,
.btn, .form-control, .form-select, .form-label, .badge, .status-badge,
.dropdown-item, .modal-title, .alert {
  font-family: var(--wa-font) !important;
}

/* Poppins is wider and rounder than the serif it replaces: headings sit a
   touch smaller and lose the serif's tight tracking. */
h1, h2, h3, .page-title, .brand-name { font-weight: 600; letter-spacing: 0; }
.page-title { font-size: clamp(1.5rem, 3.2vw, 2rem); }
.brand-mark { font-weight: 600; }

/* Codes stay monospaced, so WA-2026-4F7K2P is easy to read back. */
code, kbd, pre, .font-monospace { font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace !important; }

/* The prototype only themed FILLED primary buttons, so every OUTLINED button
   and link fell back to Bootstrap's blue. One purple, everywhere. */
.btn-outline-primary {
  --bs-btn-color: var(--wa-primary, #614A96); --bs-btn-border-color: var(--wa-primary, #614A96);
  --bs-btn-hover-color: #fff; --bs-btn-hover-bg: var(--wa-primary, #614A96); --bs-btn-hover-border-color: var(--wa-primary, #614A96);
  --bs-btn-active-color: #fff; --bs-btn-active-bg: var(--wa-primary-dark, #4a3776); --bs-btn-active-border-color: var(--wa-primary-dark, #4a3776);
  --bs-btn-focus-shadow-rgb: 97, 74, 150;
}
.btn-primary { --bs-btn-focus-shadow-rgb: 97, 74, 150; }
.btn-link, a:not(.btn):not(.nav-link):not(.dropdown-item):not(.stat-card):not(.portal-brand) { --bs-link-color-rgb: 97, 74, 150; }
.form-check-input:checked { background-color: var(--wa-primary, #614A96); border-color: var(--wa-primary, #614A96); }
.form-control:focus, .form-select:focus { border-color: #b9aed0; box-shadow: 0 0 0 .2rem rgba(97, 74, 150, .15); }
.pagination { --bs-pagination-color: var(--wa-primary, #614A96); --bs-pagination-active-bg: var(--wa-primary, #614A96);
  --bs-pagination-active-border-color: var(--wa-primary, #614A96); --bs-pagination-focus-box-shadow: 0 0 0 .2rem rgba(97, 74, 150, .15); }
