/* Parents brand layer (parents.ng), loaded after Baby Buddy's compiled Bootstrap 5.3 (app.css).
   Coral accent #F26B3A on the Bootstrap light theme. No SCSS rebuild: everything here
   overrides Bootstrap 5.3 CSS variables or the few upstream rules compiled for a dark page. */

:root,
[data-bs-theme="light"] {
  --bs-primary: #F26B3A;
  --bs-primary-rgb: 242, 107, 58;
  --bs-primary-text-emphasis: #8a3117;
  --bs-primary-bg-subtle: #fde5db;
  --bs-primary-border-subtle: #f9c2ad;
  --bs-link-color: #d9512a;
  --bs-link-color-rgb: 217, 81, 42;
  --bs-link-hover-color: #b8421f;
  --bs-link-hover-color-rgb: 184, 66, 31;
  --bs-body-bg: #fffaf7;
  --bs-tertiary-bg: #fff1ea;
}

.btn-primary {
  --bs-btn-bg: #F26B3A;
  --bs-btn-border-color: #F26B3A;
  --bs-btn-hover-bg: #d9512a;
  --bs-btn-hover-border-color: #d9512a;
  --bs-btn-active-bg: #b8421f;
  --bs-btn-active-border-color: #b8421f;
  --bs-btn-disabled-bg: #F26B3A;
  --bs-btn-disabled-border-color: #F26B3A;
  --bs-btn-focus-shadow-rgb: 242, 107, 58;
}

.btn-outline-primary {
  --bs-btn-color: #d9512a;
  --bs-btn-border-color: #F26B3A;
  --bs-btn-hover-bg: #F26B3A;
  --bs-btn-hover-border-color: #F26B3A;
  --bs-btn-active-bg: #d9512a;
  --bs-btn-active-border-color: #d9512a;
  --bs-btn-focus-shadow-rgb: 242, 107, 58;
}

.text-primary { color: #F26B3A !important; }
.bg-primary { background-color: #F26B3A !important; }
.border-primary { border-color: #F26B3A !important; }
.progress-bar { background-color: #F26B3A; }
.form-check-input:checked { background-color: #F26B3A; border-color: #F26B3A; }
.form-control:focus,
.form-select:focus { border-color: #f6a689; box-shadow: 0 0 0 .25rem rgba(242, 107, 58, .25); }
.page-link {
  --bs-pagination-color: #d9512a;
  --bs-pagination-hover-color: #b8421f;
  --bs-pagination-active-bg: #F26B3A;
  --bs-pagination-active-border-color: #F26B3A;
}
.nav-pills { --bs-nav-pills-link-active-bg: #F26B3A; }
.dropdown-menu { --bs-dropdown-link-active-bg: #F26B3A; }
.navbar .navbar-brand { font-weight: 600; }

/* Upstream compiled these for a dark page. Make them readable on a light one. */
.table {
  --bs-table-striped-bg: rgba(242, 107, 58, .06);
  --bs-table-striped-color: var(--bs-body-color);
  --bs-table-hover-bg: rgba(242, 107, 58, .12);
  --bs-table-hover-color: var(--bs-body-color);
}
.card-dashboard .list-group .list-group-item { color: var(--bs-body-color); }
.card-feeding,
.card-pumping { border-color: #F26B3A; }
.card-feeding .card-header,
.card-feeding .card-header a,
.card-pumping .card-header,
.card-pumping .card-header a { background-color: #F26B3A; }
.card-feeding .card-body,
.card-pumping .card-body { color: #d9512a; }
.timeline::before { background-color: #F26B3A; }
.timeline li .card::before { border-left-color: var(--bs-border-color); border-right-color: var(--bs-border-color); }
.timeline li .card::after { border-left-color: var(--bs-card-bg, #fff); border-right-color: var(--bs-card-bg, #fff); }

/* Dashboard timers card: upstream paints its title in near-white for the dark page, which reads as
   blank ("0 timers") on the light theme. Found in the browser on 2026-09-02. */
.card-dashboard.card-timer .card-body .card-title,
.card-dashboard.card-timer .card-body { color: var(--bs-body-color); }