/* LATKEOTV HEADER V4 - REFERENCE DESIGN */
/* Emerald / Gold / Icons / Responsive */

/* HEADER V4 - ICON NAVIGATION */
@media (min-width:1101px) {

body:has(#site-main.latkeo-emerald-home)
.site-header {
  background:linear-gradient(
    180deg,#004d39 0%,#00281f 55%,#00160f 100%
  )!important;
  border-top:2px solid #e5bd60!important;
  border-bottom:2px solid #e5bd60!important;
  box-shadow:0 0 18px #00ff9955,
             inset 0 0 20px #00b77933!important;
}

body:has(#site-main.latkeo-emerald-home)
.site-header .header-elements {
  gap:12px!important;
}

body:has(#site-main.latkeo-emerald-home)
.site-header .listMenuHeader {
  flex:1!important;
  min-width:0!important;
}

body:has(#site-main.latkeo-emerald-home)
.site-header .menuItem {
  width:100%!important;
  display:flex!important;
  align-items:center!important;
  justify-content:space-between!important;
  gap:4px!important;
}

body:has(#site-main.latkeo-emerald-home)
.site-header .menuItem > a {
  display:inline-flex!important;
  flex-direction:row!important;
  align-items:center!important;
  justify-content:center!important;
  gap:7px!important;
  padding:7px 9px!important;
  min-height:48px!important;
  font-size:12px!important;
  font-weight:800!important;
  line-height:1.15!important;
  color:#f5fff9!important;
  border-radius:11px!important;
  white-space:nowrap!important;
}

body:has(#site-main.latkeo-emerald-home)
.site-header .latkeo-menu-icon {
  display:block!important;
  width:22px!important;
  height:22px!important;
  flex-shrink:0!important;
  stroke:#f2f6f1!important;
  filter:drop-shadow(0 1px 3px #0008);
}

body:has(#site-main.latkeo-emerald-home)
.site-header .menuItem > a[href="/"] {
  background:linear-gradient(
    180deg,#127b59,#003b2c
  )!important;
  border:1px solid #f6d77c!important;
  color:#ffe49a!important;
  box-shadow:0 0 15px #eac45b77,
             inset 0 0 10px #00ffa633!important;
}

body:has(#site-main.latkeo-emerald-home)
.site-header .menuItem > a[href="/"] .latkeo-menu-icon {
  stroke:#ffe49a!important;
}

body:has(#site-main.latkeo-emerald-home)
.site-header .menuItem > a:hover {
  background:linear-gradient(
    180deg,#087b58,#003c2c
  )!important;
  border-color:#d7b65c!important;
  box-shadow:0 0 12px #00ed9b55!important;
}

}

@media (max-width:1100px) {
  .site-header .latkeo-menu-icon {
    width:18px;
    height:18px;
    flex-shrink:0;
  }
}

/* STEP 112 - LARGE MENU */

@media (min-width:1101px) {

  body:has(#site-main.latkeo-emerald-home)
  .site-header {
    height:68px!important;
    min-height:68px!important;
    background:linear-gradient(
      180deg,#00533d,#002c22 60%,#001910
    )!important;
    border-top:2px solid #eac66b!important;
    border-bottom:2px solid #eac66b!important;
    box-shadow:
      0 0 22px rgba(0,255,160,.35),
      inset 0 0 18px rgba(0,255,150,.12)!important;
  }

  body:has(#site-main.latkeo-emerald-home)
  .site-header .menuItem {
    gap:2px!important;
  }

  body:has(#site-main.latkeo-emerald-home)
  .site-header .menuItem > a {
    font-size:15px!important;
    font-weight:900!important;
    min-height:54px!important;
    padding:8px 7px!important;
    gap:7px!important;
    letter-spacing:-.3px!important;
  }

  body:has(#site-main.latkeo-emerald-home)
  .site-header .latkeo-menu-icon {
    width:26px!important;
    height:26px!important;
    stroke-width:2!important;
  }

  body:has(#site-main.latkeo-emerald-home)
  .site-header .menuItem > a[href="/"] {
    border:2px solid #f5d37b!important;
    border-radius:12px!important;
    box-shadow:
      0 0 18px rgba(255,216,105,.5),
      inset 0 0 12px rgba(0,255,170,.2)!important;
  }
}

@media (min-width:1101px) and (max-width:1450px) {
  body:has(#site-main.latkeo-emerald-home)
  .site-header .menuItem > a {
    font-size:12px!important;
    padding:7px 4px!important;
    gap:4px!important;
  }

  body:has(#site-main.latkeo-emerald-home)
  .site-header .latkeo-menu-icon {
    width:21px!important;
    height:21px!important;
  }
}

/* STEP 114 - RAISE NAVIGATION */

/* Move navigation content upward without
   moving the ticker or match section */

@media (min-width:1101px) {

  body:has(#site-main.latkeo-emerald-home)
  .site-header .header-elements {
    position:relative!important;
    top:-18px!important;
  }

  body:has(#site-main.latkeo-emerald-home)
  .site-header .menuItem > a {
    position:relative!important;
  }
}

/* STEP 116 - FILTER ACTIVE STATE */

body:has(#site-main.latkeo-emerald-home)
.schedule-nav .nav-item:not(.active),
body:has(#site-main.latkeo-emerald-home)
.schedule-nav .nav-item:not(.active):hover {
  background:linear-gradient(
    180deg,#07543e 0%,#002d23 100%
  )!important;
  color:#f5fff8!important;
  border:1px solid #b39442!important;
}

body:has(#site-main.latkeo-emerald-home)
.schedule-nav .nav-item:not(.active):hover {
  box-shadow:0 0 15px rgba(0,255,160,.35)!important;
}

body:has(#site-main.latkeo-emerald-home)
.schedule-nav .nav-item.active,
body:has(#site-main.latkeo-emerald-home)
.schedule-nav .nav-item.active:hover {
  background:linear-gradient(
    180deg,#ffe49a 0%,#d6a73f 100%
  )!important;
  color:#003d2b!important;
  border:1px solid #ffe49a!important;
}

/* STEP 119 - ACCOUNT BUTTON */

body:has(#site-main.latkeo-emerald-home)
.site-header #openLogin.latkeo-account-button {
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  width:46px!important;
  height:46px!important;
  min-width:46px!important;
  padding:0!important;
  border-radius:50%!important;
  background:linear-gradient(180deg,#086a4e,#002b20)!important;
  color:#f9dc87!important;
  border:2px solid #e9c66b!important;
  box-shadow:0 0 13px rgba(0,255,160,.28)!important;
  cursor:pointer!important;
}

body:has(#site-main.latkeo-emerald-home)
.site-header #openLogin.latkeo-account-button:hover {
  background:linear-gradient(180deg,#139b6d,#00432f)!important;
  box-shadow:0 0 18px rgba(241,206,104,.55)!important;
}

body:has(#site-main.latkeo-emerald-home)
.site-header #openLogin.latkeo-account-button svg {
  width:23px!important;
  height:23px!important;
  display:block!important;
}