/* Hide the default Woo dropdown for Format */
.single-product form.variations_form table.variations{
  display: none !important;
}

/* Bundle UI wrapper */
.rc-bundle{
  margin: 18px 0 14px;
}

.rc-bundle__title{
  font-weight: 600;
  margin-bottom: 10px;
}

/* Cards layout */
.rc-bundle__grid{
  display: grid;
  grid-template-columns: 1fr;
  gap: 12px;
}

@media (min-width: 768px){
  .rc-bundle__grid{
    grid-template-columns: 1fr;
  }
}

.rc-bundle__card{
  width: 100%;
  text-align: left;
  border: 2px solid rgba(0,0,0,0.12);
  background: #fff;
  border-radius: 10px;
  padding: 14px 14px;
  cursor: pointer;
  transition: transform 120ms ease, border-color 120ms ease, background 120ms ease;
}

.rc-bundle__card:hover{
  transform: translateY(-1px);
}

.rc-bundle__card.is-active{
  border-color: #7a3b3b;
  background: #fff3f3;
}

.rc-bundle__cardTop{
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  margin-bottom: 6px;
}

.rc-bundle__label{
  font-weight: 700;
  font-family: syne;
}

.rc-bundle__badge{
  font-size: 12px;
  padding: 4px 10px;
  border-radius: 999px;
  background: #7a3b3b;
  color: #fff;
  white-space: nowrap;
}

.rc-bundle__price{
  font-size: 15px;
}

.rc-bundle__price del{
  opacity: 0.6;
  margin-right: 8px;
}


/* ================================
   Bundle UI: Green theme (#657D5E)
   ================================ */

:root{
  --rc-green: #657D5E;
}

/* Typography: titles */
.rc-bundle__title{
  font-family: "Syne", sans-serif !important;
  font-weight: 800 !important;
  letter-spacing: .2px !important;
}

/* Optional: also apply Syne to option labels (if you want the same Shopify vibe) */
/*
.rc-bundle__label{
  font-family: "Syne", sans-serif !important;
  font-weight: 800 !important;
}
*/

/* Base card border (replace bordeaux) */
.rc-bundle__card{
  border-color: rgba(101, 125, 94, 0.35) !important;
}

/* Active card: green -> white gradient */
.rc-bundle__card.is-active{
  border-color: rgba(101, 125, 94, 1) !important;
  background: linear-gradient(178deg, rgb(101 125 94 / 40%), #ffffff) !important;
  box-shadow: 0 10px 24px rgba(101, 125, 94, 0.18) !important;
}

/* Badge (Plus apprécié / Livraison gratuite): same green */
.rc-bundle__badge{
  background: rgba(101, 125, 94, 1) !important;
  color: white !important;
  border-color: rgba(101, 125, 94, 0.22) !important;
  font-weight: 500 !important;
}

/* If you use the "Shopify reference" badge floating class */
.rc-bundle2__badge{
  background: var(--rc-green) !important;
  color: #fff !important;
}

/* If you use radio style in the Shopify reference CSS */
.rc-bundle2__radio{
  border-color: rgba(101, 125, 94, 0.40) !important;
}
.rc-bundle__card.is-active .rc-bundle2__radio{
  border-color: var(--rc-green) !important;
}
.rc-bundle__card.is-active .rc-bundle2__radio::after{
  background: var(--rc-green) !important;
}





/* Mini thumbnail inside each bundle card */
.rc-bundle__card{
  position: relative;
  padding-left: 78px; /* space for thumb */
}

.rc-bundle__thumb{
  position: absolute;
  left: 16px;
  top: 50%;
  transform: translateY(-50%);
  width: 48px;
  height: 48px;
  border-radius: 12px;
  overflow: hidden;
  background: #fff;
  border: 1px solid rgba(0,0,0,0.10);
  box-shadow: 0 10px 18px rgba(0,0,0,0.06);
  pointer-events: none;
}

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

@media (max-width: 768px){
  .rc-bundle__card{ padding-left: 70px; }
  .rc-bundle__thumb{
    left: 14px;
    width: 44px;
    height: 44px;
    border-radius: 10px;
  }
}