/* VM Offer of the Month - centered layout (Elementor background handled by you) */
.vm-offer-month, .vm-offer-month *{ box-sizing:border-box !important; }
.vm-offer-month{ width:100% !important; background:transparent !important; padding:0 !important; }

/* Outer centers the whole block */
.vm-offer-month .vm-offer-inner{
  width:100% !important;
  display:flex !important;
  justify-content:center !important;
  align-items:stretch !important;
}

/* Centered layout: single block centered */
.vm-offer-month.vm-offer-layout-centered .vm-offer-right{
  width:100% !important;
  display:flex !important;
  justify-content:center !important;
  align-items:center !important;
  padding:60px 20px !important;
}

.vm-offer-month.vm-offer-layout-centered .vm-offer-right-inner{
  width:min(780px, 100%) !important;
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  gap:34px !important;
}

/* Optional split layout (if used) */
.vm-offer-month.vm-offer-layout-split .vm-offer-left{
  flex: 0 0 50% !important;
  min-height: 560px !important;
  background-size:cover !important;
  background-position:center !important;
  background-repeat:no-repeat !important;
}
.vm-offer-month.vm-offer-layout-split .vm-offer-right{
  flex: 0 0 50% !important;
  display:flex !important;
  justify-content:center !important;
  align-items:center !important;
  padding:60px 20px !important;
}
.vm-offer-month.vm-offer-layout-split .vm-offer-right-inner{
  width:min(560px, 100%) !important;
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  gap:34px !important;
}

/* Copy */
.vm-offer-month .vm-offer-copy{
  flex:1 1 auto !important;
  text-align:center !important;
  min-width:0 !important;
  display:flex !important;
  flex-direction:column !important;
  align-items:center !important; /* hard center */
}
.vm-offer-month.vm-offer-align-left .vm-offer-copy{ text-align:left !important; align-items:flex-start !important; }

.vm-offer-month .vm-offer-eyebrow{
  font-family:"Great Vibes",cursive !important;
  font-size:34px !important;
  color:#8b1f2b !important;
  line-height:1 !important;
  margin:0 0 10px !important;
}
.vm-offer-month .vm-offer-title{
  font-family:"Cinzel",serif !important;
  letter-spacing:3px !important;
  text-transform:uppercase !important;
  font-weight:600 !important;
  font-size:36px !important;
  margin:0 0 10px !important;
  color:#111 !important;
}
.vm-offer-month .vm-offer-ornament{
  height:2px !important;
  width:160px !important;
  background:#d9d9d9 !important;
  margin:10px auto 16px !important;
}
.vm-offer-month.vm-offer-align-left .vm-offer-ornament{ margin-left:0 !important; margin-right:auto !important; }
.vm-offer-month .vm-offer-text{
  font-family:"Lato",sans-serif !important;
  font-size:14px !important;
  line-height:1.7 !important;
  color:#666 !important;
  margin:0 0 18px !important;
  max-width:420px !important;
}

/* Countdown: ONE LINE on desktop */
.vm-offer-month .vm-offer-countdown{
  display:flex !important;
  flex-direction:row !important;
  flex-wrap:nowrap !important;
  gap:14px !important;
  justify-content:center !important;
  align-items:center !important;
  margin:18px 0 22px !important;
}
.vm-offer-month.vm-offer-align-left .vm-offer-countdown{ justify-content:flex-start !important; }

.vm-offer-month .vm-cd-box{
  width:86px !important;
  height:92px !important;
  border:1px solid #e6e6e6 !important;
  background:#fff !important;
  display:flex !important;
  flex-direction:column !important;
  justify-content:center !important;
  align-items:center !important;
  flex:0 0 auto !important;
}
.vm-offer-month .vm-cd-num{
  font-family:"Cinzel",serif !important;
  font-size:30px !important;
  color:#111 !important;
  line-height:1 !important;
}
.vm-offer-month .vm-cd-lbl{
  font-family:"Cinzel",serif !important;
  font-size:11px !important;
  letter-spacing:2px !important;
  color:#888 !important;
  margin-top:8px !important;
  text-transform:uppercase !important;
}

/* CTA */
.vm-offer-month .vm-offer-cta{
  background:transparent !important;
  display:inline-block !important;
  border:1px solid #111 !important;
  color:#111 !important;
  text-decoration:none !important;
  font-family:"Cinzel",serif !important;
  letter-spacing:2px !important;
  font-size:12px !important;
  padding:11px 22px !important;
  border-radius:999px !important;
  transition:all 250ms ease !important;
}
.vm-offer-month .vm-offer-cta:hover{ background:#111 !important; color:#fff !important; }

/* Preview card */
.vm-offer-month .vm-offer-preview{
  width:200px !important;
  background:#fff !important;
  border:1px solid #e6e6e6 !important;
  padding:1px 18px 10px !important;
  position:relative !important;
  flex:0 0 auto !important;
  border-radius:15px !important;
}

/* Put the price ON the bottle area (overlay on image), not on the card corner */
.vm-offer-month .vm-slider{
  position:relative !important;
  width:100% !important;
  height:260px !important;
  display:flex !important;
  overflow:hidden !important;
  align-items:center !important;
  justify-content:center !important;
}
.vm-offer-month .vm-offer-ribbon{
  position:absolute !important;
  top:10px !important;
  left:10px !important;
  z-index:5 !important;
  background:#8b1f2b !important;
  color:#fff !important;
  font-family:"Cinzel",serif !important;
  font-size:14px !important;
  padding:8px 12px !important;
  border-radius:8px !important;
  letter-spacing:1px !important;
  pointer-events:none !important;
}

.vm-offer-month .vm-slide{
  min-width:100% !important;
  opacity:0 !important;
  transform:translateX(10px) !important;
  transition:opacity 250ms ease, transform 250ms ease !important;
}
.vm-offer-month .vm-slide[data-active="1"]{ opacity:1 !important; transform:translateX(0) !important; }
.vm-offer-month .vm-slide img{
  max-width:100% !important;
  max-height:240px !important;
  width:auto !important;
  height:auto !important;
  display:block !important;
  margin:0 auto !important;
}
.vm-offer-month .vm-dots{
  display:flex !important;
  justify-content:center !important;
  gap:10px !important;
  padding:10px 0 0 !important;
}
.vm-offer-month .vm-dot{
  width:8px !important;
  height:8px !important;
  border-radius:999px !important;
  border:1px solid #caa !important;
  background:transparent !important;
  cursor:pointer !important;
  padding:0 !important;
}
.vm-offer-month .vm-dot[data-active="1"]{ background:#8b1f2b !important; border-color:#8b1f2b !important; }

/* Mobile */
@media (max-width: 980px){
  /* Mobile CTA: filled for contrast on busy backgrounds */
  .vm-offer-month .vm-offer-cta{
    background:#8b1f2b !important;
    color:#fff !important;
    border-color:#8b1f2b !important;
  }
  .vm-offer-month .vm-offer-cta:hover{
    background:#6f1620 !important;
    border-color:#6f1620 !important;
    color:#fff !important;
  }

  .vm-offer-month.vm-offer-layout-centered .vm-offer-right{ padding:40px 16px !important; }
  .vm-offer-month .vm-offer-right-inner{ flex-direction:column !important; width:min(560px, 100%) !important; }
  .vm-offer-month .vm-offer-copy{ text-align:center !important; align-items:center !important; }
  .vm-offer-month .vm-offer-ornament{ margin-left:auto !important; margin-right:auto !important; }

  /* ✅ Countdown: UNA riga + respiro sx/dx (e se non entra, scroll) */
  .vm-offer-month .vm-offer-countdown{
    flex-wrap:nowrap !important;
    justify-content:center !important;
    gap:10px !important;
    padding:0 12px !important;
    overflow-x:auto !important;
    -webkit-overflow-scrolling:touch;
  }
  .vm-offer-month .vm-offer-countdown > *{
    flex:0 0 auto !important;
    white-space:nowrap;
  }

  /* Preview */
  .vm-offer-month .vm-offer-preview{
    width:min(200px, 100%) !important;
    border-radius:15px !important;
  }
}

/* Extra-small phones: shrink countdown boxes to reduce need for scroll */
@media (max-width: 480px){
  .vm-offer-month .vm-cd-box{
    width:68px !important;
    height:78px !important;
  }
  .vm-offer-month .vm-cd-num{ font-size:24px !important; }
  .vm-offer-month .vm-cd-lbl{ font-size:10px !important; letter-spacing:1px !important; }
}