/* Structure shared by every area. Colors come from CSS variables: the public theme engine (includes/theme.php)
   sets them per calendar; user/admin skins set them in their own css files. */
:root{--bg:#fff;--fg:#222;--muted:#6b6b6b;--accent:#2b6c7a;--accent-fg:#fff;--panel:#fff;--panel-fg:var(--fg);--line:#e3e3e3;
  --accent-on-panel:var(--accent);--link:var(--accent);--open:#f4d3d3;--open-fg:#222;--held:#f1e2a8;--held-fg:#222;--paid:#a8d8c8;--paid-fg:#222;--num:var(--accent);
  --input-bg:#fff;--input-fg:#222;--input-line:#bdbdbd;--day-radius:12px;--day-ar:auto;--day-minh:72px;--cal-border:solid;--radius:14px;
  --font:system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;--head-font:var(--font)}
*{box-sizing:border-box}
body{margin:0;background:var(--bg);color:var(--fg);font:16px/1.5 var(--font)}
body.area-public{background-attachment:fixed;min-height:100vh}
a{color:var(--link)}
.panel a:not(.btn),.calendar a:not(.btn),.site-head a:not(.btn){color:var(--accent-on-panel)}
h1,h2,h3{font-family:var(--head-font);line-height:1.2}
.wrap{max-width:1000px;margin:0 auto;padding:1rem}
.wrap.narrow{max-width:560px}
.site-head{display:flex;justify-content:space-between;align-items:center;padding:.8rem 1.2rem;border-bottom:1px solid var(--line);background:var(--panel);color:var(--panel-fg)}
.site-head nav{display:flex;gap:1rem;align-items:center}
.brand{font:700 1.3rem var(--head-font);color:var(--accent-on-panel);text-decoration:none;display:inline-flex;align-items:center;gap:.5rem}
.brand-mark{flex:none}.brand em{font-weight:400}
.btn{display:inline-block;background:var(--accent);color:var(--accent-fg);border:2px solid var(--accent);padding:.65rem 1.2rem;border-radius:999px;font:600 1rem var(--font);text-decoration:none;cursor:pointer}
.btn.small{padding:.35rem .9rem;font-size:.9rem}
.btn.ghost{background:transparent;color:var(--link);border-color:currentColor}
.panel .btn.ghost{color:var(--accent-on-panel)}
.btn.danger{background:#b3261e;border-color:#b3261e;color:#fff}
.btn[disabled]{opacity:.5;cursor:not-allowed}
.panel{background:var(--panel);color:var(--panel-fg);border:1px solid var(--line);border-radius:var(--radius);padding:1.2rem;margin:1rem 0}
.center{text-align:center}
.muted{color:color-mix(in srgb,currentColor 78%,transparent);font-size:.92rem}
.sr-only{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
code{background:rgba(127,127,127,.18);padding:.1rem .4rem;border-radius:5px}
.flash{padding:.7rem 1rem;border-radius:10px;margin:.8rem 0;background:#e3f4ea;border:1px solid #b9e0c9;color:#173d26}
.flash.err{background:#fde8e8;border-color:#f3b9b9;color:#5a1a1a}
.fields{display:grid;grid-template-columns:1fr 1fr;gap:.9rem;margin:1rem 0}
.fields.one{grid-template-columns:1fr}
.fields .full{grid-column:1/-1}
label{display:block;font-weight:600;font-size:.93rem}
input:not([type=checkbox]):not([type=radio]):not([type=color]),select,textarea{display:block;width:100%;margin-top:.3rem;padding:.6rem .7rem;border:1px solid var(--input-line);border-radius:9px;font:1rem var(--font);background:var(--input-bg);color:var(--input-fg)}
input[type=color]{display:block;width:100%;height:2.6rem;margin-top:.3rem;padding:.15rem;border:1px solid var(--input-line);border-radius:9px;background:var(--input-bg);cursor:pointer}
label.check{display:flex;gap:.5rem;align-items:flex-start;font-weight:400}
label.method{display:flex;gap:.8rem;align-items:center;border:1px solid var(--line);border-radius:12px;padding:.8rem;margin:.5rem 0;cursor:pointer}
label.method small{display:block;font-weight:400;opacity:.72}
@media(max-width:640px){.fields{grid-template-columns:1fr}}

/* landing */
.landing-hero{text-align:center;padding:3rem 0 1rem}
.landing-hero h1{font-size:clamp(2rem,6vw,3.2rem);margin:.2rem 0}
.demo{margin:1.5rem 0}.demo>h2,.demo>p{text-align:center}.demo h2{margin-bottom:.2rem}.demo .demo-cal{max-width:700px;margin-inline:auto}.demo .day .who{font-size:.66rem}.demo-raised{margin:.4rem 0 .8rem}.demo-total{font-weight:700;margin:.6rem 0 0}
.steps h2{font-size:1.15rem;margin-top:0}.steps{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:1rem}
.cards{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:1rem}
.card{display:flex;flex-direction:column;gap:.3rem;padding:1rem;border:1px solid var(--line);border-radius:var(--radius);text-decoration:none;color:var(--panel-fg);background:var(--panel)}
.card img{width:100%;height:140px;object-fit:cover;border-radius:10px}

/* calendar page */
.hero{display:flex;gap:1.5rem;align-items:center;flex-wrap:wrap}
.hero .cover{width:200px;max-width:40%;border-radius:var(--radius);object-fit:cover;aspect-ratio:3/4}
.hero>div{flex:1;min-width:240px}
.eyebrow{letter-spacing:.08em;text-transform:uppercase;font-size:.8rem;opacity:.72;margin:0}
.progress{height:12px;background:rgba(127,127,127,.3);border-radius:999px;overflow:hidden;margin:.8rem 0 .3rem}
.progress span{display:block;height:100%;background:var(--accent)}
.share{display:flex;flex-wrap:wrap;gap:.4rem;margin-top:.8rem}
.calendar{background:var(--panel);color:var(--panel-fg);border:3px var(--cal-border) var(--accent);border-radius:18px;padding:1rem;margin:1.2rem 0}
.cal-title{text-align:center;font:700 1.6rem var(--head-font);color:var(--accent-on-panel);margin-bottom:.6rem}
.grid{display:grid;grid-template-columns:repeat(7,1fr);gap:6px}
.grid.head span{text-align:center;font-weight:700;color:var(--accent-on-panel)}
.grid .blank{display:block}
.day{position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:var(--day-minh);aspect-ratio:var(--day-ar);border-radius:var(--day-radius);background:var(--open);color:var(--open-fg);cursor:pointer;text-align:center;padding:.2rem;overflow:hidden;font-weight:400;transition:transform .1s}
.day input{position:absolute;opacity:0;inset:0;cursor:pointer}
.day .num{font:700 1.3rem var(--head-font);color:var(--num)}
.day .who{font-size:.72rem;line-height:1.1;color:inherit;word-break:break-word}
.day.held{background:var(--held);color:var(--held-fg);cursor:not-allowed}
.day.held .num{color:var(--held-fg)}
.day.paid{background:var(--paid);color:var(--paid-fg);cursor:not-allowed}
.day.paid .num{color:var(--paid-fg)}
.day:has(input:checked),.day.sel{background:var(--accent);color:var(--accent-fg);box-shadow:0 0 0 2px var(--panel),0 0 0 4px var(--accent)}
.day:has(input:checked) .num,.day.sel .num{color:var(--accent-fg)}
.day:has(input:focus-visible){outline:3px dashed var(--panel-fg)}
.legend{font-size:.82rem;opacity:.8;margin:.8rem 0 0}
.legend .k{display:inline-block;width:.8rem;height:.8rem;border-radius:3px;vertical-align:middle;margin:0 .2rem 0 .6rem;border:1px solid rgba(127,127,127,.4)}
.legend .k.open{background:var(--open)}.legend .k.held{background:var(--held)}.legend .k.paid{background:var(--paid)}
.total-line{font-size:1.1rem}
@media(max-width:520px){.day{min-height:calc(var(--day-minh) * .8)}.day .who{font-size:.62rem}.grid{gap:4px}}

/* design editor */
.theme-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(130px,1fr));gap:.6rem}
.theme-opt{position:relative;border:2px solid var(--line);border-radius:12px;padding:.5rem;cursor:pointer;font-weight:600;text-align:center}
.theme-opt input{position:absolute;opacity:0;inset:0;cursor:pointer}
.theme-opt:has(input:checked){border-color:var(--accent);box-shadow:0 0 0 2px var(--accent)}
.theme-opt .sw{display:flex;height:34px;border-radius:8px;overflow:hidden;margin-bottom:.4rem;border:1px solid rgba(127,127,127,.35)}
.theme-opt .sw i{flex:1}
.designer-cols{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:1.2rem;align-items:start}
@media(max-width:860px){.designer-cols{grid-template-columns:1fr}}
.pv{background:var(--bg);color:var(--fg);padding:1rem;border-radius:14px;position:sticky;top:1rem;border:1px solid var(--line)}
.pv .calendar{margin:0}
.pv .day{min-height:calc(var(--day-minh) * .62);font-size:.8rem}
.pv .day .num{font-size:1rem}
.pv .day .who{font-size:.55rem}
.pv .cal-title{font-size:1.2rem}
.pv.hide-prices .day.open .who{display:none}
.pv .btn{margin-top:.8rem}
.colorgrid{display:grid;grid-template-columns:repeat(auto-fit,minmax(110px,1fr));gap:.7rem;margin:.8rem 0}

/* ---- additions: privacy, legal, ticker, tips, notices ---- */
[hidden]{display:none!important}
.hp{position:absolute;left:-10000px;top:auto;width:1px;height:1px;overflow:hidden}
.cookie{position:fixed;left:0;right:0;bottom:0;z-index:50;display:flex;gap:1rem;align-items:center;justify-content:center;flex-wrap:wrap;padding:.7rem 1rem;background:#1f2937;color:#fff;font-size:.9rem}
.cookie a{color:#fff;text-decoration:underline}
.site-foot{margin:2.5rem auto 1.5rem;text-align:center;font-size:.9rem;opacity:.85}
.site-foot a{text-decoration:underline}
.legal h2{margin-top:1.6rem}
.legal ul{padding-left:1.2rem}
.ticker{list-style:none;margin:0;padding:0}.ticker li{padding:.35rem 0;border-bottom:1px solid rgba(0,0,0,.08)}.ticker li:last-child{border:0}
.update{padding:.5rem 0;border-bottom:1px solid rgba(0,0,0,.08)}.update:last-child{border:0}.update p{margin:.25rem 0 0}
.match{font-weight:600}
.org-note{font-size:.85rem}
.series{margin:.5rem 0}.series a{margin-right:.6rem;text-decoration:underline}
.tipbox{border:1px solid rgba(0,0,0,.18);border-radius:.6rem;padding:.6rem .9rem}.tipbox legend{padding:0 .4rem;font-weight:600}
details.receipt{margin:.8rem 0;text-align:left}details.receipt pre{white-space:pre-wrap;font:inherit;background:rgba(0,0,0,.05);padding:.7rem;border-radius:.5rem}
.badge.refunded{background:#e5e7eb;color:#374151}
.center{text-align:center}
