/* VH Category Featured Ranking UI - VivaHome v1.5.21 */
body.vhcr-modal-open{position:fixed!important;left:0!important;right:0!important;width:100%!important;overflow:hidden!important}
:root{
  --vhcr-primary:#1876d2;
  --vhcr-primary-dark:#0f5fae;
  --vhcr-border:#dce8f6;
  --vhcr-text:#111827;
  --vhcr-muted:#6b7280;
  --vhcr-bg:#ffffff;
}
.vhcr-image-host{position:relative!important;overflow:visible!important}

/* LISTING: daha kucuk, etiketlerden asagi, tamamen gorsel icinde */
.vhcr-badge-btn{position:absolute!important;z-index:22;top:36px;left:8px;width:62px;height:69px;padding:0;border:0;border-radius:0;background:transparent;cursor:pointer;filter:drop-shadow(0 3px 5px rgba(15,23,42,.22));-webkit-tap-highlight-color:transparent}
.vhcr-badge-btn img{display:block;width:100%;height:100%;object-fit:contain;border-radius:0}
.vhcr-badge-copy{position:absolute;top:8%;right:5%;bottom:20%;left:5%;display:flex;align-items:center;justify-content:center;flex-direction:column;gap:2px;box-sizing:border-box;padding:0;color:#fff;text-align:center;text-shadow:0 1px 2px rgba(0,0,0,.35);pointer-events:none}
.vhcr-badge-rank{display:block;margin:0;font:900 17px/.9 Arial,sans-serif;letter-spacing:-.35px;color:#fff}
.vhcr-badge-label{display:block;font:800 6.6px/1.02 Arial,sans-serif;letter-spacing:-.14px;color:#fff;text-transform:uppercase}

/* PRODUCT PAGE: badge daha buyuk ama ust etiketlerin altinda */
.route-product-product .product-left .product-image .vhcr-badge-btn,
.route-product-product .product-left .vhcr-product-image-host .vhcr-badge-btn{
  width:84px;height:93px;top:40px;left:12px;
}
.route-product-product .product-left .product-image .vhcr-badge-rank,
.route-product-product .product-left .vhcr-product-image-host .vhcr-badge-rank{font-size:24px}
.route-product-product .product-left .product-image .vhcr-badge-label,
.route-product-product .product-left .vhcr-product-image-host .vhcr-badge-label{font-size:9.2px}

/* Product page ranking linki: referanstaki medal + kategori + soft turuncu pill */
.vhcr-product-rank-link{
  position:relative!important;
  z-index:3;
  display:flex!important;
  align-items:center!important;
  flex-wrap:nowrap!important;
  box-sizing:border-box!important;
  width:100%!important;
  max-width:100%!important;
  min-height:44px;
  margin:7px 0 0!important;
  padding:0 4px!important;
  border:0!important;
  border-radius:0!important;
  background:transparent!important;
  color:#9a9a9a!important;
  font-family:inherit!important;
  font-size:14px!important;
  font-weight:400!important;
  line-height:1.2!important;
  text-align:left!important;
  text-decoration:none!important;
  box-shadow:none!important;
  cursor:pointer;
  white-space:nowrap!important;
  -webkit-tap-highlight-color:transparent;
}
.vhcr-rank-medal{
  position:relative;
  display:inline-flex;
  flex:0 0 31px;
  align-items:flex-start;
  justify-content:center;
  width:31px;
  height:39px;
  margin-right:8px;
}
.vhcr-rank-medal-head{
  position:relative;
  z-index:2;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  box-sizing:border-box;
  width:27px;
  height:27px;
  border:3px solid #ffe07c;
  border-radius:50%;
  background:#f7b61f;
  color:#fff1a8;
  box-shadow:0 1px 2px rgba(0,0,0,.10);
}
.vhcr-rank-medal-head .fa{font-size:11px!important;line-height:1!important;color:#fff1a8!important}
.vhcr-rank-medal-ribbon{
  position:absolute;
  z-index:1;
  top:23px;
  left:7px;
  width:17px;
  height:15px;
  background:#2878d1;
  clip-path:polygon(0 0,100% 0,100% 100%,50% 74%,0 100%);
}
.vhcr-rank-category{
  display:block;
  min-width:0;
  overflow:hidden;
  color:#9a9a9a!important;
  font-weight:400!important;
  text-overflow:ellipsis;
  white-space:nowrap;
}
.vhcr-rank-pill{
  display:inline-flex;
  flex:0 0 auto;
  align-items:center;
  justify-content:center;
  box-sizing:border-box;
  min-height:31px;
  margin-left:8px;
  padding:5px 10px 5px 12px;
  border:0;
  border-radius:18px;
  background:#fff1e7;
  color:#e7791d;
  line-height:1;
  white-space:nowrap;
}
.vhcr-rank-pill strong{
  color:#e7791d!important;
  font-size:14px!important;
  font-weight:700!important;
  line-height:1!important;
}
.vhcr-product-rank-arrow{
  position:static!important;
  margin-left:7px!important;
  color:#e7791d!important;
  font-size:18px!important;
  line-height:1!important;
}
.vhcr-product-rank-link:hover,
.vhcr-product-rank-link:focus,
.vhcr-product-rank-link:active{
  border:0!important;
  background:transparent!important;
  color:#9a9a9a!important;
  text-decoration:none!important;
  outline:0!important;
  box-shadow:none!important;
}
.vhcr-product-rank-link:hover .vhcr-rank-pill,
.vhcr-product-rank-link:focus .vhcr-rank-pill{
  background:#ffe8d6!important;
}

.vhcr-modal-backdrop{position:fixed;z-index:2147482500;inset:0;display:none;align-items:center;justify-content:center;padding:12px;background:rgba(15,23,42,.48)}.vhcr-modal-backdrop.is-open{display:flex}
.vhcr-modal{display:flex;flex-direction:column;width:min(760px,100%);max-height:min(88vh,820px);overflow:hidden;border:1px solid var(--vhcr-border);border-radius:14px;background:#fff;box-shadow:0 18px 50px rgba(15,23,42,.22)}
.vhcr-modal-head{position:relative;padding:18px 50px 12px 18px;border-bottom:1px solid var(--vhcr-border);background:#fff}.vhcr-modal-title{margin:0;color:var(--vhcr-text);font-size:21px;font-weight:700;line-height:1.2}.vhcr-modal-sub{margin-top:4px;color:var(--vhcr-muted);font-size:13px}.vhcr-modal-close{position:absolute;top:12px;right:12px;width:34px;height:34px;padding:0;border:1px solid var(--vhcr-border);border-radius:50%;background:#fff;color:#334155;font-size:23px;line-height:30px}
.vhcr-tabs{display:flex;flex:0 0 auto;gap:6px;padding:10px 12px;overflow-x:auto;border-bottom:1px solid var(--vhcr-border);scrollbar-width:none}.vhcr-tabs::-webkit-scrollbar{display:none}.vhcr-tab{flex:0 0 auto;padding:8px 11px;border:1px solid var(--vhcr-border);border-radius:9px;background:#f7fbff;color:#475569;font-size:12px;font-weight:600;white-space:nowrap}.vhcr-tab.is-active{border-color:var(--vhcr-primary);background:var(--vhcr-primary);color:#fff}
.vhcr-list{overflow:auto;padding:4px 12px 12px;scrollbar-width:thin;scrollbar-color:var(--vhcr-primary) #eef6ff}.vhcr-list::-webkit-scrollbar{width:6px}.vhcr-list::-webkit-scrollbar-track{background:#eef6ff;border-radius:99px}.vhcr-list::-webkit-scrollbar-thumb{background:var(--vhcr-primary);border-radius:99px}
.vhcr-row{display:grid;grid-template-columns:34px 60px minmax(0,1fr);gap:10px;align-items:center;padding:10px 0;border-bottom:1px solid #edf2f7}.vhcr-row:last-child{border-bottom:0}.vhcr-row-rank{display:flex;align-items:center;justify-content:center;width:30px;height:30px;border:2px solid rgba(255,255,255,.88);border-radius:50%;box-sizing:border-box;color:#fff;font-size:12px;font-weight:800;line-height:1;text-align:center;text-shadow:0 1px 1px rgba(0,0,0,.18);box-shadow:0 0 0 1px rgba(15,23,42,.08),0 2px 7px rgba(15,23,42,.12)}
/* Modal sıra numaraları: badge'lerin 1-10 renk paletiyle birebir uyumlu. Nokta yoktur. */
.vhcr-row-rank-1{background:linear-gradient(145deg,#FFD95A,#F5B800 58%,#A96D00)}
.vhcr-row-rank-2{background:linear-gradient(145deg,#D7DEE5,#9AA6B2 58%,#53616F)}
.vhcr-row-rank-3{background:linear-gradient(145deg,#E3A06A,#C7783A 58%,#7A3F1D)}
.vhcr-row-rank-4{background:linear-gradient(145deg,#FFB7BE,#D63B48 58%,#861F2C)}
.vhcr-row-rank-5{background:linear-gradient(145deg,#BFD7FF,#2D6CDF 58%,#173E91)}
.vhcr-row-rank-6{background:linear-gradient(145deg,#B9F1DD,#159A6C 58%,#0A5B42)}
.vhcr-row-rank-7{background:linear-gradient(145deg,#DCD0FF,#7657C8 58%,#432B86)}
.vhcr-row-rank-8{background:linear-gradient(145deg,#B8EDF0,#138B97 58%,#07515A)}
.vhcr-row-rank-9{background:linear-gradient(145deg,#FFD0A9,#E87826 58%,#944313)}
.vhcr-row-rank-10{background:linear-gradient(145deg,#DCE3EA,#475569 58%,#1F2937)}
/* Durum rengi badge dış çerçevesini modal rank rozetine de taşır. */
.vhcr-row-rank-bestsellers{box-shadow:0 0 0 2px rgba(245,184,0,.18),0 2px 7px rgba(15,23,42,.12)}
.vhcr-row-rank-favorites{box-shadow:0 0 0 2px rgba(255,107,154,.18),0 2px 7px rgba(15,23,42,.12)}
.vhcr-row-rank-viewed{box-shadow:0 0 0 2px rgba(92,200,255,.20),0 2px 7px rgba(15,23,42,.12)}
.vhcr-row-rank-reviewed{box-shadow:0 0 0 2px rgba(142,112,255,.18),0 2px 7px rgba(15,23,42,.12)}
.vhcr-row-img{width:60px;height:90px;overflow:hidden;border-radius:7px;background:#f5f7fa}.vhcr-row-img img{width:100%;height:100%;object-fit:cover}.vhcr-row-name{display:block;color:var(--vhcr-text)!important;font-size:13px;font-weight:500;line-height:1.35;text-decoration:none!important}.vhcr-row-price{margin-top:4px;color:var(--vhcr-primary-dark);font-size:14px;font-weight:800}.vhcr-row-stat{margin-top:3px;color:var(--vhcr-muted);font-size:11px}.vhcr-empty{padding:28px 14px;color:var(--vhcr-muted);text-align:center}

@media(max-width:768px){
  /* 2 sutunlu kartlarda okunakli, biraz daha buyuk badge */
  .vhcr-badge-btn{width:56px;height:62px;top:34px;left:7px}
  .vhcr-badge-rank{font-size:16px}
  .vhcr-badge-label{font-size:5.9px;letter-spacing:-.18px}

  /* Product page listing kuralini override eder */
  .route-product-product .product-left .product-image .vhcr-badge-btn,
  .route-product-product .product-left .vhcr-product-image-host .vhcr-badge-btn{
    width:82px;height:90px;top:38px;left:10px;
  }
  .route-product-product .product-left .product-image .vhcr-badge-rank,
  .route-product-product .product-left .vhcr-product-image-host .vhcr-badge-rank{font-size:23px}
  .route-product-product .product-left .product-image .vhcr-badge-label,
  .route-product-product .product-left .vhcr-product-image-host .vhcr-badge-label{font-size:8.6px}
  /* Product rank strip: mobilde tek satir + daha kucuk madalya. BG/renk/radius korunur. */
  .route-product-product .vhcr-product-rank-link{
    min-height:34px!important;
    margin-top:6px!important;
    padding:0 1px!important;
    overflow:hidden!important;
    flex-wrap:nowrap!important;
    white-space:nowrap!important;
  }
  .route-product-product .vhcr-rank-medal{
    flex:0 0 18px!important;
    width:18px!important;
    min-width:18px!important;
    height:24px!important;
    margin-right:4px!important;
  }
  .route-product-product .vhcr-rank-medal-head{
    width:17px!important;
    height:17px!important;
    border-width:1.5px!important;
  }
  .route-product-product .vhcr-rank-medal-head .fa{font-size:7px!important}
  .route-product-product .vhcr-rank-medal-ribbon{
    top:14px!important;
    left:5px!important;
    width:9px!important;
    height:10px!important;
  }
  .route-product-product .vhcr-rank-category{
    flex:0 1 auto!important;
    width:auto!important;
    min-width:0!important;
    overflow:hidden!important;
    font-size:11px!important;
    line-height:1.3!important;
    letter-spacing:-.15px!important;
    text-overflow:ellipsis!important;
    white-space:nowrap!important;
  }
  .route-product-product .vhcr-rank-pill{
    flex:0 0 auto!important;
    min-height:24px!important;
    margin-left:2px!important;
    padding:3px 5px 3px 7px!important;
    white-space:nowrap!important;
  }
  .route-product-product .vhcr-rank-pill strong{
    font-size:11px!important;
    line-height:1.3!important;
    letter-spacing:-.15px!important;
    white-space:nowrap!important;
  }
  .route-product-product .vhcr-product-rank-arrow{
    margin-left:3px!important;
    font-size:13px!important;
  }

  /* MOBIL RANKING MODAL: GERCEK FULL SCREEN */
  .vhcr-modal-backdrop{
    position:fixed!important;
    inset:0!important;
    display:none;
    align-items:stretch!important;
    justify-content:stretch!important;
    width:100vw!important;
    height:100vh!important;
    height:100svh!important;
    min-height:0!important;
    padding:0!important;
    background:#fff!important;
    z-index:2147482500!important;
  }
  .vhcr-modal-backdrop.is-open{display:flex!important}
  .vhcr-modal{
    display:flex!important;
    flex:1 1 auto!important;
    flex-direction:column!important;
    width:100vw!important;
    max-width:100vw!important;
    height:100vh!important;
    height:100svh!important;
    min-height:0!important;
    max-height:100svh!important;
    margin:0!important;
    overflow:hidden!important;
    border:0!important;
    border-radius:0!important;
    background:#fff!important;
    box-shadow:none!important;
  }
  .vhcr-modal-head{
    position:relative!important;
    flex:0 0 auto!important;
    padding:18px 54px 13px 16px!important;
    border-bottom:1px solid var(--vhcr-border)!important;
    background:#fff!important;
  }
  .vhcr-modal-title{font-size:20px!important;font-weight:700!important}
  .vhcr-modal-sub{font-size:13px!important}
  .vhcr-modal-close{top:14px!important;right:14px!important;width:38px!important;height:38px!important}
  .vhcr-tabs{
    position:relative!important;
    flex:0 0 auto!important;
    width:100%!important;
    box-sizing:border-box!important;
    padding:10px 12px!important;
    overflow-x:auto!important;
    overflow-y:hidden!important;
    border-bottom:1px solid var(--vhcr-border)!important;
    background:#fff!important;
    white-space:nowrap!important;
    scrollbar-width:none!important;
    -webkit-overflow-scrolling:touch;
  }
  .vhcr-tabs::-webkit-scrollbar{display:none!important}
  .vhcr-list{
    flex:1 1 auto!important;
    min-height:0!important;
    width:100%!important;
    box-sizing:border-box!important;
    padding:6px 16px calc(12px + env(safe-area-inset-bottom, 0px))!important;
    scroll-padding-bottom:calc(12px + env(safe-area-inset-bottom, 0px))!important;
    overflow-x:hidden!important;
    overflow-y:auto!important;
    background:#fff!important;
    scrollbar-width:thin;
    scrollbar-color:var(--vhcr-primary) #eef6ff;
    -webkit-overflow-scrolling:touch;
  }
  .vhcr-row{grid-template-columns:34px 60px minmax(0,1fr);gap:10px;padding:10px 0}
  .vhcr-row-name{font-size:13px!important;font-weight:500!important;line-height:1.35!important}
}

/* v1.5.17 — icon-free badge final alignment */
.vhcr-badge-copy{
  top:7%!important;
  right:6%!important;
  bottom:20%!important;
  left:6%!important;
  gap:1px!important;
  align-items:center!important;
  justify-content:center!important;
  text-align:center!important;
}
.vhcr-badge-label,
.vhcr-badge-rank{
  width:100%!important;
  text-align:center!important;
}
.vhcr-badge-label i,
.vhcr-badge-label .fa,
.vhcr-badge-copy i,
.vhcr-badge-copy .fa,
.vhcr-badge-copy svg{
  display:none!important;
}
.vhcr-row-rank::after,
.vhcr-badge-rank::after{content:none!important;display:none!important}

/* v1.5.17 — badge text optical centering
   SVG madalyanin dairesel yuzeyi viewBox icinde merkezde olsa da, kurdele ve
   font metrikleri metni gozle sag-alt tarafa kaymis gosteriyordu. Metin katmani
   dairenin gerçek alanina kilitlenir ve optik olarak hafif sola/yukariya alınır. */
.vhcr-badge-copy{
  top:15.15%!important;
  right:15.8%!important;
  bottom:auto!important;
  left:15.8%!important;
  height:62.2%!important;
  width:auto!important;
  padding:0!important;
  gap:1px!important;
  align-items:center!important;
  justify-content:center!important;
  text-align:center!important;
  transform:translate(-2px,-2px)!important;
  transform-origin:center center!important;
}
.vhcr-badge-label,
.vhcr-badge-rank{
  display:block!important;
  width:100%!important;
  max-width:100%!important;
  margin:0!important;
  padding:0!important;
  text-align:center!important;
}
.vhcr-badge-label{line-height:1.00!important}
.vhcr-badge-rank{line-height:.90!important}

/* Ürün sayfasındaki büyük badge'de optik kayma daha görünür: biraz daha sola/yukarı. */
.route-product-product .product-left .product-image .vhcr-badge-copy,
.route-product-product .product-left .vhcr-product-image-host .vhcr-badge-copy{
  transform:translate(-3px,-3px)!important;
}

@media(max-width:768px){
  /* Listing mobil: küçük badge'de ince ayar. */
  .vhcr-badge-copy{transform:translate(-1.5px,-2px)!important}

  /* Ürün mobil: büyük badge. */
  .route-product-product .product-left .product-image .vhcr-badge-copy,
  .route-product-product .product-left .vhcr-product-image-host .vhcr-badge-copy{
    transform:translate(-3px,-3px)!important;
  }
}


/* v1.5.19 — BADGE TEXT CENTERING FINAL
   Kullanici referansina gore mevcut metin grubu dairesel yuzeyde sag-alt algilaniyordu.
   SVG dairesi aynen korunur; yalniz HTML metin katmani listing ve urun sayfasinda
   optik merkeze daha belirgin sola/yukari alinir. */
.vhcr-badge-btn .vhcr-badge-copy{
  top:15.15%!important;
  right:15.80%!important;
  bottom:auto!important;
  left:15.80%!important;
  height:62.12%!important;
  width:auto!important;
  display:flex!important;
  flex-direction:column!important;
  align-items:center!important;
  justify-content:center!important;
  box-sizing:border-box!important;
  padding:0!important;
  margin:0!important;
  gap:1px!important;
  text-align:center!important;
  transform:translate(-3px,-4px)!important;
  transform-origin:center center!important;
}
.vhcr-badge-btn .vhcr-badge-label,
.vhcr-badge-btn .vhcr-badge-rank{
  position:static!important;
  display:block!important;
  width:100%!important;
  max-width:none!important;
  margin:0!important;
  padding:0!important;
  text-align:center!important;
  transform:none!important;
}
.vhcr-badge-btn .vhcr-badge-label{
  line-height:1!important;
}
.vhcr-badge-btn .vhcr-badge-rank{
  line-height:.90!important;
}

/* Buyuk urun badge'i: ayni optik merkezleme daha fazla piksel ister. */
.route-product-product .product-left .product-image .vhcr-badge-btn .vhcr-badge-copy,
.route-product-product .product-left .vhcr-product-image-host .vhcr-badge-btn .vhcr-badge-copy{
  transform:translate(-5px,-6px)!important;
}

@media(max-width:768px){
  /* Mobil listing */
  .vhcr-badge-btn .vhcr-badge-copy{
    transform:translate(-3px,-4px)!important;
  }
  /* Mobil urun sayfasi */
  .route-product-product .product-left .product-image .vhcr-badge-btn .vhcr-badge-copy,
  .route-product-product .product-left .vhcr-product-image-host .vhcr-badge-btn .vhcr-badge-copy{
    transform:translate(-5px,-6px)!important;
  }
}

/* v1.5.19 — PRODUCT BADGE: exact centering + requested position
   1) Metin katmani SVG madalya dairesinin geometrik merkezine kilitlidir.
      Eski optik translate duzeltmeleri iptal edildi; yatay/dikey kaydirma yok.
   2) Urun sayfasinda badge: sol 5px. Ust label satirinin altindan 10px:
      mevcut Viva/Journal label satiri 43px'de bittigi icin button top 53px. */
.vhcr-badge-btn .vhcr-badge-copy{
  top:10.61%!important;
  left:10.83%!important;
  right:10.83%!important;
  bottom:auto!important;
  width:auto!important;
  height:71.21%!important;
  margin:0!important;
  padding:0!important;
  display:flex!important;
  flex-direction:column!important;
  align-items:center!important;
  justify-content:center!important;
  gap:2px!important;
  text-align:center!important;
  transform:none!important;
  transform-origin:center center!important;
}
.vhcr-badge-btn .vhcr-badge-label,
.vhcr-badge-btn .vhcr-badge-rank{
  position:static!important;
  width:100%!important;
  margin:0!important;
  padding:0!important;
  text-align:center!important;
  transform:none!important;
}
.vhcr-badge-btn .vhcr-badge-label{line-height:1!important}
.vhcr-badge-btn .vhcr-badge-rank{line-height:1!important}

.route-product-product .product-left .product-image .vhcr-badge-btn,
.route-product-product .product-left .vhcr-product-image-host .vhcr-badge-btn{
  left:5px!important;
  top:53px!important;
}
.route-product-product .product-left .product-image .vhcr-badge-btn .vhcr-badge-copy,
.route-product-product .product-left .vhcr-product-image-host .vhcr-badge-btn .vhcr-badge-copy{
  transform:none!important;
}

@media(max-width:768px){
  .route-product-product .product-left .product-image .vhcr-badge-btn,
  .route-product-product .product-left .vhcr-product-image-host .vhcr-badge-btn{
    left:5px!important;
    top:53px!important;
  }
  .route-product-product .product-left .product-image .vhcr-badge-btn .vhcr-badge-copy,
  .route-product-product .product-left .vhcr-product-image-host .vhcr-badge-btn .vhcr-badge-copy{
    transform:none!important;
  }
}


/* v1.5.20 — 40 STATIC SVG BADGES
   Text + rank are baked into each SVG. No HTML text overlay remains. */
.vhcr-badge-copy,.vhcr-badge-label,.vhcr-badge-rank{display:none!important}
.vhcr-badge-btn img{display:block!important;width:100%!important;height:100%!important;object-fit:contain!important}

/* Modal rank: metric + position pair, same palette as 40 SVG assets. */
.vhcr-row-rank-bestsellers.vhcr-row-rank-1{background:linear-gradient(145deg,#A9F1EC,#12A8A0 58%,#08756F)!important}
.vhcr-row-rank-bestsellers.vhcr-row-rank-2{background:linear-gradient(145deg,#A7EFEA,#10A7A1 58%,#08736E)!important}
.vhcr-row-rank-bestsellers.vhcr-row-rank-3{background:linear-gradient(145deg,#C4F5BF,#24B51F 58%,#116D13)!important}
.vhcr-row-rank-bestsellers.vhcr-row-rank-4{background:linear-gradient(145deg,#ECF7AF,#A9D31A 58%,#66860A)!important}
.vhcr-row-rank-bestsellers.vhcr-row-rank-5{background:linear-gradient(145deg,#BDD5FF,#2D6CDF 58%,#17469B)!important}
.vhcr-row-rank-bestsellers.vhcr-row-rank-6{background:linear-gradient(145deg,#C4CEFF,#3959C8 58%,#233781)!important}
.vhcr-row-rank-bestsellers.vhcr-row-rank-7{background:linear-gradient(145deg,#E4BDF6,#8E2BC7 58%,#55147F)!important}
.vhcr-row-rank-bestsellers.vhcr-row-rank-8{background:linear-gradient(145deg,#FFC2DF,#E92C82 58%,#98174F)!important}
.vhcr-row-rank-bestsellers.vhcr-row-rank-9{background:linear-gradient(145deg,#FFD0B8,#FF5A12 58%,#A92E00)!important}
.vhcr-row-rank-bestsellers.vhcr-row-rank-10{background:linear-gradient(145deg,#E8C3AF,#9A4B24 58%,#57230F)!important}
.vhcr-row-rank-favorites.vhcr-row-rank-1{background:linear-gradient(145deg,#E4BDF6,#8E2BC7 58%,#55147F)!important}
.vhcr-row-rank-favorites.vhcr-row-rank-2{background:linear-gradient(145deg,#FFD1B0,#FF650F 58%,#A73500)!important}
.vhcr-row-rank-favorites.vhcr-row-rank-3{background:linear-gradient(145deg,#D9CCFF,#855EF0 58%,#5432A6)!important}
.vhcr-row-rank-favorites.vhcr-row-rank-4{background:linear-gradient(145deg,#FFC0DE,#EF2E8B 58%,#A31757)!important}
.vhcr-row-rank-favorites.vhcr-row-rank-5{background:linear-gradient(145deg,#B6F1EF,#19AAA7 58%,#0B716E)!important}
.vhcr-row-rank-favorites.vhcr-row-rank-6{background:linear-gradient(145deg,#C8F4BD,#45B82A 58%,#287819)!important}
.vhcr-row-rank-favorites.vhcr-row-rank-7{background:linear-gradient(145deg,#C4DAFF,#2671D8 58%,#164794)!important}
.vhcr-row-rank-favorites.vhcr-row-rank-8{background:linear-gradient(145deg,#FFE6A3,#F7B516 58%,#A56A00)!important}
.vhcr-row-rank-favorites.vhcr-row-rank-9{background:linear-gradient(145deg,#FFC4BF,#F14C3D 58%,#A3261D)!important}
.vhcr-row-rank-favorites.vhcr-row-rank-10{background:linear-gradient(145deg,#C5D6E3,#426987 58%,#243B50)!important}
.vhcr-row-rank-viewed.vhcr-row-rank-1{background:linear-gradient(145deg,#B9D0FF,#1357E8 58%,#0D3499)!important}
.vhcr-row-rank-viewed.vhcr-row-rank-2{background:linear-gradient(145deg,#BAE8FC,#1098DD 58%,#086392)!important}
.vhcr-row-rank-viewed.vhcr-row-rank-3{background:linear-gradient(145deg,#B7EFED,#18A7A3 58%,#0C706D)!important}
.vhcr-row-rank-viewed.vhcr-row-rank-4{background:linear-gradient(145deg,#ABE4E1,#118A89 58%,#075957)!important}
.vhcr-row-rank-viewed.vhcr-row-rank-5{background:linear-gradient(145deg,#BBD2FF,#185EE5 58%,#0D3997)!important}
.vhcr-row-rank-viewed.vhcr-row-rank-6{background:linear-gradient(145deg,#C6CCF9,#354DB3 58%,#202C75)!important}
.vhcr-row-rank-viewed.vhcr-row-rank-7{background:linear-gradient(145deg,#D2C6FA,#5533B9 58%,#342075)!important}
.vhcr-row-rank-viewed.vhcr-row-rank-8{background:linear-gradient(145deg,#DBC0FF,#7C25E4 58%,#481397)!important}
.vhcr-row-rank-viewed.vhcr-row-rank-9{background:linear-gradient(145deg,#C5D7E2,#4A7C9D 58%,#29475E)!important}
.vhcr-row-rank-viewed.vhcr-row-rank-10{background:linear-gradient(145deg,#A9C3D9,#173D67 58%,#0A233D)!important}
.vhcr-row-rank-reviewed.vhcr-row-rank-1{background:linear-gradient(145deg,#FFC1C3,#F12D31 58%,#9A171A)!important}
.vhcr-row-rank-reviewed.vhcr-row-rank-2{background:linear-gradient(145deg,#FFD0B8,#F15A16 58%,#9C2D04)!important}
.vhcr-row-rank-reviewed.vhcr-row-rank-3{background:linear-gradient(145deg,#FFE8A3,#F5B51B 58%,#9F6A00)!important}
.vhcr-row-rank-reviewed.vhcr-row-rank-4{background:linear-gradient(145deg,#F7D7A4,#D78813 58%,#894D05)!important}
.vhcr-row-rank-reviewed.vhcr-row-rank-5{background:linear-gradient(145deg,#C6F0C2,#42B83B 58%,#23731F)!important}
.vhcr-row-rank-reviewed.vhcr-row-rank-6{background:linear-gradient(145deg,#B5EEEE,#12A4A5 58%,#087071)!important}
.vhcr-row-rank-reviewed.vhcr-row-rank-7{background:linear-gradient(145deg,#BBD3FF,#185FE3 58%,#0D3998)!important}
.vhcr-row-rank-reviewed.vhcr-row-rank-8{background:linear-gradient(145deg,#DEC0F3,#7E22CE 58%,#48117E)!important}
.vhcr-row-rank-reviewed.vhcr-row-rank-9{background:linear-gradient(145deg,#FFC1DF,#E72C88 58%,#991750)!important}
.vhcr-row-rank-reviewed.vhcr-row-rank-10{background:linear-gradient(145deg,#E5D0C3,#9C7057 58%,#593D2D)!important}


/* v1.5.21 — SVG COLOR SKIN + HTML TEXT OVERLAY + ADMIN POSITION CONTROLS */
.vhcr-badge-copy{
  display:flex!important;position:absolute!important;z-index:2!important;
  top:10.61%!important;left:10.83%!important;right:10.83%!important;height:71.21%!important;bottom:auto!important;
  flex-direction:column!important;align-items:center!important;justify-content:center!important;
  box-sizing:border-box!important;margin:0!important;padding:0!important;gap:2px!important;
  color:#fff!important;text-align:center!important;text-shadow:0 1px 2px rgba(0,0,0,.32)!important;pointer-events:none!important;
  transform:translate(var(--vhcr-text-x-web,0px),var(--vhcr-text-y-web,0px))!important;
}
.vhcr-badge-label{display:flex!important;flex-direction:column!important;align-items:center!important;justify-content:center!important;width:100%!important;margin:0!important;padding:0!important;font:800 6.6px/1 Arial,sans-serif!important;letter-spacing:-.12px!important;color:#fff!important;text-align:center!important;text-transform:uppercase!important}
.vhcr-badge-label span{display:block!important;width:100%!important;margin:0!important;padding:0!important;line-height:1!important;text-align:center!important}
.vhcr-badge-rank{display:block!important;width:100%!important;margin:2px 0 0!important;padding:0!important;font:900 17px/.9 Arial,sans-serif!important;letter-spacing:-.3px!important;color:#fff!important;text-align:center!important}
.vhcr-lines-3 .vhcr-badge-label{font-size:5.8px!important;line-height:.96!important}
.vhcr-lines-3 .vhcr-badge-rank{margin-top:1px!important}

/* Listing badge position — values come from module admin. */
.vhcr-badge-btn{left:var(--vhcr-list-x-web,8px)!important;top:var(--vhcr-list-y-web,36px)!important}

/* Product page has its own position controls. */
.route-product-product .product-left .product-image .vhcr-badge-btn,
.route-product-product .product-left .vhcr-product-image-host .vhcr-badge-btn{
  left:var(--vhcr-product-x-web,5px)!important;top:var(--vhcr-product-y-web,53px)!important;
}
.route-product-product .product-left .product-image .vhcr-badge-label,
.route-product-product .product-left .vhcr-product-image-host .vhcr-badge-label{font-size:9.2px!important}
.route-product-product .product-left .product-image .vhcr-lines-3 .vhcr-badge-label,
.route-product-product .product-left .vhcr-product-image-host .vhcr-lines-3 .vhcr-badge-label{font-size:8.1px!important}
.route-product-product .product-left .product-image .vhcr-badge-rank,
.route-product-product .product-left .vhcr-product-image-host .vhcr-badge-rank{font-size:24px!important}

@media(max-width:768px){
  .vhcr-badge-btn{left:var(--vhcr-list-x-mobile,7px)!important;top:var(--vhcr-list-y-mobile,34px)!important}
  .vhcr-badge-copy{transform:translate(var(--vhcr-text-x-mobile,0px),var(--vhcr-text-y-mobile,0px))!important}
  .vhcr-badge-label{font-size:5.9px!important}
  .vhcr-lines-3 .vhcr-badge-label{font-size:5.25px!important}
  .vhcr-badge-rank{font-size:16px!important}
  .route-product-product .product-left .product-image .vhcr-badge-btn,
  .route-product-product .product-left .vhcr-product-image-host .vhcr-badge-btn{
    left:var(--vhcr-product-x-mobile,5px)!important;top:var(--vhcr-product-y-mobile,53px)!important;
  }
  .route-product-product .product-left .product-image .vhcr-badge-label,
  .route-product-product .product-left .vhcr-product-image-host .vhcr-badge-label{font-size:8.6px!important}
  .route-product-product .product-left .product-image .vhcr-lines-3 .vhcr-badge-label,
  .route-product-product .product-left .vhcr-product-image-host .vhcr-lines-3 .vhcr-badge-label{font-size:7.5px!important}
  .route-product-product .product-left .product-image .vhcr-badge-rank,
  .route-product-product .product-left .vhcr-product-image-host .vhcr-badge-rank{font-size:23px!important}
}


/* ============================================================
   v1.5.22 — ADMIN CONTROLLED BADGE TYPOGRAPHY (FINAL OVERRIDE)
   Label + rank number typography are independently configurable
   for desktop and mobile. These rules intentionally sit last.
   ============================================================ */
.vhcr-badge-btn .vhcr-badge-label{
  font-family:var(--vhcr-label-font-web,Arial,sans-serif)!important;
  font-weight:var(--vhcr-label-weight-web,800)!important;
  font-size:var(--vhcr-label-size-web,6.6px)!important;
  letter-spacing:var(--vhcr-label-spacing-web,-.12px)!important;
  color:var(--vhcr-label-color-web,#fff)!important;
}
.vhcr-badge-btn .vhcr-badge-label span{
  font-family:inherit!important;
  font-weight:inherit!important;
  font-size:inherit!important;
  letter-spacing:inherit!important;
  color:inherit!important;
}
.vhcr-badge-btn .vhcr-badge-rank{
  font-family:var(--vhcr-number-font-web,Arial,sans-serif)!important;
  font-weight:var(--vhcr-number-weight-web,900)!important;
  font-size:var(--vhcr-number-size-web,17px)!important;
  letter-spacing:var(--vhcr-number-spacing-web,-.3px)!important;
  color:var(--vhcr-number-color-web,#fff)!important;
}
/* Three-line labels use the same admin-selected font size; no hidden scaling. */
.vhcr-badge-btn.vhcr-lines-3 .vhcr-badge-label,
.vhcr-badge-btn .vhcr-lines-3 .vhcr-badge-label{
  font-size:var(--vhcr-label-size-web,6.6px)!important;
}
@media(max-width:768px){
  .vhcr-badge-btn .vhcr-badge-label{
    font-family:var(--vhcr-label-font-mobile,Arial,sans-serif)!important;
    font-weight:var(--vhcr-label-weight-mobile,800)!important;
    font-size:var(--vhcr-label-size-mobile,5.9px)!important;
    letter-spacing:var(--vhcr-label-spacing-mobile,-.12px)!important;
    color:var(--vhcr-label-color-mobile,#fff)!important;
  }
  .vhcr-badge-btn .vhcr-badge-label span{
    font-family:inherit!important;
    font-weight:inherit!important;
    font-size:inherit!important;
    letter-spacing:inherit!important;
    color:inherit!important;
  }
  .vhcr-badge-btn .vhcr-badge-rank{
    font-family:var(--vhcr-number-font-mobile,Arial,sans-serif)!important;
    font-weight:var(--vhcr-number-weight-mobile,900)!important;
    font-size:var(--vhcr-number-size-mobile,16px)!important;
    letter-spacing:var(--vhcr-number-spacing-mobile,-.3px)!important;
    color:var(--vhcr-number-color-mobile,#fff)!important;
  }
  .vhcr-badge-btn.vhcr-lines-3 .vhcr-badge-label,
  .vhcr-badge-btn .vhcr-lines-3 .vhcr-badge-label{
    font-size:var(--vhcr-label-size-mobile,5.9px)!important;
  }
}
\n\n

/* ============================================================
   v1.5.24 — IMAGE BADGE VISIBILITY + RESPONSIVE SIZE CONTROLS
   CSS fallback. JS also prevents image badges from being created
   when the admin setting is disabled.
   ============================================================ */
.vhcr-badge-btn{
  display:var(--vhcr-image-badge-display, block) !important;
  width:var(--vhcr-list-width-web, 62px) !important;
  height:var(--vhcr-list-height-web, 69px) !important;
}
.route-product-product .product-left .product-image .vhcr-badge-btn,
.route-product-product .product-left .vhcr-product-image-host .vhcr-badge-btn{
  width:var(--vhcr-product-width-web, 84px) !important;
  height:var(--vhcr-product-height-web, 93px) !important;
}
@media (max-width:768px){
  .vhcr-badge-btn{
    width:var(--vhcr-list-width-mobile, 56px) !important;
    height:var(--vhcr-list-height-mobile, 62px) !important;
  }
  .route-product-product .product-left .product-image .vhcr-badge-btn,
  .route-product-product .product-left .vhcr-product-image-host .vhcr-badge-btn{
    width:var(--vhcr-product-width-mobile, 82px) !important;
    height:var(--vhcr-product-height-mobile, 90px) !important;
  }
}
