:root {
  --sp-ink: #111827;
  --sp-text: #374151;
  --sp-muted: #6b7280;
  --sp-line: #e8ebef;
  --sp-soft: #f6f7f9;
  --sp-radius: 14px;
}

/* ---------- Header: sticky menu bar ----------
   The menu bar used to switch to position:fixed at 100px of scroll, which pulled it out of the page,
   made everything below jump up by its height, and could loop on short pages (visible flicker).
   Sticky keeps its space in the page; only the contact strip above it scrolls away. */
header {
  position: -webkit-sticky;
  position: sticky;
  top: calc(-1 * var(--ko-topbar-h, 0px));
  z-index: 1030;
}
header .bottom_bar.fixed_header { position: static; }
/* Anything else that sticks while scrolling has to sit below the pinned menu bar. */
.shop.shop-category-page .shop-sidebar { top: var(--ko-header-h, 0px) !important; }
.ka-nav { top: calc(var(--ko-header-h, 0px) + 16px) !important; }
/* On phones the page hides sideways overflow, which turns the section into the sticky container and pushes
   the chips down by the header height. The chips card also hangs from the header there. */
@media (max-width: 767.98px) {
  .shop.shop-category-page { margin-top: 0 !important; }
  .shop.shop-category-page .shop-sidebar { position: static !important; top: auto !important; }
}

/* ---------- No shrink-on-hover ----------
   Older styles shrank buttons and images to 90% on hover. The edge moves out from under the cursor,
   the hover ends, it grows back, and it flickers in a loop. */
.banner a:hover,
.categories .main_wapper img:hover,
.shop_appreal .main_wapper img:hover,
.common_shop:hover img,
.contact_sec button:hover,
.contact_form button:hover,
.button_order a:hover,
.create-btn:hover,
.edit_address:hover {
  transform: none !important;
}
/* Same flicker for lifting cards: the lift follows the card's unmoving wrapper instead. */
.shop .shop_appreal .subcategory-card.main_wapper:hover,
.shop .shop_appreal .main_wapper:hover {
  transform: none !important;
}
@media (min-width: 768px) and (hover: hover) and (pointer: fine) {
  .shop .shop_appreal *:hover > .main_wapper { transform: translateY(-4px) !important; }
}
/* Touch screens keep hover styles after a tap, so nothing should move or resize on hover there. */
@media (hover: none) {
  .add_cart:hover,
  .checout_btn:hover,
  .place-order:hover,
  .promoapply:hover,
  .return_text:hover,
  .continue_shop:hover,
  .continue_shp:hover,
  .add_btn a:hover,
  .add_btn button:hover,
  .login_sec .login_btn:hover,
  .contact_form .btn-submit-contact:hover,
  .how_sec .help-form .btn-submit-help:hover,
  .cart-qty-control .cart-qty-btn:hover,
  .error-404-btn-primary:hover,
  .empty-cart a:hover,
  .shop .shop_appreal .main_wapper:hover .img img,
  .shop-details .silde_main:hover img {
    transform: none !important;
  }
}

/* ---------- Shared buttons ---------- */
.add_cart,
.checout_btn,
.place-order,
.promoapply,
.return_text,
.continue_shop,
.view_price,
.continue_shp,
.add_btn a,
.add_btn button {
  border-radius: 10px !important;
  font-weight: 600 !important;
  letter-spacing: 0.01em;
  transition: background-color 0.2s, color 0.2s, border-color 0.2s, transform 0.15s, box-shadow 0.2s !important;
}
.add_cart:hover,
.checout_btn:hover,
.place-order:hover,
.promoapply:hover,
.return_text:hover,
.continue_shop:hover,
.continue_shp:hover,
.add_btn a:hover,
.add_btn button:hover {
  transform: translateY(-1px) !important;
}

/* ---------- Home ---------- */
.home-section-head {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 20px;
}
.home-section-title {
  margin: 0 0 20px;
  text-align: center;
  font-size: 30px;
  font-weight: 700;
  color: var(--sp-ink);
  letter-spacing: -0.01em;
}
.home-section-head .home-section-title {
  margin: 0;
  text-align: left;
}
.home-section-link {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: 14px;
  font-weight: 600;
  color: var(--primary, #017961);
  text-decoration: none;
  white-space: nowrap;
}
.home-section-link:hover { text-decoration: underline; }
.home-all-products,
.categories {
  padding: 56px 0 24px;
}
.categories .head_main { margin-bottom: 4px; }
.how_sec .help-card { border-radius: 18px !important; }

/* ---------- Product detail ---------- */
.shop-details .silde_main .img_up {
  overflow: hidden;
  border: 1px solid var(--sp-line);
  border-radius: 18px;
  background: var(--sp-soft);
}
.shop-details .silde_main img {
  object-fit: contain !important;
  transition: transform 0.4s ease !important;
}
.shop-details .silde_main:hover img {
  transform: scale(1.03) !important;
  opacity: 1 !important;
}
.shop-details .silde_nav img {
  width: 100% !important;
  max-width: 110px;
  height: 110px !important;
  border-radius: 12px !important;
  border: 2px solid transparent !important;
  background: var(--sp-soft);
  object-fit: contain !important;
  transition: border-color 0.15s;
}
.shop-details .silde_nav .slick-current img,
.shop-details .silde_nav img:hover {
  border-color: var(--primary, #017961) !important;
  opacity: 1 !important;
}
.shop-details .silde_nav .slick-slide { padding: 0 5px; }

.shop-details .item_detail > a.apparel {
  display: inline-block !important;
  margin-top: 4px !important;
  padding: 3px 10px;
  border-radius: 999px;
  background: var(--sp-soft);
  color: var(--sp-muted) !important;
  font-size: 12px !important;
  font-weight: 600 !important;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}
.shop-details .item_detail > a.fs_32 {
  font-size: 30px !important;
  font-weight: 700 !important;
  line-height: 1.25;
  color: var(--sp-ink) !important;
  letter-spacing: -0.01em;
  pointer-events: none;
}
.shop-details #priceCurrDt {
  font-size: 26px !important;
  font-weight: 700 !important;
}

.shop-details .size_select {
  gap: 12px;
}
.shop-details .size_select > h3,
.shop-details .size_select h3.apparel {
  flex: 0 0 96px;
  max-width: 96px;
  font-size: 14px !important;
  font-weight: 600 !important;
  color: var(--sp-text) !important;
}
.shop-details .size_select select,
.shop-details .size_select .form-select {
  min-width: 220px;
  height: 46px !important;
  border: 1px solid var(--sp-line) !important;
  border-radius: 10px !important;
  background-color: #fff !important;
  font-size: 15px;
  color: var(--sp-ink);
  transition: border-color 0.15s, box-shadow 0.15s;
}
.shop-details .size_select select:focus {
  border-color: var(--primary, #017961) !important;
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--primary, #017961) 18%, transparent) !important;
  outline: none;
}
.shop-details .input_increment {
  display: inline-flex;
  align-items: center;
  overflow: hidden;
  border: 1px solid var(--sp-line);
  border-radius: 10px;
  background: #fff;
}
.shop-details .input_increment button {
  width: 40px;
  height: 44px;
  border: 0 !important;
  background: transparent !important;
}
.shop-details .input_increment button:hover { background: var(--sp-soft) !important; }
.shop-details .input_increment input {
  width: 56px !important;
  height: 44px;
  border: 0 !important;
  border-left: 1px solid var(--sp-line) !important;
  border-right: 1px solid var(--sp-line) !important;
  border-radius: 0 !important;
  text-align: center;
  font-weight: 600;
}

.shop-details .custom_name {
  padding: 14px 16px !important;
  border: 1px solid var(--sp-line) !important;
  border-radius: 14px !important;
  background: #fafbfc !important;
  box-shadow: none !important;
}
.shop-details .custom_name h4 {
  font-size: 15px !important;
  font-weight: 600 !important;
  color: var(--sp-ink);
}
.shop-details .custom_name input[type="text"],
.shop-details .custom_name input:not([type]) {
  margin-top: 12px !important;
  height: 46px;
  border: 1px solid var(--sp-line) !important;
  border-radius: 10px !important;
  background: #fff !important;
}
.shop-details .custom_name input[type="text"]:focus {
  border-color: var(--primary, #017961) !important;
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--primary, #017961) 18%, transparent) !important;
}

.shop-details .product_total {
  margin-top: 0 !important;
  padding: 12px 2px;
  border-bottom: 1px dashed var(--sp-line);
}
.shop-details .product_total h3 {
  font-size: 15px !important;
  color: var(--sp-muted) !important;
}
.shop-details .product_total h4 { font-size: 16px !important; }
.shop-details .product_total:has(.price_grand) {
  border-bottom: 0;
  padding-top: 16px;
}
.shop-details .product_total:has(.price_grand) h3 {
  color: var(--sp-ink) !important;
  font-weight: 700 !important;
  font-size: 17px !important;
}
.shop-details .price_grand h4 {
  font-size: 22px !important;
  font-weight: 700 !important;
}
.shop-details .add_cart {
  width: 100% !important;
  max-width: 380px;
  height: 52px !important;
  margin-top: 24px !important;
  background-color: var(--sp-ink) !important;
  font-size: 16px !important;
  text-transform: none !important;
  box-shadow: 0 8px 20px rgba(17, 24, 39, 0.18);
}
.shop-details .add_cart:hover {
  background-color: var(--primary, #017961) !important;
}
.shop-details .detail_alert {
  border-radius: 12px;
}

/* ---------- Cart ---------- */
.cart .cart-page-title {
  font-size: 30px;
  font-weight: 700;
  color: var(--sp-ink);
  letter-spacing: -0.01em;
}
.cart .table_common,
.cart .cart-summary-card {
  border-radius: 16px !important;
}
.cart .cart-summary-card {
  box-shadow: 0 10px 30px rgba(16, 24, 40, 0.06);
}
.cart .continue_shop {
  height: 44px;
  padding: 0 18px;
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
}
.cart .clearallcart,
.cart .clearallcartoffline {
  background: #fff !important;
  border: 1px solid var(--sp-line) !important;
  color: var(--sp-text) !important;
}
.cart .clearallcart:hover,
.cart .clearallcartoffline:hover {
  border-color: #fca5a5 !important;
  color: #b91c1c !important;
}
.cart .checout_btn {
  height: 52px !important;
  background-color: var(--sp-ink) !important;
  font-size: 16px;
  box-shadow: 0 8px 20px rgba(17, 24, 39, 0.18);
}
.cart .checout_btn:hover { background-color: var(--primary, #017961) !important; }

.cart .cart-table-modern thead th:first-child,
.cart .cart-table-modern tbody td:first-child {
  min-width: 250px;
}
@media (min-width: 1200px) {
  .cart > .container {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 320px;
    column-gap: 24px;
    align-items: start;
  }
  .cart > .container > .cart-page-title { grid-column: 1 / -1; }
  .cart .cart-table-modern thead th,
  .cart .cart-table-modern tbody td {
    padding-left: 0.5rem !important;
    padding-right: 0.5rem !important;
  }
  .cart > .container > .table_common { grid-column: 1; min-width: 0; }
  .cart > .container > .shipping_price {
    grid-column: 2;
    position: sticky;
    top: calc(var(--ko-header-h, 80px) + 16px);
    margin-top: 0 !important;
  }
  .cart > .container > .shipping_price > .row { margin: 0; }
  .cart > .container > .shipping_price > .row > [class*="col-"]:first-child { display: none; }
  .cart > .container > .shipping_price > .row > [class*="col-"]:last-child {
    flex: 0 0 100%;
    max-width: 100%;
    width: 100%;
    padding: 0;
  }
}

/* ---------- Cart on phones: one card per item, labelled price / quantity / subtotal ---------- */
@media (max-width: 767.98px) {
  .cart .table_common .table-responsive { padding: 16px !important; }
  .cart .cart-table-modern { width: 100% !important; margin: 0 !important; }
  .cart .cart-table-modern tbody tr {
    display: flex !important;
    flex-direction: column;
    padding: 4px 0 12px;
  }
  .cart .cart-table-modern tbody td {
    width: 100% !important;
    min-width: 0 !important;
    max-width: none !important;
    padding: 8px 0 !important;
    text-align: left !important;
  }
  .cart .cart-table-modern .cart-line-item { max-width: none; }
  .cart .cart-table-modern:not(.cart-table-no-prices) tbody td:nth-child(2),
  .cart .cart-table-modern tbody td:nth-child(3),
  .cart .cart-table-modern:not(.cart-table-no-prices) tbody td:nth-child(4) {
    display: flex !important;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 6px 12px;
    border-top: 1px solid #f1f3f6;
  }
  .cart .cart-table-modern tbody td:nth-child(2)::before { content: "Price"; }
  .cart .cart-table-modern tbody td:nth-child(3)::before { content: "Quantity"; }
  .cart .cart-table-modern tbody td:nth-child(4)::before { content: "Subtotal"; }
  .cart .cart-table-modern tbody td:nth-child(2)::before,
  .cart .cart-table-modern tbody td:nth-child(3)::before,
  .cart .cart-table-modern tbody td:nth-child(4)::before {
    font-size: 14px;
    font-weight: 500;
    color: var(--sp-muted);
  }
  .cart .cart-table-modern tbody td:nth-child(4) { font-weight: 700 !important; }
  .cart .cart-table-modern tbody td:nth-child(3) > [id^="numbers-error"] { flex: 0 0 100%; }
  .cart .cart-table-modern tbody td:nth-child(3) .cart-qty-control { justify-content: flex-end; }
  .cart .cart-table-modern tbody td:nth-child(5) { text-align: right !important; padding-top: 4px !important; }
  .cart .btn_cart .continue_shop { width: 100%; margin: 0 !important; }
  .cart .btn_cart.d-flex { gap: 10px; }
}

section.empty-cart.m100 {
  display: flex;
  align-items: center;
  padding: 40px 0 80px;
}
.empty-cart > .container { width: 100%; }
.empty-cart .empty_common {
  display: block;
  min-height: 0;
  max-width: 460px;
  margin: 0 auto;
  padding: 44px 28px 38px;
  border: 1px solid var(--sp-line);
  border-radius: 20px;
  background: #fff;
  box-shadow: 0 10px 30px rgba(16, 24, 40, 0.06);
}
.empty-cart .empty-cart-icon {
  width: 72px;
  height: 72px;
  margin: 0 auto 18px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  background: color-mix(in srgb, var(--primary, #017961) 10%, #fff);
  color: var(--primary, #017961);
  font-size: 28px;
}
.empty-cart h3 {
  font-size: 24px !important;
  font-weight: 700 !important;
  color: var(--sp-ink) !important;
  text-transform: none !important;
}
.empty-cart p {
  margin: 8px 0 22px;
  font-size: 15px !important;
  color: var(--sp-muted) !important;
}
.empty-cart .return_text {
  display: inline-flex;
  width: auto;
  margin: 0 auto;
  align-items: center;
  gap: 8px;
  height: 48px;
  padding: 0 26px;
  background-color: var(--sp-ink) !important;
}
.empty-cart .return_text:hover { background-color: var(--primary, #017961) !important; }

/* ---------- Checkout ---------- */
.checkout h3.fs_25 {
  font-size: 22px !important;
  font-weight: 700 !important;
  color: var(--sp-ink) !important;
  text-transform: none !important;
}
.checkout .shipping_form,
.checkout .right_box,
.checkout .cuppon_code {
  padding: 24px;
  border: 1px solid var(--sp-line);
  border-radius: 16px;
  background: #fff;
}
.checkout .shipping_form .selct_pyment {
  margin-top: 28px;
  padding-top: 24px;
  border-top: 1px solid var(--sp-line);
}
.checkout .shipping_form .form-control,
.checkout .shipping_form .form-select,
.checkout .cuppon_code .form-control {
  height: 46px;
  border: 1px solid var(--sp-line) !important;
  border-radius: 10px !important;
  background-color: #fafbfc;
  font-size: 15px;
  color: var(--sp-ink);
  transition: border-color 0.15s, box-shadow 0.15s, background-color 0.15s;
}
.checkout .shipping_form .stripe-card-element {
  height: auto;
  min-height: 46px;
  padding-top: 13px;
}
.checkout .shipping_form .form-control:focus,
.checkout .shipping_form .form-select:focus,
.checkout .cuppon_code .form-control:focus {
  background-color: #fff;
  border-color: var(--primary, #017961) !important;
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--primary, #017961) 18%, transparent) !important;
}
.checkout .shipping_form label {
  font-size: 13px !important;
  font-weight: 600 !important;
  color: var(--sp-text);
}
.checkout .place-order {
  width: 100%;
  height: 52px;
  margin-top: 18px;
  border: 0;
  background-color: var(--sp-ink) !important;
  font-size: 16px !important;
  box-shadow: 0 8px 20px rgba(17, 24, 39, 0.18);
}
.checkout .place-order:hover { background-color: var(--primary, #017961) !important; }
.checkout .promoapply {
  background-color: var(--sp-ink) !important;
}
.checkout .promoapply:hover { background-color: var(--primary, #017961) !important; }
.checkout .checkout-review-banner { border-radius: 12px; }
.checkout .checkout-item-card { border-radius: 14px; }
@media (min-width: 992px) {
  .checkout .checkout-sidebar > .right_box {
    position: sticky;
    top: 96px;
  }
}

/* ---------- Order placed ---------- */
.billing_sec .billing_box,
.billing_sec .right_box {
  border-radius: 16px !important;
}
.billing_sec .thnku h3,
.billing_sec .thnk_text h3 {
  font-weight: 700 !important;
  color: var(--sp-ink);
}
.billing_sec .continue_shop,
.billing_sec .continue_shp {
  height: 48px;
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  padding: 0 24px;
}

/* ---------- Mobile ---------- */
@media (max-width: 575.98px) {
  .home-section-title { font-size: 24px; }
  .home-all-products,
  .categories { padding-top: 36px; }
  .shop-details .item_detail > a.fs_32 { font-size: 24px !important; }
  .shop-details .size_select select,
  .shop-details .size_select .form-select { min-width: 0; flex: 1 1 auto; }
  .shop-details .add_cart { max-width: none; }
  .checkout .shipping_form,
  .checkout .right_box,
  .checkout .cuppon_code { padding: 18px; }
}

/* ---------- Loading states (storefront-loading.js) ---------- */
@keyframes sp-spin { to { transform: rotate(360deg); } }
.add_cart.is-loading,
#bulk_btn.is-loading {
  cursor: progress !important;
}
.add_cart.is-loading::before,
#bulk_btn.is-loading::before {
  content: "";
  display: inline-block;
  width: 15px;
  height: 15px;
  margin-right: 8px;
  vertical-align: -2px;
  border: 2px solid rgba(255, 255, 255, 0.45);
  border-top-color: #fff;
  border-radius: 50%;
  animation: sp-spin 0.7s linear infinite;
}
.cart-summary-card.is-updating #sbT,
.cart-summary-card.is-updating #sizeScP,
.cart-summary-card.is-updating #gTot,
.cart [id^="gTotal"].is-updating {
  opacity: 0.45;
  transition: opacity 0.15s;
}
.cart-summary-card.is-updating #gTot::before,
.cart [id^="gTotal"].is-updating::before {
  content: "";
  display: inline-block;
  width: 12px;
  height: 12px;
  margin-right: 6px;
  vertical-align: -1px;
  border: 2px solid #d1d5db;
  border-top-color: var(--primary, #017961);
  border-radius: 50%;
  animation: sp-spin 0.7s linear infinite;
}

/* ---------- Product page facts + delivery note ---------- */
.pd-price-row {
  display: flex;
  align-items: baseline;
  gap: 8px;
  flex-wrap: wrap;
}
.pd-price-from,
.pd-price-unit {
  font-size: 15px;
  font-weight: 600;
  color: var(--sp-muted);
}
.pd-facts {
  display: flex;
  flex-direction: column;
  gap: 8px;
  margin-top: 12px;
}
.pd-min-order,
.delivery-note {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  margin: 0;
  padding: 10px 12px;
  border-radius: 10px;
  background: var(--sp-soft);
  font-size: 14px;
  line-height: 1.45;
  color: var(--sp-text);
}
.pd-min-order i,
.delivery-note i {
  margin-top: 2px;
  color: var(--primary, #017961);
}
.cart-delivery {
  margin-top: 14px;
  font-size: 13px;
}

/* ---------- Product page: before the photo slider starts ----------
   The slider script loads at the end of the page. Until then every photo was stacked down the page and
   then collapsed into the slider, a large flash on slower phones. Show only what the slider will show. */
.shop-details .silde_main:not(.slick-initialized) > .img ~ .img { display: none; }
.shop-details .silde_nav:not(.slick-initialized) {
  display: flex;
  gap: 10px;
  overflow: hidden;
}
.shop-details .silde_nav:not(.slick-initialized) > .img { flex: 0 0 auto; }

/* ---------- Product page: slider arrows (all sizes) ---------- */
.shop-details .silde_main .slick-arrow {
  z-index: 2;
  width: 38px;
  height: 38px;
  border: 0;
  border-radius: 50%;
  background: rgba(255, 255, 255, 0.92) !important;
  box-shadow: 0 2px 10px rgba(17, 24, 39, 0.18);
  -webkit-appearance: none;
  appearance: none;
}
.shop-details .silde_main .slick-prev { left: 10px; }
.shop-details .silde_main .slick-next { right: 10px; }
.shop-details .silde_main .slick-prev:before,
.shop-details .silde_main .slick-next:before {
  font-family: inherit;
  font-size: 26px;
  line-height: 36px;
  color: var(--sp-ink);
  opacity: 1;
}
.shop-details .silde_main .slick-prev:before { content: "\2039"; }
.shop-details .silde_main .slick-next:before { content: "\203A"; }
.shop-details .silde_main .slick-arrow.slick-disabled { opacity: 0.4; }

.pd-mobile-head { display: none; }

/* ---------- Product page: quantity price breaks (admin rich text) ---------- */
.pd-price-breaks {
  margin: 14px 0 4px;
  padding: 12px 14px;
  border: 1px solid var(--sp-line);
  border-left: 3px solid var(--primary, #017961);
  border-radius: 10px;
  background: #fff;
  font-size: 15px;
  line-height: 1.5;
  color: var(--sp-text);
}
.pd-price-breaks *:not(b):not(strong) {
  font-family: inherit !important;
  font-size: inherit !important;
  line-height: inherit !important;
}
.pd-price-breaks p,
.pd-price-breaks div { margin: 0 !important; min-height: 0 !important; }
/* Admins add empty paragraphs as spacers; inside the card they only add gaps. */
.pd-price-breaks p:has(> br:only-child),
.pd-price-breaks p:has(> b:only-child > br:only-child),
.pd-price-breaks div:has(> br:only-child),
.pd-price-breaks div:has(> span:only-child > br:only-child) { display: none; }

/* ---------- Product page: size chart link ---------- */
.pd-size-chart-btn {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 8px 14px;
  border: 1.5px solid var(--primary, #017961);
  border-radius: 999px;
  background: #fff;
  color: var(--primary, #017961) !important;
  font-size: 14px;
  font-weight: 600;
  line-height: 1.2;
  text-decoration: none !important;
  white-space: nowrap;
  cursor: pointer;
}
.pd-size-chart-btn i { font-size: 14px; }
.pd-size-chart-btn:hover,
.pd-size-chart-btn:focus-visible {
  background: var(--primary, #017961);
  color: #fff !important;
}
.pd-size-chart-btn--block { margin-bottom: 14px; }
.pd-sizes-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px 12px;
  flex-wrap: wrap;
}
.pd-size-chart-row { margin-top: 12px; }

/* ---------- Product page: size quantities, one line per size ---------- */
.shop-details .outfit-product > .ps-3 { padding-left: 0 !important; }
.shop-details .outfit-product .row.number {
  display: flex;
  flex-wrap: nowrap;
  align-items: center;
  gap: 8px;
  margin: 0 0 8px !important;
  padding: 8px 10px;
  border: 1px solid var(--sp-line);
  border-radius: 10px;
  background: #fff;
}
.shop-details .outfit-product .row.number > .col-md-4 {
  flex: 1 1 auto;
  width: auto;
  max-width: none;
  padding: 0 !important;
}
.shop-details .outfit-product .row.number label {
  margin: 0 !important;
  font-size: 15px;
  font-weight: 600;
  color: var(--sp-ink);
  word-break: normal;
}
.shop-details .outfit-product .row.number > .col-4 {
  flex: 0 0 58px;
  width: 58px;
  max-width: 58px;
  padding: 0 !important;
}
.shop-details .outfit-product .row.number input.ch_size {
  width: 100%;
  height: 40px;
  margin: 0 !important;
  border: 1px solid var(--sp-line);
  border-radius: 8px;
  text-align: center;
  font-size: 16px;
  font-weight: 600;
}
.shop-details .outfit-product .row.number .minus,
.shop-details .outfit-product .row.number .plus {
  flex: 0 0 40px;
  width: 40px !important;
  height: 40px !important;
  margin: 0 !important;
  padding: 0;
  border-radius: 8px;
  font-size: 18px;
}


@media (min-width: 768px) {
  .shop-details .outfit-product .row.number { max-width: 420px; }
}

/* ---------- Product page: tablets and phones ---------- */
@media (max-width: 991.98px) {
  .shop-details .silde_main .img_up {
    width: 100%;
    height: auto;
    aspect-ratio: 1 / 1;
  }
  .shop-details .silde_main img {
    width: 100% !important;
    height: 100% !important;
  }
  .shop-details .description.m-top { margin-top: 40px; }
}

@media (max-width: 767.98px) {
  .shop-details { overflow-x: hidden; overflow-x: clip; }
  section.shop-details.m100 { margin-top: 12px; margin-bottom: 40px; }

  .pd-mobile-head {
    display: block;
    margin: 0 0 14px;
  }
  .pd-mobile-cat {
    display: inline-block;
    padding: 3px 10px;
    border-radius: 999px;
    background: var(--sp-soft);
    color: var(--sp-muted);
    font-size: 12px;
    font-weight: 600;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    cursor: default;
  }
  .pd-mobile-title {
    margin: 8px 0 4px;
    font-size: 24px;
    font-weight: 700;
    line-height: 1.25;
    color: var(--sp-ink);
    text-transform: none;
    word-break: normal;
    overflow-wrap: anywhere;
  }
  .pd-mobile-price-row {
    display: flex;
    align-items: baseline;
    gap: 6px;
  }
  .pd-mobile-price {
    font-size: 22px;
    font-weight: 700;
    color: var(--primary, #017961);
    cursor: default;
  }

  /* Name, category and price are shown above the photos instead. */
  .shop-details .item_detail > a.apparel,
  .shop-details .item_detail > a.fs_32,
  .shop-details .item_detail .pd-price-row { display: none !important; }
  .shop-details .item_detail { margin-top: 16px; }
  .pd-price-breaks { margin-top: 0; }
  .pd-sizes-head .pd-size-chart-btn { padding: 7px 12px; font-size: 13px; }

  /* Pasted descriptions often carry tiny inline font sizes. */
  .shop-details .description [style*="font-size"] { font-size: 15px !important; line-height: 1.6 !important; }

  .shop-details .silde_main .img_up {
    max-height: 62vh;
    border-radius: 14px;
  }
  .shop-details .silde_main .slick-arrow { width: 34px; height: 34px; }
  .shop-details .silde_main .slick-prev:before,
  .shop-details .silde_main .slick-next:before { line-height: 32px; }
  .shop-details .silde_nav.mt-5 { margin-top: 12px !important; }
  .shop-details .silde_nav .slick-arrow,
  .shop-details .silde_nav .slick-dots { display: none !important; }
  .shop-details .silde_nav img {
    max-width: 72px;
    height: 72px !important;
  }

  /* Phones have no hover; the zoom effect would stick after a tap. */
  .shop-details .silde_main:hover img { transform: none !important; }

  .shop-details .size_select {
    flex-wrap: wrap;
  }
  .shop-details .size_select > h3,
  .shop-details .size_select h3.apparel { flex: 0 0 72px; max-width: 72px; }
  .shop-details .size_select select,
  .shop-details .size_select .form-select {
    min-width: 0;
    width: auto !important;
    flex: 1 1 0;
  }

  .shop-details .add_cart { width: 100% !important; max-width: none; }
  .shop-details .description.m-top { margin-top: 32px; }

}

/* iPhone Safari zooms the whole page into any field under 16px when it is tapped. */
@media (max-width: 767.98px) {
  input:not([type="hidden"]):not([type="checkbox"]):not([type="radio"]):not([type="range"]),
  select,
  textarea { font-size: 16px !important; }
}

/* custom.css capitalises every email placeholder ("Name@Example.Com"). */
input[type="email"]::placeholder { text-transform: none !important; }

/* ---------- Account: add a card ----------
   .card_detail styles from the old checkout strip the field borders, so the fields looked like plain text. */
.ka-card .card_detail { margin-bottom: 0; }
.ka-card .card_detail input.form-control[type="text"] {
  height: 46px;
  padding: 10px 12px;
  border: 1px solid #d9dee5 !important;
  border-radius: 10px;
  background: #fff !important;
  color: var(--sp-ink) !important;
  font-size: 16px !important;
}
.ka-card .card_detail input.form-control[type="text"]:focus {
  border-color: var(--primary, #017961) !important;
  box-shadow: 0 0 0 3px rgba(1, 121, 97, 0.12) !important;
}

/* Slick asks for a loading gif and an icon font that are not shipped with the site. */
.slick-loading .slick-list { background: #fff none !important; }
.slick-prev:before,
.slick-next:before,
.slick-dots li button:before { font-family: inherit !important; }

/* ---------- Footer: finger-sized links on touch screens ---------- */
@media (max-width: 767.98px) {
  .social_media a {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 44px;
    min-height: 44px;
  }
  .social_media a > span.pe-3 { padding-right: 0 !important; }
  .copy-right .terms a { display: inline-block; padding: 10px 0; }
  .ka-crumbs a,
  .ov-back {
    display: inline-block;
    padding: 10px 0;
    margin-top: -10px;
    margin-bottom: -10px;
  }
}

@media (max-width: 359.98px) {
  .pd-mobile-title { font-size: 21px; }
  .shop-details .outfit-product .row.number > .col-4 { flex-basis: 50px; width: 50px; max-width: 50px; }
}