/* Pencarian di menu header: solid, terbaca, tidak tembus ke menu di bawahnya. */
html:not(#_) body .navigation-search,
html:not(#_) body .navigation-search.nav-search-active{background:#fff!important}
html:not(#_) body .navigation-search input[type="search"],
html:not(#_) body .navigation-search input[type="search"]:hover,
html:not(#_) body .navigation-search input[type="search"]:focus,
html:not(#_) body .navigation-search input[type="search"]:active{
  opacity:1!important;background:#fff!important;color:#1f2937!important;-webkit-text-fill-color:#1f2937;
  caret-color:#1f2937;border:0!important;box-shadow:none!important;outline:0;height:60px;padding:0 64px 0 20px;font-size:1rem}
html:not(#_) body .navigation-search input[type="search"]::placeholder{color:#6b7280;opacity:1}
html:not(#_) body .navigation-search.nav-search-active{box-shadow:0 6px 18px rgba(0,0,0,.12)}

/* Mode popup (opsional, aktif lewat filter mysp_hpage_nav_search_popup) */
body.mysp-nav-search-popup .navigation-search.nav-search-active{
  position:fixed!important;top:18vh!important;left:50%!important;right:auto!important;
  width:min(640px,92vw)!important;transform:translateX(-50%);z-index:100000;
  border-radius:14px;overflow:hidden;box-shadow:0 0 0 100vmax rgba(0,0,0,.55),0 20px 50px rgba(0,0,0,.35)}
body.mysp-nav-search-popup .navigation-search input[type="search"]{height:64px;font-size:1.1rem}

/* Tombol close (X) pencarian: tetap terang di semua keadaan (normal, hover, fokus, saat mengetik). */
html:not(#_) body .main-navigation .menu-bar-items .search-item.active,
html:not(#_) body .main-navigation .menu-bar-items .search-item.active:hover,
html:not(#_) body .main-navigation .menu-bar-items .search-item.active:focus-within,
html:not(#_) body .main-navigation .main-nav ul li.search-item.active,
html:not(#_) body .main-navigation .main-nav ul li.search-item.active:hover,
html:not(#_) body .main-navigation .main-nav ul li.search-item.active:focus-within{background:#eef2f9!important}
html:not(#_) body .main-navigation .menu-bar-items .search-item.active > a,
html:not(#_) body .main-navigation .menu-bar-items .search-item.active > a:hover,
html:not(#_) body .main-navigation .menu-bar-items .search-item.active > a:focus,
html:not(#_) body .main-navigation .menu-bar-items .search-item.active > a:active,
html:not(#_) body .main-navigation .main-nav ul li.search-item.active > a,
html:not(#_) body .main-navigation .main-nav ul li.search-item.active > a:hover,
html:not(#_) body .main-navigation .main-nav ul li.search-item.active > a:focus,
html:not(#_) body .main-navigation .main-nav ul li.search-item.active > a:active{
  background:#eef2f9!important;color:#1f2937!important;opacity:1!important}
html:not(#_) body .main-navigation .menu-bar-items .search-item.active > a:hover,
html:not(#_) body .main-navigation .main-nav ul li.search-item.active > a:hover{background:#dfe6f3!important}
html:not(#_) body .main-navigation .search-item.active > a svg,
html:not(#_) body .main-navigation .search-item.active > a .gp-icon{fill:currentColor;color:#1f2937!important}
