/* ===================== CLEAN MODERN STYLE — WHITE DOMINANT, YELLOW AS ACCENT ===================== */

/* PALETTE
   White base: #ffffff
   Text: #333333
   Lines: #eaeaea / #eeeeee
   Subtle bg (sections/stripes): #fafafa
   Accent Yellow (sparingly): #f0b400 (hover/focus/active only), darker: #d99a00
*/

/* GLOBAL */
body {
  background-color: #ffffff; /* pure white base */
  color: #333333;
  font-family: 'Open Sans', sans-serif;
  font-size: 16px;
  line-height: 1.6;
}

/* LINKS — neutral by default, yellow only on hover/focus */
a {
  color: #333333;
  text-decoration: none;
  border-bottom: 1px solid transparent;
  transition: color .2s ease, border-color .2s ease;
}
a:hover, a:focus {
  color: #333333;
  border-bottom-color: #f0b400; /* thin yellow underline as accent */
  text-decoration: none;
}

/* BUTTONS — outline style; fill yellow on hover only */
.btn {
  border-radius: 6px;
  box-shadow: none;
  font-weight: 500;
  padding: 10px 16px;
  transition: background-color .2s ease, color .2s ease, border-color .2s ease;
}
.btn-primary {
  background-color: #ffffff;
  border: 1px solid #f0b400; /* yellow as outline accent */
  color: #333333;
}
.btn-primary:hover,
.btn-primary:focus {
  background-color: #f0b400; /* accent appears on interaction */
  border-color: #d99a00;
  color: #ffffff;
}

/* PANEL / CARD */
.panel {
  border: none;
  border-radius: 8px;
  box-shadow: 0 2px 6px rgba(0,0,0,0.08);
  background-color: #ffffff;
}
.panel-heading {
  background-color: #ffffff;
  border-bottom: 1px solid #eeeeee;
  font-size: 18px;
  font-weight: 600;
}

/* TABLE */
.table {
  background-color: #ffffff;
  border-collapse: collapse;
}
.table th, .table td {
  border: none;
  border-bottom: 1px solid #eaeaea;
  padding: 12px 16px;
}
.table-striped > tbody > tr:nth-of-type(odd) {
  background-color: #fafafa; /* subtle gray, no yellow wash */
}

/* NAVBAR / HEADER — white by default; yellow only as thin indicator */
.navbar, .header_view {
  background-color: #ffffff; /* remove yellow blocks */
  border-bottom: 3px solid #f0b400;
  color: #333333 !important;
}
.navbar .navbar-brand,
.header_view .navbar-brand,
.navbar .nav > li > a,
.header_view .nav > li > a,
.navbar-default .navbar-nav > li > a,
.navbar-default .navbar-brand {
  color: #333333 !important;
}

/* Hover state: no background color; just a 2px yellow underline */
.navbar .nav > li > a:hover,
.header_view .nav > li > a:hover {
  background-color: transparent;
  color: #333333 !important;
  box-shadow: inset 0 -2px 0 0 #f0b400; /* yellow accent underline */
}

/* Active state indicator */
.navbar .nav > .active > a,
.navbar .nav > .active > a:focus,
.navbar .nav > .active > a:hover {
  background-color: transparent !important;
  color: #333333 !important;
  box-shadow: inset 0 -2px 0 0 #d99a00;
}

/* ARTICLE SUMMARY */
.article-summary .media {
  background-color: #ffffff;
  border-radius: 10px;
  padding: 20px;
  box-shadow: 0 1px 3px rgba(0,0,0,0.05);
}
.article-summary .media-heading {
  font-size: 18px;
  font-weight: 600;
}

/* FOOTER */
footer[role="contentinfo"] {
  background-color: #ffffff;
  border-top: 1px solid #dddddd;
  color: #777777;
  padding: 30px 0;
  font-size: 14px;
}

/* OPTIONAL UTILITIES — small yellow accents when needed */
.accent-left {
  border-left: 4px solid #f0b400;
}
.accent-top {
  border-top: 3px solid #f0b400;
}

/* REDUCE ANY REMAINING YELLOW BACKGROUNDS FROM LEGACY SELECTORS */
:root {
  --accent-yellow: #f0b400;
  --accent-yellow-dark: #d99a00;
  --base-white: #ffffff;
  --ink: #333333;
  --line: #eaeaea;
  --wash: #fafafa;
}

/* If there are components relying on previous yellow backgrounds, normalize them */
.bg-yellow,
.bg-accent,
.header-yellow {
  background-color: #ffffff !important;
  color: #333333 !important;
  border-bottom: 1px solid #eeeeee !important;
}

/* END — white-dominant theme with yellow accents only */