/* The Shopify gift in the header (includes/shopify-gift.php): a glass gift button with a soft green pulse, and the
   card it opens with Shopify's $1/month offer. Written for both themes; not run through the dark-mode generator,
   so the button rule uses two classes to beat its "button{background:transparent}". */
.dsgift{--gf-card:#fff;--gf-ink:#0a2540;--gf-text:#425466;--gf-muted:#697386;--gf-line:#e3e8ee;--gf-green:#5e8e3e;--gf-green-2:#95bf47;
  position:relative;display:inline-flex}
html[data-ds-theme="dark"] .dsgift{--gf-card:#0f1522;--gf-ink:#f1f4f9;--gf-text:#c3cad6;--gf-muted:#8b93a3;--gf-line:#1f2738;--gf-green:#95bf47;--gf-green-2:#b5d86a}
.dsgift .dsgift-btn{position:relative;display:inline-flex;align-items:center;gap:6px;height:38px;padding:0 12px 0 5px;border:1px solid var(--border,#e2e8f0);border-radius:12px;background:#fff;color:#0f172a;font:600 13px/1 Inter,system-ui,sans-serif;cursor:pointer;transition:border-color .15s,box-shadow .2s}
.dsgift .dsgift-btn:hover,.dsgift.is-open .dsgift-btn{border-color:rgba(94,142,62,.45);box-shadow:0 4px 14px -6px rgba(94,142,62,.45)}
.dsgift .dsgift-btn:focus-visible{outline:2px solid var(--gf-green);outline-offset:2px}
html[data-ds-theme="dark"] .dsgift .dsgift-btn{background:#11151e;border-color:#232a3a;color:#f1f4f9}
.dsgift-ico{width:28px;height:28px;transform-origin:50% 80%;animation:dsgiftWiggle 5s ease-in-out 2s infinite;filter:drop-shadow(0 3px 6px rgba(94,142,62,.35))}
.dsgift .dsgift-btn:hover .dsgift-ico{animation-duration:1.2s}
.dsgift-dot{position:absolute;left:25px;top:5px;width:8px;height:8px;border-radius:50%;background:#22c55e;border:2px solid #fff;animation:dsgiftPing 2.4s ease-out infinite}
html[data-ds-theme="dark"] .dsgift-dot{border-color:#11151e}
.dsgift-label{white-space:nowrap}
@keyframes dsgiftWiggle{0%,80%,100%{transform:none}84%{transform:rotate(-9deg) scale(1.06)}88%{transform:rotate(7deg) scale(1.06)}92%{transform:rotate(-4deg)}96%{transform:rotate(2deg)}}
@keyframes dsgiftPing{0%{box-shadow:0 0 0 0 rgba(34,197,94,.55)}80%,100%{box-shadow:0 0 0 7px rgba(34,197,94,0)}}

.dsgift-pop{position:absolute;right:0;top:calc(100% + 10px);z-index:90;width:320px;box-sizing:border-box;padding:20px 20px 20px;border-radius:16px;background:var(--gf-card);color:var(--gf-ink);text-align:center;font-family:Inter,system-ui,sans-serif;
  box-shadow:0 1px 2px rgba(10,37,64,.06),0 24px 60px -18px rgba(10,37,64,.35);animation:dsgiftIn .25s cubic-bezier(.22,1,.36,1)}
html[data-ds-theme="dark"] .dsgift-pop{box-shadow:0 0 0 1px rgba(255,255,255,.09),0 28px 70px -20px rgba(0,0,0,.85)}
.dsgift-pop[hidden]{display:none}
@keyframes dsgiftIn{from{opacity:0;transform:translateY(-6px) scale(.98)}}
.dsgift-art{position:relative;width:96px;height:96px;margin:0 auto 6px}
.dsgift-art::before{content:"";position:absolute;inset:8px;border-radius:50%;background:radial-gradient(circle,rgba(149,191,71,.35),transparent 70%)}
.dsgift-box{position:relative;width:96px;height:96px;animation:dsgiftFloat 3.6s ease-in-out infinite}
.dsgift-bag{position:absolute;right:-4px;bottom:2px;width:34px;height:34px;filter:drop-shadow(0 4px 8px rgba(10,37,64,.3))}
@keyframes dsgiftFloat{0%,100%{transform:translateY(0) rotate(-3deg)}50%{transform:translateY(-5px) rotate(2deg)}}
.dsgift-k{margin:0;font:600 11.5px/1 Inter,sans-serif;letter-spacing:.06em;text-transform:uppercase;color:var(--gf-green)}
.dsgift-title{margin:8px 0 6px!important;font:600 19px/1.25 Inter,sans-serif!important;letter-spacing:-.02em;color:var(--gf-ink)!important}
.dsgift-text{margin:0;font:400 13.5px/1.55 Inter,sans-serif;color:var(--gf-text)}
.dsgift-cta{display:flex;align-items:center;justify-content:center;gap:6px;height:42px;margin-top:16px;border-radius:10px;background:linear-gradient(135deg,#5e8e3e,#7fb24a);color:#fff!important;font:600 14px/1 Inter,sans-serif;text-decoration:none!important;box-shadow:inset 0 1px 0 rgba(255,255,255,.22),0 8px 18px -8px rgba(94,142,62,.8);transition:transform .15s,box-shadow .15s}
.dsgift-cta:hover{transform:translateY(-1px);box-shadow:inset 0 1px 0 rgba(255,255,255,.22),0 12px 24px -8px rgba(94,142,62,.9)}
.dsgift-cta:focus-visible{outline:2px solid var(--gf-green);outline-offset:3px}

@media(max-width:900px){.dsgift .dsgift-btn{padding:0 5px;gap:0}.dsgift-label{display:none}}
@media(max-width:640px){.dsgift-pop{position:fixed;left:8px;right:8px;width:auto}}
@media(prefers-reduced-motion:reduce){.dsgift-ico,.dsgift-dot,.dsgift-box,.dsgift-pop{animation:none}}
