/* Site pop-ups (admin: Settings -> Site pop-ups). Shared by the public pages and the admin live preview. */
.spp{--spp-accent:#bb1b25;font-family:Arial,Helvetica,sans-serif;color:#171717;line-height:1.35;box-sizing:border-box}
.spp *{box-sizing:border-box}
.spp.spp-black{--spp-accent:#0b0b0b}
/* floating layouts */
.spp-corner,.spp-sheet{position:fixed;z-index:99990;transition:transform .6s ease,opacity .6s ease;opacity:0;pointer-events:none}
.spp-corner{bottom:16px;width:296px;max-width:calc(100vw - 24px);transform:translateY(30px)}
.spp-corner.spp-left{left:16px}.spp-corner.spp-right{right:16px}
.spp-sheet{left:0;right:0;bottom:0;transform:translateY(100%)}
.spp-corner.show,.spp-sheet.show{opacity:1;transform:none;pointer-events:auto}
.spp-card{background:#fff;border:1px solid #ddd;border-top:4px solid var(--spp-accent);border-radius:10px;box-shadow:0 12px 32px rgba(0,0,0,.18);max-height:80vh;overflow-y:auto;position:relative}
.spp-sheet .spp-card{border-radius:14px 14px 0 0;max-height:75vh}
@media(max-width:767px){
 .spp-corner{left:0!important;right:0!important;bottom:0;width:auto;max-width:none;transform:translateY(100%)}
 .spp-corner .spp-card{border-radius:14px 14px 0 0;max-height:75vh}
}
.spp-head{display:flex;justify-content:space-between;align-items:flex-start;gap:8px;padding:12px 12px 0}
.spp-head h4{font-size:15.5px;line-height:1.25;margin:0;color:#0b0b0b;font-weight:800}
.spp-x{flex:none;display:flex;align-items:center;justify-content:center;width:28px;height:28px;background:#f2f2f2;border:0;border-radius:50%;font-size:20px;line-height:1;color:#444;cursor:pointer;margin-top:-2px}
.spp-x:hover{background:#e8e8e8;color:#111}
.spp-img{display:block;width:calc(100% - 24px);margin:10px 12px 0;border-radius:6px;max-height:150px;object-fit:cover}
.spp-text{font-size:12.5px;margin:6px 12px 10px;color:#555}
.spp-count{display:block;font-weight:700;color:var(--spp-accent);margin:0 12px 8px;font-size:12px}
.spp-body{padding:0 12px 12px}
.spp-body input,.spp-body select{width:100%;height:34px;border:1px solid #ccc;border-radius:6px;padding:0 10px;font-size:13px;margin-bottom:7px;font-family:inherit;background:#fff;color:#171717}
.spp-err{display:none;background:#fdecea;color:#b91c1c;border-radius:6px;padding:7px 9px;margin-bottom:8px;font-size:12px}
.spp-actions{display:flex;gap:8px;flex-wrap:wrap}
.spp-btn,.spp-btn2{flex:1;min-width:0;border-radius:6px;padding:9px 8px;font-size:12.5px;font-weight:800;cursor:pointer;text-align:center;text-decoration:none;font-family:inherit;display:inline-block}
.spp-btn{border:0;background:var(--spp-accent);color:#fff}
.spp-btn2{border:1px solid var(--spp-accent);background:#fff;color:var(--spp-accent);font-weight:700}
.spp-btn:hover{color:#fff;opacity:.92}
.spp-legal{font-size:10px;color:#888;margin:8px 0 0}
.spp-thanks{padding:6px 12px 14px;text-align:center}
.spp-thanks h4{font-size:16px;margin:0 0 6px;color:#0b0b0b}.spp-thanks p{margin:0;font-size:13px;color:#555}
.spp-hp{position:absolute;left:-9999px;top:-9999px}
/* centre pop-up */
.spp-modal-wrap{position:fixed;inset:0;z-index:99995;background:rgba(0,0,0,.55);display:flex;align-items:center;justify-content:center;padding:16px;opacity:0;pointer-events:none;transition:opacity .4s}
.spp-modal-wrap.show{opacity:1;pointer-events:auto}
.spp-modal-wrap > .spp{width:min(420px,100%)}
.spp-modal-wrap .spp-card{width:100%}
/* top strip: part of the page, scrolls away, never floats over a button */
.spp-strip{position:relative;z-index:1000;background:#fff;border-bottom:3px solid var(--spp-accent);display:flex;align-items:center;justify-content:center;gap:12px;flex-wrap:wrap;padding:8px 40px 8px 14px;font-size:13px}
.spp.spp-black.spp-strip{background:#0b0b0b;color:#fff}
.spp-strip .spp-strong{font-weight:800}
.spp-strip .spp-sub{color:#555}.spp.spp-black.spp-strip .spp-sub{color:#ccc}
.spp-strip .spp-btn{flex:none;padding:6px 14px}
.spp-strip .spp-link{color:var(--spp-accent);font-weight:700;font-size:12.5px;text-decoration:underline}
.spp.spp-black.spp-strip .spp-link{color:#fff}
.spp-strip .spp-x{position:absolute;right:8px;top:50%;margin-top:-14px;background:transparent}
@media(max-width:767px){.spp-strip{justify-content:flex-start;padding:7px 38px 7px 10px;font-size:12px;gap:8px}.spp-strip .spp-sub{display:none}}
/* side tab */
.spp-tab{position:fixed;left:0;bottom:96px;z-index:99980;background:#0b0b0b;color:#fff;border:0;border-radius:0 8px 8px 0;padding:9px 12px;font-size:12px;font-weight:800;cursor:pointer;font-family:Arial,Helvetica,sans-serif;box-shadow:0 4px 12px rgba(0,0,0,.25)}
.spp-tab:hover{background:var(--spp-accent)}
/* inside the admin live preview frame */
.spp-frame{position:relative;overflow:hidden}
.spp-frame .spp-corner,.spp-frame .spp-sheet,.spp-frame .spp-tab,.spp-frame .spp-modal-wrap{position:absolute}
.spp-frame .spp-corner{width:46%;max-width:none;bottom:8px}
.spp-frame .spp-corner.spp-left{left:8px}.spp-frame .spp-corner.spp-right{right:8px}
.spp-frame .spp-card{max-height:none}
