/* =========================
   SEARCH OVERLAY - CLEAN VERSION
========================= */

@media(min-width:769px){

  body.search-window-visible{
    overflow:hidden!important;
  }

  body.search-window-visible::after{
    display:none!important;
  }

  body.search-window-visible .search-window,
  body.search-window-visible .search-widget{
    position:fixed!important;
    inset:0!important;

    width:100vw!important;
    height:100vh!important;

    overflow-y:auto!important;

    padding-top:125px!important;

    background:rgba(15,15,15,.42)!important;

    pointer-events:none!important;

    z-index:var(--vv-z-header)!important;
  }

  /* Blur only the page behind search, never the search UI itself. */
  body.search-window-visible .vv-hero,
  body.search-window-visible .vv-custom-menu,
  body.search-window-visible .vv-category-teaser,
  body.search-window-visible .vv-bento-categories,
  body.search-window-visible #content,
  body.search-window-visible #content-wrapper,
  body.search-window-visible .content-wrapper,
  body.search-window-visible .index-content-wrapper,
  body.search-window-visible .homepage-group-title-wrapper,
  body.search-window-visible .products-wrapper,
  body.search-window-visible .products-slider-holder,
  body.search-window-visible .homepage-products-heading-31{
    filter:blur(12px)!important;
    transform:scale(1.01)!important;
    transition:.25s ease!important;
  }

  body.search-window-visible .search-window,
  body.search-window-visible .search-widget,
  body.search-window-visible #formSearchForm,
  body.search-window-visible .searchWhisperer,
  body.search-window-visible .search-widget-close,
  body.search-window-visible #header,
  body.search-window-visible #header *{
    filter:none!important;
  }

  /* Header state while search is open. */
  body.search-window-visible #header .navigation-buttons,
  body.search-window-visible #header .top-navigation-tools{
    display:none!important;
  }

  body.search-window-visible .vv-custom-menu{
    opacity:.28!important;
    pointer-events:none!important;
    z-index:calc(var(--vv-z-header) - 1)!important;
  }

  body.search-window-visible .vv-custom-menu a,
  body.search-window-visible .vv-custom-menu a:hover,
  body.search-window-visible .vv-custom-menu a:focus{
    color:var(--vv-gray)!important;
    pointer-events:none!important;
    transition:none!important;
  }

  body.search-window-visible #header .site-name,
  body.search-window-visible #header .logo{
    position:fixed!important;
    top:28px!important;
    left:50%!important;

    width:auto!important;
    height:auto!important;
    max-width:none!important;
    min-width:0!important;

    margin:0!important;
    padding:0!important;

    transform:translateX(-50%)!important;

    pointer-events:none!important;

    z-index:var(--vv-z-overlay-items)!important;
  }

  body.search-window-visible #header .site-name img,
  body.search-window-visible #header .logo img,
  body.search-window-visible #header .site-name:hover img,
  body.search-window-visible #header .logo:hover img{
    display:block!important;
    width:auto!important;
    max-height:30px!important;

    pointer-events:none!important;

    filter:brightness(0) saturate(100%) invert(96%) sepia(8%) saturate(370%) hue-rotate(315deg) brightness(101%) contrast(96%)!important;
  }

  /* Search input. */
  body.search-window-visible #formSearchForm{
    position:relative!important;
    top:auto!important;
    left:auto!important;

    width:82vw!important;
    max-width:var(--vv-overlay-max)!important;

    margin:0 auto 34px auto!important;
    padding:0!important;

    transform:none!important;

    overflow:visible!important;
    pointer-events:auto!important;

    z-index:var(--vv-z-search-form)!important;
  }

  body.search-window-visible #formSearchForm *,
  body.search-window-visible .searchWhisperer,
  body.search-window-visible .searchWhisperer *,
  body.search-window-visible .search-results,
  body.search-window-visible .search-results *,
  body.search-window-visible .search-widget-close,
  body.search-window-visible .search-widget-close *{
    pointer-events:auto!important;
  }

  body.search-window-visible #formSearchForm .search-form-input-group{
    width:var(--vv-form-width)!important;
    max-width:var(--vv-form-max)!important;

    margin:0 auto!important;

    background:transparent!important;
    border:0!important;
    box-shadow:none!important;

    pointer-events:auto!important;
  }

  body.search-window-visible #formSearchForm input.query-input.search-input,
  body.search-window-visible #formSearchForm input[type="text"],
  body.search-window-visible #formSearchForm input[type="search"]{
    width:100%!important;
    height:var(--vv-field-height)!important;

    padding:0 28px!important;

    background:var(--vv-input)!important;
    border:none!important;
    border-radius:var(--vv-field-radius)!important;
    outline:none!important;

    box-shadow:0 4px 18px rgba(0,0,0,.06)!important;

    color:var(--vv-gray)!important;
    font-family:var(--vv-font)!important;
    font-size:18px!important;
  }

  body.search-window-visible #formSearchForm input:focus{
    border:none!important;
    outline:none!important;
    box-shadow:0 8px 28px rgba(0,0,0,.10)!important;
  }

  /* Search suggestions. */
  body.search-window-visible .searchWhisperer,
  body.search-window-visible .searchWhisperer__products,
  body.search-window-visible .search-results{
    position:relative!important;
    top:auto!important;
    left:auto!important;

    display:block!important;
    opacity:1!important;
    visibility:visible!important;

    width:100%!important;
    max-width:var(--vv-overlay-max)!important;

    margin:34px auto 0 auto!important;
    padding:0!important;

    pointer-events:auto!important;

    z-index:var(--vv-z-overlay-top)!important;
  }

  body.search-window-visible .searchWhisperer{
    width:100%!important;
  }

  body.search-window-visible .searchWhisperer__products{
    display:flex!important;
    flex-direction:column!important;
    gap:18px!important;
  }

  body.search-window-visible .searchWhisperer__product,
  body.search-window-visible .search-whisperer .product,
  body.search-window-visible .search-results .product{
    display:flex!important;
    align-items:center!important;
    justify-content:flex-start!important;

    width:100%!important;

    gap:24px!important;

    opacity:1!important;
    visibility:visible!important;

    pointer-events:auto!important;
  }

  body.search-window-visible .searchWhisperer__product__imageWrapper,
  body.search-window-visible .searchWhisperer__product__image,
  body.search-window-visible .searchWhisperer__product img,
  body.search-window-visible .search-whisperer img,
  body.search-window-visible .search-results img{
    display:block!important;
    opacity:1!important;
    visibility:visible!important;
  }

  body.search-window-visible .searchWhisperer__product__imageWrapper{
    width:96px!important;
    min-width:96px!important;
    height:96px!important;

    margin-right:0!important;

    flex-shrink:0!important;
  }

  body.search-window-visible .searchWhisperer__product img,
  body.search-window-visible .search-whisperer img,
  body.search-window-visible .search-results img{
    width:96px!important;
    height:96px!important;

    object-fit:contain!important;
  }

  body.search-window-visible .searchWhisperer__product__infoWrapper{
    width:420px!important;
    min-width:420px!important;
    max-width:420px!important;

    flex:0 0 420px!important;
  }

  body.search-window-visible .searchWhisperer__product__price{
    width:110px!important;
    min-width:110px!important;
    max-width:110px!important;

    margin-left:24px!important;
    margin-right:32px!important;

    flex:0 0 110px!important;

    color:var(--vv-red)!important;
    white-space:nowrap!important;
  }

  body.search-window-visible .searchWhisperer__product__detail,
  body.search-window-visible .searchWhisperer__productDetail,
  body.search-window-visible .searchWhisperer__product a[href*="detail"]{
    margin-left:24px!important;
  }

  body.search-window-visible .searchWhisperer__productsHeading,
  body.search-window-visible .searchWhisperer__categoriesHeading,
  body.search-window-visible .searchWhisperer__brandsHeading,
  body.search-window-visible .searchWhisperer__articlesHeading,
  body.search-window-visible .searchWhisperer h3{
    color:var(--vv-rose)!important;
  }

  /* Close button. */
  body.search-window-visible .search-widget-close,
  body.search-window-visible .search-widget-close.toggle-window,
  body.search-window-visible [data-testid="linkSearchIcon"].search-widget-close{
    position:fixed!important;
    top:42px!important;
    right:50px!important;
    left:auto!important;

    width:20px!important;
    height:20px!important;

    font-size:0!important;
    line-height:0!important;

    opacity:1!important;
    visibility:visible!important;
    pointer-events:auto!important;

    transform:none!important;

    z-index:var(--vv-z-overlay-top)!important;
  }

  body.search-window-visible .search-widget-close i,
  body.search-window-visible .search-widget-close svg,
  body.search-window-visible .search-widget-close span{
    display:none!important;
  }

  body.search-window-visible .search-widget-close::before,
  body.search-window-visible .search-widget-close::after{
    content:""!important;

    position:absolute!important;
    top:50%!important;
    left:50%!important;

    width:20px!important;
    height:2px!important;

    background:var(--vv-cream)!important;
    border-radius:10px!important;

    transform-origin:center!important;
  }

  body.search-window-visible .search-widget-close::before{
    transform:translate(-50%,-50%) rotate(45deg)!important;
  }

  body.search-window-visible .search-widget-close::after{
    transform:translate(-50%,-50%) rotate(-45deg)!important;
  }

}

@media(max-width:768px){

  body.search-window-visible{
    overflow:hidden!important;
  }

  body.search-window-visible::after{
    display:none!important;
  }

  body.search-window-visible .search-window,
  body.search-window-visible .search-widget{
    position:fixed!important;
    inset:0!important;
    width:100vw!important;
    height:100vh!important;
    padding:86px 18px 28px!important;
    box-sizing:border-box!important;
    overflow-y:auto!important;
    background:rgba(15,15,15,.34)!important;
    pointer-events:none!important;
    z-index:var(--vv-z-header)!important;
  }

  body.search-window-visible .vv-hero,
  body.search-window-visible .vv-category-teaser,
  body.search-window-visible .vv-bento-categories,
  body.search-window-visible #content,
  body.search-window-visible #content-wrapper,
  body.search-window-visible .content-wrapper,
  body.search-window-visible .index-content-wrapper,
  body.search-window-visible .homepage-group-title-wrapper,
  body.search-window-visible .products-wrapper,
  body.search-window-visible .products-slider-holder,
  body.search-window-visible .homepage-products-heading-31,
  body.search-window-visible #footer,
  body.search-window-visible .footer,
  body.search-window-visible .footer-newsletter-full-width,
  body.search-window-visible .footer-bottom-full-width{
    filter:blur(12px)!important;
    transform:scale(1.01)!important;
    opacity:.72!important;
    transition:.25s ease!important;
    pointer-events:none!important;
  }

  body.search-window-visible .vv-mobile-menu,
  body.search-window-visible .vv-mobile-toggle{
    display:none!important;
  }

  body.search-window-visible .search-window,
  body.search-window-visible .search-widget,
  body.search-window-visible #formSearchForm,
  body.search-window-visible #formSearchForm *,
  body.search-window-visible .searchWhisperer,
  body.search-window-visible .searchWhisperer *,
  body.search-window-visible .search-results,
  body.search-window-visible .search-results *,
  body.search-window-visible .search-widget-close,
  body.search-window-visible .search-widget-close *{
    filter:none!important;
    pointer-events:auto!important;
  }

  body.search-window-visible #formSearchForm{
    position:relative!important;
    inset:auto!important;
    width:100%!important;
    max-width:100%!important;
    margin:0 auto 18px!important;
    padding:0!important;
    transform:none!important;
    z-index:var(--vv-z-search-form)!important;
  }

  body.search-window-visible #formSearchForm .search-form-input-group{
    width:100%!important;
    max-width:100%!important;
    margin:0!important;
    padding:0!important;
    background:transparent!important;
    border:0!important;
    box-shadow:none!important;
  }

  body.search-window-visible #formSearchForm input.query-input.search-input,
  body.search-window-visible #formSearchForm input[type="text"],
  body.search-window-visible #formSearchForm input[type="search"]{
    width:100%!important;
    height:54px!important;
    box-sizing:border-box!important;
    padding:0 22px!important;
    background:var(--vv-input)!important;
    border:0!important;
    border-radius:28px!important;
    outline:none!important;
    box-shadow:0 14px 36px rgba(64,64,65,.12)!important;
    color:var(--vv-gray)!important;
    font-family:var(--vv-font)!important;
    font-size:16px!important;
    font-weight:500!important;
  }

  body.search-window-visible #formSearchForm input:focus{
    box-shadow:0 18px 44px rgba(64,64,65,.16)!important;
  }

  body.search-window-visible .searchWhisperer,
  body.search-window-visible .searchWhisperer__products,
  body.search-window-visible .search-results{
    position:relative!important;
    top:auto!important;
    left:auto!important;
    display:block!important;
    opacity:1!important;
    visibility:visible!important;
    width:100%!important;
    max-width:100%!important;
    margin:18px auto 0!important;
    padding:0!important;
    z-index:var(--vv-z-overlay-top)!important;
  }

  body.search-window-visible .searchWhisperer__products{
    display:flex!important;
    flex-direction:column!important;
    gap:12px!important;
  }

  body.search-window-visible .searchWhisperer__product,
  body.search-window-visible .search-whisperer .product,
  body.search-window-visible .search-results .product{
    display:flex!important;
    align-items:center!important;
    gap:14px!important;
    width:100%!important;
    box-sizing:border-box!important;
    padding:14px!important;
    background:rgba(249,240,234,.86)!important;
    border:1px solid rgba(255,255,255,.52)!important;
    border-radius:26px!important;
    box-shadow:0 16px 42px rgba(64,64,65,.12)!important;
  }

  body.search-window-visible .searchWhisperer__product__imageWrapper{
    width:72px!important;
    min-width:72px!important;
    height:72px!important;
    margin:0!important;
  }

  body.search-window-visible .searchWhisperer__product img,
  body.search-window-visible .search-whisperer img,
  body.search-window-visible .search-results img{
    width:72px!important;
    height:72px!important;
    object-fit:contain!important;
  }

  body.search-window-visible .searchWhisperer__product__infoWrapper{
    width:auto!important;
    min-width:0!important;
    max-width:none!important;
    flex:1 1 auto!important;
  }

  body.search-window-visible .searchWhisperer__product__price{
    width:auto!important;
    min-width:0!important;
    max-width:none!important;
    margin:4px 0 0!important;
    flex:0 0 auto!important;
    color:var(--vv-red)!important;
    white-space:nowrap!important;
  }

  body.search-window-visible .searchWhisperer__product__detail,
  body.search-window-visible .searchWhisperer__productDetail,
  body.search-window-visible .searchWhisperer__product a[href*="detail"]{
    margin-left:0!important;
  }

  body.search-window-visible .search-widget-close,
  body.search-window-visible .search-widget-close.toggle-window,
  body.search-window-visible [data-testid="linkSearchIcon"].search-widget-close{
    position:fixed!important;
    top:23px!important;
    right:24px!important;
    left:auto!important;
    width:26px!important;
    height:26px!important;
    font-size:0!important;
    line-height:0!important;
    opacity:1!important;
    visibility:visible!important;
    pointer-events:auto!important;
    transform:none!important;
    z-index:var(--vv-z-overlay-top)!important;
  }

  body.search-window-visible .search-widget-close i,
  body.search-window-visible .search-widget-close svg,
  body.search-window-visible .search-widget-close span{
    display:none!important;
  }

  body.search-window-visible .search-widget-close::before,
  body.search-window-visible .search-widget-close::after{
    content:""!important;
    position:absolute!important;
    top:50%!important;
    left:50%!important;
    width:22px!important;
    height:2px!important;
    background:var(--vv-cream)!important;
    border-radius:10px!important;
    transform-origin:center!important;
  }

  body.search-window-visible .search-widget-close::before{
    transform:translate(-50%,-50%) rotate(45deg)!important;
  }

  body.search-window-visible .search-widget-close::after{
    transform:translate(-50%,-50%) rotate(-45deg)!important;
  }

}
