@media (max-width: 767px) {

  #header .header-top {
    background: #ebebeb !important;
    padding: 8px 0 !important;
    border-bottom: 0 !important;
    position: relative !important;
    z-index: 50 !important;
  }

  #header .header-top .header-top-wrapper {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    flex-wrap: nowrap !important;
    gap: 10px !important;
    min-height: 64px !important;
    padding: 0 14px 0 0 !important;
  }

  #header .header-top .site-name {
    flex: 0 0 128px !important;
    width: 128px !important;
    max-width: 128px !important;
    margin: 0 0 0 -8px !important;
    padding-left: 0 !important;
  }

  #header .header-top .site-name a {
    display: flex !important;
    align-items: center !important;
    justify-content: flex-start !important;
    margin-left: 0 !important;
    padding-left: 0 !important;
  }

  #header .header-top .site-name img {
    display: block !important;
    width: 100% !important;
    height: auto !important;
    max-height: none !important;
    margin-left: 0 !important;
  }

  #header .header-top .header-top-wrapper > .search,
  #header .header-top .header-top-wrapper > .search.custom-search-pill {
    display: block !important;
  }

  #header .header-top .navigation-buttons {
    display: flex !important;
    align-items: center !important;
    justify-content: flex-end !important;
    gap: 10px !important;
    margin-left: auto !important;
    padding-right: 12px !important;
    flex: 1 1 auto !important;
    width: auto !important;
  }

  #header .header-top .navigation-buttons > * {
    flex: 0 0 auto !important;
    margin: 0 !important;
  }

  #header .header-top .navigation-buttons .toggle-window[data-target="search"],
  #header .header-top .navigation-buttons .custom-login-wrap,
  #header .header-top .navigation-buttons .cart-count {
    width: 42px !important;
    height: 42px !important;
    min-width: 42px !important;
    min-height: 42px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    padding: 0 !important;
    margin: 0 !important;
    line-height: 1 !important;
    position: relative !important;
    vertical-align: middle !important;
    background: transparent !important;
    border: 0 !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    overflow: visible !important;
  }

  #header .header-top .navigation-buttons .custom-login-button,
  #header .header-top .navigation-buttons .toggle-window[data-target="navigation"] {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    padding: 0 !important;
    margin: 0 !important;
    text-decoration: none !important;
    appearance: none !important;
    -webkit-appearance: none !important;
    box-shadow: none !important;
  }

  /* SEARCH */
  #header .header-top .navigation-buttons .toggle-window[data-target="search"] {
    font-size: 0 !important;
    color: transparent !important;
    text-decoration: none !important;
    appearance: none !important;
    -webkit-appearance: none !important;
  }

  #header .header-top .navigation-buttons .toggle-window[data-target="search"]::before {
    content: "" !important;
    display: block !important;
    width: 32px !important;
    height: 32px !important;
    background-repeat: no-repeat !important;
    background-position: center !important;
    background-size: 32px 32px !important;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 122.879 119.799' fill='none'%3E%3Cpath d='M49.988 0h.016v.007C63.803.011 76.298 5.608 85.34 14.652c9.027 9.031 14.619 21.515 14.628 35.303h.007v.073h-.007c-.005 5.557-.917 10.905-2.594 15.892-.281.837-.575 1.641-.877 2.409v.007c-1.446 3.66-3.315 7.12-5.547 10.307l29.082 26.139.018.016.157.146.011.011c1.642 1.563 2.536 3.656 2.649 5.78.11 2.1-.543 4.248-1.979 5.971l-.011.016-.175.203-.035.035-.146.16-.016.021c-1.565 1.642-3.654 2.534-5.78 2.646-2.097.111-4.247-.54-5.971-1.978l-.015-.011-.204-.175-.029-.024-28.809-25.898c-.88.62-1.778 1.209-2.687 1.765-1.233.755-2.51 1.466-3.813 2.115-6.699 3.342-14.269 5.222-22.272 5.222v.007h-.016v-.007c-13.799-.004-26.296-5.601-35.338-14.645C5.605 76.291.016 63.805.007 50.021H0v-.049h.007c.004-13.799 5.601-26.296 14.645-35.338C23.683 5.608 36.167.016 49.955.007V0h.033Zm.016 11.21v.007h-.049v-.007c-10.686.007-20.372 4.35-27.384 11.359C15.56 29.578 11.213 39.274 11.21 49.973h.007v.049h-.007c.007 10.686 4.347 20.367 11.359 27.381 7.009 7.012 16.705 11.359 27.403 11.361v-.007h.049v.007c10.686-.007 20.368-4.348 27.382-11.359 7.011-7.009 11.358-16.702 11.36-27.4h-.006v-.049h.006c-.006-10.686-4.35-20.372-11.358-27.384C70.396 15.56 60.703 11.213 50.004 11.21Z' fill='%23111'/%3E%3C/svg%3E") !important;
  }

  #header .header-top .navigation-buttons .toggle-window[data-target="search"]::after {
    content: none !important;
  }

  #header .header-top .navigation-buttons .toggle-window[data-target="search"] span,
  #header .header-top .navigation-buttons .toggle-window[data-target="search"] svg,
  #header .header-top .navigation-buttons .toggle-window[data-target="search"] i {
    display: none !important;
  }

  /* LOGIN */
  #header .header-top .custom-login-wrap {
    display: inline-flex !important;
    align-items: center !important;
    position: relative !important;
  }

  #header .header-top .custom-login-button {
    width: 42px !important;
    height: 42px !important;
    min-width: 42px !important;
    min-height: 42px !important;
    background: transparent !important;
    border: 0 !important;
    border-radius: 0 !important;
    color: #111 !important;
    line-height: 1 !important;
    position: relative !important;
  }

  #header .header-top .custom-login-button .login-icon,
  #header .header-top .custom-login-button .custom-login-text,
  #header .header-top .custom-login-button .login-arrow {
    display: none !important;
  }

  #header .header-top .custom-login-button::before {
    content: "" !important;
    display: block !important;
    width: 42px !important;
    height: 42px !important;
    background-repeat: no-repeat !important;
    background-position: center !important;
    background-size: 42px 42px !important;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 600 600' fill='none'%3E%3Ccircle cx='300' cy='230' r='115' stroke='%23111' stroke-width='30'/%3E%3Cpath d='M106.81863443903,481.4 a205,205 1 0,1 386.36273112194,0' stroke='%23111' stroke-width='30' stroke-linecap='butt'/%3E%3C/svg%3E") !important;
  }

  /* CART */
  #header .header-top .navigation-buttons .cart-count {
    color: #111 !important;
    outline: none !important;
  }

  #header .header-top .navigation-buttons .cart-count::before {
    content: "" !important;
    display: block !important;
    width: 40px !important;
    height: 40px !important;
    background-repeat: no-repeat !important;
    background-position: center !important;
    background-size: 40px 40px !important;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 64 64' fill='none'%3E%3Ccircle cx='24' cy='54' r='4.5' stroke='%23111' stroke-width='4'/%3E%3Ccircle cx='46' cy='54' r='4.5' stroke='%23111' stroke-width='4'/%3E%3Cpath d='M8 11H15L21 38H48L55 20H25' stroke='%23111' stroke-width='4.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3Cpath d='M23 44H47' stroke='%23111' stroke-width='4.5' stroke-linecap='round'/%3E%3C/svg%3E") !important;
  }

  #header .header-top .navigation-buttons .cart-count::after {
    display: none !important;
    content: none !important;
  }

  #header .header-top .navigation-buttons .cart-count > span:first-child,
  #header .header-top .navigation-buttons .cart-count .csvg,
  #header .header-top .navigation-buttons .cart-count .cart-price,
  #header .header-top .navigation-buttons .cart-count .visible-lg-inline-block,
  #header .header-top .navigation-buttons .cart-count .sr-only {
    display: none !important;
  }

  /* MENU */
  #header .header-top .navigation-buttons .toggle-window[data-target="navigation"] {
    height: 42px !important;
    min-width: 86px !important;
    padding: 0 5px !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    border: 2px solid #111 !important;
    border-radius: 10px !important;
    box-sizing: border-box !important;
    background: #ebebeb !important;
    color: #111 !important;
    gap: 8px !important;
    font-size: 0 !important;
    line-height: 1 !important;
    white-space: nowrap !important;
  }

  #header .header-top .navigation-buttons .toggle-window[data-target="navigation"]::before {
    content: "" !important;
    display: block !important;
    width: 20px !important;
    height: 12px !important;
    background:
      linear-gradient(#111, #111) 0 0 / 100% 2.2px no-repeat,
      linear-gradient(#111, #111) 0 50% / 100% 2.2px no-repeat,
      linear-gradient(#111, #111) 0 100% / 100% 2.2px no-repeat !important;
  }

  #header .header-top .navigation-buttons .toggle-window[data-target="navigation"]::after {
    content: "Menu" !important;
    display: block !important;
    font-size: 14px !important;
    font-weight: 500 !important;
    color: #111 !important;
    line-height: 1 !important;
  }

  #header .header-top .navigation-buttons .toggle-window[data-target="navigation"] span,
  #header .header-top .navigation-buttons .toggle-window[data-target="navigation"] svg,
  #header .header-top .navigation-buttons .toggle-window[data-target="navigation"] i {
    display: none !important;
  }

  #header .header-top .custom-login-dropdown {
    top: calc(100% + 10px) !important;
    right: 0 !important;
    left: auto !important;
    width: min(92vw, 320px) !important;
  }

  #header .header-top .navigation-buttons a:hover,
  #header .header-top .navigation-buttons a:focus,
  #header .header-top .navigation-buttons a:active,
  #header .header-top .navigation-buttons button:hover,
  #header .header-top .navigation-buttons button:focus,
  #header .header-top .navigation-buttons button:active {
    box-shadow: none !important;
    outline: none !important;
  }
}

@media (max-width: 767px) {

  body.mobile-sticky-header-active {
    padding-top: var(--mobile-header-top-height, 72px) !important;
  }

  #header .header-top {
    position: fixed !important;
    top: 0 !important;
    left: 0 !important;
    right: 0 !important;
    width: 100% !important;
    z-index: 9999 !important;
    background: #ebebeb !important;
  }

  #header .header-bottom {
    position: relative !important;
    z-index: 20 !important;
  }
}