/** Shopify CDN: Minification failed

Line 850:0 Unexpected "@media"

**/
/* Beisat fashion product card — elevated card shell + clear detail chrome */

.beisat-product-card,
html.beisat .product-block--fashion {
  text-align: start;
  background: transparent;
  box-shadow: none;
}

html.beisat .product-grid {
  padding: 8px 4px 16px;
  gap: 16px;
}

html.beisat .product-grid .product-block--fashion,
html.beisat .beisat-featured__item .product-block--fashion {
  height: 100%;
}

/* Visual card lives on the inner shell so image + details share one surface */
.beisat-product-card .block-inner,
html.beisat .product-block--fashion .block-inner {
  height: 100%;
  padding: 0;
}

.beisat-pcard,
html.beisat .product-block--fashion .block-inner-inner {
  display: flex;
  flex-direction: column;
  height: 100%;
  overflow: hidden;
  border-radius: 16px;
  background: #fff;
  border: 1px solid rgb(17 17 17 / 0.06);
  box-shadow:
    0 1px 2px rgb(17 17 17 / 0.04),
    0 8px 24px rgb(17 17 17 / 0.08);
}


.beisat-pcard__media,
html.beisat .product-block--fashion .image-cont {
  position: relative;
  overflow: hidden;
  isolation: isolate;
  border-radius: 0;
  background: #f3f3f3;
  /* Symmetry ships `.product-block .image-cont { margin: 0 auto }`, which was
     harmless while the card was a block. .beisat-pcard is a column flex
     container, and auto margins on the cross axis suppress stretch, so the
     media collapsed to its fit-content width - zero, because every child is
     absolutely positioned. That zero width then made .img-ar's percentage
     padding-top resolve to zero height and the image never took up space.
     Pin the cross axis explicitly. */
  width: 100%;
  margin-inline: 0;
}

/* Product card photo, every card and screen size: slightly landscape (1.1:1)
   so two full rows (4 products) fit on a phone screen; the text area under it
   keeps its size. Was 4:5 (0.8). */
html.beisat .product-block--fashion .image-cont .img-ar,
.beisat-product-card .image-cont .img-ar {
  --aspect-ratio: 1.1 !important;
}

.beisat-pcard__media-link {
  display: block;
}

.beisat-pcard__media img,
.beisat-pcard__media .theme-img,
html.beisat .product-block--fashion .image-cont img,
html.beisat .product-block--fashion .image-cont .theme-img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center 15%;
}

.beisat-product-card .image-cont--with-secondary-image .product-block__image--secondary {
  transition: opacity var(--beisat-duration, 0.35s) var(--beisat-ease-timing, cubic-bezier(0.22, 1, 0.36, 1));
}

/* Reveal the second photo on hover even before the card script runs.
   display:none was keeping loading="lazy" from fetching the file. */
@media (hover: hover) {
  .beisat-product-card .image-cont--with-secondary-image:hover .product-block__image--inactivated,
  html.beisat .product-block--fashion .image-cont--with-secondary-image:hover .product-block__image--inactivated {
    display: block !important;
  }

  .beisat-product-card .image-cont--with-secondary-image:hover .product-block__image--active,
  html.beisat .product-block--fashion .image-cont--with-secondary-image:hover .product-block__image--active {
    opacity: 0;
  }

  .beisat-product-card .image-cont--with-secondary-image:hover .product-block__image--show-on-hover,
  html.beisat .product-block--fashion .image-cont--with-secondary-image:hover .product-block__image--show-on-hover {
    opacity: 1;
  }
}

.beisat-pcard__wishlist,
html.beisat .product-block--fashion .product-block__wishlist {
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  position: absolute;
  top: 10px;
  /* Physical left — do not mirror in Arabic RTL */
  left: 10px;
  right: auto;
  inset-inline-start: auto;
  inset-inline-end: auto;
  z-index: 8;
  width: 40px;
  height: 40px;
  padding: 0 !important;
  border: 0;
  border-radius: 50%;
  background: #fff !important;
  color: #171717 !important;
  box-shadow: 0 2px 10px rgb(17 17 17 / 0.14);
  cursor: pointer;
  pointer-events: auto !important;
  font-size: 0 !important;
  line-height: 0 !important;
  overflow: hidden;
  box-sizing: border-box;
  transition: transform 0.25s cubic-bezier(0.22, 1, 0.36, 1), color 0.2s ease, background-color 0.2s ease, box-shadow 0.2s ease;
}

/* Always-visible heart (ST app often empties / replaces button content) */
.beisat-pcard__wishlist::after,
html.beisat .product-block--fashion .product-block__wishlist::after {
  content: "";
  display: block;
  flex: 0 0 auto;
  width: 18px;
  height: 18px;
  margin: 0;
  background-color: currentColor;
  mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='none' stroke='black' stroke-width='1.6' d='M12 20s-7-4.4-7-10a4 4 0 0 1 7-2 4 4 0 0 1 7 2c0 5.6-7 10-7 10Z'/%3E%3C/svg%3E") center / contain no-repeat;
  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='none' stroke='black' stroke-width='1.6' d='M12 20s-7-4.4-7-10a4 4 0 0 1 7-2 4 4 0 0 1 7 2c0 5.6-7 10-7 10Z'/%3E%3C/svg%3E") center / contain no-repeat;
}

.beisat-pcard__wishlist img,
.beisat-pcard__wishlist svg,
.beisat-pcard__wishlist span,
.beisat-pcard__wishlist .st-wishlist-button-text,
html.beisat .product-block--fashion .product-block__wishlist img,
html.beisat .product-block--fashion .product-block__wishlist svg,
html.beisat .product-block--fashion .product-block__wishlist span,
html.beisat .product-block--fashion .product-block__wishlist .st-wishlist-button-text {
  display: none !important;
}


.beisat-pcard__wishlist.is-tapped,
html.beisat .product-block--fashion .product-block__wishlist.is-tapped {
  animation: beisat-heart-tap 0.32s cubic-bezier(0.22, 1, 0.36, 1);
}

.beisat-pcard__wishlist.is-active,
html.beisat .product-block--fashion .product-block__wishlist.is-active,
.beisat-pcard__wishlist.st-is-added,
html.beisat .product-block--fashion .product-block__wishlist.st-is-added,
.beisat-pcard__wishlist.st-is-loading:not(.st-is-added),
html.beisat .product-block--fashion .product-block__wishlist.st-is-loading:not(.st-is-added),
.beisat-pcard__wishlist.st-wishlist-button.active,
html.beisat .product-block--fashion .product-block__wishlist.st-wishlist-button.active,
.beisat-pcard__wishlist[aria-pressed="true"],
html.beisat .product-block--fashion .product-block__wishlist[aria-pressed="true"] {
  color: #e53935 !important;
  background: #fff5f5 !important;
  box-shadow: 0 1px 4px rgb(229 57 53 / 0.28);
}

.beisat-pcard__wishlist.is-active::after,
html.beisat .product-block--fashion .product-block__wishlist.is-active::after,
.beisat-pcard__wishlist.st-is-added::after,
html.beisat .product-block--fashion .product-block__wishlist.st-is-added::after,
.beisat-pcard__wishlist.st-is-loading:not(.st-is-added)::after,
html.beisat .product-block--fashion .product-block__wishlist.st-is-loading:not(.st-is-added)::after,
.beisat-pcard__wishlist.st-wishlist-button.active::after,
html.beisat .product-block--fashion .product-block__wishlist.st-wishlist-button.active::after,
.beisat-pcard__wishlist[aria-pressed="true"]::after,
html.beisat .product-block--fashion .product-block__wishlist[aria-pressed="true"]::after {
  background-color: currentColor;
  mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='black' d='M12 20s-7-4.4-7-10a4 4 0 0 1 7-2 4 4 0 0 1 7 2c0 5.6-7 10-7 10Z'/%3E%3C/svg%3E") center / contain no-repeat;
  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='black' d='M12 20s-7-4.4-7-10a4 4 0 0 1 7-2 4 4 0 0 1 7 2c0 5.6-7 10-7 10Z'/%3E%3C/svg%3E") center / contain no-repeat;
}

@keyframes beisat-heart-tap {
  0% { transform: scale(1); }
  40% { transform: scale(1.18); }
  100% { transform: scale(1); }
}

.beisat-pcard__wishlist:focus-visible,
html.beisat .product-block--fashion .product-block__wishlist:focus-visible {
  outline: 2px solid var(--beisat-color-focus, #111);
  outline-offset: 2px;
}

/* Badges top-right — keep physical right in Arabic RTL (do not flip) */
.beisat-pcard__badges,
html.beisat .product-block--fashion .product-label-container {
  /* Beat Symmetry `.product-label-container { inset: 7.5px }` which pinned
     sale tags over the wishlist heart on the left. */
  inset: 10px 10px auto auto !important;
  left: unset !important;
  right: 10px !important;
  top: 10px !important;
  bottom: unset !important;
  width: max-content !important;
  max-width: calc(100% - 56px);
  z-index: 3;
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  gap: 4px;
  pointer-events: none;
  position: absolute !important;
}

.beisat-pcard__badges > *,
html.beisat .product-block--fashion .product-label-container > * {
  pointer-events: auto;
}

/* Stock already shows under title — hide image stock chip for cleaner cards */
.beisat-pcard__badge--stock,
html.beisat .product-block--fashion .product-label--stock,
html.beisat .product-block--fashion .product-label--stock > span {
  display: none !important;
}

/* Modern sale / new pills */
.beisat-pcard__badge,
.beisat-product-card .product-label > span,
.beisat-pcard__badge.product-label,
html.beisat .product-block--fashion .product-label--sale > span,
html.beisat .product-block--fashion .product-label--new-in > span {
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  min-height: 22px;
  padding: 4px 10px !important;
  border-radius: 999px !important;
  background: #111 !important;
  color: #fff !important;
  font-size: 11px !important;
  font-weight: 600 !important;
  letter-spacing: 0.02em;
  line-height: 1.2 !important;
  text-transform: none !important;
  box-shadow: 0 1px 2px rgb(0 0 0 / 0.12);
}

.beisat-pcard__badge--new,
html.beisat .product-block--fashion .product-label--new-in > span {
  background: #171717 !important;
}

html.beisat .product-block--fashion .product-label--sale > span {
  background: #e11d48 !important;
}

html.beisat .product-block--fashion .product-block__quick-add {
  position: absolute;
  inset-inline-end: 10px;
  bottom: 10px;
  left: auto;
  right: auto;
  z-index: 5;
  width: calc(100% - 20px);
  max-width: 100%;
  padding: 0;
  background: transparent;
  opacity: 1;
  transform: none;
  pointer-events: auto;
}

html.beisat .product-block--fashion .image-cont .btn.quickbuy-toggle {
  display: none !important;
}

html.beisat .product-block--fashion .product-block__quick-add-form {
  display: flex;
  flex-direction: row;
  align-items: flex-end;
  justify-content: flex-end;
  gap: 8px;
  width: 100%;
}

html.beisat .product-block--fashion .product-block__quick-add--sizes .product-block__quick-add-form {
  justify-content: space-between;
}

/* Compact Material size menu — ~40% card width */
/* Compact Material size menu — ~40% card width */
html.beisat .product-block--fashion .product-block__size-menu {
  position: relative;
  flex: 0 0 40%;
  width: 40%;
  max-width: 40%;
  min-width: 64px;
  z-index: 6;
}

html.beisat .product-block--fashion .product-block__size-menu.is-open {
  z-index: 20;
}

html.beisat .product-block--fashion:has(.product-block__size-menu.is-open) {
  z-index: 6;
  position: relative;
}

html.beisat .product-block--fashion .image-cont:has(.product-block__size-menu.is-open) {
  overflow: visible;
  z-index: 6;
}

html.beisat .product-block--fashion .product-block__quick-add-select {
  position: absolute;
  width: 1px;
  height: 1px;
  opacity: 0;
  pointer-events: none;
}

html.beisat .product-block--fashion .product-block__size-trigger {
  display: inline-flex;
  align-items: center;
  justify-content: space-between;
  gap: 4px;
  width: 100%;
  height: 36px;
  margin: 0;
  padding: 0 10px 0 12px;
  border: 0;
  border-radius: 4px;
  background: #fff;
  box-shadow:
    0 1px 2px rgb(0 0 0 / 0.14),
    0 1px 3px rgb(0 0 0 / 0.1);
  color: #171717;
  font-size: 12px;
  font-weight: 600;
  line-height: 1;
  cursor: pointer;
  transition: box-shadow 0.18s ease, background-color 0.18s ease;
}

html.beisat .product-block--fashion .product-block__size-trigger:hover {
  box-shadow:
    0 2px 4px rgb(0 0 0 / 0.16),
    0 1px 5px rgb(0 0 0 / 0.12);
}

html.beisat .product-block--fashion .product-block__size-menu.is-open .product-block__size-trigger {
  border-radius: 4px 4px 0 0;
  box-shadow:
    0 2px 4px rgb(0 0 0 / 0.14),
    0 4px 10px rgb(0 0 0 / 0.12);
}

html.beisat .product-block--fashion .product-block__size-trigger-label {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

html.beisat .product-block--fashion .product-block__size-trigger-icon {
  flex: 0 0 auto;
  transition: transform 0.18s ease;
}

html.beisat .product-block--fashion .product-block__size-menu.is-open .product-block__size-trigger-icon {
  transform: rotate(180deg);
}

html.beisat .product-block--fashion .product-block__size-trigger:focus-visible {
  outline: 2px solid #171717;
  outline-offset: 2px;
}

/* Material menu panel — opens upward above the trigger */
html.beisat .product-block--fashion .product-block__size-list {
  position: absolute;
  inset-inline: 0;
  bottom: calc(100% - 1px);
  z-index: 8;
  display: flex;
  flex-direction: column;
  gap: 0;
  margin: 0;
  padding: 4px 0;
  list-style: none;
  border-radius: 4px 4px 0 0;
  background: #fff;
  box-shadow:
    0 -2px 4px rgb(0 0 0 / 0.1),
    0 -6px 16px rgb(0 0 0 / 0.14);
  max-height: min(220px, 42vh);
  overflow-y: auto;
  overscroll-behavior: contain;
  -webkit-overflow-scrolling: touch;
  animation: beisat-size-menu-in 0.16s cubic-bezier(0.2, 0, 0, 1);
}

html.beisat .product-block--fashion .product-block__size-list[hidden] {
  display: none !important;
}

@keyframes beisat-size-menu-in {
  from {
    opacity: 0;
    transform: translateY(6px) scaleY(0.96);
    transform-origin: bottom center;
  }
  to {
    opacity: 1;
    transform: none;
    transform-origin: bottom center;
  }
}

html.beisat .product-block--fashion .product-block__size-option {
  display: flex;
  align-items: center;
  width: 100%;
  min-height: 40px;
  margin: 0;
  padding: 0 12px;
  border: 0;
  background: transparent;
  color: #171717;
  font-size: 13px;
  font-weight: 500;
  text-align: start;
  cursor: pointer;
  transition: background-color 0.12s ease;
}

html.beisat .product-block--fashion .product-block__size-option:hover,
html.beisat .product-block--fashion .product-block__size-option:focus-visible {
  background: rgb(0 0 0 / 0.06);
  outline: none;
}

html.beisat .product-block--fashion .product-block__size-option.is-selected {
  background: rgb(65 183 91 / 0.16);
  color: #111;
  font-weight: 700;
}

/* Hide legacy chip/panel/preview UI if any remains */
html.beisat .product-block--fashion .product-block__quick-add-panel,
html.beisat .product-block--fashion .product-block__quick-add-preview,
html.beisat .product-block--fashion .product-block__quick-add-chips,
html.beisat .product-block--fashion .product-block__quick-add-label,
html.beisat .product-block--fashion .product-block__quick-add-size {
  display: none !important;
}

html.beisat .product-block--fashion .product-block__quick-add-submit {
  position: relative;
  display: inline-flex;
  flex: 0 0 auto;
  align-items: center;
  justify-content: center;
  width: 36px;
  height: 36px;
  min-height: 36px;
  padding: 0;
  border: 0;
  border-radius: 50%;
  background: #41b75b;
  color: #ffffff;
  font-size: 0;
  font-weight: 600;
  line-height: 1;
  letter-spacing: 0;
  text-transform: none;
  text-decoration: none;
  box-shadow: 0 1px 4px rgb(22 163 74 / 0.35);
  cursor: pointer;
  transition: transform 0.2s cubic-bezier(0.22, 1, 0.36, 1), background-color 0.2s ease, box-shadow 0.2s ease;
}

html.beisat .product-block--fashion .product-block__quick-add-submit:hover {
  background: #35964c;
  color: #ffffff;
}

html.beisat .product-block--fashion .product-block__quick-add-plus,
html.beisat .product-block--fashion .product-block__quick-add-check {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  line-height: 0;
  color: #ffffff;
  fill: #ffffff;
}

html.beisat .product-block--fashion .product-block__quick-add-plus svg,
html.beisat .product-block--fashion .product-block__quick-add-check svg {
  color: #ffffff;
  fill: #ffffff;
  stroke: #ffffff;
}

html.beisat .product-block--fashion .product-block__quick-add-check {
  display: none;
}

html.beisat .product-block--fashion .product-block__quick-add.is-adding .product-block__quick-add-plus {
  display: none;
}

html.beisat .product-block--fashion .product-block__quick-add.is-adding .product-block__quick-add-check {
  display: inline-flex;
  animation: beisat-check-pop 0.35s cubic-bezier(0.22, 1, 0.36, 1);
}

html.beisat .product-block--fashion .product-block__quick-add.is-adding .product-block__quick-add-submit {
  background: #41b75b;
  color: #ffffff;
}

/* Already in cart — persistent check state */
html.beisat .product-block--fashion .product-block__quick-add.is-in-cart .product-block__quick-add-plus {
  display: none;
}

html.beisat .product-block--fashion .product-block__quick-add.is-in-cart .product-block__quick-add-check {
  display: inline-flex;
}

html.beisat .product-block--fashion .product-block__quick-add.is-in-cart .product-block__quick-add-submit {
  background: #41b75b;
  color: #ffffff;
  box-shadow: 0 1px 4px rgb(15 118 110 / 0.35);
}

html.beisat .product-block--fashion .product-block__quick-add.is-in-cart .product-block__quick-add-submit::before {
  content: "";
  position: absolute;
  inset: -2px;
  border-radius: 50%;
  border: 2px solid rgb(15 118 110 / 0.35);
  pointer-events: none;
}

@keyframes beisat-check-pop {
  0% { transform: scale(0.6); opacity: 0; }
  60% { transform: scale(1.12); opacity: 1; }
  100% { transform: scale(1); }
}

html.beisat .product-block--fashion .product-block__quick-add-desktop {
  display: none;
}

html.beisat .product-block--fashion .product-block__quick-add-submit:focus-visible {
  outline: 2px solid #fff;
  outline-offset: 2px;
}

/* Sold-out: hide empty grey circle (font-size:0 made label invisible) */
html.beisat .product-block--fashion .product-block__quick-add--sold {
  display: none !important;
}

html.beisat .product-block--fashion .product-block__quick-add-error {
  margin: 6px 0 0;
  color: var(--beisat-color-error, #b33323);
  font-size: 11px;
}

/* -------------------------------------------------------------------------- */
/* Detail area — standard padding, type hierarchy, aligned heights            */
/* -------------------------------------------------------------------------- */

.beisat-pcard__body,
html.beisat .product-block--fashion .product-block__detail {
  display: flex;
  flex-direction: column;
  flex: 1 1 auto;
  gap: 8px;
  margin-top: 0 !important;
  padding: 16px 16px 18px;
  background: #fff;
  border-top: 1px solid rgb(17 17 17 / 0.04);
  min-height: 108px;
}

.beisat-pcard__meta {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 4px 8px;
  margin-top: 2px;
}

.beisat-pcard__meta-item {
  color: #737373;
  font-size: 11px;
  font-weight: 500;
  letter-spacing: 0.01em;
  line-height: 1.3;
}

.beisat-pcard__meta-item--stock {
  color: #e11d48;
  font-weight: 600;
}

.beisat-pcard__meta-item--size {
  color: #525252;
  font-weight: 600;
}

.beisat-pcard__link {
  display: flex;
  flex-direction: column;
  gap: 6px;
  color: inherit;
  text-decoration: none;
}

.beisat-pcard__link:hover .beisat-pcard__title,
html.beisat .product-block--fashion .product-link:hover .product-block__title {
  text-decoration: underline;
  text-underline-offset: 2px;
}

.beisat-pcard__vendor {
  color: #737373;
  font-size: 11px;
  letter-spacing: 0.06em;
  text-transform: uppercase;
}

.beisat-pcard__title,
html.beisat .product-block--fashion .product-block__title {
  display: -webkit-box !important;
  margin: 0;
  overflow: hidden;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  line-clamp: 2;
  white-space: normal !important;
  text-overflow: ellipsis;
  min-height: calc(1.4em * 2);
  font-size: 14px !important;
  font-weight: 500 !important;
  letter-spacing: -0.01em;
  line-height: 1.4 !important;
  color: #111 !important;
}

.beisat-pcard__price,
html.beisat .product-block--fashion .product-price--block {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: 6px;
  margin: 0;
}

.beisat-pcard__price .price__current,
html.beisat .product-block--fashion .product-price--block .price__current {
  font-size: 14px !important;
  font-weight: 700 !important;
  color: #111 !important;
}

.beisat-pcard__price .price__was,
html.beisat .product-block--fashion .price__was,
.beisat-pcard__price .price__was .money,
html.beisat .product-block--fashion .price__was .money {
  color: #595959 !important;
  opacity: 1 !important;
  font-size: 13px !important;
  font-weight: 400 !important;
  text-decoration: line-through;
}

/* Sale current price stays dark for clarity (not red) */
.beisat-pcard__price .price--on-sale .price__current,
html.beisat .product-block--fashion .price--on-sale .price__current {
  color: #171717 !important;
}

.beisat-pcard__rating,
html.beisat .product-block--fashion .product-block__rating {
  display: flex;
  align-items: center;
  gap: 4px;
}

.beisat-pcard__rating .cc-rating-text,
html.beisat .product-block--fashion .product-block__rating .cc-rating-text {
  display: none;
}

.beisat-pcard__rating .cc-rating,
html.beisat .product-block--fashion .product-block__rating .cc-rating {
  transform: scale(0.85);
  transform-origin: 0 50%;
}

html[dir='rtl'] .beisat-pcard__rating .cc-rating,
html[dir='rtl'] .product-block--fashion .product-block__rating .cc-rating {
  transform-origin: 100% 50%;
}

.beisat-pcard__rating .cc-rating-custom-caption,
html.beisat .product-block--fashion .cc-rating-custom-caption {
  color: #737373;
  font-size: 11px;
}

.beisat-pcard__swatches,
html.beisat .product-block--fashion .product-block__colors,
.beisat-product-card .product-block-options__inner {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 6px;
  margin: 4px 0 0;
}

.beisat-pcard__swatch,
html.beisat .product-block--fashion .product-block__color,
.beisat-product-card .product-block-options__item {
  display: block;
  flex: none;
  width: 24px;
  height: 24px;
  overflow: hidden;
  border: 1px solid rgb(17 17 17 / 0.16);
  border-radius: 50%;
  background: var(--swatch-background-color, #d9d4cc);
}

.beisat-pcard__swatch.is-current,
html.beisat .product-block--fashion .product-block__color.is-current,
.beisat-product-card .product-block-options__item.is-current {
  outline: 1px solid #171717;
  outline-offset: 2px;
}

.beisat-pcard__swatch:focus-visible,
html.beisat .product-block--fashion .product-block__color:focus-visible {
  outline: 2px solid var(--beisat-color-focus, #111);
  outline-offset: 2px;
}

.beisat-pcard__swatch img,
.beisat-pcard__swatch .theme-img,
html.beisat .product-block--fashion .product-block__color img,
html.beisat .product-block--fashion .product-block__color .theme-img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.beisat-pcard__swatch-more {
  color: #737373;
  font-size: 0.6875rem;
}

.beisat-product-card .product-block-options__item__text {
  position: absolute;
  width: 1px;
  height: 1px;
  overflow: hidden;
  clip: rect(0 0 0 0);
}

.beisat-product-card--compact .beisat-pcard__wishlist,
.beisat-product-card--compact .product-block__quick-add {
  display: none;
}

.beisat-product-card--landscape .beisat-pcard {
  flex-direction: row;
  gap: 12px;
}

.beisat-product-card--landscape .beisat-pcard__media {
  flex: 0 0 42%;
}

@media (min-width: 768px) {
  .beisat-pcard__title,
  html.beisat .product-block--fashion .product-block__title {
    font-size: 14px !important;
  }

  .beisat-pcard__wishlist,
  html.beisat .product-block--fashion .product-block__wishlist {
    top: 10px;
    left: 10px;
    right: auto;
    inset-inline-start: auto;
    inset-inline-end: auto;
  }

  .beisat-pcard__badges,
  html.beisat .product-block--fashion .product-label-container {
    inset: 10px 10px auto auto !important;
    left: unset !important;
    right: 10px !important;
    top: 10px !important;
    bottom: unset !important;
  }

  html.beisat .product-block--fashion .product-block__quick-add {
    opacity: 1;
    transform: none;
    pointer-events: auto;
  }

  html.beisat .product-block--fashion .image-cont:hover .product-block__image-dots {
    opacity: 0;
  }
}

.beisat-pcard__media img,
.beisat-pcard__media .theme-img,

@media (prefers-reduced-motion: reduce) {
  .beisat-product-card .image-cont--with-secondary-image .product-block__image--secondary,
  html.beisat .product-block--fashion .product-block__quick-add,
  .beisat-pcard__wishlist,
  html.beisat .product-block--fashion .product-block__wishlist,
  .beisat-pcard__media img,
  .beisat-pcard__media .theme-img,
  html.beisat .product-block--fashion .image-cont img,
  html.beisat .product-block--fashion .image-cont .theme-img {
    transition: none;
  }

}

/* -------------------------------------------------------------------------- */
/* Mobile                                                                     */
/* -------------------------------------------------------------------------- */
@media (max-width: 767.98px) {
  .beisat-pcard,
  html.beisat .product-block--fashion .block-inner-inner {
    border-radius: 14px;
  }

  .beisat-pcard__body,
  html.beisat .product-block--fashion .product-block__detail {
    gap: 6px;
    padding: 14px 12px 16px;
    min-height: 98px;
  }

  .beisat-pcard__title,
  html.beisat .product-block--fashion .product-block__title {
    font-size: 13px !important;
    line-height: 1.4 !important;
    -webkit-line-clamp: 2;
    line-clamp: 2;
  }

  .beisat-pcard__price .price__current,
  html.beisat .product-block--fashion .product-price--block .price__current {
    font-size: 13px !important;
  }

  .beisat-pcard__price .price__was,
  html.beisat .product-block--fashion .price__was {
    font-size: 12px !important;
  }

  .beisat-pcard__meta-item,
  .beisat-pcard__rating .cc-rating-custom-caption,
  html.beisat .product-block--fashion .cc-rating-custom-caption {
    font-size: 11px;
  }

  .beisat-pcard__badge,
  .beisat-product-card .product-label > span,
  .beisat-pcard__badge.product-label,
  html.beisat .product-block--fashion .product-label--sale > span,
  html.beisat .product-block--fashion .product-label--new-in > span {
    padding: 3px 8px !important;
    font-size: 11px !important;
    min-height: 20px;
  }

  .beisat-pcard__wishlist,
  html.beisat .product-block--fashion .product-block__wishlist {
    width: 38px;
    height: 38px;
    padding: 11px;
    top: 8px;
    left: 8px;
  }

  .beisat-pcard__wishlist::after,
  html.beisat .product-block--fashion .product-block__wishlist::after {
    width: 14px;
    height: 14px;
  }

  html.beisat .product-block--fashion .product-block__size-menu {
    flex-basis: 40%;
    width: 40%;
    max-width: 40%;
    min-width: 56px;
  }

  html.beisat .product-block--fashion .product-block__size-trigger {
    height: 34px;
    padding: 0 8px 0 10px;
    font-size: 11px;
  }

  html.beisat .product-block--fashion .product-block__size-option {
    min-height: 38px;
    font-size: 12px;
  }

  html.beisat .product-block--fashion .product-block__quick-add-submit {
    width: 34px;
    height: 34px;
    min-height: 34px;
  }

  .beisat-pcard__swatches,
  html.beisat .product-block--fashion .product-block__colors,
  .beisat-product-card .product-block-options__inner {
    gap: 12px;
  }

  .beisat-pcard__swatch,
  html.beisat .product-block--fashion .product-block__color,
  .beisat-product-card .product-block-options__item {
    position: relative;
    width: 24px;
    height: 24px;
  }

  .beisat-pcard__swatch::after,
  html.beisat .product-block--fashion .product-block__color::after,
  .beisat-product-card .product-block-options__item::after {
    content: "";
    position: absolute;
    inset: -10px -6px;
  }
}

/* CL-03 Beisat labels: collection / NEW IN pills, colours from theme settings
   (snippets/beisat-label-styles). Sit above the sale badge in the same stack. */
.beisat-pcard__badge.beisat-label,
html.beisat .product-block--fashion .beisat-pcard__badge.beisat-label {
  background: var(--beisat-label-bg, #111) !important;
  color: var(--beisat-label-fg, #fff) !important;
  max-width: 100%;
  min-height: 20px;
  padding: 3px 8px !important;
  overflow: hidden;
  font-size: 11px !important;
  letter-spacing: 0.04em;
  text-overflow: ellipsis;
  white-space: nowrap;
}

[dir="rtl"] .beisat-pcard__badge.beisat-label {
  letter-spacing: 0;
}

/* -------------------------------------------------------------------------- */
/* SHEIN-style card rows: trends chip, stock badge + one-line title, ranking  */
/* strip, price + cart pill, colour dots on the image.                        */
/* -------------------------------------------------------------------------- */

.beisat-pcard__body,
html.beisat .product-block--fashion .product-block__detail {
  gap: 6px;
  padding: 10px 8px 12px;
  min-height: 0;
  border-top: 0;
}

.beisat-pcard__trend {
  display: flex;
  align-items: center;
  gap: 4px;
  min-width: 0;
  font-size: 11px;
  line-height: 1.5;
}

.beisat-pcard__trend-chip {
  flex: none;
  padding: 0 5px;
  border-radius: 2px;
  background: #9b51e0;
  color: #fff;
  font-weight: 600;
}

.beisat-pcard__store {
  display: inline-flex;
  align-items: center;
  gap: 2px;
  min-width: 0;
  padding: 0 5px;
  border-radius: 2px;
  background: #f5efff;
  color: #7a3fc8;
  text-decoration: none;
}

.beisat-pcard__store-name {
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}

.beisat-pcard__store-icon,
.beisat-pcard__chev {
  flex: none;
}

[dir='rtl'] .beisat-pcard__chev {
  transform: scaleX(-1);
}

.beisat-pcard__title-row {
  display: flex;
  align-items: center;
  gap: 4px;
  min-width: 0;
}

.beisat-pcard__badge-stock {
  flex: none;
  padding: 1px 4px;
  border-radius: 2px;
  background: #2a9fd6;
  color: #fff;
  font-size: 11px;
  font-weight: 600;
  line-height: 1.4;
  white-space: nowrap;
}

.beisat-pcard__title,
html.beisat .product-block--fashion .beisat-pcard__title.product-block__title {
  display: block !important;
  flex: 1 1 auto;
  min-width: 0;
  min-height: 0;
  overflow: hidden;
  -webkit-line-clamp: unset;
  line-clamp: unset;
  white-space: nowrap !important;
  text-overflow: ellipsis;
  font-size: 13px !important;
  font-weight: 400 !important;
}

.beisat-pcard__rank {
  display: flex;
  align-items: center;
  gap: 6px;
  min-width: 0;
  padding: 3px 6px;
  border-radius: 2px;
  background: #fff8e6;
  color: #b8601a;
  font-size: 11px;
  line-height: 1.4;
  text-decoration: none;
}

.beisat-pcard__rank-num {
  flex: none;
  padding: 0 4px;
  border-radius: 2px;
  background: #ffe7a3;
  color: #8a4708;
  font-weight: 700;
}

.beisat-pcard__rank-in {
  flex: 1 1 auto;
  min-width: 0;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}

.beisat-pcard__buy {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  margin-top: 2px;
}

.beisat-pcard__buy .beisat-pcard__price .price__current,
html.beisat .product-block--fashion .beisat-pcard__buy .price__current {
  font-size: 17px !important;
  font-weight: 800 !important;
}

.beisat-pcard__cart {
  flex: none;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 46px;
  height: 30px;
  padding: 0;
  border: 1.5px solid #111;
  border-radius: 999px;
  background: #fff;
  color: #111;
  cursor: pointer;
  transition: background-color 0.15s ease, color 0.15s ease, opacity 0.15s ease;
}

.beisat-pcard__cart:hover,
.beisat-pcard__cart:focus-visible,
.beisat-pcard:has(product-form.is-in-cart) .beisat-pcard__cart {
  background: #111;
  color: #fff;
}

.beisat-pcard:has(product-form.is-adding) .beisat-pcard__cart {
  opacity: 0.55;
}

/* The pill replaces the + on the image; the size chip stays on the image. */
html.beisat .product-block--fashion .beisat-pcard:has(.beisat-pcard__cart) .product-block__quick-add-submit {
  display: none !important;
}

html.beisat .product-block--fashion .beisat-pcard:has(.beisat-pcard__cart) .product-block__quick-add-form {
  justify-content: flex-start;
}

.beisat-pcard__dots {
  position: absolute;
  inset-inline-end: 8px;
  bottom: 10px;
  z-index: 6;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 3px;
  pointer-events: none;
}

.beisat-pcard__dot {
  display: block;
  width: 16px;
  height: 16px;
  overflow: hidden;
  border: 1.5px solid #fff;
  border-radius: 50%;
  background: var(--dot, #d4d4d4);
  box-shadow: 0 0 0 1px rgb(0 0 0 / 0.18);
}

.beisat-pcard__dot img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.beisat-pcard__dots-count {
  min-width: 16px;
  padding: 0 3px;
  border-radius: 999px;
  background: rgb(255 255 255 / 0.9);
  color: #222;
  font-size: 11px;
  font-weight: 600;
  line-height: 1.5;
  text-align: center;
}

/* Phones: two cards per row — tighter badge / rank so the title keeps room. */
@media (max-width: 599.98px) {
  .beisat-pcard__badge-stock {
    padding: 0 3px;
    font-size: 11px;
  }

  .beisat-pcard__trend,
  .beisat-pcard__rank {
    font-size: 11px;
  }

  .beisat-pcard__rank {
    gap: 4px;
    padding: 2px 4px;
  }

  .beisat-pcard__title,
  html.beisat .product-block--fashion .beisat-pcard__title.product-block__title {
    font-size: 12px !important;
  }

  .beisat-pcard__buy .beisat-pcard__price .price__current,
  html.beisat .product-block--fashion .beisat-pcard__buy .price__current {
    font-size: 15px !important;
  }

  .beisat-pcard__cart {
    width: 40px;
    height: 28px;
  }
}

/* Phones: keep badge pills clear of the wishlist heart (34px + 8px inset);
   a pill that still doesn't fit ends in "…" instead of being cut. */
@media (max-width: 599.98px) {
  /* Swishlist sizes its button from this variable (with !important). */
  .beisat-pcard__wishlist,
  html.beisat .product-block--fashion .product-block__wishlist {
    --st-product-card-btn-size: 34px;
    width: 34px;
    height: 34px;
    padding: 9px;
  }

  .beisat-pcard__badges,
  html.beisat .product-block--fashion .product-label-container {
    max-width: calc(100% - 56px) !important;
  }

  .beisat-pcard__badges > .beisat-pcard__badge,
  .beisat-pcard__badge.beisat-label {
    display: block !important;
    max-width: 100%;
    padding-inline: 7px !important;
    overflow: hidden;
    letter-spacing: 0;
    text-overflow: ellipsis;
    white-space: nowrap;
  }
}

/* Labels under the image (one compact row) + discount chip next to the price. */
.beisat-pcard__tags {
  display: flex;
  flex-wrap: wrap;
  gap: 4px;
  min-width: 0;
  overflow: visible;
}

.beisat-pcard__tags .beisat-pcard__badge,
.beisat-pcard__tags .beisat-pcard__badge.product-label,
.beisat-pcard__tags .beisat-label {
  position: static !important;
  flex: none;
  margin: 0 !important;
  min-height: 18px !important;
  padding: 1px 6px !important;
  border-radius: 2px !important;
  font-size: 10px !important;
  font-weight: 600 !important;
  letter-spacing: 0.02em !important;
  line-height: 1.5 !important;
  white-space: nowrap;
  box-shadow: none !important;
}

.beisat-pcard__off {
  align-self: center;
  padding: 0 4px;
  border: 1px solid #fa6338;
  border-radius: 2px;
  color: #fa6338;
  font-size: 11px;
  font-weight: 700;
  line-height: 1.45;
}

/* Price row stays on one line on every card width. */
.beisat-pcard__buy {
  flex-wrap: nowrap;
}

.beisat-pcard__buy .beisat-pcard__price {
  flex-wrap: nowrap;
  min-width: 0;
  overflow: hidden;
}

.beisat-pcard__buy .price__current,
.beisat-pcard__buy .price__was {
  white-space: nowrap;
}

@media (max-width: 599.98px) {
  /* Narrow cards: the -% chip shows the saving, so the old price is hidden. */
  .beisat-pcard__buy .price__was {
    display: none !important;
  }

  .beisat-pcard__off {
    padding: 0 3px;
    font-size: 10px;
  }

  .beisat-pcard__cart {
    width: 36px;
    height: 26px;
  }

  .beisat-pcard__cart svg {
    width: 17px;
    height: 17px;
  }
}

/* Same card width site-wide: 5 across on desktop rails/grids, 2 on phones.
   Phones hide the 5th card of fixed 5-product lists so rows stay even. */
@media (max-width: 767.98px) {
  .beisat-flash__rail > :nth-child(5),
  .section-related-products .product-grid--per-row-5 > :nth-child(5) {
    display: none !important;
  }
}

/* Phones: nothing cut — labels wrap, titles get 2 lines, size chip fits its text. */
@media (max-width: 599.98px) {
  .beisat-pcard__tags {
    flex-wrap: wrap;
    overflow: visible;
  }

  .beisat-pcard__title,
  html.beisat .product-block--fashion .beisat-pcard__title.product-block__title {
    display: -webkit-box !important;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    line-clamp: 2;
    white-space: normal !important;
    line-height: 1.35 !important;
  }

  .beisat-pcard__title-row {
    align-items: flex-start;
  }
}

html.beisat .product-block--fashion .product-block__size-menu {
  flex: 0 0 auto;
  width: auto;
  max-width: 75%;
  min-width: 56px;
}

html.beisat .product-block--fashion .product-block__size-trigger-label {
  overflow: visible;
  white-space: nowrap;
  text-overflow: clip;
}

/* Phones: bigger cards — narrower page gutters and gaps in product grids. */
@media (max-width: 767.98px) {
  .product-grid.product-grid--per-row-mob-2 {
    gap: 8px !important;
    column-gap: 8px !important;
    margin-inline: -8px;
  }
}

html.beisat .product-block--fashion .product-block__size-trigger--static {
  cursor: default;
  pointer-events: none;
}

/* Whole card opens the product (assets/beisat-product-card.js). */
.beisat-product-card .beisat-pcard {
  cursor: pointer;
}

/* NV-HP11: the card's add-to-cart is a filled button (not outline-until-hover), with a
   44px-high tap area; in the cart it turns dark brand green. */
.beisat-pcard__cart {
  position: relative;
  width: 44px;
  height: 32px;
  border-color: #111;
  background: #111;
  color: #fff;
}

.beisat-pcard__cart::before {
  content: "";
  position: absolute;
  inset: -6px -2px;
}

.beisat-pcard__cart:hover,
.beisat-pcard__cart:focus-visible {
  border-color: #2b2b2b;
  background: #2b2b2b;
  color: #fff;
}

.beisat-pcard:has(product-form.is-in-cart) .beisat-pcard__cart {
  border-color: #2a7d3d;
  background: #2a7d3d;
  color: #fff;
}

.beisat-pcard__cart:focus-visible {
  outline: 2px solid #111;
  outline-offset: 2px;
}