/************************************************
 BHW Base – Color Layer
************************************************/

/*:is(#header, #main-navigation, #main, #footer) *{
  color: inherit;
  background-color: inherit;
}*/

/*body {
  color: var(--fyc-color-darkslategray);
  background-color: var(--fyc-color-white);
}*/

/* Keep the header divider on the main navigation element rather than
   the header/container itself. */
#main-navigation {
  color: var(--fyc-color-white);
  background-color: var(--fyc-color-robinsegg);
  border-bottom: var(--header-divider-width, 0.012rem) solid
    color-mix(
      in srgb,
      var(--fyc-color-robinsegg),
      var(--fyc-color-black) var(--header-divider-mix, 18%)
    );
}

#main-navigation a {
  color: var(--fyc-color-white);
}

.menu-toggle {
  background-color: var(--fyc-color-robinsegg);
}

.hamburger span {
  background-color: var(--fyc-color-white);
}

.header-logo-section {
  background-color: var(--fyc-color-white);
}

#main{
  color: var(--fyc-color-darkslategray);
  background-color: var(--fyc-color-white);
}

.page {
  background-color: var(--fyc-color-white);
}

#footer {
  display: flex;
  flex-wrap: nowrap;
  justify-content: space-between;
  align-items: center;
  gap: 1.5rem;
  min-height: 5.5rem;
  padding: 1rem 2rem;
  color: var(--fyc-color-white);
  background-color: var(--fyc-color-dimgray);
}

#footer .social-icons {
  flex: 0 1 50%;
  flex-wrap: wrap;
  justify-content: center;
  align-items: center;
  max-width: 520px;
}

#footer .social-icon {
  flex: 0 0 auto;
}

#footer .social-icon a,
#footer .social-icon svg {
  color: var(--fyc-color-white);
  fill: var(--fyc-color-white);
}

#footer .social-icon a::after {
  background-color: var(--fyc-color-white);
  color: var(--fyc-color-dimgray);
}

/* Header podcast icons - black */
#header-podcast-list .social-icon a,
#header-podcast-list .social-icon svg {
  color: var(--fyc-color-black);
  fill: var(--fyc-color-black);
}

#header-podcast-list .social-icon a::after {
  background-color: var(--fyc-color-darkslategray);
  color: var(--fyc-color-white);
}

.header-widget-area {
  background-color: var(--fyc-color-robinsegg);
}

.header-widget-area .widget-title {
  color: var(--fyc-color-white);
  background-color: var(--fyc-color-robinsegg);
}

/* Header widget form inputs */
.header-widget-area input[type="email"],
.header-widget-area input[type="text"] {
  background-color: var(--fyc-color-white);
  color: var(--fyc-color-black);
  border-color: var(--fyc-color-dimgray);
}

.header-widget-area input[type="email"]:focus,
.header-widget-area input[type="text"]:focus {
  border-color: var(--fyc-color-robinsegg);
}

.header-widget-area button[type="submit"],
.header-widget-area input[type="submit"] {
  background-color: var(--fyc-color-dimgray);
  color: var(--fyc-color-white);
}

.header-widget-area button[type="submit"]:hover,
.header-widget-area input[type="submit"]:hover {
  background-color: var(--fyc-color-darkslategray);
}

@media (max-width: 768px) {
  #footer {
    flex-wrap: wrap;
    flex-direction: column;
    align-items: center;
    min-height: auto;
  }

  #footer .social-icons {
    flex: 1 1 100%;
    justify-content: center;
    max-width: 420px;
  }
}