/* ════════════════════════════════════════════════════════════════════
   SAPE Engineering — sape-extra.css
   Componenti che nel prototipo vivevano nei <style> inline delle singole
   pagine, qui consolidati e caricati globalmente. NON introdurre hex fuori
   dai token :root di sape.css.
   ════════════════════════════════════════════════════════════════════ */

/* ── WordPress glue ─────────────────────────────────────────────────── */
main{display:block}
/* Il corpo pagina è un blocco wp:html con le <section> del prototipo:
   nessun padding aggiuntivo, il layout se lo gestisce da solo. */
.entry-content{margin:0}
.entry-content>*{margin:0}
.alignfull{width:100%}
/* Evita che eventuali <p> vuoti generati dall'editor rompano il ritmo. */
.entry-content>p:empty{display:none}

/* ── Barra amministrazione WordPress ────────────────────────────────────
   Da loggati la #wpadminbar è position:fixed in cima (32px, 46px sotto i
   782px). Senza compensazione la .topnav sticky (top:0) le scivola sotto
   allo scroll e logo/menu restano coperti — su ogni pagina. Spingiamo in
   basso header, menu mobile a tendina, ancore .svc e side-card della stessa
   altezza della barra. */
body.admin-bar .topnav{top:32px}
body.admin-bar .svc{scroll-margin-top:112px}
body.admin-bar .side-card{top:120px}
@media(max-width:1180px){
  body.admin-bar .topnav nav{top:96px}
}
@media screen and (max-width:782px){
  body.admin-bar .topnav{top:46px}
  body.admin-bar .topnav nav{top:110px}
  body.admin-bar .svc{scroll-margin-top:126px}
}

/* ── .svc — blocchi sotto-servizio (pagine servizio) ────────────────── */
.svc{padding-block:clamp(40px,6vw,72px);scroll-margin-top:80px}
.svc+.svc{border-top:1px solid var(--border)}
.svc ul.list{list-style:none;margin:18px 0 0;padding:0;display:grid;grid-template-columns:1fr 1fr;gap:10px 24px}
@media(max-width:560px){.svc ul.list{grid-template-columns:1fr}}
.svc ul.list li{display:flex;gap:10px;align-items:flex-start;font-size:14.5px;color:var(--fg)}
.svc ul.list li::before{content:"";flex:none;width:16px;height:16px;margin-top:3px;border-radius:4px;background:var(--accent-soft);
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%235f7d12' stroke-width='3'%3E%3Cpath d='M20 6 9 17l-5-5'/%3E%3C/svg%3E");background-size:11px;background-position:center;background-repeat:no-repeat}

/* ── Accreditamenti (.accr) — home ──────────────────────────────────── */
.on-ink .kpi-strip .kpi{color:var(--on-ink-muted)}
.on-ink .kpi-strip .kpi b{color:#fff}
.accr-strip{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
@media(max-width:820px){.accr-strip{grid-template-columns:repeat(2,1fr)}}
.accr{border:1px solid var(--border);border-radius:12px;padding:18px;display:flex;flex-direction:column;gap:4px;background:var(--surface)}
.accr b{font-family:var(--font-display);font-size:15px}
.accr span{font-size:12px;color:var(--muted)}

/* ════════════════════════════════════════════════════════════════════
   Scheda corso (single-corso) — componenti da corso.html
   ════════════════════════════════════════════════════════════════════ */
#corso-hero{position:relative;isolation:isolate}
.hero-bg{position:absolute;inset:0;z-index:0;overflow:hidden}
.hero-bg img{width:100%;height:100%;object-fit:cover;object-position:center 32%;transform:scale(1.02)}
.hero-bg::after{content:"";position:absolute;inset:0;background:linear-gradient(105deg,rgba(10,20,36,.94) 0%,rgba(12,26,44,.86) 42%,rgba(20,48,79,.62) 100%),linear-gradient(0deg,rgba(10,20,36,.5),transparent 60%)}
#corso-hero>.glow{z-index:1}
#corso-hero>.container{position:relative;z-index:2}
.chips{display:flex;flex-wrap:wrap;gap:10px;margin-top:22px}
.chip{display:inline-flex;align-items:center;gap:8px;padding:8px 14px;border-radius:999px;font-family:var(--font-mono);font-size:12.5px;letter-spacing:.02em;
  background:color-mix(in oklch,#fff 8%,transparent);border:1px solid var(--on-ink-border);color:#fff}
.chip svg{width:15px;height:15px;stroke:currentColor;fill:none;stroke-width:2}
.chip.accent{background:var(--accent);border-color:var(--accent);color:var(--accent-on,#0f1b13);font-weight:600}
.detail-grid{display:grid;grid-template-columns:1.7fr 1fr;gap:56px;align-items:start}
@media(max-width:920px){.detail-grid{grid-template-columns:1fr;gap:32px}}
.prog{margin:0;padding:0}
.prog li{list-style:none;padding:16px 0;border-top:1px solid var(--border);display:flex;gap:14px;align-items:flex-start}
.prog li:first-child{border-top:0}
.prog .n{font-family:var(--font-mono);font-size:13px;color:var(--accent-ink);flex:0 0 auto;min-width:26px}
.prog li p{margin:2px 0 0;color:var(--muted);font-size:14.5px}
.prog li h4{margin:0;font-size:15.5px}
.side-card{position:sticky;top:88px}
.side-card .row-line{display:flex;justify-content:space-between;gap:12px;padding:11px 0;border-top:1px solid var(--border);font-size:14.5px}
.side-card .row-line:first-of-type{border-top:0}
.side-card .row-line b{font-family:var(--font-mono);font-weight:600}
.empty-dates{color:var(--muted);padding:20px;border:1px dashed var(--border);border-radius:var(--radius);text-align:center}
.backlink{display:inline-flex;align-items:center;gap:7px;font-family:var(--font-mono);font-size:12.5px;color:var(--muted)}
.backlink:hover{color:var(--accent-ink)}
.backlink svg{width:15px;height:15px;stroke:currentColor;fill:none;stroke-width:2}

/* selettore modalità (corsi Aula + Online) */
.modechooser{background:var(--surface);border-top:1px solid var(--border);border-bottom:1px solid var(--border)}
.mc-card{display:grid;gap:24px}
.mc-head{max-width:64ch}
.mc-options{display:grid;grid-template-columns:1fr 1fr;gap:16px}
@media(max-width:720px){.mc-options{grid-template-columns:1fr}}
.mc-opt{position:relative;text-align:left;display:grid;grid-template-columns:auto 1fr auto;grid-template-areas:"ic t check" "ic d check";column-gap:14px;row-gap:5px;align-items:start;
  padding:20px 22px;border:1.5px solid var(--border);border-radius:var(--radius-lg);background:var(--bg);transition:border-color .16s,background .16s,box-shadow .16s}
.mc-opt:hover{border-color:var(--accent-line)}
.mc-opt.is-active{border-color:var(--accent);background:color-mix(in oklch,var(--accent) 8%,var(--surface));box-shadow:0 0 0 3px color-mix(in oklch,var(--accent) 18%,transparent)}
.mc-ic{grid-area:ic;width:44px;height:44px;display:grid;place-items:center;border-radius:12px;background:var(--accent-soft);color:var(--accent-ink)}
.mc-ic svg{width:22px;height:22px;stroke:currentColor;fill:none;stroke-width:1.9}
.mc-t{grid-area:t;font-family:var(--font-display);font-weight:680;font-size:16.5px;letter-spacing:-.01em;align-self:center}
.mc-d{grid-area:d;color:var(--muted);font-size:13.5px;line-height:1.5}
.mc-check{grid-area:check;align-self:center;width:24px;height:24px;border-radius:50%;border:1.5px solid var(--border);display:grid;place-items:center;background:transparent;transition:.16s}
.mc-check svg{width:13px;height:13px;stroke:currentColor;fill:none;stroke-width:2.6;opacity:0}
.mc-opt.is-active .mc-check{background:var(--accent);border-color:var(--accent);color:var(--accent-on,#0f1b13)}
.mc-opt.is-active .mc-check svg{opacity:1}
.mc-cta{display:flex;align-items:center;gap:18px;flex-wrap:wrap}

/* date in programma */
.drow{display:grid;grid-template-columns:56px 1.4fr .9fr auto auto;gap:18px;align-items:center;padding:12px 0;border-top:1px solid var(--border)}
.drow:first-child{border-top:0}
.ddate{display:flex;flex-direction:column;align-items:center;justify-content:center;width:52px;height:52px;border:1px solid var(--border);border-radius:var(--radius-sm);background:var(--bg)}
.ddate .d{font-family:var(--font-display);font-size:20px;font-weight:760;line-height:1}
.ddate .m{font-family:var(--font-mono);font-size:10px;letter-spacing:.08em;text-transform:uppercase;color:var(--accent-ink);margin-top:3px}
.dinfo .dlabel,.ddur .dlabel{display:none}
.dinfo .dval{font-size:14.5px;font-weight:600;margin:0;display:flex;align-items:center;gap:7px}
.dinfo .dval svg{width:15px;height:15px;stroke:currentColor;fill:none;stroke-width:1.9;color:var(--accent-ink);flex:0 0 auto}
.dinfo .dnote{font-size:12.5px;color:var(--muted);margin:2px 0 0}
.ddur .dval{font-size:13.5px;font-weight:600;margin:0;display:flex;align-items:center;gap:7px;color:var(--muted);font-family:var(--font-mono)}
.ddur .dval svg{width:15px;height:15px;stroke:currentColor;fill:none;stroke-width:1.9;color:var(--accent-ink);flex:0 0 auto}
.dseats{font-family:var(--font-mono);font-size:12px;justify-self:start;white-space:nowrap}
.dseats.ok{color:#0f7a52}.dseats.low{color:#b23120}
.drow .btn{white-space:nowrap;padding:9px 16px;font-size:14px}
@media(max-width:760px){
  .drow{grid-template-columns:52px 1fr auto;grid-template-areas:"date info btn" "date dur btn" "date seats btn";row-gap:4px;column-gap:14px;align-items:center;padding:14px 0}
  .drow>.ddate{grid-area:date;align-self:center}.drow>.dinfo{grid-area:info}.drow>.ddur{grid-area:dur}.drow>.dseats{grid-area:seats}.drow>.btn{grid-area:btn;align-self:center}
}

/* selettore categoria del catalogo: consenti wrap su mobile */
@media(max-width:560px){[data-filter-group]{flex-wrap:wrap}}
