/* Product card image radius */
.mp-pcard-imgwrap img,
.mp-pcard-media img {
  border-radius: 12px !important;
}
.mp-pcard-wish {
  position: absolute !important;
  top: 10px !important;
  left: 10px !important;
  z-index: 3 !important;
  width: 36px !important;
  height: 36px !important;
  border-radius: 50% !important;
  border: 0 !important;
  background: rgba(255,255,255,.92) !important;
  color: #111 !important;
  display: grid !important;
  place-items: center !important;
  cursor: pointer !important;
  box-shadow: 0 4px 12px rgba(0,0,0,.1) !important;
}
.mp-pcard-wish.is-active {
  background: #111 !important;
  color: #fff !important;
}
.mp-pcard-wish.is-active svg { stroke: #fff !important; fill: #fff !important; }
.mp-pcard-media { position: relative !important; }

/* Mobile bottom nav — black + white icons */
.mobile-bottom-nav {
  background: #000 !important;
  border-top: 1px solid #1a1a1a !important;
  box-shadow: 0 -6px 24px rgba(0,0,0,.25) !important;
  height: 8vh !important;
  min-height: 58px !important;
  max-height: 72px !important;
  z-index: 90 !important;
}
.mobile-bottom-nav a,
.mobile-bottom-nav button.bottom-menu-btn {
  color: #fff !important;
  background: transparent !important;
}
.mobile-bottom-nav .bottom-icon svg {
  stroke: #fff !important;
  width: 22px !important;
  height: 22px !important;
}
.mobile-bottom-nav .bottom-label {
  color: #fff !important;
  font-size: 10px !important;
  font-weight: 700 !important;
}
.mobile-bottom-nav a.active .bottom-label,
.mobile-bottom-nav a.active .bottom-icon svg {
  color: #fff !important;
  stroke: #fff !important;
  opacity: 1 !important;
}

/* Hamburger → X animation */
.bottom-menu-btn .bottom-icon {
  transition: transform .25s ease;
  display: grid;
  place-items: center;
}
.bottom-menu-btn.is-open .bottom-icon {
  transform: rotate(45deg);
}
.bottom-menu-btn.is-open .bottom-icon svg {
  /* swap to X look via rotate of menu lines - use CSS on path hard; simpler: change opacity */
}

/* Drawer: 90% height, above nav, rounded, scroll */
@media (max-width: 900px) {
  .mobile-drawer {
    top: 2vh !important;
    bottom: calc(8vh + 12px) !important;
    height: auto !important;
    max-height: 90vh !important;
    right: 12px !important;
    left: auto !important;
    width: min(320px, calc(100vw - 24px)) !important;
    border-radius: 20px !important;
    background: #000 !important;
    color: #fff !important;
    box-shadow: 0 20px 60px rgba(0,0,0,.45) !important;
    overflow-y: auto !important;
    -webkit-overflow-scrolling: touch !important;
    z-index: 95 !important;
    transform: translateX(110%) !important;
  }
  .mobile-drawer[aria-hidden="false"],
  body.drawer-open .mobile-drawer,
  body.mp-drawer-open .mobile-drawer {
    transform: translateX(0) !important;
  }
  .mobile-drawer .drawer-head,
  .mobile-drawer nav a,
  .mobile-drawer .drawer-intro strong {
    color: #fff !important;
  }
  .mobile-drawer nav a { color: #e8e8e8 !important; }
  .mobile-drawer nav a:hover { background: rgba(255,255,255,.08) !important; }
  .header-search-desktop { display: none !important; }
  .menu-toggle { display: none !important; }
}
@media (min-width: 901px) {
  .header-search-desktop { display: inline-flex !important; }
}

/* Header typography polish */
.desktop-nav a {
  font-size: 13px !important;
  font-weight: 700 !important;
  letter-spacing: 0 !important;
}
.header-login-btn {
  font-size: 12px !important;
  padding: 8px 16px !important;
  border-radius: 999px !important;
  background: #111 !important;
  color: #fff !important;
  font-weight: 800 !important;
}
.brand-logo { height: 32px !important; width: auto !important; }

/* Shop filters vs mobile nav */
@media (max-width: 900px) {
  .shop-toolbar,
  .woocommerce-filters,
  .mp-shop-filters,
  .widget_layered_nav,
  aside.widget {
    position: relative !important;
    z-index: 1 !important;
  }
  .woocommerce-products-header,
  .shop-toolbar {
    margin-bottom: 16px !important;
  }
  /* sticky filters shouldn't cover bottom nav */
  .shop-toolbar.is-sticky,
  .mp-filters-sticky {
    bottom: auto !important;
    top: 60px !important;
  }
  body {
    padding-bottom: 0 !important;
  }
  .site-footer {
    padding-bottom: calc(8vh + 24px) !important;
  }
}

.drawer-search-link {
  display: flex !important;
  align-items: center !important;
  gap: 12px !important;
  padding: 12px 14px !important;
  margin: 0 0 12px !important;
  border-radius: 14px !important;
  background: rgba(255,255,255,.08) !important;
  color: #fff !important;
  text-decoration: none !important;
}
.drawer-search-link small { display: block; color: #999; font-size: 11px; font-weight: 600; }
.drawer-search-link svg { stroke: #fff; width: 20px; height: 20px; }
