/* ===== TOP HEADER BAR ===== */
/* Divi's inline CSS handles #top-header layout via floats + clearfix.
   .et_fullwidth_secondary_nav #top-header .container{width:100%;max-width:100%;padding:0 30px}
   #et-info floats left, #et-secondary-menu floats right.
   Do NOT use display:flex on .container — it breaks the clearfix::after pseudo-element. */

/* Only override colors/font if Divi's inline CSS doesn't already set them.
   Divi sets: #top-header{background-color:#024e7a} and font-size:14px via et-critical-inline-css. */

#top-header a {
  color: rgba(255, 255, 255, 0.7);
  text-decoration: none;
  transition: color 0.3s ease;
}

#top-header a:hover {
  color: #fff;
}

/* ===== MAIN HEADER ===== */
/* Divi's critical inline CSS handles the header layout:
   - .et_fixed_nav #main-header { position:fixed }
   - .et_header_style_left .logo_container { position:absolute; height:100%; width:100% }
   - .et_header_style_left #et-top-navigation { padding-top:33px }
   - #et-top-navigation { float:right }
   - #top-menu li { display:inline-block; padding-right:22px }
   - Divi's et-critical-inline-css handles font-family, colors, widths on live pages
   Do NOT add et-divi-customizer-global.min.css — it is NOT on the live site (only 404 page).
   Do NOT override container display, top-menu display, or nav float here. */

/* ===== DROPDOWN ARROW OVERRIDES ===== */
/* Divi's inline CSS sets:
   #top-menu .menu-item-has-children>a:first-child:after{font-family:'ETmodules';content:"3";position:absolute;right:0;top:0}
   We match Divi's selector (same specificity) and load after, so we win. */
#top-menu .menu-item-has-children > a:first-child::after {
  font-family: inherit;
  content: '';
  font-size: 0;
  font-weight: normal;
  position: static;
  right: auto;
  top: auto;
  display: inline-block;
  width: 0;
  height: 0;
  margin-left: 7px;
  vertical-align: middle;
  border-left: 5px solid transparent;
  border-right: 5px solid transparent;
  border-top: 5px solid rgba(255, 255, 255, 0.6);
}

/* ===== DROPDOWN MENUS ===== */
/* Divi handles most dropdown positioning via .nav li ul rules.
   We add visibility/opacity for our hover effect. */
#top-menu > li:hover > .sub-menu {
  visibility: visible;
  opacity: 1;
  transform: translateY(0);
}

.sub-menu li.menu-item-has-children:hover > .sub-menu {
  visibility: visible;
  opacity: 1;
  transform: translateY(0);
}

/* Nested submenu arrow - must override Divi's:
   #top-menu li .menu-item-has-children>a:first-child:after{right:20px;top:6px} */
#top-menu li .menu-item-has-children > a:first-child::after {
  content: '';
  font-family: inherit;
  font-size: 0;
  font-weight: normal;
  position: static;
  right: auto;
  top: auto;
  display: inline-block;
  width: 0;
  height: 0;
  float: right;
  margin-top: 6px;
  margin-left: 0;
  border-top: 5px solid transparent;
  border-bottom: 5px solid transparent;
  border-left: 5px solid #999;
  border-right: none;
}
