/* =========================================================
   LaGreen Offer Builder — shared foundation
   Each style can override these rules independently.
   ========================================================= */
.lg-offer-style{display:grid;gap:12px;width:100%}
.lg-offer{position:relative;display:block;cursor:pointer}
.lg-offer input{position:absolute;opacity:0;pointer-events:none}
.lg-offer-inner{display:flex;flex-direction:column;gap:5px}
.lg-offer-price-row{display:flex;align-items:center;gap:9px;flex-wrap:wrap}
.lg-offer-old-price{opacity:.55}
.lg-offer-badge{align-self:flex-start}
.lg-offer-title{font-weight:700}
.lg-offer-description{font-size:.9em;opacity:.78}

/* Initial visual identities — intentionally different, not just different colors. */
.lg-offer-style-premium .lg-offer-inner{padding:18px;border:1px solid #d8d0c5;border-radius:14px;background:#f8f5ef}
.lg-offer-style-premium .lg-offer.selected .lg-offer-inner{box-shadow:0 0 0 2px #222}

.lg-offer-style-flash-sale .lg-offer-inner{padding:16px;border-radius:8px;border:2px dashed #222}
.lg-offer-style-flash-sale .lg-offer-badge{padding:4px 8px;border-radius:5px;font-size:.78em;font-weight:800}

.lg-offer-style-best-seller{grid-template-columns:repeat(3,minmax(0,1fr))}
.lg-offer-style-best-seller .lg-offer-inner{padding:16px;border:1px solid #ddd;border-radius:12px;text-align:center}
.lg-offer-style-best-seller .lg-offer-badge{margin:auto}

.lg-offer-style-buy-1-get-1 .lg-offer-inner{padding:18px;border-radius:18px;border:2px solid #222}
.lg-offer-style-buy-1-get-1 .lg-offer-title{font-size:1.15em}

.lg-offer-style-buy-more-save-more .lg-offer-inner{padding:15px 18px;border-bottom:1px solid #ddd}
.lg-offer-style-buy-more-save-more .lg-offer.selected .lg-offer-inner{border-left:5px solid #222}

.lg-offer-style-gift .lg-offer-inner{padding:17px;border-radius:14px;border:1px solid #ddd}
.lg-offer-style-gift .lg-offer-badge:before{content:"🎁 ";}

.lg-offer-style-korean-beauty .lg-offer-inner{padding:17px 18px;border-radius:22px;border:1px solid #e8e1dc}
.lg-offer-style-korean-beauty .lg-offer-title{font-weight:600;letter-spacing:.01em}

.lg-offer-style-luxury .lg-offer-inner{padding:22px;border:1px solid #bbb;border-radius:3px;text-align:center}
.lg-offer-style-luxury .lg-offer-price{font-size:1.25em}

.lg-offer-style-minimal .lg-offer-inner{padding:12px 2px;border-bottom:1px solid #ddd}
.lg-offer-style-minimal .lg-offer.selected .lg-offer-inner{border-bottom:2px solid #111}

.lg-offer-style-bold-discount .lg-offer-inner{padding:18px;border-radius:6px;border:3px solid #111}
.lg-offer-style-bold-discount .lg-offer-price{font-size:1.25em}
.lg-offer-style-bold-discount .lg-offer-badge{font-weight:900;text-transform:uppercase}

@media (max-width: 640px){
  .lg-offer-style-best-seller{grid-template-columns:1fr}
}


/* Keep Offer Builder visuals above the generic COD offer rules. */
.lg-cod-form-wrap .lg-offer-style .lg-offer-main{width:100%}
.lg-cod-form-wrap .lg-offer-style .lg-offer-inner{box-sizing:border-box;width:100%}
.lg-cod-form-wrap .lg-offer-style .lg-offer input{position:absolute;opacity:0;pointer-events:none}


/* =========================================================
   RELEASIT
   Independent visual style.
   ========================================================= */
.lg-offer-style-releasit{
    width:100%;
    padding:12px 10px 14px;
    box-sizing:border-box;
    border-radius:18px;
    background:linear-gradient(135deg,#effff3 0%,#f8fff8 52%,#f5f0e4 100%);
    box-shadow:0 2px 9px rgba(0,0,0,.28);
}

.lg-offer-style-releasit .lg-releasit-offer{
    position:relative;
    display:block;
    margin:0 0 10px;
    cursor:pointer;
}

.lg-offer-style-releasit .lg-releasit-offer:last-child{
    margin-bottom:0;
}

.lg-offer-style-releasit .lg-releasit-offer input{
    position:absolute;
    opacity:0;
    width:1px;
    height:1px;
    pointer-events:none;
}

.lg-offer-style-releasit .lg-releasit-card{
    position:relative;
    display:flex;
    align-items:center;
    min-height:78px;
    padding:12px 14px 12px 44px;
    border:3px solid transparent;
    border-radius:20px;
    background:linear-gradient(110deg,#f3fff5 0%,#fffaf0 100%);
    box-shadow:0 2px 7px rgba(0,0,0,.13);
    transition:.15s;
}

.lg-offer-style-releasit .lg-releasit-offer input:checked + .lg-releasit-card{
    border-color:#16749d;
}

.lg-offer-style-releasit .lg-releasit-radio{
    position:absolute;
    left:12px;
    top:50%;
    width:18px;
    height:18px;
    margin-top:-9px;
    border:2px solid #cfcfcf;
    border-radius:50%;
    background:#fff;
}

.lg-offer-style-releasit .lg-releasit-offer input:checked + .lg-releasit-card .lg-releasit-radio{
    border-color:#19b629;
}

.lg-offer-style-releasit .lg-releasit-offer input:checked + .lg-releasit-card .lg-releasit-radio:after{
    content:"";
    position:absolute;
    left:3px;
    top:3px;
    width:8px;
    height:8px;
    border-radius:50%;
    background:#19b629;
}

.lg-offer-style-releasit .lg-releasit-content{
    flex:1;
    min-width:0;
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    text-align:center;
    gap:4px;
}

.lg-offer-style-releasit .lg-releasit-title{
    color:#385276;
    font-size:16px;
    line-height:1.45;
    font-weight:700;
}

.lg-offer-style-releasit .lg-releasit-description{
    color:#385276;
    font-size:14px;
    line-height:1.35;
}

.lg-offer-style-releasit .lg-releasit-badge{
    display:inline-block;
    padding:5px 10px;
    border-radius:999px;
    background:linear-gradient(90deg,#15d84a,#d8f000);
    color:#fff;
    font-size:11px;
    font-weight:800;
}

.lg-offer-style-releasit .lg-releasit-price-wrap{
    min-width:112px;
    display:flex;
    flex-direction:column;
    align-items:flex-end;
    justify-content:center;
    text-align:right;
}

.lg-offer-style-releasit .lg-releasit-price{
    color:#13a72a;
    font-size:20px;
    font-weight:800;
    white-space:nowrap;
}

.lg-offer-style-releasit .lg-releasit-offer:nth-of-type(1) .lg-releasit-price{
    color:#f08a00;
}

.lg-offer-style-releasit .lg-releasit-offer:nth-of-type(3) .lg-releasit-price{
    color:#1676d2;
}

.lg-offer-style-releasit .lg-releasit-old-price{
    color:#777;
    font-size:12px;
    opacity:.7;
    white-space:nowrap;
}

.lg-offer-style-releasit .lg-releasit-offer:nth-of-type(3) .lg-releasit-badge{
    background:linear-gradient(90deg,#126ff1,#238cf0);
    color:#ffe600;
    font-size:13px;
    letter-spacing:1px;
}

@media (max-width:640px){
    .lg-offer-style-releasit .lg-releasit-card{
        min-height:76px;
        padding-left:42px;
        padding-right:10px;
        border-radius:19px;
    }

    .lg-offer-style-releasit .lg-releasit-title{
        font-size:15px;
    }

    .lg-offer-style-releasit .lg-releasit-price-wrap{
        min-width:92px;
    }

    .lg-offer-style-releasit .lg-releasit-price{
        font-size:18px;
    }
}


/* Releasit live-site compatibility:
   The COD plugin updates .lg-submit-price by reading .lg-offer-price.
   Releasit therefore uses both classes on the price element. */
.lg-offer-style-releasit .lg-releasit-price.lg-offer-price{
    display:block;
}


/* =========================================================
   RELEASIT — SINGLE VISUAL LAYER
   Prevent the generic offer-card CSS from creating a second
   card/background/border around the Releasit card.
   ========================================================= */

.lg-offer-style-releasit .lg-offer{
    display:block;
    position:relative;
    margin:0 0 10px;
    padding:0 !important;
    border:0 !important;
    border-radius:0 !important;
    background:transparent !important;
    box-shadow:none !important;
}

.lg-offer-style-releasit .lg-offer-main{
    position:relative;
    display:flex;
    align-items:center;
    min-height:78px;
    margin:0 !important;
    padding:12px 14px 12px 44px !important;
    border:3px solid transparent !important;
    border-radius:20px !important;
    background:linear-gradient(110deg,#f3fff5 0%,#fffaf0 100%) !important;
    box-shadow:0 2px 7px rgba(0,0,0,.13) !important;
}

.lg-offer-style-releasit .lg-offer input{
    position:absolute;
    opacity:0;
    pointer-events:none;
}

.lg-offer-style-releasit .lg-offer:has(input:checked) .lg-offer-main,
.lg-offer-style-releasit .lg-offer.selected .lg-offer-main{
    border-color:#16749d !important;
}

.lg-offer-style-releasit .lg-releasit-radio{
    position:absolute;
    left:12px;
    top:50%;
    width:18px;
    height:18px;
    margin-top:-9px;
    border:2px solid #cfcfcf;
    border-radius:50%;
    background:#fff;
}

.lg-offer-style-releasit .lg-offer:has(input:checked) .lg-releasit-radio,
.lg-offer-style-releasit .lg-offer.selected .lg-releasit-radio{
    border-color:#19b629;
}

.lg-offer-style-releasit .lg-offer:has(input:checked) .lg-releasit-radio:after,
.lg-offer-style-releasit .lg-offer.selected .lg-releasit-radio:after{
    content:"";
    position:absolute;
    left:3px;
    top:3px;
    width:8px;
    height:8px;
    border-radius:50%;
    background:#19b629;
}

.lg-offer-style-releasit .lg-releasit-content{
    flex:1;
    min-width:0;
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    text-align:center;
    gap:4px;
}

.lg-offer-style-releasit .lg-releasit-title{
    color:#385276 !important;
    font-size:16px !important;
    line-height:1.45 !important;
    font-weight:700 !important;
}

.lg-offer-style-releasit .lg-releasit-price-wrap{
    min-width:112px;
    display:flex;
    flex-direction:column;
    align-items:flex-end;
    justify-content:center;
    text-align:right;
}

.lg-offer-style-releasit .lg-releasit-price{
    font-size:20px !important;
    font-weight:800 !important;
    white-space:nowrap;
}

.lg-offer-style-releasit .lg-offer:nth-of-type(1) .lg-releasit-price{
    color:#f08a00 !important;
}

.lg-offer-style-releasit .lg-offer:nth-of-type(2) .lg-releasit-price{
    color:#13a72a !important;
}

.lg-offer-style-releasit .lg-offer:nth-of-type(3) .lg-releasit-price{
    color:#1676d2 !important;
}

.lg-offer-style-releasit .lg-releasit-badge{
    display:inline-block;
    padding:5px 10px;
    border-radius:999px;
    background:linear-gradient(90deg,#15d84a,#d8f000) !important;
    color:#fff !important;
    font-size:11px !important;
    font-weight:800 !important;
}

.lg-offer-style-releasit .lg-offers{
    margin:0 !important;
}


/* =========================================================
   GLOBAL OFFER PALETTES
   One palette controls the coordinated color tokens of every style.
   ========================================================= */
.lg-offer-style[data-offer-palette]{
  --lg-p-bg1:#effff3;--lg-p-bg2:#f8fff8;--lg-p-card1:#f3fff5;--lg-p-card2:#fffaf0;
  --lg-p-primary:#16a34a;--lg-p-secondary:#d9f99d;--lg-p-accent:#0f766e;--lg-p-border:#1683a8;
  --lg-p-price:#16a34a;--lg-p-badge1:#16a34a;--lg-p-badge2:#d9f99d;--lg-p-badge-text:#fff;
  --lg-p-button1:#16d94b;--lg-p-button2:#d9f000;--lg-p-text:#24415f;
}

/* Common palette hooks for the existing 10 styles. */
.lg-offer-style[data-offer-palette] .lg-offer-inner{
  background:linear-gradient(135deg,var(--lg-p-card1),var(--lg-p-card2)) !important;
  border-color:var(--lg-p-border) !important;
}
.lg-offer-style[data-offer-palette] .lg-offer-title,
.lg-offer-style[data-offer-palette] .lg-offer-description{color:var(--lg-p-text) !important}
.lg-offer-style[data-offer-palette] .lg-offer-price{color:var(--lg-offer-price-color, var(--lg-p-price)) !important}
.lg-offer-style[data-offer-palette] .lg-offer-badge{
  background:linear-gradient(90deg,var(--lg-p-badge1),var(--lg-p-badge2)) !important;
  color:var(--lg-p-badge-text) !important;
}
.lg-offer-style[data-offer-palette] .lg-offer.selected .lg-offer-inner{
  box-shadow:0 0 0 2px var(--lg-p-accent) !important;
}

/* Shared selected-state palette: no hard-coded blue/green from COD may leak through. */
.lg-offer-style[data-offer-palette] .lg-offer.selected{
  border-color:var(--lg-p-border) !important;
  background:transparent !important;
  box-shadow:none !important;
}
.lg-offer-style[data-offer-palette] .lg-offer input{
  accent-color:var(--lg-p-primary) !important;
}
.lg-offer-style[data-offer-palette] .lg-offer-main{
  --lg-offer-selected-color:var(--lg-p-border);
}

/* Badge placement rule for Arabic offers: LEFT and outside the text flow. */
html[dir="rtl"] .lg-offer-style[data-offer-palette] .lg-offer-inner{position:relative}
html[dir="rtl"] .lg-offer-style[data-offer-palette] .lg-offer-badge{
  position:absolute;
  left:10px;
  top:-12px;
  z-index:3;
  margin:0 !important;
  white-space:nowrap;
}

/* Palette also colors the main offer container without forcing one shape on styles. */
.lg-offer-style[data-offer-palette]{
  background:linear-gradient(135deg,var(--lg-p-bg1),var(--lg-p-bg2));
}

/* =========================================================
   EASYSALE
   Arabic RTL content; badge + radio are both on the LEFT.
   Badge sits outside the text area to save vertical/horizontal space.
   ========================================================= */
.lg-offer-style-easysale{
  direction:rtl;
  width:100%;
  box-sizing:border-box;
  padding:12px 0 4px;
  display:grid;
  gap:10px;
  border-radius:12px;
  background:linear-gradient(135deg,var(--lg-p-bg1),var(--lg-p-bg2));
}
.lg-offer-style-easysale .lg-easysale-offer{
  position:relative;
  display:block;
  margin:0;
  padding:0;
  cursor:pointer;
  direction:rtl;
}
.lg-offer-style-easysale .lg-easysale-offer input{
  position:absolute;
  width:1px;height:1px;opacity:0;pointer-events:none;
}
.lg-offer-style-easysale .lg-easysale-card{
  position:relative;
  min-height:68px;
  display:flex;
  flex-direction:row-reverse;
  align-items:center;
  gap:12px;
  padding:12px 16px 12px 52px !important;
  border:1px solid rgba(80,80,80,.25) !important;
  border-radius:9px !important;
  background:linear-gradient(135deg,var(--lg-p-card1),var(--lg-p-card2)) !important;
  box-shadow:0 2px 5px rgba(0,0,0,.08) !important;
  box-sizing:border-box;
}
.lg-offer-style-easysale .lg-easysale-offer input:checked + .lg-easysale-badge + .lg-easysale-radio + .lg-easysale-card,
.lg-offer-style-easysale .lg-easysale-offer.selected .lg-easysale-card{
  border:2px solid var(--lg-p-border) !important;
  box-shadow:0 2px 7px rgba(0,0,0,.12) !important;
}
.lg-offer-style-easysale .lg-easysale-radio{
  position:absolute;
  left:12px;
  top:50%;
  width:18px;height:18px;
  margin-top:-9px;
  border:2px solid #c9cdd1;
  border-radius:50%;
  background:#fff;
  z-index:4;
  box-sizing:border-box;
}
.lg-offer-style-easysale .lg-easysale-offer input:checked + .lg-easysale-badge + .lg-easysale-radio,
.lg-offer-style-easysale .lg-easysale-offer.selected .lg-easysale-radio{border-color:var(--lg-p-primary)}
.lg-offer-style-easysale .lg-easysale-offer input:checked + .lg-easysale-badge + .lg-easysale-radio:after,
.lg-offer-style-easysale .lg-easysale-offer.selected .lg-easysale-radio:after{
  content:"";position:absolute;left:3px;top:3px;width:8px;height:8px;border-radius:50%;background:var(--lg-p-primary)
}
.lg-offer-style-easysale .lg-easysale-content{
  flex:1;min-width:0;display:flex;flex-direction:column;align-items:flex-end;justify-content:center;text-align:right;gap:3px;direction:rtl
}
.lg-offer-style-easysale .lg-easysale-title{font-size:16px;line-height:1.35;font-weight:700;color:var(--lg-p-text);direction:rtl}
.lg-offer-style-easysale .lg-easysale-description{font-size:13px;line-height:1.3;color:var(--lg-p-text);opacity:.78}
.lg-offer-style-easysale .lg-easysale-price-wrap{min-width:92px;display:flex;flex-direction:column;align-items:flex-start;justify-content:center;text-align:left;direction:rtl}
.lg-offer-style-easysale .lg-easysale-price{font-size:20px;font-weight:900;color:var(--lg-p-price);white-space:nowrap}
.lg-offer-style-easysale .lg-easysale-old-price{font-size:12px;color:#777;opacity:.72;white-space:nowrap}
.lg-offer-style-easysale .lg-easysale-badge{
  position:absolute;left:40px;top:-10px;z-index:5;
  padding:5px 9px;border-radius:2px;
  background:linear-gradient(90deg,var(--lg-p-badge1),var(--lg-p-badge2));
  color:var(--lg-p-badge-text);font-size:12px;font-weight:900;line-height:1;white-space:nowrap;
}
@media(max-width:640px){
  .lg-offer-style-easysale .lg-easysale-card{min-height:66px;padding:11px 12px 11px 48px !important;gap:8px}
  .lg-offer-style-easysale .lg-easysale-title{font-size:15px}
  .lg-offer-style-easysale .lg-easysale-price-wrap{min-width:84px}
  .lg-offer-style-easysale .lg-easysale-price{font-size:18px}
  .lg-offer-style-easysale .lg-easysale-badge{left:38px}
}


/* Per-offer price color always wins over style defaults when selected in the COD editor. */
.lg-offer-style[data-offer-palette] .lg-offer-price{
  color:var(--lg-offer-price-color, var(--lg-p-price)) !important;
}


/* =========================================================
   PRICE COLOR OVERRIDE — FINAL
   Custom price color beats palette and style defaults.
   ========================================================= */
.lg-offer-style[data-offer-palette] .lg-offer.lg-offer .lg-offer-price{
    color:var(--lg-offer-price-color, var(--lg-p-price)) !important;
}
.lg-offer-style-easysale[data-offer-palette] .lg-offer.lg-offer .lg-easysale-price{
    color:var(--lg-offer-price-color, var(--lg-p-price)) !important;
}
.lg-offer-style-releasit[data-offer-palette] .lg-offer.lg-offer .lg-releasit-price{
    color:var(--lg-offer-price-color, var(--lg-p-price)) !important;
}


/* v1.4.13 — a custom price color also controls the matching badge. */
.lg-offer-style[data-offer-palette] .lg-offer .lg-offer-badge,
.lg-offer-style[data-offer-palette] .lg-offer .lg-easysale-badge,
.lg-offer-style[data-offer-palette] .lg-offer .lg-releasit-badge{
  background:var(--lg-offer-badge-color, var(--lg-p-badge1)) !important;
  color:#fff !important;
}

/* Quantity offers + lead fields are one real HTML form. */
.lg-cod-form .lg-offer-style{margin-top:0 !important}


/* v1.4.14 — custom per-offer price color is written directly on the price element.
   The inline !important value intentionally overrides palette/style defaults. */
.lg-offer-style .lg-offer-price[style],
.lg-offer-style .lg-easysale-price[style],
.lg-offer-style .lg-releasit-price[style]{
  color:inherit;
}


/* ============================================================
   v1.4.15 — RIBBON / TAG BADGES
   Arabic RTL: badge stays on the LEFT.
   The existing independent badge gradient is preserved.
   ============================================================ */

/* Generic badge: ribbon/tag instead of a plain rectangle. */
.lg-offer-style[data-offer-palette] .lg-offer-badge,
.lg-offer-style[data-offer-palette] .lg-easysale-badge,
.lg-offer-style[data-offer-palette] .lg-releasit-badge{
  position:absolute !important;
  left:40px !important;
  top:-11px !important;
  z-index:20 !important;

  min-height:26px;
  padding:6px 12px 6px 11px !important;
  box-sizing:border-box;

  border:0 !important;
  border-radius:2px 2px 2px 0 !important;

  /* Keep the custom two-color badge gradient. */
  background:linear-gradient(
    90deg,
    var(--lg-offer-badge-color-1, var(--lg-p-badge1)),
    var(--lg-offer-badge-color-2, var(--lg-p-badge2))
  ) !important;

  color:#fff !important;
  font-size:11px !important;
  font-weight:900 !important;
  line-height:1.15 !important;
  white-space:nowrap;

  box-shadow:0 2px 4px rgba(0,0,0,.12);
  overflow:visible !important;
}

/* Folded ribbon corner on the RIGHT side. */
.lg-offer-style[data-offer-palette] .lg-offer-badge::after,
.lg-offer-style[data-offer-palette] .lg-easysale-badge::after,
.lg-offer-style[data-offer-palette] .lg-releasit-badge::after{
  content:"";
  position:absolute;
  right:-9px;
  top:0;
  width:0;
  height:0;
  border-top:13px solid rgba(0,0,0,.22);
  border-right:9px solid transparent;
}

/* Small cut/fold underneath the LEFT edge. */
.lg-offer-style[data-offer-palette] .lg-offer-badge::before,
.lg-offer-style[data-offer-palette] .lg-easysale-badge::before,
.lg-offer-style[data-offer-palette] .lg-releasit-badge::before{
  content:"";
  position:absolute;
  left:0;
  bottom:-5px;
  width:0;
  height:0;
  border-top:5px solid rgba(0,0,0,.18);
  border-right:5px solid transparent;
}

/* EasySale / Releasit have their own badge positioning rules;
   these override them while keeping the badge on the LEFT. */
.lg-offer-style-easysale .lg-easysale-badge,
.lg-offer-style-releasit .lg-releasit-badge{
  left:40px !important;
  top:-11px !important;
}

/* Do not let the generic badge style create extra space in the offer. */
.lg-offer-style[data-offer-palette] .lg-offer-content,
.lg-offer-style[data-offer-palette] .lg-easysale-content,
.lg-offer-style[data-offer-palette] .lg-releasit-content{
  position:relative;
}

/* Mobile */
@media (max-width:640px){
  .lg-offer-style[data-offer-palette] .lg-offer-badge,
  .lg-offer-style[data-offer-palette] .lg-easysale-badge,
  .lg-offer-style[data-offer-palette] .lg-releasit-badge{
    left:38px !important;
    top:-10px !important;
    padding:5px 11px 5px 10px !important;
    font-size:10px !important;
  }
}


/* ============================================================
   v1.4.16 — ONE FRAME FOR THE WHOLE COD FORM
   The active Color Theme controls the entire frame.
   ============================================================ */
.lg-cod-form-wrap{
  --lg-form-frame-bg1:var(--lg-p-bg1,#f8fff8);
  --lg-form-frame-bg2:var(--lg-p-bg2,#fffaf0);
  --lg-form-frame-border:var(--lg-p-border,#d8e5df);
  --lg-form-frame-accent:var(--lg-p-accent,#16a34a);

  width:100%;
  box-sizing:border-box;
  padding:18px;
  margin-top:14px;

  direction:rtl;
  border:2px solid var(--lg-form-frame-border);
  border-radius:22px;

  background:linear-gradient(
    135deg,
    var(--lg-form-frame-bg1),
    var(--lg-form-frame-bg2)
  ) !important;

  box-shadow:
    0 8px 24px rgba(0,0,0,.16),
    0 2px 7px rgba(0,0,0,.08);

  overflow:visible;
}

/* The individual offer-style wrapper must NOT become a second frame. */
.lg-cod-form-wrap .lg-offer-style[data-offer-palette]{
  width:100%;
  box-sizing:border-box;
  padding:0 !important;
  margin:0 !important;

  background:transparent !important;
  border:0 !important;
  box-shadow:none !important;
  border-radius:0 !important;
}

/* Remove the old plugin offers container frame. */
.lg-cod-form-wrap .lg-offers{
  margin:0 !important;
  padding:0 !important;
  background:transparent !important;
  border:0 !important;
  box-shadow:none !important;
}

/* Keep the lead form inside the same outer frame. */
.lg-cod-form-wrap .lg-cod-form{
  margin-top:16px;
}

/* The frame palette also controls the main heading color. */
.lg-cod-form-wrap .lg-cod-form h3{
  color:var(--lg-p-text,#24415f);
}

/* Keep the checkout fields visually clean while the outer frame carries
   the shared palette identity. */
.lg-cod-form-wrap .lg-cod-field{
  background:rgba(255,255,255,.82);
}

/* The submit button follows the selected palette. */
.lg-cod-form-wrap .lg-cod-submit,
.lg-cod-form-wrap button[type="submit"]{
  background:linear-gradient(
    90deg,
    var(--lg-p-button1,#16d94b),
    var(--lg-p-button2,#d9f000)
  ) !important;
  border-color:transparent !important;
}

/* Mobile: slightly tighter single frame. */
@media (max-width:640px){
  .lg-cod-form-wrap{
    padding:12px;
    border-radius:18px;
    box-shadow:0 6px 18px rgba(0,0,0,.14);
  }
}


/* ============================================================
   v1.4.20 — OFFER ROW ONLY
   IMPORTANT: outer ONE-FORM frame is preserved from v1.4.16.
   Radio = far left | Price = left | Offer text = right.
   Badge remains on the left.
   ============================================================ */

.lg-offer-style-releasit .lg-offer-main,
.lg-offer-style-easysale .lg-offer-main{
    position:relative !important;
    display:flex !important;
    flex-direction:row !important;
    align-items:center !important;
    direction:ltr !important;
    width:100% !important;
    box-sizing:border-box !important;
}

/* Radio stays at the far left without affecting the outer frame. */
.lg-offer-style-releasit .lg-releasit-radio,
.lg-offer-style-easysale .lg-easysale-radio{
    position:absolute !important;
    left:12px !important;
    right:auto !important;
    top:50% !important;
    transform:translateY(-50%) !important;
}

/* Price column = LEFT. */
.lg-offer-style-releasit .lg-releasit-price-wrap,
.lg-offer-style-easysale .lg-easysale-price-wrap{
    order:1 !important;
    flex:0 0 auto !important;
    margin-left:34px !important;
    margin-right:12px !important;
    text-align:left !important;
    direction:rtl !important;
    white-space:nowrap !important;
}

/* Offer text column = RIGHT. */
.lg-offer-style-releasit .lg-releasit-content,
.lg-offer-style-easysale .lg-easysale-content{
    order:2 !important;
    flex:1 1 auto !important;
    min-width:0 !important;
    margin:0 !important;
    text-align:right !important;
    direction:rtl !important;
}

/* Text remains RTL. */
.lg-offer-style-releasit .lg-releasit-title,
.lg-offer-style-easysale .lg-easysale-title{
    text-align:right !important;
    direction:rtl !important;
}

/* Badge stays on the left and outside the text area. */
.lg-offer-style-releasit .lg-releasit-badge,
.lg-offer-style-easysale .lg-easysale-badge{
    left:28px !important;
    right:auto !important;
}

@media(max-width:640px){
    .lg-offer-style-releasit .lg-releasit-price-wrap,
    .lg-offer-style-easysale .lg-easysale-price-wrap{
        margin-left:32px !important;
        margin-right:8px !important;
    }
    .lg-offer-style-releasit .lg-releasit-radio,
    .lg-offer-style-easysale .lg-easysale-radio{
        left:10px !important;
    }
    .lg-offer-style-releasit .lg-releasit-badge,
    .lg-offer-style-easysale .lg-easysale-badge{
        left:24px !important;
    }
}


/* ============================================================
   v1.4.33 — MOBILE FINAL OFFER ALIGNMENT
   Radio = far left | PRICE = far left | text = far right
   Keep the one-form frame untouched.
   ============================================================ */
@media (max-width:767px){

  .lg-offer-style-easysale .lg-easysale-offer,
  .lg-offer-style-releasit .lg-releasit-offer{
    position:relative !important;
  }

  .lg-offer-style-easysale .lg-easysale-card,
  .lg-offer-style-releasit .lg-releasit-card,
  .lg-offer-style-easysale .lg-offer-main,
  .lg-offer-style-releasit .lg-offer-main{
    position:relative !important;
    display:block !important;
    width:100% !important;
    min-height:70px !important;
    direction:rtl !important;
    box-sizing:border-box !important;
  }

  /* Radio: absolutely fixed to the far left. */
  .lg-offer-style-easysale .lg-easysale-radio,
  .lg-offer-style-releasit .lg-releasit-radio{
    position:absolute !important;
    left:10px !important;
    right:auto !important;
    top:50% !important;
    transform:translateY(-50%) !important;
    z-index:20 !important;
  }

  /* Price: fixed left column, just right of the radio. */
  .lg-offer-style-easysale .lg-easysale-price-wrap,
  .lg-offer-style-releasit .lg-releasit-price-wrap{
    position:absolute !important;
    left:36px !important;
    right:auto !important;
    top:50% !important;
    transform:translateY(-50%) !important;
    width:82px !important;
    min-width:82px !important;
    margin:0 !important;
    padding:0 !important;
    display:flex !important;
    align-items:flex-start !important;
    justify-content:center !important;
    text-align:left !important;
    direction:rtl !important;
    z-index:18 !important;
  }

  .lg-offer-style-easysale .lg-easysale-price,
  .lg-offer-style-releasit .lg-releasit-price{
    display:block !important;
    width:100% !important;
    margin:0 !important;
    text-align:left !important;
    white-space:nowrap !important;
  }

  /* Text: occupy the right side and never overlap the left price zone. */
  .lg-offer-style-easysale .lg-easysale-content,
  .lg-offer-style-releasit .lg-releasit-content{
    display:flex !important;
    width:100% !important;
    min-width:0 !important;
    margin:0 !important;
    padding:0 10px 0 132px !important;
    box-sizing:border-box !important;
    align-items:flex-end !important;
    justify-content:center !important;
    text-align:right !important;
    direction:rtl !important;
  }

  .lg-offer-style-easysale .lg-easysale-title,
  .lg-offer-style-releasit .lg-releasit-title{
    width:100% !important;
    text-align:right !important;
    direction:rtl !important;
    margin:0 !important;
  }
}




/* ============================================================
   v1.4.49 — FINAL MOBILE EASYSALE / RELEASIT GEOMETRY
   Goal: no vertical overlap. Same top/bottom inset for every
   card. Text stays in normal flow; left price/radio zones are
   protected without forcing the text into the price.
   ============================================================ */

@media (max-width:767px){

  .lg-offer-style-easysale .lg-easysale-card,
  .lg-offer-style-releasit .lg-releasit-card{
    position:relative !important;
    display:flex !important;
    flex-direction:row !important;
    align-items:center !important;
    width:100% !important;
    min-height:66px !important;
    height:auto !important;
    box-sizing:border-box !important;
    padding:11px 5px 11px 5px !important;
    overflow:visible !important;
    direction:rtl !important;
  }

  /*
   * Text owns the full card area but reserves only a compact
   * left zone for price + radio. No absolute positioning.
   */
  .lg-offer-style-easysale .lg-easysale-content,
  .lg-offer-style-releasit .lg-releasit-content{
    position:static !important;
    order:1 !important;
    flex:1 1 auto !important;
    width:auto !important;
    min-width:0 !important;
    max-width:none !important;
    height:auto !important;
    margin:0 !important;
    padding:0 !important;

    display:flex !important;
    flex-direction:column !important;
    align-items:flex-end !important;
    justify-content:center !important;

    text-align:right !important;
    direction:rtl !important;
    box-sizing:border-box !important;
  }

  .lg-offer-style-easysale .lg-easysale-title,
  .lg-offer-style-releasit .lg-releasit-title{
    display:block !important;
    width:100% !important;
    max-width:none !important;
    margin:0 !important;
    padding:0 !important;
    text-align:right !important;
    direction:rtl !important;
    font-size:16px !important;
    line-height:1.35 !important;
    overflow-wrap:normal !important;
    word-break:normal !important;
  }

  /*
   * Leave a small protected zone at the LEFT so text never
   * reaches the price. The gap is much smaller than before.
   */
  .lg-offer-style-easysale .lg-easysale-content,
  .lg-offer-style-releasit .lg-releasit-content{
    margin-left:82px !important;
  }

  /* Price: fixed in the left zone and slightly lower. */
  .lg-offer-style-easysale .lg-easysale-price-wrap,
  .lg-offer-style-releasit .lg-releasit-price-wrap{
    position:absolute !important;
    left:28px !important;
    right:auto !important;
    top:58% !important;
    transform:translateY(-50%) !important;
    width:auto !important;
    min-width:0 !important;
    max-width:70px !important;
    margin:0 !important;
    padding:0 !important;
    display:flex !important;
    align-items:center !important;
    justify-content:flex-start !important;
    text-align:left !important;
    direction:rtl !important;
    white-space:nowrap !important;
    z-index:5 !important;
  }

  .lg-offer-style-easysale .lg-easysale-price,
  .lg-offer-style-releasit .lg-releasit-price{
    margin:0 !important;
    padding:0 !important;
    white-space:nowrap !important;
  }

  /* Radio: fixed at far-left. */
  .lg-offer-style-easysale .lg-easysale-radio,
  .lg-offer-style-releasit .lg-releasit-radio{
    position:absolute !important;
    left:7px !important;
    right:auto !important;
    top:50% !important;
    transform:translateY(-50%) !important;
    z-index:6 !important;
  }

  /* Badge remains outside the text flow. */
  .lg-offer-style-easysale .lg-easysale-badge,
  .lg-offer-style-releasit .lg-releasit-badge{
    left:38px !important;
    right:auto !important;
  }

  /*
   * For very narrow phones, reduce only the protected left zone
   * slightly; font size and card padding remain unchanged.
   */
  @media(max-width:420px){
    .lg-offer-style-easysale .lg-easysale-content,
    .lg-offer-style-releasit .lg-releasit-content{
      margin-left:76px !important;
    }

    .lg-offer-style-easysale .lg-easysale-price-wrap,
    .lg-offer-style-releasit .lg-releasit-price-wrap{
      left:27px !important;
    }
  }
}

/* ============================================================
   v1.4.50 — FINAL SMALL POSITION TUNING
   ONLY:
   1) Increase the right-side inset of offer text slightly.
   2) Move offer price slightly lower.
   Everything else remains unchanged.
   ============================================================ */
@media (max-width:767px){

  /* More breathing room between the offer text and right edge. */
  .lg-offer-style-easysale .lg-easysale-content,
  .lg-offer-style-releasit .lg-releasit-content{
    margin-right:5px !important;
  }

  /* Price lower than center, without changing its left position. */
  .lg-offer-style-easysale .lg-easysale-price-wrap,
  .lg-offer-style-releasit .lg-releasit-price-wrap{
    top:62% !important;
  }
}

/* ============================================================
   v1.4.51 — PRICE LOWER + PROTECTED GAP
   Mobile only.
   - Move price further down.
   - Protect a clear horizontal gap between offer text and price.
   - Keep right-side text inset unchanged.
   - Do not change text size.
   ============================================================ */
@media (max-width:767px){

  /* Keep the right-side spacing already established. */
  .lg-offer-style-easysale .lg-easysale-content,
  .lg-offer-style-releasit .lg-releasit-content{
    margin-right:5px !important;

    /* Protected left zone for price + visual breathing room. */
    margin-left:90px !important;

    /* Never let text intrude into the price zone. */
    padding-left:0 !important;
    padding-right:0 !important;
  }

  /* Put the price clearly below the visual middle. */
  .lg-offer-style-easysale .lg-easysale-price-wrap,
  .lg-offer-style-releasit .lg-releasit-price-wrap{
    top:66% !important;
  }

  @media(max-width:420px){
    .lg-offer-style-easysale .lg-easysale-content,
    .lg-offer-style-releasit .lg-releasit-content{
      margin-left:84px !important;
      margin-right:5px !important;
    }

    .lg-offer-style-easysale .lg-easysale-price-wrap,
    .lg-offer-style-releasit .lg-releasit-price-wrap{
      top:66% !important;
    }
  }
}

/* ============================================================
   v1.4.52 — COMPACT BADGE
   Mobile only:
   - Reduce badge height/padding.
   - Move badge slightly to the left.
   - Do not change text, price, radio, fields, or frame.
   ============================================================ */
@media (max-width:767px){
  .lg-offer-style-easysale .lg-easysale-badge,
  .lg-offer-style-releasit .lg-releasit-badge{
    left:32px !important;
    top:-7px !important;
    padding:3px 8px !important;
    min-height:0 !important;
    line-height:1.1 !important;
    font-size:11px !important;
    border-radius:6px !important;
  }

  @media(max-width:420px){
    .lg-offer-style-easysale .lg-easysale-badge,
    .lg-offer-style-releasit .lg-releasit-badge{
      left:30px !important;
      padding:3px 7px !important;
    }
  }
}

/* ============================================================
   v1.4.53 — SMALL BADGE + TIGHTER TOP GAP
   Mobile only:
   1) Move badges a little further left.
   2) Reduce the empty space between the form frame and the
      first offer card.
   Nothing else is changed.
   ============================================================ */
@media (max-width:767px){

  /* Badge: a little further left. */
  .lg-offer-style-easysale .lg-easysale-badge,
  .lg-offer-style-releasit .lg-releasit-badge{
    left:23px !important;
  }

  /* Reduce only the top empty space before the first offer. */
  .lg-cod-form .lg-offers,
  .lg-offers{
    padding-top:0 !important;
    margin-top:0 !important;
  }

  .lg-offer-style-easysale,
  .lg-offer-style-releasit{
    padding-top:0 !important;
    margin-top:0 !important;
  }

  .lg-offer-style-easysale .lg-offer:first-child,
  .lg-offer-style-releasit .lg-offer:first-child{
    margin-top:0 !important;
  }
}


/* ============================================================
   v1.4.54 — REMOVE THE REAL TOP GAP ABOVE FIRST OFFER
   Mobile only.
   Targets the wrapper/first-offer vertical gap, not card
   padding, text, price, fields, or frame.
   ============================================================ */
@media (max-width:767px){

  .lg-offer-style-easysale,
  .lg-offer-style-releasit{
    margin-top:0 !important;
    padding-top:0 !important;
  }

  .lg-offer-style-easysale > .lg-offer:first-child,
  .lg-offer-style-releasit > .lg-offer:first-child{
    margin-top:0 !important;
  }

  .lg-offer-style-easysale > .lg-offer:first-child .lg-offer-main,
  .lg-offer-style-releasit > .lg-offer:first-child .lg-offer-main{
    margin-top:0 !important;
  }

  /* The offers wrapper itself should start immediately. */
  .lg-offer-style-easysale + *,
  .lg-offer-style-releasit + *{
    margin-top:0;
  }
}

/* ============================================================
   v1.4.55 — REAL TOP GAP FIX
   The visible gap was coming from TWO places:
   1) the COD frame's top padding
   2) EasySale/Releasit style wrapper top padding
   Collapse both on mobile. Nothing else is changed.
   ============================================================ */
@media (max-width:767px){

  /* Directly controls the empty space inside the blue COD frame. */
  .lg-cod-form-wrap{
    padding-top:4px !important;
  }

  /* Directly controls the space before the first offer card. */
  .lg-offer-style-easysale,
  .lg-offer-style-releasit{
    padding-top:0 !important;
    margin-top:0 !important;
  }

  .lg-offer-style-easysale > .lg-offer:first-child,
  .lg-offer-style-releasit > .lg-offer:first-child{
    margin-top:0 !important;
  }
}

/* ============================================================
   v1.4.56 — MOVE BADGES LEFT
   Mobile only. Badge position only.
   ============================================================ */
@media (max-width:767px){
  .lg-offer-style-easysale .lg-easysale-badge,
  .lg-offer-style-releasit .lg-releasit-badge{
    left:10px !important;
    right:auto !important;
  }

  @media(max-width:420px){
    .lg-offer-style-easysale .lg-easysale-badge,
    .lg-offer-style-releasit .lg-releasit-badge{
      left:9px !important;
    }
  }
}

/* v1.4.57 — badge left position */
.lg-offer-style[data-offer-palette] .lg-offer-badge,
.lg-offer-style[data-offer-palette] .lg-easysale-badge,
.lg-offer-style[data-offer-palette] .lg-releasit-badge{
    left:32px !important;
}


/* ============================================================
   v1.5.14 — MOBILE EASYSALE: BALANCED CARD SPACING
   Only changes EasySale mobile layout.
   ============================================================ */
@media (max-width:767px){
  .lg-offer-style-easysale .lg-easysale-card{
    display:flex !important;
    flex-direction:column !important;
    align-items:stretch !important;
    height:auto !important;
    box-sizing:border-box !important;
    padding:16px 12px 0 42px !important;
    gap:0 !important;
  }

  .lg-offer-style-easysale .lg-easysale-content{
    order:1 !important;
    width:100% !important;
    min-width:0 !important;
    margin:0 !important;
    padding:0 !important;
    display:block !important;
    text-align:right !important;
    box-sizing:border-box !important;
  }

  .lg-offer-style-easysale .lg-easysale-title{
    display:block !important;
    width:100% !important;
    margin:0 !important;
    padding:0 !important;
    text-align:right !important;
    direction:rtl !important;
  }

  .lg-offer-style-easysale .lg-easysale-price-wrap{
    order:2 !important;
    position:static !important;
    inset:auto !important;
    align-self:stretch !important;
    width:100% !important;
    min-width:0 !important;
    margin:18px 0 0 0 !important;
    padding:0 !important;
    display:block !important;
    text-align:right !important;
    direction:rtl !important;
    white-space:nowrap !important;
  }

  .lg-offer-style-easysale .lg-easysale-price{
    display:block !important;
    width:100% !important;
    margin:0 !important;
    padding:0 !important;
    text-align:right !important;
  }
}