/*
  Theme: Purple / Yellow / Blue with dark nav bg
  -----------------------------------
  Dark        : #212529  (nav background)
  Primary     : #91278f  (main brand purple)
  Secondary   : #00a9ea  (blue accent)
  Light       : #f8f9fa  (Bootstrap default light)
  Accent      : #f9ed33  (bright yellow)
  a on dark   : #f9ed33  (yellow)
  a on light  : #91278f  (purple)
*/

:root {
  /* ===== Base Palette ===== */
  --bs-dark: #212529 !important;
  --bs-dark-rgb: 33, 37, 41 !important;

  --bs-primary: #91278f !important;
  --bs-primary-rgb: 145, 39, 143 !important;

  --bs-secondary: #00a9ea !important;
  --bs-secondary-rgb: 0, 169, 234 !important;

  --bs-light: #f8f9fa !important;
  --bs-light-rgb: 248, 249, 250 !important;

  --bs-accent: #f9ed33 !important;
  --bs-accent-rgb: 249, 237, 51 !important;

  /* ===== Link Logic ===== */
  --link-on-light: var(--bs-primary);
  --link-on-light-hover: var(--bs-secondary);
  --link-on-dark: var(--bs-accent);
  --link-on-dark-hover: #ffffff;

  /* ===== Defaults ===== */
  color: #212529;
  background-color: var(--bs-light);

  --bs-link-color: var(--link-on-light) !important;
  --bs-link-hover-color: var(--link-on-light-hover) !important;

  /* Preserve Bootstrap info/warning colors */
  --bs-info: #0dcaf0 !important;
  --bs-warning: #ffc107 !important;
}

/* ===== Alerts ===== */
.alert-info {
  color: #055160 !important;
  background-color: #cff4fc !important;
  border-color: #b6effb !important;
}
.alert-warning {
  color: #664d03 !important;
  background-color: #fff3cd !important;
  border-color: #ffecb5 !important;
}

/* ===== Sections ===== */
.section-light {
  background-color: var(--bs-light) !important;
  color: var(--bs-dark) !important;
}
.section-dark {
  background-color: var(--bs-dark) !important;
  color: var(--bs-light) !important;
}

/* ===== Global Link Behavior ===== */
a {
  color: var(--link-on-light);
  text-decoration: none;
  transition: color 0.2s ease;
}
a:hover,
a:focus {
  color: var(--link-on-light-hover);
  text-decoration: underline;
}

/* Links on dark backgrounds */
.section-dark a,
.bg-dark a,
.text-bg-dark a {
  color: var(--link-on-dark);
}
.section-dark a:hover,
.bg-dark a:hover,
.text-bg-dark a:hover {
  color: var(--link-on-dark-hover);
}

/* ===== Navigation ===== */
#mainNav {
  background-color: var(--bs-dark) !important;
}
#mainNav .navbar-brand,
#mainNav .nav-link {
  color: var(--bs-light) !important;
  text-decoration: none;
}
#mainNav .nav-link:hover {
  color: var(--bs-accent) !important; /* yellow hover */
}

/* ===== Masthead ===== */
.masthead {
  background-color: var(--bs-primary) !important;
  color: var(--bs-light) !important;
  padding: 2rem 1rem;
  text-align: center;
}
.masthead h1,
.masthead h2,
.masthead h3,
.masthead h4,
.masthead p {
  color: var(--bs-light) !important;
}
.masthead a {
  color: var(--link-on-dark);
  text-decoration: none;
}
.masthead a:hover {
  color: var(--link-on-dark-hover);
  text-decoration: underline;
}

/* ===== Divider ===== */
.divider {
  height: 4px;
  width: 100%;
  background-color: var(--bs-secondary);
  border-radius: 2px;
  margin: 1rem 0;
}

/* ===== Buttons ===== */

/* Primary (Purple) */
.btn-primary,
.btn-outline-primary {
  --bs-btn-color: #fff !important;
  --bs-btn-bg: var(--bs-primary) !important;
  --bs-btn-border-color: var(--bs-primary) !important;
  --bs-btn-hover-color: #fff !important;
  --bs-btn-hover-bg: #731f72 !important; /* darker purple */
  --bs-btn-hover-border-color: #731f72 !important;
  --bs-btn-active-bg: #731f72 !important;
  --bs-btn-active-border-color: #731f72 !important;
  --bs-btn-disabled-bg: var(--bs-primary) !important;
  --bs-btn-disabled-border-color: var(--bs-primary) !important;
}

/* Secondary (Blue) */
.btn-secondary,
.btn-outline-secondary {
  --bs-btn-color: #fff !important;
  --bs-btn-bg: var(--bs-secondary) !important;
  --bs-btn-border-color: var(--bs-secondary) !important;
  --bs-btn-hover-bg: #008bc0 !important; /* darker blue */
  --bs-btn-hover-border-color: #008bc0 !important;
  --bs-btn-active-bg: #008bc0 !important;
  --bs-btn-active-border-color: #008bc0 !important;
  --bs-btn-disabled-bg: var(--bs-secondary) !important;
  --bs-btn-disabled-border-color: var(--bs-secondary) !important;
}

/* Accent (Yellow) */
.btn-accent,
.btn-outline-accent {
  --bs-btn-color: #222 !important;
  --bs-btn-bg: var(--bs-accent) !important;
  --bs-btn-border-color: var(--bs-accent) !important;
  --bs-btn-hover-bg: #e6d52d !important; /* darker yellow */
  --bs-btn-hover-border-color: #e6d52d !important;
  --bs-btn-active-bg: #e6d52d !important;
  --bs-btn-active-border-color: #e6d52d !important;
  --bs-btn-disabled-bg: var(--bs-accent) !important;
  --bs-btn-disabled-border-color: var(--bs-accent) !important;
}
