/*
  FRONTLINE MUTUAL — SITE-WIDE COLOR SETTINGS

  Edit the values below to recolor every page. This file is loaded last by
  all HTML pages so the site can be updated without editing each page.
*/
:root {
  --frontline-cream: #fbf6ea;
  --frontline-cream-light: #fffaf0;
  --frontline-green: #0b4937;
  --frontline-green-deep: #07392b;
  --frontline-green-mid: #165c46;
  --frontline-gold: #c9942f;
  --frontline-gold-light: #e5c46f;
  --frontline-text: #17372c;

  /* Existing page variables, standardized across every page. */
  --green: var(--frontline-green) !important;
  --green-deep: var(--frontline-green-deep) !important;
  --green-mid: var(--frontline-green-mid) !important;
  --green-soft: #f4ecd9 !important;
  --gold: var(--frontline-gold) !important;
  --gold-dark: #8b6219 !important;
  --gold-hover: #a97823 !important;
  --gold-light: var(--frontline-gold-light) !important;
  --gold-pale: #fff3d7 !important;
  --gold-border: var(--frontline-gold) !important;
  --text: var(--frontline-text) !important;
  --text-mid: #39584c !important;
  --text-light: #587166 !important;
  --border: #d9cba8 !important;
  --white: var(--frontline-cream-light) !important;
  --off-white: var(--frontline-cream) !important;
}

html,
body {
  background-color: var(--frontline-cream) !important;
  color: var(--frontline-text);
}

/*
  MAIN PAGE HEROES
  Warm cream is the dominant color on every page. Dark green and gold remain
  the supporting brand colors.
*/
.hero,
.page-hero,
.policy-hero {
  background: var(--frontline-cream) !important;
  border-top: 1px solid #d9cba8 !important;
  border-bottom: 5px solid var(--frontline-gold) !important;
}

:is(.hero, .page-hero, .policy-hero)
  :is(h1, h2, h3, p, .hero-headline, .hero-sub, .agent-name, .agent-title, .hero-name, .hero-tagline) {
  color: var(--frontline-green) !important;
}

:is(.hero, .page-hero, .policy-hero) :is(h1, h2, h3) em,
:is(.hero, .page-hero, .policy-hero) .hero-highlight {
  color: var(--frontline-gold) !important;
}

:is(.hero, .page-hero, .policy-hero) :is(.agent-photo, .hero-photo, .frontline-hero-feature-image) {
  border-color: var(--frontline-gold) !important;
}

/* Green primary actions and gold call actions on the cream hero areas. */
:is(.hero, .page-hero, .policy-hero)
  :is(.btn-primary, .hero-text-action, .hero-compare-action, .btn-scroll-form,
      .frontline-medigap-hero-action--secondary, .frontline-medigap-hero-action--compare) {
  background: var(--frontline-green) !important;
  border-color: var(--frontline-green) !important;
  color: var(--frontline-cream-light) !important;
}

:is(.hero, .page-hero, .policy-hero)
  :is(.hero-direct-call, .btn-call-hero, .frontline-medigap-hero-action--call, .contact-hero-phone) {
  background: var(--frontline-gold) !important;
  border-color: var(--frontline-gold) !important;
  color: var(--frontline-green-deep) !important;
}

:is(.hero, .page-hero, .policy-hero)
  :is(.hero-direct-call__number, .hero-direct-call svg, .btn-call-hero svg) {
  color: var(--frontline-green-deep) !important;
  stroke: currentColor;
}

/* Forms inside a hero stay visually distinct and readable. */
:is(.hero, .page-hero, .policy-hero)
  :is(.hero-card, .hero-form-card, .contact-form-card) {
  background: var(--frontline-cream-light) !important;
  border-color: var(--frontline-gold) !important;
}

:is(.hero, .page-hero, .policy-hero)
  :is(.hero-card-header, .hero-form-header, .contact-form-card__header) {
  background: var(--frontline-green-deep) !important;
  border-color: var(--frontline-gold) !important;
}

:is(.hero, .page-hero, .policy-hero)
  :is(.hero-card-header, .hero-form-header, .contact-form-card__header)
  :is(h2, h3, p, span) {
  color: var(--frontline-cream-light) !important;
}

/* The exported site builder stores the header background inline. */
[style*="--background-color:rgb(255, 255, 255)"] {
  --background-color: var(--frontline-cream-light) !important;
}

/* Keep ordinary content surfaces warm instead of stark white. */
.section,
.who-card,
.approach-item,
.hero-card,
.form-group input,
.area-pill,
.faq-item,
.contact-card,
.content-card,
.info-card,
.comparison-card,
.benefit-card,
.service-card,
.location-card {
  background-color: var(--frontline-cream-light);
}

/* Preserve strong brand contrast in the smaller bands and calls to action. */
.testi-section,
.trust-strip,
.cta-section,
footer,
.footer {
  border-color: var(--frontline-gold) !important;
}

::selection {
  background: var(--frontline-gold-light);
  color: var(--frontline-green-deep);
}
