/* =========================================================
   Cedar Christian School - Theme Overrides
   Primary:   #181d38
   Secondary: #fdcf1a
   Load this AFTER Bootstrap + theme CSS (style.css)
   ========================================================= */

:root {
  --ccs-primary: #181d38;
  --ccs-primary-hover: #12162a;
  --ccs-secondary: #fdcf1a;
  --ccs-secondary-hover: #f3c400;
  --ccs-on-primary: #ffffff;
  --ccs-on-secondary: #181d38;
  
  /* Bootstrap CSS variables override for secondary */
  --bs-secondary: #fdcf1a !important;
  --bs-secondary-rgb: 253, 207, 26 !important;
  --bs-secondary-bg-subtle: rgba(253, 207, 26, 0.15) !important;
  --bs-secondary-border-subtle: rgba(253, 207, 26, 0.3) !important;
  --bs-secondary-text-emphasis: #f3c400 !important;
}

/* ---------- Background utilities ---------- */
.bg-primary {
  background-color: var(--ccs-primary) !important;
}

.bg-secondary {
  background-color: #fdcf1a !important;
}

/* Theme-specific aliases used in `assets/css/style.css` */
.pro-bg-primary,
.badge-primary {
  background-color: var(--ccs-primary) !important;
}

/* Light variants (used by some widgets) */
.bg-primary-light {
  background-color: rgba(24, 29, 56, 0.12) !important;
}

.bg-secondary-light {
  background-color: rgba(253, 207, 26, 0.18) !important;
}

/* Badge secondary */
.badge-secondary {
  background-color: #fdcf1a !important;
  color: var(--ccs-on-secondary) !important;
}

/* Alert secondary */
.alert-secondary {
  background-color: rgba(253, 207, 26, 0.15) !important;
  border-color: #fdcf1a !important;
  color: var(--ccs-on-secondary) !important;
}

/* Table secondary */
.table-secondary,
.table-secondary > th,
.table-secondary > td {
  background-color: #fdcf1a !important;
  color: var(--ccs-on-secondary) !important;
}

/* Progress bar secondary */
.progress-bar-secondary {
  background-color: #fdcf1a !important;
}

/* List group secondary */
.list-group-item-secondary {
  background-color: rgba(253, 207, 26, 0.15) !important;
  color: var(--ccs-on-secondary) !important;
}

/* Any other secondary color references */
a.text-secondary:hover,
a.text-secondary:focus {
  color: #f3c400 !important;
}

/* ---------- Text utilities ---------- */
.text-primary,
.dropdown-menu > li > a.text-primary {
  color: var(--ccs-primary) !important;
}

.text-secondary {
  color: #fdcf1a !important;
}

/* ---------- Border utilities ---------- */
.border-primary {
  border-color: var(--ccs-primary) !important;
}

.border-secondary {
  border-color: #fdcf1a !important;
}

/* ---------- Buttons ---------- */
.btn-primary {
  background-color: var(--ccs-primary) !important;
  border-color: var(--ccs-primary) !important;
  color: var(--ccs-on-primary) !important;
}

.btn-primary:hover,
.btn-primary:focus,
.btn-primary:active,
.btn-primary.active,
.show > .btn-primary.dropdown-toggle {
  background-color: var(--ccs-primary-hover) !important;
  border-color: var(--ccs-primary-hover) !important;
  color: var(--ccs-on-primary) !important;
}

/* Buttons inside light blue themed cards should use light blue */
.bg-info .btn-primary,
.bg-info-light .btn-primary,
.pro-bg-light .btn-primary,
.badge-info .btn-primary,
.badge-light .btn-primary,
.card.bg-info .btn-primary,
.card.bg-info-light .btn-primary,
.card.border-info .btn-primary,
.border-info .btn-primary {
  background-color: #18aefa !important;
  border-color: #18aefa !important;
  color: #fff !important;
}

.bg-info .btn-primary:hover,
.bg-info-light .btn-primary:hover,
.pro-bg-light .btn-primary:hover,
.badge-info .btn-primary:hover,
.badge-light .btn-primary:hover,
.card.bg-info .btn-primary:hover,
.card.bg-info-light .btn-primary:hover,
.card.border-info .btn-primary:hover,
.border-info .btn-primary:hover,
.bg-info .btn-primary:focus,
.bg-info-light .btn-primary:focus,
.pro-bg-light .btn-primary:focus,
.card.bg-info .btn-primary:focus,
.card.bg-info-light .btn-primary:focus,
.card.border-info .btn-primary:focus,
.border-info .btn-primary:focus,
.bg-info .btn-primary:active,
.bg-info-light .btn-primary:active,
.pro-bg-light .btn-primary:active,
.card.bg-info .btn-primary:active,
.card.bg-info-light .btn-primary:active,
.card.border-info .btn-primary:active,
.border-info .btn-primary:active {
  background-color: #009efb !important;
  border-color: #009efb !important;
  color: #fff !important;
}

/* Also handle btn-info inside light blue cards */
.bg-info .btn-info,
.bg-info-light .btn-info,
.pro-bg-light .btn-info,
.card.bg-info .btn-info,
.card.bg-info-light .btn-info,
.card.border-info .btn-info,
.border-info .btn-info {
  background-color: #18aefa !important;
  border-color: #18aefa !important;
  color: #fff !important;
}

.bg-info .btn-info:hover,
.bg-info-light .btn-info:hover,
.pro-bg-light .btn-info:hover,
.card.bg-info .btn-info:hover,
.card.bg-info-light .btn-info:hover,
.card.border-info .btn-info:hover,
.border-info .btn-info:hover,
.bg-info .btn-info:focus,
.bg-info-light .btn-info:focus,
.pro-bg-light .btn-info:focus,
.card.bg-info .btn-info:focus,
.card.bg-info-light .btn-info:focus,
.card.border-info .btn-info:focus,
.border-info .btn-info:focus {
  background-color: #009efb !important;
  border-color: #009efb !important;
  color: #fff !important;
}

.btn-secondary {
  background-color: #fdcf1a !important;
  border-color: #fdcf1a !important;
  color: var(--ccs-on-secondary) !important;
}

.btn-secondary:hover,
.btn-secondary:focus,
.btn-secondary:active,
.btn-secondary.active,
.show > .btn-secondary.dropdown-toggle {
  background-color: #f3c400 !important;
  border-color: #f3c400 !important;
  color: var(--ccs-on-secondary) !important;
}

.btn-secondary.disabled,
.btn-secondary:disabled {
  background-color: #fdcf1a !important;
  border-color: #fdcf1a !important;
  opacity: 0.65;
}

/* Outline secondary button */
.btn-outline-secondary {
  color: #fdcf1a !important;
  border-color: #fdcf1a !important;
  background-color: transparent !important;
}

.btn-outline-secondary:hover,
.btn-outline-secondary:focus {
  background-color: #fdcf1a !important;
  border-color: #fdcf1a !important;
  color: var(--ccs-on-secondary) !important;
}

.btn-outline-secondary:active,
.btn-outline-secondary.active,
.show > .btn-outline-secondary.dropdown-toggle {
  background-color: #fdcf1a !important;
  border-color: #fdcf1a !important;
  color: var(--ccs-on-secondary) !important;
}

.btn-outline-secondary.disabled,
.btn-outline-secondary:disabled {
  color: #fdcf1a !important;
  background-color: transparent !important;
  opacity: 0.65;
}

/* Focus rings (accessibility) */
.btn-primary:focus,
.btn-secondary:focus {
  box-shadow: 0 0 0 0.2rem rgba(24, 29, 56, 0.25) !important;
}

/* ---------- Anchors using bg-primary (theme defines hover states) ---------- */
a.bg-primary:hover,
a.bg-primary:focus,
button.bg-primary:hover,
button.bg-primary:focus {
  background-color: var(--ccs-primary-hover) !important;
}

/* ---------- Theme-specific accents (replace old theme blues/yellows) ---------- */
/* Header dropdown arrow + icon hover */
.header .has-arrow .dropdown-toggle:after {
  border-bottom-color: var(--ccs-primary) !important;
  border-right-color: var(--ccs-primary) !important;
}

.user-menu.nav > li > a:hover i,
.user-menu.nav > li > a:focus i {
  color: var(--ccs-primary) !important;
}

/* Header dropdown items (theme used old yellow) */
.header .dropdown-menu > li > a i,
.header .user-menu .dropdown-menu > li > a i {
  color: var(--ccs-secondary) !important;
}

.header .dropdown-menu > li > a:focus,
.header .dropdown-menu > li > a:hover {
  background-color: var(--ccs-secondary) !important;
  color: var(--ccs-on-secondary) !important;
}

.header .dropdown-menu > li > a:focus i,
.header .dropdown-menu > li > a:hover i {
  color: var(--ccs-on-secondary) !important;
}

.user-menu .dropdown-menu .dropdown-item:hover {
  color: var(--ccs-secondary) !important;
}

/* Sidebar active/hover colors (theme used old blue) */
.sidebar-menu li a:hover,
.sidebar-menu > ul > li > a:hover,
.sidebar-menu li.active > a,
.sidebar-menu ul ul a.active {
  color: var(--ccs-primary) !important;
}

.sidebar-menu li.active > a::before {
  background: var(--ccs-secondary) !important; /* nice accent bar */
}


