/* Zoomag r16 — restore coin shape; viewport-aware search spacing/readability. */

/* COIN: undo the circular 'ball' mask. Keep original artwork geometry. */
body.zm-storefront-r16 .zoomag_logo_with_coins,
body.zm-storefront-r16 .zoomag_logo_block,
body.zm-storefront-r16 .zoomag_logo_block > a {
  background: transparent !important;
  box-shadow: none !important;
  overflow: visible !important;
}
body.zm-storefront-r16 .zoomag_logo_with_coins .coin,
body.zm-storefront-r16 .zoomag_logo_with_coins .coin.coin-slide-right {
  clip-path: none !important;
  -webkit-clip-path: none !important;
  border-radius: 30% !important;
  overflow: visible !important;
  background-color: transparent !important;
  background-size: contain !important;
  background-position: center !important;
  background-repeat: no-repeat !important;
  mix-blend-mode: multiply !important;
  box-shadow: none !important;
  filter: drop-shadow(1px 5px 9px rgba(68,48,10,.22)) !important;
}
body.zm-storefront-r16 .zoomag_logo_with_coins .coin::before,
body.zm-storefront-r16 .zoomag_logo_with_coins .coin::after {
  clip-path: none !important;
  -webkit-clip-path: none !important;
  border-radius: 30% !important;
}

/* SEARCH: dedicated icon lane + viewport-aware text/button sizing. */
body.zm-storefront-r16 .magic-search-input-wrapper {
  background: #fff !important;
  background-image: none !important;
  border-color: #d5e0d8 !important;
  overflow: visible !important;
}
body.zm-storefront-r16 .magic-search-input {
  box-sizing: border-box !important;
  padding-left: clamp(82px, 3.6vw, 126px) !important;
  padding-right: clamp(154px, 8.2vw, 210px) !important;
  color: #263849 !important;
  -webkit-text-fill-color: #263849 !important;
  font-size: clamp(17px, .78vw, 24px) !important;
  font-weight: 600 !important;
}
body.zm-storefront-r16 .magic-search-input::placeholder {
  color: #718072 !important;
  -webkit-text-fill-color: #718072 !important;
  opacity: 1 !important;
}
body.zm-storefront-r16 .magic-loupe {
  left: clamp(18px, 1.05vw, 30px) !important;
  width: clamp(36px, 1.8vw, 48px) !important;
  height: clamp(36px, 1.8vw, 48px) !important;
  font-size: clamp(15px, .72vw, 21px) !important;
  background: #fff3e6 !important;
  color: #e98329 !important;
}
body.zm-storefront-r16 .magic-search-btn {
  width: clamp(118px, 6.6vw, 172px) !important;
  min-width: clamp(118px, 6.6vw, 172px) !important;
  padding-inline: clamp(16px, 1vw, 26px) !important;
  background: #1d7549 !important;
  color: #fff !important;
  -webkit-text-fill-color: #fff !important;
  font-size: clamp(15px, .72vw, 22px) !important;
  line-height: 1 !important;
  font-weight: 850 !important;
  text-shadow: none !important;
}
body.zm-storefront-r16 .magic-search-btn:hover,
body.zm-storefront-r16 .magic-search-btn:focus {
  background: #155e3a !important;
  color: #fff !important;
  -webkit-text-fill-color: #fff !important;
}

/* Explicit extra scale for the very-wide CSS viewport seen in screenshots. */
@media (min-width: 2200px) {
  body.zm-storefront-r16 .magic-search-input {
    padding-left: 112px !important;
    padding-right: 220px !important;
    font-size: 22px !important;
  }
  body.zm-storefront-r16 .magic-loupe {
    left: 28px !important;
    width: 48px !important;
    height: 48px !important;
    font-size: 21px !important;
  }
  body.zm-storefront-r16 .magic-search-btn {
    width: 168px !important;
    min-width: 168px !important;
    font-size: 20px !important;
  }
}
@media (min-width: 3000px) {
  body.zm-storefront-r16 .magic-search-input {
    padding-left: 132px !important;
    padding-right: 250px !important;
    font-size: 25px !important;
  }
  body.zm-storefront-r16 .magic-loupe {
    left: 32px !important;
    width: 54px !important;
    height: 54px !important;
    font-size: 23px !important;
  }
  body.zm-storefront-r16 .magic-search-btn {
    width: 190px !important;
    min-width: 190px !important;
    font-size: 23px !important;
  }
}

@media (max-width: 767.98px) {
  body.zm-storefront-r16 .magic-search-input {
    padding-left: 58px !important;
    padding-right: 108px !important;
    font-size: 15px !important;
  }
  body.zm-storefront-r16 .magic-loupe {
    left: 14px !important;
    width: 34px !important;
    height: 34px !important;
    font-size: 15px !important;
  }
  body.zm-storefront-r16 .magic-search-btn {
    width: 90px !important;
    min-width: 90px !important;
    font-size: 13px !important;
  }
}
