/* Shiny Nails gift cards – card, /gift-cards page, /gift page. Loaded only on those pages (giftcard_head()). */

/* ---------- the card (CSS 3D, black + champagne-gold foil) ---------- */
.gc-stage{--rx:0deg;--ry:0deg;--mx:50%;--my:30%;--lift:0;position:relative;width:min(460px,100%);aspect-ratio:1.586/1;perspective:1300px;margin-inline:auto;-webkit-tap-highlight-color:transparent}
.gc-stage.gc-md{width:min(380px,100%)}
.gc-stage.gc-sm{width:min(300px,100%)}
.gc-float{position:absolute;inset:0;transform-style:preserve-3d;animation:gcFloat 7s ease-in-out infinite}
.gc-card{position:absolute;inset:0;border-radius:22px;transform-style:preserve-3d;transform:rotateX(var(--rx)) rotateY(var(--ry)) translateZ(calc(var(--lift) * 18px));transition:transform .7s cubic-bezier(.2,.7,.2,1)}
.gc-stage.is-tilting .gc-card{transition:transform .08s linear}
.gc-stage.is-tilting .gc-float{animation-play-state:paused}
.gc-face{position:absolute;inset:0;border-radius:inherit;overflow:hidden;isolation:isolate;color:#f2dc9f;
  background:radial-gradient(120% 95% at 88% -8%,rgba(201,164,92,.34),transparent 55%),radial-gradient(90% 80% at -5% 108%,rgba(201,164,92,.2),transparent 60%),linear-gradient(152deg,#1d150c 0%,#0b0805 52%,#151009 100%);
  box-shadow:0 1px 0 rgba(255,240,205,.25) inset,0 0 0 1px rgba(236,212,154,.18) inset;padding:clamp(16px,5.2%,26px) clamp(18px,6%,30px);display:flex;flex-direction:column;justify-content:space-between}
/* foil frame */
.gc-face::before{content:"";position:absolute;inset:0;border-radius:inherit;padding:1.6px;background:linear-gradient(115deg,#8a6a2f,#ecd49a 22%,#fff6dc 32%,#c9a45c 45%,#7a5b25 60%,#f2dc9f 78%,#a17a35);background-size:220% 220%;
  -webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask:linear-gradient(#000 0 0) content-box exclude,linear-gradient(#000 0 0);animation:gcFoil 6s linear infinite;z-index:3;pointer-events:none}
/* inner hairline */
.gc-face::after{content:"";position:absolute;inset:9px;border-radius:15px;border:1px solid rgba(236,212,154,.14);pointer-events:none;z-index:1}
.gc-guilloche{position:absolute;inset:0;z-index:0;opacity:.7;background:repeating-radial-gradient(circle at 108% -12%,rgba(236,212,154,.075) 0 1px,transparent 1.5px 10px),repeating-radial-gradient(circle at -10% 115%,rgba(236,212,154,.05) 0 1px,transparent 1.5px 13px)}
.gc-glow{position:absolute;width:70%;aspect-ratio:1;right:-22%;top:-38%;border-radius:50%;background:radial-gradient(circle,rgba(242,220,159,.22),transparent 65%);filter:blur(6px);z-index:0}
.gc-top,.gc-amount,.gc-bottom{position:relative;z-index:2}
.gc-top{display:flex;align-items:center;gap:10px}
.gc-mark{width:clamp(30px,9%,40px);aspect-ratio:1;display:grid;place-items:center;border-radius:10px;background:linear-gradient(150deg,#241a0f,#0d0906);box-shadow:0 0 0 1px rgba(236,212,154,.35) inset}
.gc-mark svg{width:62%;height:auto}
.gc-brand{display:flex;flex-direction:column;line-height:1}
.gc-brand b{font-family:var(--serif);font-weight:600;font-size:clamp(1.05rem,4.4vw,1.35rem);letter-spacing:.01em;color:#f2dc9f}
.gc-brand i{font-style:normal;font-size:.56rem;letter-spacing:.42em;color:#c9a45c;margin-top:3px}
.gc-label{margin-left:auto;font-size:.6rem;letter-spacing:.34em;text-transform:uppercase;color:#c9a45c;border:1px solid rgba(201,164,92,.45);border-radius:99px;padding:.35em .9em .3em 1.1em}
.gc-amount{font-family:var(--serif);font-weight:600;font-size:clamp(2.8rem,15vw,4.9rem);line-height:.9;letter-spacing:-.02em;font-feature-settings:"lnum" 1;
  background:linear-gradient(100deg,#9a742f 0%,#d7b46a 20%,#fff3cf 38%,#f2dc9f 50%,#c9a45c 64%,#8a6a2f 82%,#e9cf8f 100%);background-size:260% auto;-webkit-background-clip:text;background-clip:text;color:transparent;
  animation:gcText 6s linear infinite;filter:drop-shadow(0 2px 10px rgba(201,164,92,.25));transition:transform .35s cubic-bezier(.2,.7,.2,1)}
.gc-amount.bump{animation:gcText 6s linear infinite,gcBump .45s cubic-bezier(.2,.7,.2,1)}
.gc-bottom{display:flex;align-items:flex-end;justify-content:space-between;gap:12px}
.gc-to{min-width:0;display:flex;flex-direction:column}
.gc-to small,.gc-from small{font-size:.56rem;letter-spacing:.3em;text-transform:uppercase;color:#a88a4f;font-style:normal}
.gc-to>span{font-family:var(--serif);font-style:italic;font-size:clamp(1.15rem,5vw,1.6rem);line-height:1.15;color:#fff6e0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:100%}
.gc-from{font-style:normal;font-size:.76rem;color:#bfa774;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;margin-top:2px}
.gc-from small{letter-spacing:.12em;text-transform:none;font-size:.72rem;color:#a88a4f}
.gc-from:has(span:empty){visibility:hidden}
.gc-code{flex:none;font:600 clamp(.7rem,2.9vw,.86rem)/1 ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;letter-spacing:.14em;color:#ecd49a;opacity:.9}
.gc-shimmer{position:absolute;inset:-60% -40%;z-index:4;pointer-events:none;mix-blend-mode:screen;
  background:linear-gradient(112deg,transparent 41%,rgba(255,236,190,.1) 46%,rgba(255,250,235,.38) 50%,rgba(255,236,190,.1) 54%,transparent 59%);transform:translateX(-55%);animation:gcSweep 6.5s cubic-bezier(.45,.05,.3,1) infinite}
.gc-sheen{position:absolute;inset:0;z-index:4;pointer-events:none;mix-blend-mode:soft-light;opacity:0;transition:opacity .4s;background:radial-gradient(circle at var(--mx) var(--my),rgba(255,244,214,.75),transparent 46%)}
.gc-stage.is-tilting .gc-sheen{opacity:1}
.gc-shadow{position:absolute;left:8%;right:8%;bottom:-9%;height:16%;border-radius:50%;background:radial-gradient(closest-side,rgba(0,0,0,.55),transparent);filter:blur(10px);z-index:-1;
  transform:translateX(calc(var(--ry) * -0.8)) scale(calc(1 - var(--lift) * .06));animation:gcShadow 7s ease-in-out infinite}
@keyframes gcFloat{0%,100%{transform:translateY(0) rotateX(4deg) rotateY(-7deg)}50%{transform:translateY(-12px) rotateX(-2deg) rotateY(6deg)}}
@keyframes gcShadow{0%,100%{opacity:.85;scale:1}50%{opacity:.55;scale:.9}}
@keyframes gcSweep{0%,30%{transform:translateX(-55%)}75%,100%{transform:translateX(55%)}}
@keyframes gcFoil{to{background-position:220% 0}}
@keyframes gcText{to{background-position:-260% 0}}
@keyframes gcBump{0%{transform:scale(1)}40%{transform:scale(1.08)}100%{transform:scale(1)}}
@media (prefers-reduced-motion:reduce){.gc-float,.gc-shimmer,.gc-face::before,.gc-amount,.gc-shadow{animation:none!important}.gc-shimmer{display:none}}

/* admin detail */
.gc-info li{gap:16px}
.gc-info li>span:first-child{flex:none;color:var(--muted)}
.gc-info li>:last-child{text-align:right;min-width:0;overflow-wrap:anywhere}

/* ---------- /gift-cards ---------- */
.gf-hero{position:relative;overflow:hidden;color:#efe4cf;padding:clamp(48px,7vw,96px) 0 clamp(64px,8vw,110px);
  background:radial-gradient(900px 480px at 82% 20%,rgba(201,164,92,.24),transparent 60%),radial-gradient(700px 420px at 0% 100%,rgba(201,164,92,.12),transparent 60%),linear-gradient(165deg,#120d08 0%,#070504 55%,#100b07 100%)}
.gf-hero::before{content:"";position:absolute;inset:0;background:repeating-linear-gradient(115deg,rgba(236,212,154,.025) 0 1px,transparent 1px 22px);pointer-events:none}
.gf-hero .wrap{position:relative;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.05fr);gap:clamp(28px,5vw,72px);align-items:center}
.gf-hero h1{color:#fbf1da;font-size:clamp(2.7rem,6vw,4.9rem);margin:0 0 .3em}
.gf-hero h1 em{font-style:italic}
.gf-hero .eyebrow{color:#d7b46a}
.gf-hero .lead{font-size:1.12rem;color:#d8ccb4;max-width:34em;margin:0 0 22px}
.gf-perks{list-style:none;padding:0;margin:0 0 30px;display:grid;gap:10px}
.gf-perks li{display:flex;gap:12px;align-items:flex-start;color:#e6dac2;font-size:.98rem}
.gf-perks .ico-svg{width:22px;height:22px;flex:none;color:#d7b46a;margin-top:2px}
.gf-hero .crumbs{font-size:.82rem;color:#a99a80;margin-bottom:16px}.gf-hero .crumbs a{color:#d7b46a}
.gf-hero-card{position:relative;padding:20px 0 40px}
.gf-hero-card::before{content:"";position:absolute;inset:-10% -6%;background:radial-gradient(closest-side,rgba(242,220,159,.18),transparent);pointer-events:none}
.gf-sparkle{position:absolute;width:10px;height:10px;color:#f2dc9f;opacity:0;animation:gfTwinkle 4s ease-in-out infinite}
.gf-sparkle svg{width:100%;height:100%}
@keyframes gfTwinkle{0%,100%{opacity:0;transform:scale(.4)}50%{opacity:.9;transform:scale(1)}}
.gf-cta-row{display:flex;flex-wrap:wrap;gap:12px;align-items:center}
.gf-cta-row .btn-ghost{color:#f2dc9f;border-color:rgba(242,220,159,.55)}
.gf-cta-row .btn-ghost:hover{background:rgba(242,220,159,.12);color:#fff6e0}

.gf-build{padding:clamp(48px,6vw,90px) 0}
.gf-grid{display:grid;grid-template-columns:minmax(0,1.35fr) minmax(0,1fr);gap:clamp(22px,3.5vw,40px);align-items:start}
.gf-grid>*{min-width:0}
.gf-step{margin-bottom:30px}
.gf-step h3{display:flex;align-items:center;gap:12px;font-size:1.65rem;margin:0 0 14px}
.gf-step h3 .n{width:32px;height:32px;border-radius:50%;flex:none;display:grid;place-items:center;font:500 .88rem var(--sans);color:#21180e;background:linear-gradient(135deg,#f7e6b0,#c9a45c 55%,#9f7a36)}
.gf-amounts{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:10px}
.gf-amt{position:relative;cursor:pointer;margin:0}
.gf-amt input{position:absolute;opacity:0;pointer-events:none}
.gf-amt span{display:flex;align-items:center;justify-content:center;height:64px;border-radius:16px;border:1px solid var(--line-2);background:var(--ivory);font:600 1.55rem/1 var(--serif);color:var(--plum);transition:.25s var(--ease)}
.gf-amt span small{font:500 .78rem var(--sans);letter-spacing:.04em}
.gf-amt:hover span{border-color:var(--gold)}
.gf-amt input:checked+span{background:linear-gradient(150deg,#1d150c,#0b0805);color:#f2dc9f;border-color:#c9a45c;box-shadow:0 10px 24px rgba(74,54,22,.25),0 0 0 1px #c9a45c inset;transform:translateY(-2px)}
.gf-amt input:focus-visible+span{outline:2px solid var(--gold);outline-offset:2px}
.gf-custom{display:none;margin-top:12px;max-width:260px}
.gf-custom.on{display:block}
.gf-money{position:relative}.gf-money::before{content:"£";position:absolute;left:14px;top:50%;transform:translateY(-50%);color:var(--muted);font-weight:500}
.gf-money input{padding-left:30px!important}
.gf-count{float:right;font-size:.78rem;color:var(--muted);font-weight:400}
.gf-count.near{color:var(--err)}
.gf-when{display:flex;flex-wrap:wrap;gap:10px;margin-bottom:12px}
.gf-when label{margin:0}
.gf-when input{position:absolute;opacity:0;pointer-events:none}
.gf-when span{display:inline-flex;align-items:center;gap:8px;padding:.6em 1.15em;border-radius:99px;border:1px solid var(--line-2);background:var(--ivory);cursor:pointer;font-size:.93rem;transition:.2s}
.gf-when input:checked+span{background:var(--plum);color:#fff;border-color:var(--plum)}
html[data-theme=dark] .gf-when input:checked+span{background:#c9a45c;color:#1b140d;border-color:#c9a45c}
.gf-when input:focus-visible+span{outline:2px solid var(--gold);outline-offset:2px}
.gf-date{display:none;max-width:260px}.gf-date.on{display:block}
.gf-hint{font-size:.84rem;color:var(--muted);margin:-6px 0 12px}
.gf-aside{position:sticky;top:calc(var(--header-h,76px) + 18px)}
.gf-aside .panel{padding:26px}
.gf-aside .gc-stage{margin:6px auto 26px}
.gf-sum{list-style:none;padding:0;margin:0 0 14px}
.gf-sum li{display:flex;justify-content:space-between;gap:12px;padding:8px 0;border-bottom:1px solid var(--line);font-size:.93rem}
.gf-sum li span:first-child{color:var(--muted)}
.gf-sum li span:last-child{text-align:right;min-width:0;overflow-wrap:anywhere}
.gf-total{display:flex;justify-content:space-between;align-items:baseline;font-family:var(--serif);font-size:1.9rem;color:var(--plum);margin:6px 0 14px}
.gf-note{font-size:.82rem;color:var(--muted);margin:12px 0 0}
.gf-how{display:grid;grid-template-columns:repeat(3,1fr);gap:22px;counter-reset:gfh}
.gf-how li{list-style:none;position:relative;padding:28px 24px 24px;border-radius:22px;background:var(--ivory);border:1px solid var(--line);box-shadow:var(--shadow-sm)}
.gf-how li::before{counter-increment:gfh;content:counter(gfh);font:600 2.6rem/1 var(--serif);background:linear-gradient(100deg,#9a742f,#d7b46a 40%,#f2dc9f 55%,#a17a35);-webkit-background-clip:text;background-clip:text;color:transparent;display:block;margin-bottom:10px}
.gf-how h3{font-size:1.4rem;margin:0 0 6px}
.gf-how p{margin:0;color:var(--muted);font-size:.95rem}
html[data-theme=dark] .gf-amt span,html[data-theme=dark] .gf-when span,html[data-theme=dark] .gf-how li{background:#17110b}
html[data-theme=dark] .gf-amt input:checked+span{background:linear-gradient(150deg,#2a1f12,#0b0805)}

/* confirmation / order */
.gf-order{padding:clamp(40px,6vw,80px) 0 90px}
.gf-order .panel{max-width:760px;margin:0 auto}
.gf-order .gc-stage{margin:8px auto 30px}
.gf-steps{display:flex;justify-content:center;gap:0;margin:0 0 26px;padding:0;list-style:none;font-size:.8rem;color:var(--muted)}
.gf-steps li{display:flex;align-items:center;gap:8px;padding:0 12px;position:relative}
.gf-steps li+li::before{content:"";position:absolute;left:-14px;width:16px;height:1px;background:var(--line-2)}
.gf-steps b{width:24px;height:24px;border-radius:50%;display:grid;place-items:center;border:1px solid var(--line-2);font-weight:500;font-size:.75rem}
.gf-steps .done b{background:var(--ok);border-color:var(--ok);color:#fff}
.gf-steps .now b{background:linear-gradient(135deg,#f7e6b0,#c9a45c);border-color:#c9a45c;color:#21180e}
.gf-steps .now{color:var(--plum);font-weight:500}

/* ---------- /gift (recipient's view) ---------- */
.gv{position:relative;min-height:70vh;overflow:hidden;color:#efe4cf;padding:clamp(40px,6vw,80px) 0 clamp(60px,7vw,100px);
  background:radial-gradient(800px 460px at 50% 0%,rgba(201,164,92,.26),transparent 62%),radial-gradient(600px 400px at 100% 100%,rgba(201,164,92,.1),transparent 60%),linear-gradient(170deg,#120d08,#070504 60%,#0e0a06)}
.gv .wrap{position:relative;max-width:760px}
.gv h1{color:#fbf1da;text-align:center;font-size:clamp(2.3rem,5.4vw,3.8rem);margin:0 0 6px}
.gv .sub{text-align:center;color:#cbbd9f;margin:0 0 30px}
.gv .gc-stage{margin:0 auto 46px}
.gv-panel{background:rgba(255,248,232,.04);border:1px solid rgba(236,212,154,.18);border-radius:24px;padding:clamp(20px,4vw,32px);backdrop-filter:blur(4px)}
.gv-stats{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin-bottom:22px}
.gv-stats div{background:rgba(0,0,0,.25);border:1px solid rgba(236,212,154,.14);border-radius:16px;padding:14px 16px;text-align:center}
.gv-stats small{display:block;font-size:.66rem;letter-spacing:.24em;text-transform:uppercase;color:#a88a4f;margin-bottom:6px}
.gv-stats strong{font:600 1.7rem/1.1 var(--serif);color:#f2dc9f}
.gv-bar{height:6px;border-radius:99px;background:rgba(236,212,154,.14);overflow:hidden;margin:0 0 22px}
.gv-bar i{display:block;height:100%;border-radius:inherit;background:linear-gradient(90deg,#8a6a2f,#f2dc9f,#c9a45c)}
.gv-code{display:flex;align-items:center;justify-content:center;gap:12px;flex-wrap:wrap;margin:0 0 22px}
.gv-code code{font:600 1.2rem ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;letter-spacing:.16em;color:#f2dc9f;background:rgba(0,0,0,.35);border:1px dashed rgba(201,164,92,.6);padding:.55em .9em;border-radius:12px}
.gv-code .copy-btn,.gv .btn-ghost{color:#f2dc9f;border:1px solid rgba(242,220,159,.5);background:transparent}
.gv .btn-ghost:hover{background:rgba(242,220,159,.12)}
.gv-msg{font-family:var(--serif);font-style:italic;font-size:1.35rem;line-height:1.5;color:#fff3d6;text-align:center;margin:0 auto 24px;max-width:34em}
.gv-msg small{display:block;font:400 .82rem var(--sans);font-style:normal;color:#a88a4f;margin-top:6px}
.gv-actions{display:flex;flex-wrap:wrap;gap:12px;justify-content:center}
.gv-howto{margin-top:26px;font-size:.92rem;color:#cbbd9f}
.gv-howto li{margin-bottom:6px}
.gv-terms{font-size:.78rem;color:#9a8b70;text-align:center;margin:24px 0 0}
.gv-state{text-align:center;padding:12px 16px;border-radius:14px;margin:0 0 20px;background:rgba(201,164,92,.12);border:1px solid rgba(201,164,92,.3);color:#f2dc9f}

@media (max-width:900px){
  .gf-hero .wrap{grid-template-columns:1fr}
  .gf-hero-card{order:-1;padding:6px 0 26px}
  .gf-hero .crumbs{display:none}
  .gf-grid{grid-template-columns:1fr}
  .gf-aside{position:static}
  .gf-how{grid-template-columns:1fr}
}
@media (max-width:560px){
  .gf-amounts{grid-template-columns:repeat(3,minmax(0,1fr))}
  .gf-amt span{height:56px;font-size:1.35rem}
  .gc-face{border-radius:18px}
  .gv-stats{grid-template-columns:1fr 1fr}
  .gv-stats div:last-child{grid-column:1/-1}
  .gf-steps{font-size:.72rem}.gf-steps li{padding:0 6px}.gf-steps li+li::before{display:none}
}
@media print{
  .site-header,.site-footer,.mobile-bar,.to-top,.contact-rail,.ticker-bar,.marquee,.sound-btn,.toasts,.gv-actions,.no-print,#shinyChat,.chat-launcher{display:none!important}
  .gv{background:#fff!important;color:#2b2116;min-height:0;padding:20px 0}
  .gv h1,.gv .sub,.gv-msg{color:#2b2116}
  .gv-panel{border-color:#ccc}
  .gc-float,.gc-shimmer,.gc-amount{animation:none!important}
  .gc-card{transform:none!important}
  *{-webkit-print-color-adjust:exact;print-color-adjust:exact}
}