/* ============================================================================
   brand-overrides.css — loaded LAST (usersc/templates/spacelab/header.php), after
   Bootstrap and the spacelab stylesheet, because theme.css loads BEFORE both and so
   cannot override them. Keep this file small: only rules that must beat Bootstrap.
   2026-09-27 (audit design-branding-6 / -8 / -9).
   ========================================================================== */

/* Primary buttons: spacelab's blue gradient sat beside the teal brand buttons. Remap
   Bootstrap's own variables so every .btn-primary / .btn-outline-primary matches, on
   every page, without touching them. White on #1f8169 = 4.77:1. .btn-success (green,
   usually "Approve") is deliberately left alone — that is a meaning, not a brand. */
.btn-primary {
  --bs-btn-color: #fff;
  --bs-btn-bg: var(--rc-btn-bg, #1f8169);
  --bs-btn-border-color: var(--rc-btn-bg, #1f8169);
  --bs-btn-hover-color: #fff;
  --bs-btn-hover-bg: var(--rc-btn-bg-hover, #17624f);
  --bs-btn-hover-border-color: var(--rc-btn-bg-hover, #17624f);
  --bs-btn-active-color: #fff;
  --bs-btn-active-bg: var(--rc-btn-bg-hover, #17624f);
  --bs-btn-active-border-color: var(--rc-btn-bg-hover, #17624f);
  --bs-btn-disabled-color: #fff;
  --bs-btn-disabled-bg: var(--rc-btn-bg, #1f8169);
  --bs-btn-disabled-border-color: var(--rc-btn-bg, #1f8169);
  --bs-btn-focus-shadow-rgb: 31,129,105;
  background-image: none;
  text-shadow: none;
}
.btn-outline-primary {
  --bs-btn-color: var(--rc-brand-ink, #1f8169);
  --bs-btn-border-color: var(--rc-brand-ink, #1f8169);
  --bs-btn-hover-color: #fff;
  --bs-btn-hover-bg: var(--rc-btn-bg, #1f8169);
  --bs-btn-hover-border-color: var(--rc-btn-bg, #1f8169);
  --bs-btn-active-color: #fff;
  --bs-btn-active-bg: var(--rc-btn-bg-hover, #17624f);
  --bs-btn-active-border-color: var(--rc-btn-bg-hover, #17624f);
  --bs-btn-focus-shadow-rgb: 31,129,105;
}
.text-primary { color: var(--rc-brand-ink, #1f8169) !important; }

/* The rest of Bootstrap's "primary" family (owner confirmed the brand ink, 2026-09-28):
   link-style buttons, .link-primary, pagination, and checked checkboxes/radios/switches
   were still spacelab blue. */
.btn-link {
  --bs-btn-color: var(--rc-brand-ink, #1f8169);
  --bs-btn-hover-color: var(--rc-btn-bg-hover, #17624f);
  --bs-btn-active-color: var(--rc-btn-bg-hover, #17624f);
}
.link-primary { color: var(--rc-brand-ink, #1f8169) !important; }
.link-primary:hover, .link-primary:focus { color: var(--rc-btn-bg-hover, #17624f) !important; }
.pagination {
  --bs-pagination-color: var(--rc-brand-ink, #1f8169);
  --bs-pagination-hover-color: var(--rc-btn-bg-hover, #17624f);
  --bs-pagination-focus-color: var(--rc-btn-bg-hover, #17624f);
  --bs-pagination-active-bg: var(--rc-btn-bg, #1f8169);
  --bs-pagination-active-border-color: var(--rc-btn-bg, #1f8169);
}
.form-check-input:checked {
  background-color: var(--rc-btn-bg, #1f8169);
  border-color: var(--rc-btn-bg, #1f8169);
}
.bg-primary { background-color: var(--rc-btn-bg, #1f8169) !important; }
.border-primary { border-color: var(--rc-btn-bg, #1f8169) !important; }

/* Keyboard focus: the dark navbar and both search boxes had no visible focus at all.
   :focus-visible only shows for keyboard users, so mouse clicks look unchanged. A white
   inner ring + teal outer ring reads on both light and dark surfaces. */
a:focus-visible, button:focus-visible, input:focus-visible, select:focus-visible,
textarea:focus-visible, summary:focus-visible, [tabindex]:focus-visible, .btn:focus-visible {
  outline: 3px solid var(--rc-brand, #2eaf96) !important;
  outline-offset: 2px !important;
  box-shadow: 0 0 0 2px #fff !important;
}

/* Pinch-zoom is allowed again (viewport no longer sets maximum-scale=1). The reason it
   was ever blocked is iOS zooming into any focused field under 16px — so make fields
   16px on phones instead of taking zoom away from everybody. */
@media (max-width: 600px) {
  input:not([type="checkbox"]):not([type="radio"]):not([type="range"]), select, textarea, .form-control, .form-select {
    font-size: 16px !important;
  }
}
