/* ===== AGU header theme: aligned with header.php palette =====
   header.php defines:
   --brand, --brand-600, --brand-700, --brand-800, --ink, --muted,
   --card, --border, --headline, --page
*/

/* Map Bootstrap + legacy names to your header variables */
:root{
  /* Body + text */
  --bs-body-bg: var(--page);
  --bs-body-color: var(--ink);

  /* “Surfaces” used across sections/cards/footers */
  --agu-surface-1: #143328;     /* menu / light surface */
  --agu-surface-2: var(--card); /* card surface from header.php */
  --agu-surface-3: #102a22;     /* deeper surface if needed */

  /* Accent (links, focus, active) */
  --agu-accent: #6bb9a3;        /* readable mint/teal on dark bg */

  /* Cards, borders, lists, accordions */
  --bs-card-bg: var(--card);
  --bs-card-border-color: var(--border);
  --bs-list-group-bg: var(--card);
  --bs-accordion-bg: var(--card);
}

/* ===== Page background & text ===== */
html, body{
  background-color: var(--bs-body-bg) !important;
  color: var(--bs-body-color);
}

/* ===== Links (global & footer) ===== */
a{ color: var(--agu-accent); }
a:hover, a:focus{ color: #8fd3c0; }

/* Map lingering light utilities to dark surfaces */
.bg-white, .bg-body, .bg-light{
  background-color: var(--agu-surface-1) !important;
  color: var(--bs-body-color) !important;
}
.bg-white::before{ background-color: var(--agu-surface-1) !important; }

/* ===== Cards ===== */
.card{ background-color: var(--bs-card-bg); border-color: var(--bs-card-border-color); }
.card .card-header{ background-color: var(--agu-surface-2); border-bottom-color: var(--border); }
.card .card-footer{ background-color: var(--agu-surface-2); border-top-color: var(--border); }

/* ===== Common sections that were white in the theme ===== */
.section, [class*="-section"], .content-section, .default-section{
  background-color: var(--agu-surface-1);
}

/* ===== Lists / accordions ===== */
.list-group-item{
  background-color: var(--bs-list-group-bg);
  color: var(--bs-body-color);
  border-color: var(--border);
}
.accordion-item{ background-color: var(--bs-accordion-bg); border-color: var(--border); }
.accordion-button{ background-color: var(--agu-surface-2); color: var(--bs-body-color); }
.accordion-button:not(.collapsed){ color: var(--agu-accent); }

/* ===== Tables ===== */
.table{ color: var(--bs-body-color); }
.table > :not(caption) > * > *{ background-color: transparent; border-color: var(--border); }
.table-striped > tbody > tr:nth-of-type(odd) > *{ background-color: rgba(255,255,255,.03); }
.table-hover > tbody > tr:hover > *{ background-color: rgba(255,255,255,.05); }

/* ===== Forms ===== */
.form-control, .form-select, .form-check-input{
  background-color: var(--agu-surface-2);
  color: var(--bs-body-color);
  border-color: var(--border);
}
.form-control::placeholder{ color: rgba(255,255,255,.55); }
.form-control:focus, .form-select:focus{
  border-color: var(--agu-accent);
  box-shadow: 0 0 0 .25rem rgba(127,227,107,.25);
}
.form-check-input:checked{ background-color: var(--agu-accent); border-color: var(--agu-accent); }

/* ===== Nav pills / tabs ===== */
.nav-pills .nav-link.active, .nav-pills .show > .nav-link{
  background-color: var(--agu-accent);
  color: #05250f;
}
.nav-tabs .nav-link{ color: var(--bs-body-color); }
.nav-tabs .nav-link.active{
  color: var(--agu-accent);
  background-color: var(--agu-surface-2);
  border-color: var(--border);
}

/* ===== Dropdown menus (match header.php navbar styles) ===== */
.dropdown-menu{
  background: var(--agu-surface-1) !important;
  color: rgba(255,255,255,.94) !important;
  border: 1px solid var(--border) !important;
  border-radius: 12px;
}
.dropdown-item{ color: rgba(255,255,255,.9) !important; border-radius: 8px; }
.dropdown-item:hover,
.dropdown-item:focus,
.dropdown-item.active{
  color:#fff !important;
  background: rgba(26,126,96,.18) !important; /* brand tint */
}

/* ===== Buttons (override Bootstrap blue) ===== */
.btn-primary{
  background-color: var(--brand) !important;
  border-color: var(--brand-600) !important;
  color:#fff !important;
}
.btn-primary:hover, .btn-primary:focus{
  background-color: var(--brand-600) !important;
  border-color: var(--brand-700) !important;
}
.btn-outline-primary{
  color: var(--brand) !important;
  border-color: var(--brand) !important;
}
.btn-outline-primary:hover, .btn-outline-primary:focus{
  color:#fff !important;
  background-color: var(--brand) !important;
  border-color: var(--brand) !important;
}

/* ===== Utility themed surfaces ===== */
.surface-1{ background-color: var(--agu-surface-1) !important; }
.surface-2{ background-color: var(--agu-surface-2) !important; }
.surface-3{ background-color: var(--agu-surface-3) !important; }

/* ===== Footer decorative icons ===== */
.footer-icon-six,
.footer-icon-seven,
.footer-icon-eight{
  position: absolute;
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
  z-index: 0;
}
.footer-icon-six{ width:80px; height:80px; }
.footer-icon-seven{ width:90px; height:90px; }
.footer-icon-eight{ width:100px; height:100px; }
@media (max-width:768px){
  .footer-icon-six, .footer-icon-seven, .footer-icon-eight{ width:50px; height:50px; }
}