/* vk-header-fix-20261024.css - STAGED, not installed. ASCII only.
   Three small fixes for the top strip (#topNavBar / #topNavTabs). Load AFTER vk-nav-studio-20261021f.css and
   vk-mobile-tight-20261023.css (Cssjs-head-common, below the vk-mobile-tight line).
   Each block is independent; delete a block to drop that fix. */

/* 1) LOGO OVERLAP on narrow windows with the desktop page (body.desktop, under ~540px wide).
      css-shared.css makes .topNav position:absolute; z-index:10000 inside the 30px-high #topNavBar, and floats the tabs.
      Promos + Extra 10% + Shipping + Cart no longer fit on one row, so Shipping and Cart wrap to a 2nd row at y=36-72.
      That row is not clipped, sits above the white header (z 10000 vs 9000) and its white text shows on the logo strokes.
      jquery-site-shared ($("body.site ... .topNavTabShipping").show()) sets an inline display on Shipping, which beats the
      stock "max-width:700px -> display:none" rule, hence !important here. Cart also lives in the header icon row. */
@media (max-width:540px){
  html.vkNavOn body.desktop #topNavBar ul#topNavTabs li.topNavTabShipping,
  html.vkNavOn body.desktop #topNavBar ul#topNavTabs li.topNavTabCart{display:none!important}
}

/* 2) DOUBLE UNDERLINE on hover of the strip links (Extra 10% Off Clearance, Promos, Shipping, Customer Service).
      css-shared.css: ".topNavTabName a:hover, .topNavTabDropDown:hover {text-decoration:underline}" underlines the whole <li>
      (propagates to the text inside), and Studio adds a:hover {underline, 4px offset, 1px}. Two lines. Keep the link's own
      underline, remove the one on the <li>. */
html.vkNavOn #topNavBar li.topNavTab:hover{text-decoration:none!important}

/* 3) TOP STRIP COLOUR under 1024px (desktop page): stock #topNavBar is brown #675948 (css-vic.css); Studio makes it #111
      only at min-width:1024px and phones get #111 from .mobile #topNavBar. Make the in-between widths #111 as well,
      with the same peach Extra 10% link the phone strip uses. */
@media (max-width:1023px){
  html.vk-nav--topdark body.desktop #topNavBar{background:#111}
  html.vk-nav--topdark body.desktop #topNavBar .topNavTabVkPromo .topNavTabName a,
  html.vk-nav--topdark body.desktop #topNavBar .topNavTabVkPromo .topNavTabName span{color:#ffd2b8;font-weight:700}
}