/* Promotion popup (public site + admin preview). All classes are prefixed .promo- */
.promo-overlay{position:fixed;inset:0;background:rgba(20,20,20,.6);-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px);z-index:2000;display:none;align-items:center;justify-content:center;padding:16px;overflow-y:auto}
.promo-overlay.is-open{display:flex}
body.promo-open{overflow:hidden}
.promo-dialog{--promo-g:#8DC63F;--promo-gd:#6aa525;background:#fff;color:#333;border-radius:18px;overflow:hidden;position:relative;box-shadow:0 30px 80px rgba(0,0,0,.4);max-height:100%;overflow-y:auto;animation:promo-in .5s cubic-bezier(.2,.9,.3,1.2)}
@keyframes promo-in{from{opacity:0;transform:translateY(30px) scale(.94)}to{opacity:1;transform:none}}
@media (prefers-reduced-motion:reduce){.promo-dialog{animation:none}}
.promo-close{position:absolute;top:8px;right:8px;width:36px;height:36px;border-radius:50%;border:0;background:#dc3545;color:#fff;z-index:5;font-size:1.3rem;line-height:1;cursor:pointer}
.promo-close:focus-visible,.promo-btn:focus-visible,.promo-dismiss:focus-visible{outline:3px solid #212529;outline-offset:2px}
.promo-body{display:flex;flex-direction:column}
.promo-media{display:flex;background:#f1f3f5;min-height:200px}
.promo-product-img{width:100%;height:100%;object-fit:cover;display:block;max-height:260px}
.promo-img-ph{flex:1;display:flex;align-items:center;justify-content:center;color:#999;font-size:.9rem;min-height:200px}
.promo-text{padding:1.5rem}
.promo-badge{display:inline-block;background:#dc3545;color:#fff;font-weight:700;border-radius:6px;padding:.3rem .8rem;font-size:.8rem;letter-spacing:1px}
.promo-badge[hidden],.promo-message[hidden],.promo-btn[hidden]{display:none}
.promo-title{font-weight:800;margin:.75rem 0 .5rem;font-size:1.6rem;line-height:1.2}
.promo-product-name{font-weight:700;font-size:1.15rem;margin:0 0 .75rem}
.promo-product-name[hidden]{display:none}
.promo-message{margin-bottom:1rem}
.promo-price{background:var(--promo-g);color:#fff;border-radius:14px;padding:.7rem 1.4rem;display:inline-block;margin-bottom:.75rem}
.promo-old{display:block;font-size:.8rem;text-decoration:line-through;opacity:.85}
.promo-now{font-size:1.9rem;line-height:1.1}
.promo-fine{font-size:.72rem;margin-bottom:1rem}
.promo-actions{display:flex;flex-wrap:wrap;align-items:center;gap:.75rem}
.promo-btn{display:inline-block;background:var(--promo-g);color:#fff !important;font-weight:600;border-radius:50px;padding:.6rem 1.6rem;text-decoration:none}
.promo-btn:hover{background:var(--promo-gd);color:#fff !important}
.promo-dismiss{color:#6c757d !important;font-size:.9rem}
.promo-countdown{margin-bottom:1rem;font-size:.85rem;color:#6c757d}
.promo-countdown small{display:block}
.promo-countdown-value{font-size:1.5rem;color:#333}
/* Colours are scoped under .promo-dialog (0,2,0) so the unscoped dark-mode.css rules
   ([data-theme="dark"] h2 / p / a:not(...)) cannot recolour the popup; dialog stays white. */
.promo-dialog .promo-title{color:#333}
.promo-dialog .promo-product-name{color:var(--promo-gd)}
.promo-dialog .promo-message{color:#6c757d}
.promo-dialog .promo-fine{color:#888}
.promo-dialog .promo-countdown small{color:inherit !important}
/* A: split, text left / image right on wide screens */
.promo-layout-a{width:min(860px,100%)}
/* B: compact centred card, image on top */
.promo-layout-b{width:min(460px,100%);text-align:center}
.promo-layout-b .promo-actions{flex-direction:column;align-items:stretch}
.promo-layout-b .promo-btn{text-align:center}
.promo-layout-b .promo-price{background:none;color:var(--promo-gd);padding:0}
.promo-layout-b .promo-old{display:inline;color:#999;margin-right:.5rem}
/* C: dark with countdown */
.promo-layout-c{width:min(760px,100%);background:#212529;color:#fff}
.promo-dialog.promo-layout-c .promo-title,.promo-layout-c .promo-countdown-value{color:#fff}
.promo-dialog.promo-layout-c .promo-message,.promo-layout-c .promo-countdown,.promo-dialog.promo-layout-c .promo-fine{color:rgba(255,255,255,.7)}
.promo-dialog.promo-layout-c .promo-dismiss{color:rgba(255,255,255,.7) !important}
.promo-layout-c .promo-media{background:#2d2d2d}
@media (min-width:768px){
  .promo-layout-a .promo-body{flex-direction:row-reverse}
  .promo-layout-a .promo-media{flex:0 0 41.6%}
  .promo-layout-a .promo-product-img{max-height:none}
  .promo-layout-a .promo-text{flex:1;padding:2.5rem}
  .promo-layout-c .promo-body{flex-direction:row}
  .promo-layout-c .promo-media{flex:0 0 41.6%;min-height:320px}
  .promo-layout-c .promo-product-img{max-height:none}
  .promo-layout-c .promo-text{flex:1;padding:2.5rem;display:flex;flex-direction:column;justify-content:center;align-items:flex-start}
}
@media (max-width:767px){.promo-overlay{padding:40px 12px}.promo-title{font-size:1.35rem}}