/* CB Coupon Celebration — popup + sticky banner */
.cbcc{--cbcc-primary:#e91e63;--cbcc-accent:#ffb300;--cbcc-h:0px;font-family:inherit}
.cbcc *,.cbcc *::before,.cbcc *::after{box-sizing:border-box}

/* ---------- overlay ---------- */
.cbcc .cbcc-overlay{position:fixed;inset:0;z-index:999990;background:rgba(20,10,20,.55);backdrop-filter:blur(2px);opacity:0;visibility:hidden;transition:opacity .35s,visibility .35s}
.cbcc.cbcc-popup-open .cbcc-overlay{opacity:1;visibility:visible}

/* ---------- popup ---------- */
.cbcc .cbcc-popup{position:fixed;z-index:999992;left:50%;top:50%;width:min(440px,calc(100vw - 32px));max-height:calc(100vh - 32px);overflow:auto;
	transform:translate(-50%,-46%) scale(.82);opacity:0;visibility:hidden;outline:none;
	background:#fff;border-radius:22px;padding:34px 26px 22px;text-align:center;color:#2a1b24;
	box-shadow:0 30px 80px rgba(0,0,0,.35);
	transition:transform .5s cubic-bezier(.2,1.3,.4,1),opacity .35s,visibility .35s}
.cbcc .cbcc-popup::before{content:"";position:absolute;left:0;right:0;top:0;height:8px;border-radius:22px 22px 0 0;background:linear-gradient(90deg,var(--cbcc-primary),var(--cbcc-accent),var(--cbcc-primary))}
.cbcc.cbcc-popup-open .cbcc-popup{transform:translate(-50%,-50%) scale(1);opacity:1;visibility:visible}
.cbcc.cbcc-popup-open .cbcc-popup.cbcc-fly{transform:translate(-50%,-50%) translateY(-60vh) scale(.12);opacity:0;transition:transform .55s cubic-bezier(.6,0,.9,.4),opacity .5s}

.cbcc .cbcc-x{position:absolute;right:10px;top:12px;width:34px;height:34px;padding:0;border:0;border-radius:50%;background:#f3eef1;color:#6b5a64;font-size:22px;line-height:34px;cursor:pointer}
.cbcc .cbcc-x:hover{background:#eadfe5}
.cbcc .cbcc-emoji{font-size:58px;line-height:1;margin-bottom:6px;animation:cbcc-bounce 1.2s ease-in-out infinite}
.cbcc .cbcc-title{margin:6px 0 8px;font-size:26px;line-height:1.2;font-weight:800;color:var(--cbcc-primary)}
.cbcc .cbcc-sub{margin:0 0 18px;font-size:16px;line-height:1.5;color:#4a3a44}

/* ---------- code chip (popup + banner) ---------- */
.cbcc button.cbcc-code{display:flex;flex-direction:column;align-items:center;gap:2px;width:100%;margin:0 0 14px;padding:12px 14px;cursor:pointer;
	background:#fff7e0;border:2px dashed var(--cbcc-accent);border-radius:14px;color:#2a1b24;box-shadow:none;text-transform:none}
.cbcc .cbcc-code .cbcc-code-text{font-size:28px;font-weight:800;letter-spacing:3px;font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace}
.cbcc .cbcc-code .cbcc-code-hint{font-size:12px;color:#8a6d00;letter-spacing:.3px}
.cbcc button.cbcc-code:hover{background:#fff1c4}
.cbcc button.cbcc-code.cbcc-copied{background:#e6f7ea;border-color:#43a047}
.cbcc .cbcc-code.cbcc-copied .cbcc-code-hint{color:#2e7d32;font-weight:700}

.cbcc .cbcc-timer-wrap{display:inline-block;margin-bottom:16px;padding:6px 14px;border-radius:999px;background:#fdeaf0;color:var(--cbcc-primary);font-size:14px;font-weight:600}
.cbcc .cbcc-timer{font-variant-numeric:tabular-nums;font-size:16px}

.cbcc button.cbcc-claim{display:block;width:100%;padding:15px 18px;border:0;border-radius:999px;cursor:pointer;
	background:linear-gradient(135deg,var(--cbcc-primary),#ff5c8a);color:#fff;font-size:17px;font-weight:700;letter-spacing:.3px;text-transform:none;
	box-shadow:0 10px 24px rgba(233,30,99,.35);transition:transform .15s,box-shadow .15s}
.cbcc button.cbcc-claim:hover{transform:translateY(-2px);box-shadow:0 14px 28px rgba(233,30,99,.42)}
.cbcc .cbcc-fine{display:block;margin-top:12px;color:#8b7a84;font-size:12px}

/* ---------- sticky banner ---------- */
.cbcc .cbcc-banner{position:fixed;left:0;right:0;top:0;z-index:999980;display:none;align-items:center;justify-content:center;flex-wrap:wrap;gap:8px 14px;
	padding:9px 46px 9px 16px;text-align:center;color:#fff;font-size:15px;font-weight:600;
	background:linear-gradient(90deg,var(--cbcc-primary),#ff5c8a,var(--cbcc-primary));background-size:200% 100%;animation:cbcc-shine 6s linear infinite;
	box-shadow:0 3px 14px rgba(0,0,0,.2)}
body.admin-bar .cbcc .cbcc-banner{top:32px}
@media (max-width:782px){body.admin-bar .cbcc .cbcc-banner{top:46px}}
.cbcc .cbcc-banner.cbcc-on{display:flex}
.cbcc .cbcc-banner.cbcc-drop{animation:cbcc-drop .55s cubic-bezier(.2,1,.3,1),cbcc-shine 6s linear infinite}
body.cbcc-has-banner{padding-top:var(--cbcc-h)}

.cbcc button.cbcc-b-code{display:inline-flex;align-items:center;gap:8px;margin:0;padding:5px 12px;cursor:pointer;
	background:rgba(255,255,255,.96);border:2px dashed var(--cbcc-accent);border-radius:8px;color:#2a1b24;box-shadow:none;text-transform:none;line-height:1.2}
.cbcc .cbcc-b-code .cbcc-code-text{font-size:16px;letter-spacing:2px}
.cbcc .cbcc-b-code .cbcc-code-hint{font-size:11px;font-weight:600;color:#8a6d00;padding-left:8px;border-left:1px solid #e0c36a}
.cbcc .cbcc-b-timer{padding:3px 10px;border-radius:999px;background:rgba(0,0,0,.2);font-size:14px}
.cbcc .cbcc-b-timer .cbcc-timer{font-size:14px}
.cbcc button.cbcc-b-x{position:absolute;right:8px;top:50%;transform:translateY(-50%);width:30px;height:30px;padding:0;border:0;border-radius:50%;background:rgba(255,255,255,.2);color:#fff;font-size:20px;line-height:30px;cursor:pointer}
.cbcc button.cbcc-b-x:hover{background:rgba(255,255,255,.35)}

/* ---------- toast + confetti ---------- */
.cbcc .cbcc-toast{position:fixed;left:50%;bottom:28px;z-index:999995;transform:translate(-50%,20px);opacity:0;pointer-events:none;padding:10px 18px;border-radius:999px;background:#2a1b24;color:#fff;font-size:14px;font-weight:600;transition:opacity .25s,transform .25s}
.cbcc .cbcc-toast.cbcc-show{opacity:1;transform:translate(-50%,0)}
.cbcc-confetti{position:fixed;inset:0;width:100vw;height:100vh;z-index:999991;pointer-events:none}

@keyframes cbcc-bounce{0%,100%{transform:translateY(0) rotate(-6deg)}50%{transform:translateY(-8px) rotate(6deg)}}
@keyframes cbcc-shine{to{background-position:200% 0}}
@keyframes cbcc-drop{from{transform:translateY(-100%)}to{transform:translateY(0)}}

@media (max-width:520px){
	.cbcc .cbcc-title{font-size:22px}
	.cbcc .cbcc-code .cbcc-code-text{font-size:24px}
	.cbcc .cbcc-banner{font-size:13px;padding:8px 40px 8px 10px}
}
@media (prefers-reduced-motion:reduce){
	.cbcc *{animation:none!important;transition:none!important}
}
