/* ChiliLovers presentkort: köpformulär + förhandsvisning. Allt under .clgc, kortdelar med gc-prefix, så temats CSS inte krockar. */
@font-face{font-family:"Libre Caslon Condensed";font-weight:400;font-display:swap;src:url(../fonts/libre-caslon-cond-400.woff2) format("woff2")}
@font-face{font-family:"Libre Caslon Condensed";font-weight:700;font-display:swap;src:url(../fonts/libre-caslon-cond-700.woff2) format("woff2")}
.clgc{--paper:#f7f0e4;--field:#fffaf0;--ink:#241e14;--muted:#5d5444;--accent:#9b1c1c;--accent-d:#7c1414;--green:#2f6122;--line:#cdbf9f;--soft:#efe5d0;--fd:"Libre Caslon Condensed",Georgia,serif;--fb:"Open Sans",system-ui,-apple-system,"Segoe UI",Arial,sans-serif;
display:grid;gap:32px;max-width:1160px;margin:0 auto;padding:0 0 24px;font:400 16px/1.55 var(--fb);color:var(--ink);text-align:left}
.clgc,.clgc *,.clgc *::before,.clgc *::after{box-sizing:border-box}
.clgc [hidden]{display:none!important}
.clgc h2,.clgc p,.clgc fieldset,.clgc legend,.clgc figure,.clgc ol{margin:0;padding:0}
.clgc .ttl{font-family:var(--fd);font-weight:700;font-size:clamp(44px,7vw,76px);line-height:.95;letter-spacing:-.01em;color:var(--ink);margin:0 0 14px;text-transform:none}
.clgc .lead{max-width:34em;font-size:17px;color:var(--muted);text-wrap:pretty}
.clgc-notices:empty{display:none}
.clgc-notices{grid-column:1/-1}
.clgc-notices{margin-bottom:8px}
.clgc-notices:focus{outline:3px solid var(--green);outline-offset:3px}
.clgc .gc-card{margin-top:24px;box-shadow:0 20px 30px -22px rgba(36,30,20,.55)}
.clgc .greet{margin:24px 0 0;max-width:30em}
.clgc .greet p{font:400 22px/1.4 var(--fd);white-space:pre-line;overflow-wrap:anywhere;hyphens:auto;text-wrap:pretty}
.clgc .greet.ph p{color:var(--muted)}
.clgc .greet small{display:block;margin-top:8px;color:var(--muted);font-size:14px}
.clgc fieldset{background:none;border:0;border-top:2px solid var(--ink);margin:0 0 30px;padding:14px 0 0;min-width:0}
.clgc legend{background:none;float:left;width:100%;font:700 28px/1.1 var(--fd);margin-bottom:14px;color:var(--ink)}
.clgc legend+*{clear:both}
.clgc legend i{font-style:normal;color:var(--accent);margin-right:10px}
.clgc .chips{display:flex;flex-wrap:wrap;gap:10px}
.clgc .chip,.clgc .pick,.clgc .opt{position:relative;display:block;margin:0}
.clgc .chip{display:inline-block}
.clgc .chip input,.clgc .opt input,.clgc .pick input{position:absolute;opacity:0;inset:0;margin:0;width:100%;height:100%;cursor:pointer}
.clgc .chip span{display:flex;align-items:center;min-height:48px;padding:0 18px;border:1.5px solid var(--ink);border-radius:5px;font-weight:600;background:var(--field)}
.clgc .chip input:checked+span{background:var(--ink);color:var(--paper)}
.clgc .chip:hover input:not(:checked)+span{background:var(--soft)}
.clgc input:focus-visible+span,.clgc .opt input:focus-visible~.ot,.clgc textarea:focus-visible,.clgc .in:focus-visible,.clgc button:focus-visible,.clgc a:focus-visible{outline:3px solid var(--green);outline-offset:3px}
.clgc .picks{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}
.clgc .pick .tb{display:block;padding:5px;border:1.5px solid var(--line);border-radius:10px;background:var(--field)}
.clgc .pick img{display:block;width:100%;height:auto;border-radius:6px;box-shadow:0 0 0 1px rgba(36,30,20,.14)}
.clgc .pick b{display:block;margin:6px 2px 1px;font-size:14px;font-weight:600}
.clgc .pick input:checked+.tb{border-color:var(--ink);box-shadow:inset 0 0 0 1.5px var(--ink)}
.clgc .pick input:checked+.tb b::before{content:"Vald: ";font-weight:400;color:var(--muted)}
.clgc .f{display:block;margin:0 0 18px}
.clgc .f>label,.clgc .lbl{display:block;font-weight:600;margin:0 0 6px;color:var(--ink)}
.clgc .f>label small{font-weight:400;color:var(--muted)}
.clgc .in,.clgc textarea{display:block;width:100%;max-width:none;min-height:48px;margin:0;padding:11px 14px;font:400 16px/1.4 var(--fb);color:var(--ink);background:var(--field);border:1.5px solid var(--ink);border-radius:5px;box-shadow:none;caret-color:var(--accent)}
.clgc textarea{resize:vertical;min-height:112px}
.clgc .suf{position:relative}
.clgc .suf .in{padding-right:48px}
.clgc .suf span{position:absolute;right:14px;top:50%;transform:translateY(-50%);color:var(--muted);font-weight:600}
.clgc .hint{margin:6px 0 0;font-size:14px;color:var(--muted)}
.clgc .err{margin:6px 0 0;font-size:14px;font-weight:600;color:var(--accent-d)}
.clgc .err:empty{display:none}
.clgc [aria-invalid=true]{border-color:var(--accent);box-shadow:0 0 0 1px var(--accent)}
.clgc .opts{display:grid;gap:10px;margin-bottom:16px}
.clgc .opt .ot{display:block;padding:12px 14px 12px 48px;border:1.5px solid var(--line);border-radius:6px;background:var(--field)}
.clgc .opt .ot::before{content:"";position:absolute;left:15px;top:15px;width:20px;height:20px;border:1.5px solid var(--ink);border-radius:50%;background:var(--field)}
.clgc .opt input:checked~.ot{border-color:var(--ink);box-shadow:inset 0 0 0 1.5px var(--ink)}
.clgc .opt input:checked~.ot::before{background:var(--accent);box-shadow:inset 0 0 0 4px var(--field)}
.clgc .opt b{display:block;font-weight:600}
.clgc .opt .d{display:block;font-size:14px;color:var(--muted)}
.clgc .sendto{margin:8px 0 0;padding:8px 12px;background:var(--soft);border-radius:5px;font-size:15px;overflow-wrap:anywhere}
.clgc .valid{margin:0 0 14px;font-size:14px;color:var(--muted)}
.clgc .valid strong{color:var(--ink);font-weight:600}
.clgc .valid a,.clgc .priv a{color:var(--accent-d);text-decoration:underline}
.clgc .priv{margin:10px 0 0;font-size:14px;color:var(--muted)}
/* Sticky, not fixed: it rests at the end of the form instead of covering the page footer or a theme's own bottom bar. --clgc-bottom lets a theme lift it above such a bar. */
.clgc .buy{position:sticky;bottom:var(--clgc-bottom,0px);padding:10px 0 calc(10px + env(safe-area-inset-bottom));background:var(--paper);border-top:1.5px solid var(--ink);z-index:5}
.clgc .bar{display:flex;align-items:center;gap:12px}
.clgc .mini{display:flex;align-items:center;gap:10px;flex:none;font:700 24px/1 var(--fd);white-space:nowrap}
.clgc .mini img{display:block;width:60px;height:auto;border-radius:5px;box-shadow:0 0 0 1px var(--line)}
.clgc .btn{display:block;flex:1;width:auto;min-height:52px;margin:0;padding:10px 16px;border:0;border-radius:5px;background:var(--accent);color:#fffaf0;font:700 17px/1.2 var(--fb);text-transform:none;letter-spacing:0;cursor:pointer}
.clgc .btn:hover{background:var(--accent-d);color:#fffaf0}
.clgc .btn[disabled]{opacity:.7;cursor:progress}
.clgc .bamt{display:none}
.clgc #status{margin:0 0 14px;font-size:14px;font-weight:600;color:var(--green)}
.clgc #status.bad{color:var(--accent-d)}
.clgc #status:empty{display:none}
@media (prefers-reduced-motion:no-preference){.clgc .btn:active{transform:translateY(1px)}}
@media (max-width:359px){.clgc .mini span{display:none}}
@media (min-width:900px){
.clgc{grid-template-columns:minmax(0,1fr) minmax(0,500px);gap:72px;padding-bottom:48px;align-items:start}
.clgc .stage{position:sticky;top:24px}
.clgc .buy{position:static;padding:0;border:0;background:none}
.clgc .mini{display:none}
.clgc .bamt{display:inline}
.clgc .btn{font-size:18px;min-height:54px}
}
@media (forced-colors:active){.clgc .chip input:checked+span,.clgc .opt input:checked~.ot,.clgc .pick input:checked+.tb{outline:3px solid Highlight}.clgc .btn{border:2px solid ButtonText}}
/* Kortets textlager. Enhet u = 1/856 av kortbredden (cqw), samma layout som PDF:en. */
.gc-card{position:relative;container-type:inline-size;aspect-ratio:856/540;border-radius:14px;overflow:hidden;background:var(--bg);isolation:isolate}
.gc-card>img{display:block;width:100%;height:100%;object-fit:cover}
.gc-card::after{content:"";position:absolute;inset:0;border-radius:inherit;box-shadow:inset 0 0 0 1px var(--edge);pointer-events:none}
.gc-ct{position:absolute;inset:0;--u:calc(100cqw/856);font-family:var(--fb);color:var(--ink)}
.gc-ct>*{position:absolute;margin:0;left:calc(56*var(--u))}
.gc-wm{top:calc(28*var(--u));width:calc(237*var(--u));height:calc(88*var(--u));background:url(../img/logo.png) left top/contain no-repeat}
.gc-card[data-t=dark] .gc-wm{background-image:url(../img/logo-light.png)}
.gc-lb{top:calc(128*var(--u));font:600 calc(24*var(--u))/1 var(--fb);letter-spacing:.02em;color:var(--soft)}
.gc-am{top:calc(160*var(--u));height:calc(200*var(--u));width:calc(var(--amax)*var(--u));display:flex;align-items:flex-end;overflow:hidden}
.gc-am .fit{font:700 calc(var(--amt,172)*var(--u)*var(--s,1))/.82 var(--fd);white-space:nowrap;letter-spacing:-.005em}
.gc-am i{font-style:normal;font-size:.44em;margin-left:.07em;color:var(--kr)}
.gc-rl{top:calc(376*var(--u));width:calc(var(--rw,var(--nmax))*var(--u));height:max(1px,calc(1.5*var(--u)));background:var(--rule)}
.gc-nm{width:calc(var(--nmax)*var(--u));display:flex;align-items:baseline;gap:calc(12*var(--u))}
.gc-nm.to{top:calc(396*var(--u))}.gc-nm.fr{top:calc(444*var(--u))}
.gc-nm .l{flex:none;width:calc(56*var(--u));white-space:nowrap;overflow:visible;font:600 calc(26*var(--u))/1 var(--fb);color:var(--soft)}
.gc-nm .v{min-width:0;padding-bottom:.12em;font:700 calc(40*var(--u)*var(--s,1))/1.05 var(--fd);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.gc-nm .v.ph{font-weight:400;color:var(--soft)}
.gc-lb.tag{top:calc(126*var(--u));width:calc(var(--tw)*var(--u));font:700 calc(30*var(--u))/1.133 var(--fd);letter-spacing:0;color:var(--ink)}
/* Colours by tone; text widths per design come inline from CLGC_Designs::css_vars(). */
.gc-card{--amax:400;--nmax:410;--tw:400}
.gc-card[data-t=light]{--bg:#fcf3e8;--ink:#241e14;--soft:#5d5444;--kr:#9b1c1c;--rule:#b9ab8c;--edge:rgba(36,30,20,.16)}
.gc-card[data-t=dark]{--bg:#2f2523;--ink:#f7f0e4;--soft:#d8ccb4;--kr:#f58a77;--rule:#6b5d4a;--edge:transparent}
/* Theme hardening (Flatsome): full-width templates give no gutter, and the theme uppercases legends/headings and bolds labels. */
.clgc{box-sizing:border-box;max-width:1160px;margin-inline:auto;padding-inline:16px;padding-top:24px}
@media (min-width:900px){.clgc{padding-inline:24px;padding-top:40px}}
.clgc legend,.clgc h1,.clgc h2{text-transform:none;letter-spacing:normal}
.clgc label.opt,.clgc .opt .d,.clgc .f small{font-weight:400}
.clgc .opt .ot b{font-weight:600}