/* News page-only header styles */

/* Ensure the header doesn't clip the dropdown */
header.leadership-hero { overflow: visible !important; }
nav.navbar { overflow: visible; }
header .dropdown-menu { z-index: 1100; }

/* Accessibility-first header colors (News page only) */
:root {
  /* Light variant fallbacks for broad support */
  --accessible-header-bg: #F8FAFC; /* near-white */
  --accessible-header-fg: #111827; /* near-black text */
  --accessible-cta-bg: #1D4ED8; /* strong blue */
  --accessible-cta-fg: #FFFFFF; /* white text */
}

/* Prefer perceptual colors when available */
@supports (color: oklch(0 0 0)) {
  :root {
    --accessible-header-bg: oklch(0.98 0.01 250);
    --accessible-header-fg: oklch(0.20 0.03 255);
    --accessible-cta-bg: oklch(0.60 0.18 255);
    --accessible-cta-fg: oklch(0.98 0.01 250);
  }
}

/* Apply to News header only */
header.leadership-hero { background: var(--accessible-header-bg) !important; }

/* Light, low-glare overlay while keeping the background image */
header.leadership-hero .hero-bg-overlay { background: rgba(248, 250, 252, 0.86) !important; }
@supports (color: oklch(0 0 0 / 1)) {
  header.leadership-hero .hero-bg-overlay { background: oklch(0.98 0.01 250 / 0.86) !important; }
}
header.leadership-hero .hero-bg-img { opacity: 0.35 !important; }

/* Ensure readable dark text against light header */
header.leadership-hero .leadership-hero-content,
header.leadership-hero .leadership-hero-content h1,
header.leadership-hero .leadership-hero-content .lead,
header.leadership-hero .leadership-hero-content p { color: var(--accessible-header-fg) !important; }

header.leadership-hero .leadership-hero-content h1 {
  color: #3a0ca3 !important;
  -webkit-text-fill-color: #3a0ca3 !important;
}
header.leadership-hero .text-white,
header.leadership-hero a.text-white { color: var(--accessible-header-fg) !important; -webkit-text-fill-color: var(--accessible-header-fg) !important; text-shadow: none !important; }

/* Desktop navbar links should be dark on light header */
@media (min-width: 768px) {
  header.leadership-hero .navbar .nav-link { color: var(--accessible-header-fg) !important; }
  header.leadership-hero .navbar-brand .subtitle { color: var(--accessible-header-fg) !important; -webkit-text-fill-color: var(--accessible-header-fg) !important; text-shadow: none !important; }
}

/* Tablet & smaller: accessible light header background & readable nav */
@media (max-width: 991.98px) {
  header.leadership-hero nav.navbar { background: var(--accessible-header-bg) !important; }
  header.leadership-hero .navbar .nav-link { color: var(--accessible-header-fg) !important; }
  header.leadership-hero .navbar-brand .subtitle { color: var(--accessible-header-fg) !important; -webkit-text-fill-color: var(--accessible-header-fg) !important; text-shadow: none !important; }
  header.leadership-hero .navbar-toggler { border-color: rgba(17, 24, 39, 0.25) !important; }
  header.leadership-hero .navbar-toggler-icon { filter: none; opacity: 0.9; }
  header.leadership-hero .navbar-collapse { background-color: var(--accessible-header-bg) !important; border-top: 1px solid rgba(17, 24, 39, 0.08) !important; }
  header.leadership-hero .navbar.navbar-scrolled { background: var(--accessible-header-bg) !important; }
}

/* Link cues and focus outlines for color-blind users (hero content only) */
header.leadership-hero .leadership-hero-content a:not(.btn) { text-decoration: underline; }
header.leadership-hero .leadership-hero-content a:not(.btn):focus-visible,
header.leadership-hero .btn:focus-visible { outline: 3px solid currentColor; outline-offset: 3px; }

/* Prevent underlines on navbar items */
header.leadership-hero .navbar .nav-link,
header.leadership-hero .navbar .dropdown-item,
header.leadership-hero .navbar-brand,
header.leadership-hero .navbar .dropdown-toggle { text-decoration: none !important; }

/* Accessible buttons within the hero */
header.leadership-hero .btn-primary { background: var(--accessible-cta-bg) !important; color: var(--accessible-cta-fg) !important; border: none !important; }
header.leadership-hero .btn-primary:hover,
header.leadership-hero .btn-primary:focus { filter: brightness(1.05) saturate(1.07); }
header.leadership-hero .btn-outline-light { color: var(--accessible-header-fg) !important; border-color: var(--accessible-header-fg) !important; }
header.leadership-hero .btn-outline-light:hover { background: rgba(17, 24, 39, 0.08) !important; }

.news-controls {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 10px;
  margin: 0 0 14px;
}

.news-search-label {
  font-weight: 600;
  margin: 0;
}

#news-search {
  width: min(420px, 100%);
  padding: 8px 10px;
  border-radius: 10px;
  border: 1px solid rgba(17, 24, 39, 0.18);
}

.news-refresh {
  width: 38px;
  height: 38px;
  border-radius: 10px;
  border: 1px solid rgba(17, 24, 39, 0.12);
  background: rgba(255, 255, 255, 0.9);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  color: inherit;
}

.news-refresh:hover {
  border-color: rgba(67, 97, 238, 0.28);
}

.news-refresh:active {
  transform: translateY(1px);
}

.news-list {
  display: grid;
  gap: 12px;
}

.news-item {
  display: grid;
  gap: 6px;
  padding: 14px;
  border-radius: 14px;
  border: 1px solid rgba(17, 24, 39, 0.08);
  background: rgba(255, 255, 255, 0.9);
  text-decoration: none;
  color: inherit;
}

.news-item:hover {
  border-color: rgba(67, 97, 238, 0.28);
  box-shadow: 0 10px 30px rgba(17, 24, 39, 0.08);
}

.news-meta {
  display: flex;
  justify-content: space-between;
  gap: 12px;
}

.news-title { font-weight: 800; letter-spacing: -0.01em; }
.news-date { font-size: 0.9rem; opacity: 0.75; }
.news-summary { margin: 0; }