/** Shopify CDN: Minification failed

Line 327:13 Expected identifier but found whitespace
Line 327:24 Unexpected ";"

**/
/*************************************************************
 * BESTCOMPETITION – BC CARD + TIMER / BUNDLES UI
 * All custom BC styles extracted from base.css
 * CLEAN, SCOPED, APPLE-LEVEL VERSION
 *************************************************************/
 /* VERY IMPORTANT FIX: Allow BC card wallpapers to paint inside the product page media container */
.product-information__media {
  width: auto !important;        /* undo width: 0 */
  min-width: 100% !important;    /* keep full width */
  overflow: visible !important;  /* allow ::before backgrounds to show */
  position: relative;   
}

/* Scope a safe container for the hero card */
.product-information__media .bc-card {
  max-width: 720px;
  margin: 0 auto;
  margin-top: 16px !important;
}

/* Ensure the media group respects the card height without forcing huge white gaps */
.product-information__group {
  align-items: flex-start;
}

/* Allow the media column to shrink sensibly on smaller screens */
@media (max-width: 1024px) {
  .product-information__media {
    min-width: 0 !important;
      max-width: 97%;
        margin: 0 auto;
  }
}

.bc-card__badge {
    font-size: 10px !important;
    border-radius: 999px !important;
    padding: 4px 9px !important;
    background: #ffffff8a !important;
    border: 1px solid rgb(248 250 252 / 29%) !important;
    color: #111827 !important;
    box-shadow: 0 0 0 1px #0f172ab3, 0 6px 14px #0f172acc !important;
    font-weight: 500;
}

/*************************************************************
 * ROOT TOKENS
 *************************************************************/

:root {
  /* Tier colour tokens (can tweak to taste) */
  --bc-tier-nano-base:   #e5f0ff;
  --bc-tier-nano-accent: #4f8cff;

  --bc-tier-micro-base:   #e4f5ff;
  --bc-tier-micro-accent: #2fb3ff;

  --bc-tier-minor-base:   #e7f4ff;
  --bc-tier-minor-accent: #4aa5ff;

  --bc-tier-major-base:   #fff1df;
  --bc-tier-major-accent: #ce6b2c;

  --bc-tier-mega-base:    #17191f;
  --bc-tier-mega-accent:  #c7d2ff;

  --bc-tier-ultra-base:   #050509;
  --bc-tier-ultra-accent: #fbbf24;

  /* General tokens */
  --bc-radius-card: 18px;
  --bc-radius-pill: 999px;
  --bc-card-shadow: 0 16px 40px rgba(15, 23, 42, 0.38);
  --bc-border-subtle: 1px solid rgba(148, 163, 184, 0.45);

  --bc-soft-green: #22c55e;
  --bc-soft-amber: #f59e0b;
  --bc-soft-red: #ef4444;
}

/*************************************************************
 * BASE CARD SHELL
 *************************************************************/

.bc-card {
  position: relative;
  border-radius: var(--bc-radius-card);
  overflow: hidden;
  background: radial-gradient(circle at 0 0, #020617, #020617 40%, #000 100%);
  color: #f9fafb;
}

/* Wallpaper layer */
.bc-card__bg {
  position: absolute;
  inset: 0;
  background-position: center;
  background-size: cover;
  background-repeat: no-repeat;
  z-index: 0;
}

/* Overlay content */
.bc-card__overlay {
  position: relative;
  z-index: 1;
  padding: 14px 14px 12px;
  height: 100%;
  display: flex;
  flex-direction: column;
  min-height: 380px;
}

/* Card as used inside product-card wrapper */
.product-card .bc-card {
  height: 100%;
}

/* Remove default image ratio box interference */
.product-card .product-card__media {
  display: none;
}

.product-card__content {
    box-shadow: var(--bc-card-shadow);
}

/*************************************************************
 * TIER WALLPAPER ASSIGNMENTS
 *************************************************************/

.bc-card--tier-nano   .bc-card__bg {
  background-image: url("/cdn/shop/files/bc-bg-nano.jpg?v=1763774772");
}

.bc-card--tier-micro  .bc-card__bg {
  background-image: url("/cdn/shop/files/bc-bg-micro.jpg?v=1763774772");
}

.bc-card--tier-minor  .bc-card__bg {
  background-image: url("/cdn/shop/files/bc-bg-minor.jpg?v=1763774773");
}

.bc-card--tier-major  .bc-card__bg {
  background-image: url("/cdn/shop/files/bc-bg-major.jpg?v=1763832847");
}

.bc-card--tier-mega   .bc-card__bg {
  background-image: url("/cdn/shop/files/bc-bg-mega.jpg?v=1763832847");
}

.bc-card--tier-ultra  .bc-card__bg {
  background-image: url("/cdn/shop/files/bc-bg-ultra.jpg?v=1763832847");
}

/*************************************************************
 * SHIMMER + GLOW OVERLAYS
 *************************************************************/

.bc-card__bg::before {
  content: "";
  position: absolute;
  inset: 0;
  background:
    radial-gradient(circle at 20% 0%, rgba(255,255,255,0.20), transparent 55%),
    radial-gradient(circle at 80% 100%, rgba(255,255,255,0.14), transparent 55%);
  mix-blend-mode: screen;
  opacity: 0.85;
}

/* Gentle shimmer – can be de-synchronised via animation-delay in JS */
.bc-card__bg::after {
  content: "";
  position: absolute;
  inset: 0;
  background:
    linear-gradient(120deg,
      rgba(255,255,255,0.0) 0%,
      rgba(255,255,255,0.12) 16%,
      rgba(255,255,255,0.0) 33%);
  opacity: 0.75;
  transform: translateX(-40%);
  animation: bc-card-shimmer 6s linear infinite;
}

@keyframes bc-card-shimmer {
  0%   { transform: translateX(-40%); }
  100% { transform: translateX(40%); }
}

/*************************************************************
 * CARD TOP BAR – BRAND + BADGES
 *************************************************************/
/* Keep logo perfectly circular and always visible */
.bc-card__logo-block {
  display: flex;
  align-items: center;
  gap: 6px;
  flex-shrink: 0;
  box-shadow: 0 0 0 1px #93b3ffb2, 0 6px 14px #0f172acc !important;
  border-radius: 40px;
  padding: 6px;
  background-color: #00000087;
}

.bc-card__logo-mark {
  flex: 0 0 32px;   /* lock width/height */
  width: 32px;
  height: 32px;
}

.bc-card__logo-mark img,
.bc-card__logo-mark svg {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: contain;
}

/* Allow the official badge to wrap *after* the logo/brand instead of crushing them */
.bc-card__top {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
}

.bc-card__badge--top {
  margin-left: auto;
  flex-shrink: 0;
  margin-top: 2px; /* when it wraps under the logo */
  max-width: 99%;
}

.bc-card__ladder-nav {
    color: #eceeef;
    margin: 2px;
    margin-bottom: 18px;
}

a.bc-ladder-pill.bc-ladder-pill--prev {
    font-size: 10px !important;
    border-radius: 999px !important;
    padding: 4px 9px !important;
    background: linear-gradient(to right, #232222, #0255204a, #7f7f7fc2) !important;
    border: 1px solid rgb(248 250 252 / 29%) !important;
    color: rgba(255, 255, 255, 0.9) !important;
    box-shadow: 0 0 0 1px #0f172aed, -1px 2px 9px 3px #0f172a2e !important;
    margin: 3px;
    max-width: fit-content;
    text-shadow: 0px 1px 1px #000000a6;
    border: 2px solid rgb(133 255 255 / 87%) !important;
    border-width: 1px;
    max-width: fit-content;
    text-shadow: 1px 0px 3px #000000b5;
    text-decoration: none;
}

span.bc-ladder-pill.bc-ladder-pill--current {
    font-size: 10px !important;
    border-radius: 999px !important;
    padding: 4px 9px !important;
    background: linear-gradient(135deg, #36003d38, #7549ff57 55%), radial-gradient(circle at 0 0, #57006de8, #5f025369 45%), radial-gradient(circle at 100% 100%, #5302028c, #3b82f638 45%);
    color: #ffffff !important;
    box-shadow: 0 0 0 1px #0f172ab3, 0 6px 14px #0f172acc !important;
    margin: 3px;
    max-width: fit-content;
    text-shadow: 0px 1px 1px #000000a6;
    border: 2px solid rgb(133 255 255 / 87%) !important;
    border-width: 1px;
    text-decoration: none;
}

a.bc-ladder-pill.bc-ladder-pill--next {
    font-size: 10px !important;
    border-radius: 999px !important;
    padding: 4px 9px !important;
    border: 1px solid rgb(248 250 252 / 29%) !important;
    color: #fff !important;
    margin: 3px;
    box-shadow: 0 0 0 1px #0f172ab3, 0 6px 14px #0f172acc !important;
    background: radial-gradient(ellipse farthest-corner at right bottom, #FEDB37 0%, #FDB931 8%, #9f7928 30%, #8A6E2F 40%, transparent 80%), radial-gradient(ellipse farthest-corner at left top, #FFFFFF 0%, #FFFFAC 8%, #D1B464 25%, #5d4a1f 62.5%, #5d4a1f 100%) !important;
    max-width: fit-content;
    text-shadow: 1px 0px 3px #000000b5;
    color: #ffffff !important;
    box-shadow: 0 0 0 1px #0f172ab3, 0 6px 14px #0f172acc !important;
    margin: 3px;
    max-width: fit-content;
    text-shadow: 0px 1px 1px #000000a6;;
    border: 2px solid rgb(133 255 255 / 87%) !important;
    border-width: 1px;
    text-decoration: none;
}
  /* --- BC CARD CTA – STABLE, WRAPPING BUTTONS --- */

.bc-card__cta-row {
  margin-top: 10px;
}

/* Base CTA button */
.bc-card__cta-btn {
    font-style: normal;
    color: #081f28;
    background-color: #fd0;
    border-radius: 36px;
    /* margin: 16px 7px 8px 8px; */
    font-family: "Gellix", sans-serif;
    font-size: 18px;
    font-weight: bold;
    padding: 15px 31px 3px 18px;
    min-width: 197px;
    border: none;
    display: inline-block;
    text-align: center;
    text-shadow: 0 0 #fc0;
    margin-right: 0px;
    margin-left: 0px;
}

:last-
  box-sizing: border-box;
  display: inline-flex;
  align-items: center;
  justify-content: center;

  /* Let it own the full card width so text can't overflow off the right */
  width: 100%;
  max-width: 100%;

  /* Enough height for 2-line labels without jumping */
  min-height: 44px;

  padding: 10px 16px;
  border-radius: 999px;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  text-align: center;
  line-height: 1.3;

  /* Allow wrapping inside the pill */
  white-space: normal;
  overflow-wrap: break-word;
  word-break: break-word;
}

/* Live draw – “Enter now” (big green) */
.bc-card__cta-btn--primary.bc-card__cta-btn--enter {
  background: #16a34a;
  color: #ecfdf5;
}

/* Reserve-only – “Reserve entries” */
.bc-card__cta-btn--primary.bc-card__cta-btn--reserve {
  background: rgba(37, 99, 235, 0.16);
  color: #1d4ed8;
}

/* Closed */
.bc-card__cta-btn--secondary.bc-card__cta-btn--closed {
  background: rgba(31, 41, 55, 0.85);
  color: #e5e7eb;
}

/* Generic secondary (fallback) */
.bc-card__cta-btn--secondary {
  background: rgba(15, 23, 42, 0.85);
  color: #e5e7eb;
}


/*************************************************************
 * BADGE ROW ABOVE CARD (SCOPE, TIER)
 *************************************************************/

.bc-badge-row {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin: 0 0 8px;
}

.bc-scope-badge,
.bc-tier-badge {
  border-radius: 999px;
  padding: 4px 9px;
  font-size: 10px;
  text-transform: uppercase;
  letter-spacing: 0.11em;
  display: inline-flex;
  align-items: center;
  gap: 4px;
  border: 1px solid rgba(248,250,252,0.35);
  background: rgba(15,23,42,0.9);
}

/* Scope variations */
.bc-scope-badge--standard {
  background: rgba(15,23,42,0.92);
}

.bc-scope-badge--members {
  background: linear-gradient(135deg,#4b5563,#111827);
  color: #e5e7eb;
}

/* Tier badges pick up tier tokens */
.bc-tier-badge--nano {
  background: linear-gradient(135deg, var(--bc-tier-nano-base), rgba(15,23,42,0.95));
  color: #0b1120;
}

.bc-tier-badge--micro {
    background: linear-gradient(135deg, #27457599, rgba(15, 23, 42, .95));
    color: var(--bc-tier-nano-base);
    border: 1px solid rgb(84 84 84 / 84%) !important;
    border-width: medium;
}

.bc-tier-badge--minor {
  background: linear-gradient(135deg, var(--bc-tier-minor-base), rgba(15,23,42,0.95));
  color: #0b1120;
  border: 1px solid rgb(84 84 84 / 84%) !important;
    border-width: medium;
}

.bc-tier-badge--major {
    color: #ffffff;
    border: 2px solid rgb(174 236 255 / 83%) !important;
    border-width: 1px;
    background: linear-gradient(135deg, #36003d38, #7549ff57 55%), radial-gradient(circle at 0 0, #57006de8, #5f025369 45%), radial-gradient(circle at 100% 100%, #5302028c, #3b82f638 45%);
    box-shadow: 0 0 0 1px #9609ff85, 0 6px 14px #0f172acc !important;
    border-radius: 49px;
}

.bc-tier-badge--mega {
  background: radial-gradient(circle at 0 0, #111827, #020617);
  color: #e5e7eb;
  border: 1px solid rgb(84 84 84 / 84%) !important;
    border-width: medium;
}

.bc-tier-badge--ultra {
  background: radial-gradient(circle at 0 0, #facc15, #1c1917);
  color: #111827;
  border: 1px solid rgb(84 84 84 / 84%) !important;
    border-width: medium;
}

/*************************************************************
 * ETA STACK
 *************************************************************/

.bc-card__eta-stack {
  margin-bottom: 8px;
  display: flex;
  flex-direction: column;
  gap: 4px;
}

.bc-progress-estimated-end {
  font-size: 11px;
  font-weight: 500;
  display: flex;
  align-items: baseline;
  gap: 4px;
  text-shadow: 0 1px 2px rgba(0,0,0,0.8);
}

.bc-progress-estimated-end__label {
  text-transform: uppercase;
  letter-spacing: 0.12em;
  font-size: 10px;
  opacity: 0.9;
}

.bc-progress-estimated-end__value {
  font-weight: 600;
}

/* Soft bar – progression mood */
.bc-soft-bar {
  position: relative;
  height: 6px;
  border-radius: 999px;
  overflow: hidden;
    background: radial-gradient(circle at 0 0, #47474740, #454545b5 60%);
    overflow: hidden;
  box-shadow: inset 0 0 0 1px rgba(15, 23, 42, 0.52);
}

.bc-soft-bar__fill {
  position: absolute;
  inset: 0;
  width: 40%;
  border-radius: inherit;
  background: linear-gradient(90deg,#22c55e,#a3e635);
  transform-origin: left center;
}

/* Noise variants (light wobble) */
.bc-soft-bar--low   .bc-soft-bar__fill { animation: bc-soft-bar-pulse-low 3.5s ease-in-out infinite; }
.bc-soft-bar--medium .bc-soft-bar__fill { animation: bc-soft-bar-pulse-med 2.4s ease-in-out infinite; }
.bc-soft-bar--high   .bc-soft-bar__fill { animation: bc-soft-bar-pulse-hi 1.6s ease-in-out infinite; }

@keyframes bc-soft-bar-pulse-low {
  0%   { transform: scaleX(0.35); }
  50%  { transform: scaleX(0.40); }
  100% { transform: scaleX(0.35); }
}

@keyframes bc-soft-bar-pulse-med {
  0%   { transform: scaleX(0.35); }
  50%  { transform: scaleX(0.55); }
  100% { transform: scaleX(0.35); }
}

@keyframes bc-soft-bar-pulse-hi {
  0%   { transform: scaleX(0.40); }
  50%  { transform: scaleX(0.80); }
  100% { transform: scaleX(0.40); }
}

/*************************************************************
 * TIER ROW (ICON + PILL)
 *************************************************************/

/* Pill as a flex container */
.bc-card__tier-pill,
/* Tier row: pill + icon on the right */


/* Pill behaves like a flexible badge that can wrap text */
.bc-card__tier-pill,
.bc-card__tier-pill-grid {
  flex: 1 1 auto;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 0.35rem 0.8rem;
  border-radius: 999px;

  color: #f9fafb;
  font-size: 1rem;
  max-width: 100%;
  text-align: center;
  white-space: normal;
  overflow-wrap: break-word;
}

/* Icon container: fixed 65x65 on the RIGHT */
.bc-card__tier-icon-wrap {
  order: 2;
  flex: 0 0 auto;
  width: 65px;
  height: 65px;
  display: flex;
  align-items: center;
  justify-content: center;
}

.bc-card__tier-icon {
  max-width: 100%;
  max-height: 100%;
  display: block;
  box-shadow: 0 0 0 1px #292e3b8a, 0 6px 14px #0f172acc !important;
}


/* Pill container with internal left/right layout */
/* --- CLEAN + FINAL TIER PILL LAYOUT --- */
.bc-card__tier-pill
 {
    flex: 1 1 auto;
    display: flex;
    flex-direction: row;
    align-items: center;
    gap: 6px;
    padding: 12px 12px;
    min-height: 46px;
    border-radius: 40px;
    background: linear-gradient(135deg, #0000008c, #04060ced);
    border: 1px solid rgba(255, 255, 255, .35);
    box-shadow: 0 0 0 1px #0f172a73;
    -webkit-backdrop-filter: blur(10px);
    backdrop-filter: blur(10px);
    white-space: nowrap;
    overflow: hidden;
    box-sizing: border-box;
}

.bc-card__tier-main {
    font-size: 16px;
    font-weight: 600;
    letter-spacing: 0.01em;
    text-transform: uppercase;
    line-height: 1.1;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    text-shadow: -1px 1px 3px #000000d4;
    padding-left: 12px;
    color: #ffffff;
}

.bc-card__tier-sub {
    font-size: 10px;
    opacity: .86;
    white-space: normal;
    max-width: 160px;
    padding-left: 10px;
}

.bc-card__status-chip {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 0.15rem 0.6rem;
  border-radius: 999px;
  font-size: 0.78rem;
  font-weight: 600;
  letter-spacing: 0.02em;
  white-space: nowrap;
}

/* Live variant */
.bc-card__status-chip--live {
  background: #19c463;
  color: #041310;
  box-shadow: 0 0 12px rgba(25, 196, 99, 0.45);
}



/* ETA cluster aligned to the right inside the pill */
.bc-card__tier-eta {
  margin-left: auto;
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  gap: 2px;
}

.bc-card__tier-eta-label {
  font-size: 9px;
  text-transform: uppercase;
  letter-spacing: 0.11em;
  opacity: 0.9;
  padding-left: 10px;
}

.bc-card__tier-eta-text {
    font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, Liberation Mono, Courier New, monospace;
    font-size: 11px;
    font-weight: 600;
    padding-left: 10px;
    padding-bottom: 12px;
    padding-right: 12px;
    letter-spacing: 0.05px;
    word-spacing: -1.98px;
    padding-bottom: 7px;
    color: #6aff50;
}
.bc-card__cta {
display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 5px 20px 4px 20px;
    margin: 0px 0px 3px 0px;
    background-color: #ffcf06;
    color: #000000;
    border: 0px solid #000000;
    border-radius: 22px;
    font-size: 15px;
    font-weight: 600;
    text-decoration: none;
    cursor: pointer;
    transition: all 0.3s 
ease;
    white-space: nowrap;
box-shadow: 0 0 0 1px #292e3b8a, 0 6px 14px #0f172acc !important;
}

.bc-card__cta {
  display: flex;
  align-items: center;
  justify-content: center;
  text-align: center;

  /* Keep card shape stable even as CTA text changes */
  padding: 6px 10px;
  width: 100%;
  min-height: 2.6em; /* tweak if needed after eyeballing */
}

.bc-card__cta-text {
  display: inline-block;
  max-width: 100%;
  white-space: normal;
  word-wrap: break-word;
  overflow-wrap: break-word;
}


/*************************************************************
 * TEXT STACK – KICKER, TITLE, SUBTITLE, CTA
 *************************************************************/

.bc-card__kicker {
  position: relative;
  display: inline-flex;
  align-items: center;
  padding: 3px 9px;
  border-radius: 999px;
  background: radial-gradient(circle at 0 0, rgba(0,0,0,0.65), transparent 60%);
  backdrop-filter: blur(8px);
  text-shadow: 0 1px 3px rgba(0,0,0,0.9);
}


.bc-card__title {
  font-size: 20px;
  font-weight: 700;
  letter-spacing: 0.02em;
  margin-bottom: 2px;
  text-shadow: 0 2px 5px rgba(0,0,0,0.9);
}

.bc-card__subtitle {
  font-size: 13px;
  opacity: 0.95;
  margin-bottom: 10px;
}

/* CTA line (rotating) */
.bc-card__cta {
  font-size: 13px;
  font-weight: 600;
  margin-bottom: 10px;
}

/* CTA animation variants – fade, slide-right, drop-down, typewriter */
.bc-card__cta-text {
  display: inline-block;
}

/* fade */
.bc-card__cta-text--style-fade {
  animation: bc-cta-fade 4s ease-in-out infinite;
}

/* slide-right */
.bc-card__cta-text--style-slide-right {
  animation: bc-cta-slide-right 4s ease-in-out infinite;
}

/* drop-down */
.bc-card__cta-text--style-drop-down {
  animation: bc-cta-drop-down 4s ease-in-out infinite;
}

/* typewriter (simplified) */
.bc-card__cta-text--style-typewriter {
  white-space: nowrap;
  overflow: hidden;
  animation: bc-cta-typewriter 5s steps(32, end) infinite;
}

@keyframes bc-cta-fade {
  0%, 100% { opacity: 0; transform: translateY(3px); }
  10%, 90% { opacity: 1; transform: translateY(0); }
}

@keyframes bc-cta-slide-right {
  0%   { opacity: 0; transform: translateX(-8px); }
  15%  { opacity: 1; transform: translateX(0); }
  85%  { opacity: 1; transform: translateX(0); }
  100% { opacity: 0; transform: translateX(6px); }
}

@keyframes bc-cta-drop-down {
  0%   { opacity: 0; transform: translateY(-10px); }
  15%  { opacity: 1; transform: translateY(0); }
  85%  { opacity: 1; transform: translateY(0); }
  100% { opacity: 0; transform: translateY(8px); }
}

@keyframes bc-cta-typewriter {
  0%   { width: 0; }
  50%  { width: 100%; }
  100% { width: 0; }
}

/*************************************************************
 * BOTTOM ROW – IMAGE SLOT + AGE BADGE
 *************************************************************/
.bc-card__badge {
    font-size: 10px !important;
    border-radius: 999px !important;
    padding: 4px 9px !important;
    background: #4f4e4ec2 !important;
    border: 1px solid rgb(248 250 252 / 29%) !important;
    color: #fff !important;
    box-shadow: 0 0 0 1px #0f172ab3, 0 6px 14px #0f172acc !important;
}

.bc-card__bottom-row {
  margin-top: auto;
  display: flex;
  align-items: center;
  gap: 10px;
  padding-top: 8px;
}

.bc-card__image-slot {
  flex: 0 0 72px;
  height: 56px;
  border-radius: 12px;
  overflow: hidden;
  background: rgba(15,23,42,0.9);
  border: 1px solid rgba(148,163,184,0.6);
  box-shadow: 0 10px 20px rgba(0,0,0,0.7);
}

.bc-card__image-slot img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

/* Age badge */
.bc-card__badge--age {
    /* width: 34px; */
    /* height: 26px; */
    font-size: 9px !important;
    background: rgb(51 51 51 / 21%) !important;
    color: #a9a9a9 !important;
    max-width: fit-content !important;
    height: auto !important;
    padding: 1px 4px 1px 6px !important;
}

/*************************************************************
 * BESTCOMP TICKER – BOTTOM STRIP
 *************************************************************/

.bestcomp-ticker {
   margin-top: 10px;
    border-radius: 107px;
    padding: 20px 37px;
    background: radial-gradient(circle at 0 0, #1e40afcc, #0f172af5);
    border: 1px solid rgba(148, 163, 184, .6);
    display: flex;
    flex-direction: column;
    gap: 6px;
    font-size: 12px;
    color: #fff;
    box-shadow: 0 14px 30px #0f172ad9;
}

/* Nuclear override to kill any vertical ticker behaviour anywhere */
.bestcomp-ticker__bar-fill {
  position: absolute !important;
  top: 0 !important;
  bottom: 0 !important;
  left: 0 !important;
  right: auto !important;
  width: 40% !important;
  height: 100% !important;
  transform-origin: left center !important;
  transform: scaleX(1) !important;
}

/* Status + bar row */
.bestcomp-ticker__row {
  display: flex;
  align-items: center;
  gap: 8px;
}

/* Label chip */
.bestcomp-ticker__status-chip {
  padding: 3px 8px;
  border-radius: 999px;
  font-size: 10px;
  text-transform: uppercase;
  letter-spacing: 0.12em;
  border: 1px solid rgba(148,163,184,0.8);
}

/* Live soft */
.bestcomp-ticker--live_soft .bestcomp-ticker__status-chip {
  background: rgba(22,163,74,0.16);
  color: #bbf7d0;
  border-color: rgba(34,197,94,0.8);
}

/* Live hard */
.bestcomp-ticker--live_hard .bestcomp-ticker__status-chip {
  background: rgba(245,158,11,0.16);
  color: #fed7aa;
  border-color: rgba(245,158,11,0.8);
}

/* Closed/complete */
.bestcomp-ticker--closed_pending_draw .bestcomp-ticker__status-chip,
.bestcomp-ticker--complete .bestcomp-ticker__status-chip {
  background: rgba(55,65,81,0.75);
  color: #e5e7eb;
}

/* Bar background */
.bestcomp-ticker__bar {
  position: absolute;
  flex: 1 1 auto;
  height: 6px;
  border-radius: 999px;
  overflow: hidden;
  background: rgba(15,23,42,0.9);
  box-shadow: inset 0 0 0 1px rgba(31,41,55,0.9);
}

/* Bar fill – strictly horizontal, shared for all statuses */
.bestcomp-ticker__bar-fill {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  height: 100%;
  width: 40%; /* default; JS can scale with transform */
  max-width: 100%;
  border-radius: inherit;
  transform-origin: left center;
  transform: scaleX(1);          /* ensure X axis, not Y */
  background: linear-gradient(90deg,#22c55e,#a3e635);
}

/* Hard override in case *any* status variant was messing with it */
.bestcomp-ticker--live_soft .bestcomp-ticker__bar-fill,
.bestcomp-ticker--live_hard .bestcomp-ticker__bar-fill,
.bestcomp-ticker--closed_pending_draw .bestcomp-ticker__bar-fill,
.bestcomp-ticker--complete .bestcomp-ticker__bar-fill {
  position: absolute !important;
  top: 0 !important;
  bottom: 0 !important;
  left: 0 !important;
  right: auto !important;
  width: 40% !important;
  height: 100% !important;
  transform-origin: left center !important;
}


/* Bottom row – prize + draw ref */
.bestcomp-ticker__bottom {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: 6px;
  justify-content: space-between;
}

.bestcomp-ticker__prize {
    font-weight: 700;
    font-size: large;
    color: #fffffff2;
    text-shadow: 1px 2px #00000045;
}

/*************************************************************
 * FINAL TICKER LAYOUT FIX – FORCE HORIZONTAL
 *************************************************************/

/* Top block sits neatly above the bar + text */
.bestcomp-ticker__top {
  display: flex;
  flex-direction: column;
  gap: 6px;
}

/* Status + bar row */
.bestcomp-ticker__row {
  display: flex;
  align-items: center;
  gap: 8px;
}

/* Horizontal bar strip – shared track for __bar-bg and __bar */
.bestcomp-ticker__bar-bg, .bestcomp-ticker__bar {
    position: relative;
    width: 100%;
    height: 5px;
    border-radius: 999px;
    background: #151d31;
    overflow: hidden;
    flex: 0 0 auto;
}

/* Fill – ALWAYS horizontal, left-to-right */
.bestcomp-ticker__bar-fill {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: auto;          /* width controls fill, not height */
  height: 100%;
  max-width: 100%;
  width: 40%;           /* default; inline style (width: 5%) can override */
  border-radius: inherit;
  background: linear-gradient(90deg, #22c55e, #0ea5e9);
  transform-origin: left center;
  /* no flex, no vertical scaling here */
}

/*************************************************************
 * End Of FINAL TICKER LAYOUT FIX – FORCE HORIZONTAL
 *************************************************************/

/* Bar container – MUST be relative so bar-fill stays inside it */
.bestcomp-ticker__bar {
  position: relative !important;
  flex: 1 1 auto;
  height: 6px;
  min-width: 80px;
  border-radius: 999px;
  overflow: hidden;
  background: rgba(15,23,42,0.9);
  box-shadow: inset 0 0 0 1px rgba(31,41,55,0.9);

  /* Kill any rogue absolute positioning from old CSS */
  top: auto !important;
  bottom: auto !important;
  left: auto !important;
  right: auto !important;
}

/* Bar fill – strictly horizontal, never a vertical strip */
.bestcomp-ticker__bar-fill {
  position: absolute !important;
  top: 0 !important;
  bottom: 0 !important;
  left: 0 !important;
  right: auto !important;
  width: 40% !important;     /* JS can still tweak via transform if you want */
  height: 100% !important;
  transform-origin: left center !important;
  transform: scaleX(1) !important;
  border-radius: inherit;
  background: linear-gradient(90deg,#22c55e,#a3e635);
}

.bc-draw-ref {
  font-size: 11px;
  opacity: 0.85;
}

.bc-draw-ref__label {
    text-transform: uppercase;
    letter-spacing: 0.08em;
    font-size: 10px;
    opacity: 1;
}

.bc-draw-ref__code {
  font-weight: 600;
}

.bc-hours-left {
    margin-top: 13px;
    color: #fbff4a;
    font-weight: 900;
    text-shadow: 1px -2px 1px #191c2982;
    font-size: large;
    z-index: 999;
    position: relative;
}
.bc-hours-left {
  margin-top: 13px;
  color: #fbff4a;
  font-weight: 900;
  text-shadow: 1px -2px 1px #191c2982;
  font-size: large;
  z-index: 999;
  position: relative;

  /* New: blink + centering + no layout jump */
  display: inline-block;
  text-align: center;
  animation: bc-hours-blink 2.5s ease-in-out infinite;
}

/* 1.5s blink – fade in/out without changing size */
@keyframes bc-hours-blink {
  0%, 40% {
    opacity: 1;
  }
  50%, 90% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}



.bc-hours-left-estimated {
    font-size: xx-small;
    color: #808080e8;
    text-shadow: none;
}

.bc-eta-bottom.bc-eta-bottom--long {
    font-weight: 800;
}

/*************************************************************
 * BUNDLES WIDGET (HIGH LEVEL)
 *************************************************************/
p.bc-bundles-eta__subheading {
    font-size: large;
}

#bc-bundles-widget {
  margin-top: 18px;
  border-radius: 16px;
  padding: 10px 10px 12px;
  background: radial-gradient(circle at 0 0, rgba(30,64,175,0.8), rgba(15,23,42,0.96));
  color: #e5e7eb;
  box-shadow: 0 14px 30px rgba(15,23,42,0.85);
}

.bc-bundles-header {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  gap: 8px;
  margin-bottom: 6px;
}

.bc-bundles-title {
  font-size: 14px;
  font-weight: 600;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

.bc-bundles-subtitle {
  font-size: 11px;
  opacity: 0.9;
}

/* Bundle options row */
.bc-bundles-options {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin: 6px 0 8px;
}

/*************************************************************
 * BUNDLES – BUTTONS + SLIDER (COLD → RED HOT)
 *************************************************************/

/* Bundle pill buttons */
.bc-bundle-option {
    position: relative;
    border-radius: 999px;
    padding: 6px 10px;
    font-size: 11px;
    border: 1px solid rgba(191, 219, 254, .5);
    cursor: pointer;
    display: inline-flex;
    flex-wrap: nowrap;
    align-items: center;
    gap: 5px;
    background: #f1f9ff;
    color: #111827;
    /* font-weight: 400 !important; */
    margin: 3px;
}

.bc-bundle-option__qty {
  font-weight: 600;
}

.bc-bundle-option__price {
  opacity: 0.9;
}

/* Popular + active states */
.bc-bundle-option.is-popular {
  border-color: #facc15;
}

.bc-bundle-option.is-active {
    background: radial-gradient(ellipse farthest-corner at right bottom, #FEDB37 0%, #FDB931 8%, #9f7928 30%, #8A6E2F 40%, transparent 80%), radial-gradient(ellipse farthest-corner at left top, #fff, #ffffac 8%, #d1b464 25%, #5d4a1f 62.5% 100%) !important;
    border-color: #c9c9c9fa !important;
    color: #0b1120 !important;
    box-shadow: 0 0 0 1px #0f172ae6, 0 8px 18px #0f172ae6 !important;
    font-size: 10px;
    font-weight: 600;
}

/*************************************************************
 * SLIDER – COLD → HOT GRADIENT + CUSTOM HANDLE
 *************************************************************/

.bc-bundle-slider {
  margin-top: 6px;
  display: flex;
  flex-direction: column;
  gap: 4px;
  font-size: 11px;
}

/* Track wrapper – fixed height, full width */
.bc-bundle-slider__track-wrap {
  position: relative;
  width: 100%;
  height: 8px !important;       /* lock thickness */
  flex: 0 0 auto;               /* never stretch vertically */
  border-radius: 999px;
  overflow: visible;
}

/* Gradient track sitting underneath the range input */
.bc-bundle-slider__track {
  position: absolute;
  inset: 0;
  border-radius: inherit;
  pointer-events: none;
  background: linear-gradient(
    90deg,
    #0ea5e9,   /* cold blue */
    #22c55e,   /* getting warm */
    #eab308,   /* warm yellow */
    #f97316,   /* hot orange */
    #ef4444    /* red hot */
  );
}

/* The actual HTML <input type="range"> */
.bc-bundle-slider__input {
  position: absolute;
  inset: -6px 0 0 0;            /* give thumb some vertical room */
  width: 100%;
  height: 20px;
  margin: 0;
  padding: 0;
  background: transparent;
  cursor: pointer;
  -webkit-appearance: none;
  appearance: none;
}

/* WebKit track – make it transparent so our gradient shows */
.bc-bundle-slider__input::-webkit-slider-runnable-track {
  height: 8px;
  background: transparent;
  border-radius: 999px;
}

/* WebKit thumb */
.bc-bundle-slider__input::-webkit-slider-thumb {
  -webkit-appearance: none;
  appearance: none;
  width: 14px;
  height: 14px;
  border-radius: 999px;
  background: #f9fafb;
  border: 1px solid rgba(15,23,42,0.35);
  box-shadow: 0 2px 6px rgba(15,23,42,0.6);
  margin-top: -3px; /* centre on 8px track */
}

/* Firefox track */
.bc-bundle-slider__input::-moz-range-track {
  height: 8px;
  background: transparent;
  border-radius: 999px;
}

/* Firefox thumb */
.bc-bundle-slider__input::-moz-range-thumb {
  width: 14px;
  height: 14px;
  border-radius: 999px;
  background: #f9fafb;
  border: 1px solid rgba(15,23,42,0.35);
  box-shadow: 0 2px 6px rgba(15,23,42,0.6);
}

/* Labels directly under the slider (1 / 5 / 10 / 25 / 50 etc.) */
.bc-bundle-slider__labels {
  display: flex;
  justify-content: space-between;
  margin-top: 4px;
  opacity: 0.9;
}

.bc-bundle-slider__label {
  font-size: 10px;
}

/* Mood labels: Cool | Getting warm | Hot! */
.bc-bundle-slider__mood {
  display: flex;
  justify-content: space-between;
  margin-top: 2px;
  font-size: 10px;
  opacity: 0.85;
}
.bc-eta-boost {
    background: radial-gradient(circle at 0 0, #ffffff, #bfd7ffe6);
    margin-top: 7px;
    border-radius: 16px;
    padding: 6px;
    color: #333;
}
p.bc-eta-title {
    color: #3988e9;
    font-size: small;
    font-weight: bolder;
    margin: auto;
    /* text-shadow: -1px 1px #000000a1; */
}

p.bc-eta-small {
    font-size: xx-small;
    color: rgb(79 79 79);
    line-height: 10px;
}

p.bc-eta-text.bc-eta-text-dynamic {
    color: #474747;
    font-weight: 700;
    font-size: medium;
    line-height: normal;
    margin: auto;
}

.bc-bundle-option {
    position: relative;
    border-radius: 29px;
    padding: 1px 2px 1px 4px;
    font-size: 8px;
    border: 1px solid rgba(191, 219, 254, .5);
    cursor: pointer;
    display: inline-flex;
    flex-wrap: nowrap;
    align-items: center;
    gap: 5px;
    background: #f1f9ff;
    color: #111827;
    margin: 3px;
    min-height: fit-content;
    max-height: fit-content;
    margin: 2px;
}

span.bc-bundle-option__label {
    font-weight: 600;
    font-size: 13px;
}

sspan.bc-bundle-option__meta {
    max-width: 119px;
    height: 25px;
    margin: 3px;
    padding: 6px;
    background-image: linear-gradient(to bottom, #e0e0e0, #a0a0a0);
    max-height: fit-content;
    min-height: fit-content;
    border-radius: 19px;
    font-size: 10px;
    font-weight: 600;
    border: 6px;
    border-color: #00000057 !important;
    border: solid;
}

span.bc-pop-badge {
    font-weight: 600;
    color: #d5d5d5;
    text-shadow: -0.05px -1px 4px black;
    font-size: large;
}

/*************************************************************
 * PRE-CART MODAL – SHELL STYLES HOOK
 *************************************************************/
.bc-precart-modal {
  font-family: inherit;
}

/*************************************************************
 * RESPONSIVE TWEAKS
 *************************************************************/
@media (max-width: 768px) {
  .bc-card__overlay {
    padding: 12px 10px 10px;
  }

  .bc-card__title {
    font-size: 18px;
  }

  .bc-card__tier-pill {
    padding: 6px 10px;
    min-height: 42px;
  }

  #bc-bundles-widget {
    padding: 10px 10px 10px;
  }
}


/*************************************************************
 * FINAL TWEAKS – ICON HALOS, TIER PILL LAYOUT, OVERLAY
 * Tier-specific halos + fixed spacing
 *************************************************************/

/* 1) Base tier icon – transparent PNG/WebP, no black box */
.bc-card__tier-icon {
  width: 72px;
  height: 72px;
  display: block;
  object-fit: contain;
border-radius: 99px !important;
  background: transparent !important;
}

/* Base halo wrapper – neutral, then tinted per tier */
.bc-card__tier-icon-wrap {
  width: 52px;
  height: 52px;
  border-radius: 999px;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  border: 1px solid rgba(255,255,255,0.45);
  box-shadow: 0 8px 22px rgba(0,0,0,0.55);
  background:
    radial-gradient(circle at 30% 0%, rgba(255,255,255,0.80), transparent 60%),
    radial-gradient(circle at 80% 100%, rgba(15,23,42,0.60), transparent 55%);
}

/* 1a) Tier-specific halo tints (cold → red-hot) */

/* Nano – icy, pale blue-white */
.bc-card--tier-nano .bc-card__tier-icon-wrap {
  background:
    radial-gradient(circle at 25% 0%, rgba(255,255,255,0.95), transparent 60%),
    radial-gradient(circle at 80% 100%, rgba(129,178,255,0.65), transparent 55%);
}

/* Micro – bright aqua */
.bc-card--tier-micro .bc-card__tier-icon-wrap {
  background:
    radial-gradient(circle at 25% 0%, rgba(255,255,255,0.9), transparent 60%),
    radial-gradient(circle at 80% 100%, rgba(56,189,248,0.7), transparent 55%);
}

/* Minor – cool green / teal */
.bc-card--tier-minor .bc-card__tier-icon-wrap {
  background:
    radial-gradient(circle at 25% 0%, rgba(255,255,255,0.9), transparent 60%),
    radial-gradient(circle at 80% 100%, rgba(52,211,153,0.7), transparent 55%);
}

/* Major – warm gold / bronze */
.bc-card--tier-major .bc-card__tier-icon-wrap {
  background:
    radial-gradient(circle at 20% 0%, rgba(255,255,255,0.95), transparent 60%),
    radial-gradient(circle at 80% 100%, rgba(234,179,8,0.85), transparent 55%);
}

/* Mega – deep electric blue */
.bc-card--tier-mega .bc-card__tier-icon-wrap {
  background:
    radial-gradient(circle at 20% 0%, rgba(248,250,252,0.85), transparent 60%),
    radial-gradient(circle at 80% 100%, rgba(59,130,246,0.9), transparent 55%);
}

/* Ultra – near-black with silver edge */
.bc-card--tier-ultra .bc-card__tier-icon-wrap {
  background:
    radial-gradient(circle at 20% 0%, rgba(249,250,251,0.9), transparent 60%),
    radial-gradient(circle at 80% 100%, rgba(15,23,42,0.95), transparent 55%);
}

/* Optional subtle per-tier colour tweak on the icon itself */
.bc-card--tier-nano .bc-card__tier-icon {
  filter: saturate(1.05) brightness(1.08);
}

.bc-card--tier-micro .bc-card__tier-icon {
  filter: saturate(1.15) brightness(1.06);
}

.bc-card--tier-minor .bc-card__tier-icon {
  filter: saturate(1.15) hue-rotate(-10deg);
}

.bc-card--tier-major .bc-card__tier-icon {
    filter: saturate(2.58) hue-rotate(15deg);
}


.bc-card--tier-mega .bc-card__tier-icon {
  filter: saturate(1.15) hue-rotate(210deg);
}

.bc-card--tier-ultra .bc-card__tier-icon {
  filter: saturate(1.05) brightness(1.02);
}

/* 2) TIER PILL – locked horizontal layout, no weird spacing */

.bc-card__tier-pill {
  flex: 1 1 auto;
  display: flex;
  flex-direction: row;          /* always horizontal */
  align-items: center;
  gap: 6px;

  padding: 6px 12px;
  min-height: 46px;            /* prevents vertical “jump” on digit change */
  border-radius: var(--bc-radius-pill);

  background: linear-gradient(
    135deg,
    rgba(255,255,255,0.10),
    rgba(15,23,42,0.70)
  );
  border: 1px solid rgba(255,255,255,0.35);
  box-shadow: 0 0 0 1px rgba(15,23,42,0.45);
  backdrop-filter: blur(10px);

  white-space: nowrap;
  overflow: hidden;
  box-sizing: border-box;
}

.bc-card__tier-pill {
  color: #f9fafb;
}


/* Let the sub label wrap if needed without breaking the pill */
.bc-card__tier-text {
  display: flex;
  align-items: center;
  gap: 6px;
  min-width: 0;
  flex-wrap: wrap;
}

/* Right side – countdown cluster */
.bc-card__tier-eta {
  margin-left: auto;
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  gap: 2px;
}

.bc-card__tier-eta-label {
  font-size: 9px;
  text-transform: uppercase;
  letter-spacing: 0.0011em;
  opacity: 0.9;
}

.bc-card__tier-eta-text {
    font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, Liberation Mono, Courier New, monospace;
    font-size: 13px;
    font-weight: 800;
    background: radial-gradient(circle at 0 0, rgba(0, 0, 0, .65), transparent 60%);
    border-radius: 23px;
    margin: auto;
    padding-bottom: 1px;
    backdrop-filter: blur(8px);
    text-shadow: -0.6px 0.6px 0.6px black;
}

/* 3) Overlays – reduce purple tint, add light tier flavour */
.bc-card__overlay {
  background:
    radial-gradient(circle at 0 0, rgba(0,0,0,0.35), transparent 40%),
    radial-gradient(circle at 100% 100%, rgba(0,0,0,0.55), transparent 45%);
}

/* Nano / Micro – cooler overlay */
.bc-card--tier-nano .bc-card__overlay,
.bc-card--tier-micro .bc-card__overlay {
  background: linear-gradient(135deg, rgb(0 153 54 / 92%), #0121120a 55%), radial-gradient(circle at 0 0, rgba(0, 0, 0, 0.40), #22c55e3d 45%), radial-gradient(circle at 100% 100%, rgba(0, 0, 0, 0.55), #193b224d 45%);
}

/* Minor – orange overlay */
.bc-card--tier-minor .bc-card__overlay {
  background: linear-gradient(135deg, rgb(255 153 0 / 45%), #ffd14a45 55%), radial-gradient(circle at 0 0, rgb(255 154 2 / 41%), #d700004f 45%), radial-gradient(circle at 100% 100%, rgb(67 4 4 / 32%), #ffa40085 45%);
}

/* Major – warm gold overlay */
.bc-card--tier-major .bc-card__overlay {
    background: linear-gradient(135deg, rgb(54 0 61 / 22%), #7549ff57 55%), radial-gradient(circle at 0 0, rgb(87 0 109 / 91%), #5f025369 45%), radial-gradient(circle at 100% 100%, rgb(83 2 2 / 55%), #3b82f638 45%);
}

/* Mega – deep blue overlay */
.bc-card--tier-mega .bc-card__overlay {
  background:
    linear-gradient(135deg, rgba(37,99,235,0.22), transparent 55%),
    radial-gradient(circle at 0 0, rgba(0,0,0,0.40), transparent 45%),
    radial-gradient(circle at 100% 100%, rgba(0,0,0,0.6), transparent 45%);
}

/* Ultra – subtle silver edge */
.bc-card--tier-ultra .bc-card__overlay {
  background:
    linear-gradient(135deg, rgba(248,250,252,0.20), transparent 60%),
    radial-gradient(circle at 0 0, rgba(0,0,0,0.40), transparent 45%),
    radial-gradient(circle at 100% 100%, rgba(0,0,0,0.65), transparent 45%);
}

/* 4) ETA boost text contrast – no more grey-on-white */
.bc-eta-boost__title {
  color: #111827;
}

.bc-eta-boost__text {
  color: rgba(15,23,42,0.88);
}

.bc-eta-boost__disclaimer {
  color: rgba(15,23,42,0.65);
}
.add-to-cart-button {
    height: var(--height-buy-buttons);
    text-transform: var(--button-text-case-primary);
    background: #ffd600 !important;
    color: black !important;
}

img.bc-precart-modal__logo {
    max-width: 40px;
    height: auto;
}

h3.bc-card__title {
    font-size: 20px;
    margin: 12px;
    line-break: normal;
    padding: 2px;
}

.bestcomp-ticker__bar-bg, .bestcomp-ticker__bar {
    position: relative;
    width: 100%;
    height: 5px;
    border-radius: 999px;
    background: radial-gradient(circle at 0 0, #00000000, #7d7d7d61 60%);
    overflow: hidden;
    flex: 0 0 auto;
}
.bc-soft-bar.bc-soft-bar--medium {
    background: radial-gradient(circle at 0 0, #47474740, #454545b5 60%);
    overflow: hidden;
}

/*************************************************************
 * STAGE 10 – GRID CTA BUTTONS + AGE BADGE + GRID TIER ICON
 * (Non-breaking overrides for product-card + banner card)
 *************************************************************/

/* Card overlay already runs as a column – make sure the bottom
   row genuinely hugs the base on both banner + grid cards */
.bc-card__bottom-row {
  margin-top: auto;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  padding-top: 10px;
}

/* Grid-specific bottom row hook (collection cards) */
.bc-card__bottom-row--grid {
  padding-bottom: 4px;
}

/* Age badge variant for grid cards – keeps it tucked right
   and visually balanced under the CTAs */
.bc-card__badge--age-grid {
  margin-left: auto;
}

/* Slightly calmer age badge treatment on product cards so it
   reads nicely under the yellow button row */
.product-card .bc-card__badge--age {
    background: #f7000030 !important;
    color: #e5e7eb !important;
    /* max-width: fit-content !important; */
}

/* ------------------------------------------------------------------
 * CTA ROW + BUTTONS (collection / grid cards only)
 * ------------------------------------------------------------------ */

/* Vertical stack of CTAs on the card body */
.bc-card__cta-row {
  margin-top: 10px;
  display: flex;
  flex-direction: column;
  gap: 6px;
}

/* Base CTA button style – Apple-ish, soft, clickable */
.bc-card__cta-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  min-height: 40px;
  padding: 9px 16px;
  border-radius: 999px;
  font-size: 13px;
  font-weight: 600;
  text-decoration: none;
  border: none;
  cursor: pointer;
  transition:
    transform 0.16s ease,
    box-shadow 0.16s ease,
    background 0.16s ease,
    color 0.16s ease;
}

/* Primary CTA – bright yellow “enter now” style */
.bc-card__cta-btn--primary {
  background: #ffcf06;
  color: #111827;
  box-shadow: 0 9px 20px rgba(0, 0, 0, 0.45);
}

.bc-card__cta-btn--primary:hover,
.bc-card__cta-btn--primary:focus-visible {
  transform: translateY(-1px);
  box-shadow: 0 13px 28px rgba(0, 0, 0, 0.55);
}

/* Secondary CTA – dark glass pill (e.g. “More details”) */
.bc-card__cta-btn--secondary {
  background: rgba(15, 23, 42, 0.92);
  color: #e5e7eb;
  border: 1px solid rgba(148, 163, 184, 0.7);
  box-shadow: 0 8px 18px rgba(15, 23, 42, 0.85);
}

.bc-card__cta-btn--secondary:hover,
.bc-card__cta-btn--secondary:focus-visible {
  transform: translateY(-1px);
  background: rgba(15, 23, 42, 0.98);
}

/* Ghost / tertiary CTA – for low-priority actions */
.bc-card__cta-btn--ghost {
  background: transparent;
  color: #e5e7eb;
  border: 1px dashed rgba(148, 163, 184, 0.7);
  box-shadow: none;
}

.bc-card__cta-btn--ghost:hover,
.bc-card__cta-btn--ghost:focus-visible {
  background: rgba(15, 23, 42, 0.7);
}

/* ------------------------------------------------------------------
 * TIER ICON – HERO vs GRID
 * ------------------------------------------------------------------ */

/* Shared tier icon base – keeps the PNGs looking premium */
.bc-card__tier-icon {
  width: 46px;
  height: 46px;
  object-fit: contain;
  display: block;
  filter: drop-shadow(0 10px 22px rgba(0, 0, 0, 0.65));
}

/* Smaller, slightly tighter icon for collection/grid usage.
   We’re not wiring this in Liquid yet, but the hook is ready:
   .bc-card__tier-icon--grid can be added alongside the base
   class when we introduce the icon into the grid header. */
.bc-card__tier-icon--grid {
  width: 40px;
  height: 40px;
  border-radius: 999px;
  box-shadow: 0 8px 18px rgba(0, 0, 0, 0.7);
}

.product-card__content {
    background: transparent;
}
.bc-card__tier-pill-grid {
    color: #f9fafb;
    max-width: fit-content !important;
    font-size: 26px;
    padding-left: 30px !important;
    padding-right: 30px !important;
}
.bc-card__cta-btn--primary.bc-card__cta-btn--reserve {
    color: rgb(245, 245, 245);
    box-shadow: rgba(0, 0, 0, 0.39) -1px 8px 20px;
    text-shadow: rgba(33, 33, 33, 0.86) -1px 1px 4px;
    background: rgb(3, 77, 71);
}

.bc-product-eta {
    background: radial-gradient(circle at 0 0, #16a34a, #4cef024a);
    height: auto;
    border-radius: 16px;
    padding: 10px;
    color: #e2e2e2!important;
    max-height: fit-content;
    overflow: hidden;
    --padding-block-start: max(20px, calc(var(--spacing-scale) * 24px));
    --padding-block-end: max(20px, calc(var(--spacing-scale) * 75px));
    --padding-inline-start: 12px;
    --padding-inline-end: 12px;
    --size-style-width: 100%;
    --size-style-height: fit;
    --size-style-width-mobile: 100%;
    --size-style-width-mobile-min: 5rem;
    margin-bottom: 8px;
    border: 1px solid rgb(248 250 252 / 32%);
    margin: 5px 4px 7px 4px;
    position: relative;
    z-index: 1;
    padding: 14px 14px 4px;
    height: 100%;
    display: flex;
    flex-direction: column;
}

p.bc-draw-ref {
    padding: 7px 13px;
    border-radius: 999px;
    background: radial-gradient(circle at 0 0, rgb(99 97 97 / 65%), #00000042 60%);
    max-width: fit-content;
    border: 1px solid rgb(248 250 252 / 29%) !important;
    color: #ffffff !important;
    box-shadow: 0 0 0 1px #0f172ab3, 0 6px 14px #0f172a6b !important;
}
.bc-eta-bottom.bc-eta-bottom--medium {
    color: white;
    font-weight: 500;
}

p.bc-eta-disclaimer {
    color: #ffffffab;
    font-size: xx-small;
}

.bc-draw-ref__label {
    text-transform: uppercase;
    letter-spacing: .02em;
    font-size: 10px;
    opacity: 1;
    color: #ffffff;
}


@media screen and (min-width: 750px) {
    .product-information__grid:not(:has(.product-information__media:empty)) {
        &.product-information__grid--half, &.product-information__grid--half:has(.media-gallery--extend) {
            &.product-information--media-left {
                .product-information__media {
                    grid-column: 2 / 3;
                    margin-top: -42px;
                }
            }
        }
    }
}


.ai-signup-button-anlb0njnyqxrydguxvaigenblocka516119xikhej {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 4px 20px 4px 20px;
    margin: 11px 9px -5px 2px;
    background-color: #ffcf06;
    color: #000000;
    border: 0px solid #000000;
    border-radius: 6px;
    font-size: 15px;
    font-weight: 600;
    text-decoration: none;
    cursor: pointer;
    transition: all 0.3s 
ease;
    white-space: nowrap;
    box-shadow: 0px -2px 1px -3px #00000026;
}

.product-details {
    display: flex;
    align-self: start;
    justify-content: center;
    margin-bottom: 12px;
    margin-top: 20px !important;
}

.group-block.group-block--height-fit.group-block--width-fill.border-style.spacing-style.size-style.color-scheme-6 {
    min-width: 424.953px;
}

/* --- TIER ROW LAYOUT --- */
.bc-card__tier-row {
  display: flex;
  align-items: center;
  gap: 8px;
  margin: 12px 0 10px 0;
}

/* --- UNIVERSAL PILL BASE --- */
.bc-card__tier-pill {
  flex: 1 1 auto;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 6px;

  padding: 12px 20px;
  min-height: 46px;
border-radius: 57px;

  text-align: center;
  white-space: normal;
  overflow-wrap: break-word;
  box-sizing: border-box;

  background: linear-gradient(135deg, #0000008c, #04060ced);
  border: 1px solid rgba(255, 255, 255, .35);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);

  color: #fff;
  text-shadow: -1px 1px 3px #000000d4;
}

/* --- GRID PILL STYLE BASE (before tier overrides) --- */
.bc-card__tier-pill-grid {
  font-size: 26px;
  padding-left: 30px !important;
  padding-right: 30px !important;
  max-width: fit-content !important;
  color: #f9fafb;
}

/* --- ICON WRAPPER (right side) --- */
.bc-card__tier-icon-wrap {
  order: 2;
  flex: 0 0 auto;
  width: 65px;
  height: 65px;

  display: flex;
  align-items: center;
  justify-content: center;
}

.bc-card__tier-icon {
  max-width: 100%;
  max-height: 100%;
  display: block;
}


h3.bc-card__title {
  text-align: left;
  overflow-wrap: break-word;
  margin: 0 0 0.4rem;
  max-width: 100%;
  font-size: 15px;
}


a.bc-ladder-pill.bc-ladder-pill--next {
  white-space: nowrap;
  display: inline-flex;
  align-items: center;
  gap: 3px;
}

.bc-card__tier-pill--micro {
    border-radius: var(--bc-radius-pill);
    background: linear-gradient(135deg, rgb(22 22 22 / 71%), transparent 55%), radial-gradient(circle at 0 0, rgb(23 41 27 / 55%), #0c2516ad 45%), radial-gradient(circle at 100% 100%, #22c55e, transparent 45%);
    border: 2px solid rgba(174, 236, 255, 0.83) !important;
    box-shadow: 0 0 0 1px rgba(15, 23, 42, 0.45);
}

.bc-card__tier-pill--minor  { /* colour scheme here */ }

/* --- MAJOR TIER OVERRIDE --- */
.bc-card__tier-pill--major {
    border: 2px solid rgba(174, 236, 255, 0.83) !important;
    /* background: linear-gradient(135deg, rgb(125 68 193 / 44%), rgb(120 65 170 / 29%)) !important; */
    box-shadow: 0 0 0 1px #0f172ab3, 0 6px 14px #0f172acc !important;
}

.bc-card__tier-pill--mega   { /* colour scheme gold pink here */ }

.bc-card__tier-pill--ultra  { /* colour scheme here */ }

/* --- TIER ICON INTERMITTENT SHIMMER --- */
.bc-card__tier-icon-wrap {
  position: relative;
  overflow: visible;
}

/* Shimmer pseudo-element */
.bc-card__tier-icon-wrap::after {
  content: "";
  position: absolute;
  top: -10%;
  left: -10%;
  width: 120%;
  height: 120%;
  pointer-events: none;

  background: linear-gradient(
    120deg,
    rgba(255, 255, 255, 0) 0%,
    rgba(255, 255, 255, 0.45) 45%,
    rgba(255, 255, 255, 0) 80%
  );
  
  opacity: 0;
  transform: translateX(-120%) skewX(-18deg);
  
  animation: bc-tier-icon-shimmer 4.5s ease-in-out infinite;
}

/* Keyframes: intermittent random-ish sparkles */
@keyframes bc-tier-icon-shimmer {
  0%, 10% {
    opacity: 0;
    transform: translateX(-120%) skewX(-18deg);
  }
  
  12% {
    opacity: 0.8;
  }
  
  15% {
    opacity: 0.2;
    transform: translateX(120%) skewX(-18deg);
  }
  
  20%, 100% {
    opacity: 0;
    transform: translateX(-120%) skewX(-18deg);
  }
}

.bc-card__status-link {
  display: inline-flex;
  align-items: center;
  gap: 0.4rem;
  text-decoration: none;
  color: inherit;
}

.bc-status-led {
  width: 10px;
  height: 10px;
  border-radius: 999px;
  box-shadow: 0 0 0 2px rgba(0,0,0,0.3);
}

/* Live = green pulsing */
.bc-status-led--live {
  background: #22c55e;
  animation: bc-status-led-pulse-live 1.2s ease-in-out infinite;
}

/* Reserve = amber pulsing */
.bc-status-led--reserve {
  background: #fbbf24;
  animation: bc-status-led-pulse-reserve 1.5s ease-in-out infinite;
}

@keyframes bc-status-led-pulse-live {
  0%, 100% { opacity: 0.9; box-shadow: 0 0 0 0 rgba(34, 197, 94, 0.9); }
  50%      { opacity: 1;   box-shadow: 0 0 8px 4px rgba(34, 197, 94, 0.8); }
}

@keyframes bc-status-led-pulse-reserve {
  0%, 100% { opacity: 0.9; box-shadow: 0 0 0 0 rgba(251, 191, 36, 0.9); }
  50%      { opacity: 1;   box-shadow: 0 0 8px 4px rgba(251, 191, 36, 0.8); }
}
.bc-card__status-link {
  display: inline-flex;
  align-items: center;
  gap: 0.35rem;
  text-decoration: none;
  color: inherit;
}

.bc-status-led {
  width: 10px;
  height: 10px;
  border-radius: 999px;
  box-shadow: 0 0 0 2px rgba(0,0,0,0.35);
}

/* Live = green pulse */
.bc-status-led--live {
  background: #22c55e;
  animation: bc-status-led-pulse-live 1.2s ease-in-out infinite;
}

/* Reserve = amber pulse */
.bc-status-led--reserve {
  background: #fbbf24;
  animation: bc-status-led-pulse-reserve 1.5s ease-in-out infinite;
}

@keyframes bc-status-led-pulse-live {
  0%, 100% {
    opacity: 0.85;
    box-shadow: 0 0 0 0 rgba(34, 197, 94, 0.9);
  }
  50% {
    opacity: 1;
    box-shadow: 0 0 8px 4px rgba(34, 197, 94, 0.8);
  }
}

@keyframes bc-status-led-pulse-reserve {
  0%, 100% {
    opacity: 0.85;
    box-shadow: 0 0 0 0 rgba(251, 191, 36, 0.9);
  }
  50% {
    opacity: 1;
    box-shadow: 0 0 8px 4px rgba(251, 191, 36, 0.8);
  }
}
/* ---------------- STATUS CHIPS + LEDS ---------------- */

.bc-card__status-row {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin-bottom: 10px;
}

.bc-card__status-chip {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 3px 9px;
  border-radius: 999px;
  font-size: 11px;
  font-weight: 600;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  background: rgba(15,23,42,0.85);
  border: 1px solid rgba(148,163,184,0.65);
}

.bc-card__status-chip--live {
  background: rgba(22,163,74,0.24);
  border-color: rgba(34,197,94,0.9);
  color: #bbf7d0;
}

.bc-card__status-chip--reserve {
  background: rgba(245,158,11,0.2);
  border-color: rgba(245,158,11,0.9);
  color: #fed7aa;
}

.bc-card__status-chip--closed {
  background: rgba(55,65,81,0.85);
  border-color: rgba(156,163,175,0.9);
  color: #e5e7eb;
}

.bc-card__status-link {
  display: inline-flex;
  align-items: center;
  gap: 0.4rem;
  text-decoration: none;
  color: inherit;
}

.bc-status-led {
  width: 10px;
  height: 10px;
  border-radius: 999px;
  box-shadow: 0 0 0 2px rgba(0,0,0,0.4);
}

.bc-status-led--live {
  background: #22c55e;
  animation: bc-status-led-pulse-live 1.2s ease-in-out infinite;
}

.bc-status-led--reserve {
  background: #fbbf24;
  animation: bc-status-led-pulse-reserve 1.5s ease-in-out infinite;
}

@keyframes bc-status-led-pulse-live {
  0%, 100% { opacity: 0.3; box-shadow: 0 0 0 0 rgba(34,197,94,0.9); }
  50%      { opacity: 1;   box-shadow: 0 0 10px 5px rgba(34,197,94,0.9); }
}

@keyframes bc-status-led-pulse-reserve {
  0%, 100% { opacity: 0.3; box-shadow: 0 0 0 0 rgba(251,191,36,0.9); }
  50%      { opacity: 1;   box-shadow: 0 0 10px 5px rgba(251,191,36,0.9); }
}


/* ---------------- BOTTOM CTA ROW ---------------- */

.bc-card__cta-row {
  margin-top: 14px;
  display: flex;
  justify-content: center;
}

.bc-card__cta-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 0;
  width: 100%;
  max-width: 260px;
  padding: 10px 18px;
  border-radius: 999px;
  font-size: 14px;
  font-weight: 700;
  letter-spacing: 0.03em;
  text-transform: none;
  border: none;
  cursor: pointer;
  text-decoration: none;
  box-shadow: 0 8px 18px rgba(0,0,0,0.55);
}

.bc-card__cta-btn--primary {
  background: linear-gradient(135deg, #0f766e, #059669);
  color: #ecfdf5;
}

.bc-card__cta-btn--secondary {
  background: rgba(15,23,42,0.9);
  color: #e5e7eb;
  border: 1px solid rgba(148,163,184,0.7);
}

.bc-card__cta-btn--closed {
  opacity: 0.85;
}