/* CRM ML - Studenti del Conservatorio: pagina pubblica /conservatorio/ (CRMLMS_CV_Public).
   Disegno approvato il 30/09/2026: sole giallo che sorge sulla tastiera, colori
   del logo (giallo + rosa). Tutto sotto .crmlms-cv. Font Sora e Inter: li carica
   gia l'header del sito; qui solo le famiglie con i ripieghi di sistema.
   Le fasce sono a tutta larghezza: body.crmlms-cv-page azzera i contenitori del
   tema intorno al contenuto (vedi la prima regola).
   Il tema Kubio impone colore e stile a link, titoli, pulsanti e campi: selettori
   "html body[class] .crmlms-cv ..." e !important dove il tema sovrascrive.
   Mobile: a 375px nessuno scorrimento orizzontale. */

/* Il tema Kubio chiude il contenuto in sezione > riga > colonna, con 100px sopra e
   sotto, 1232px di larghezza massima e 15px di margine a ogni livello. Su questa
   pagina si azzerano (solo nel blocco del contenuto: header e footer esclusi),
   cosi le fasce colorate arrivano ai bordi e la pagina comincia sotto l'header.
   Se il tema cambiasse struttura la pagina resterebbe centrata nel contenitore:
   stretta ma leggibile. */
body.crmlms-cv-page .site > div:not(.header):not(.footer) > .wp-block,
body.crmlms-cv-page .site > div:not(.header):not(.footer) .wp-block-kubio-section__inner,
body.crmlms-cv-page .site > div:not(.header):not(.footer) .wp-block-kubio-row,
body.crmlms-cv-page .site > div:not(.header):not(.footer) .wp-block-kubio-row__inner,
body.crmlms-cv-page .site > div:not(.header):not(.footer) .wp-block-kubio-column,
body.crmlms-cv-page .site > div:not(.header):not(.footer) .wp-block-kubio-column__inner,
body.crmlms-cv-page .site > div:not(.header):not(.footer) .wp-block-kubio-column__align,
body.crmlms-cv-page .site > div:not(.header):not(.footer) .kubio-post-content {
  max-width: none !important; width: 100% !important;
  padding: 0 !important; margin: 0 !important;
}

.crmlms-cv {
  --cv-ground: #fffaf3;
  --cv-ink: #1e1b2e;
  --cv-muted: #5b5266;
  --cv-muted-2: #4a4155;
  --cv-pink: #be185d;
  --cv-pink-dark: #9d174d;
  --cv-pink-soft: #fce7f3;
  --cv-yellow: #fcc544;
  --cv-yellow-soft: #fff1c9;
  --cv-line: #f1dfe7;
  --cv-err: #b3261e;
  --cv-err-bg: #fdecea;
  --cv-display: 'Sora', 'Segoe UI', system-ui, -apple-system, sans-serif;
  --cv-body: 'Inter', 'Segoe UI', system-ui, -apple-system, Roboto, Arial, sans-serif;
  box-sizing: border-box;
  width: 100%; max-width: 100%;
  margin: 0;
  background: var(--cv-ground);
  color: var(--cv-ink);
  font-family: var(--cv-body);
  font-size: 17px; line-height: 1.55;
  overflow-wrap: anywhere;
}
.crmlms-cv *, .crmlms-cv *::before, .crmlms-cv *::after { box-sizing: border-box; }
.crmlms-cv-in { max-width: 1180px; margin: 0 auto; padding: 0 24px; }

html body[class] .crmlms-cv h1,
html body[class] .crmlms-cv h2,
html body[class] .crmlms-cv h3 {
  font-family: var(--cv-display) !important; color: var(--cv-ink) !important;
  margin: 0 !important; text-transform: none !important; letter-spacing: -.01em;
  text-wrap: balance;
}
html body[class] .crmlms-cv p { margin: 0; font-family: var(--cv-body); }
html body[class] .crmlms-cv .crmlms-cv-h1 { font-weight: 800 !important; font-size: clamp(38px, 5.2vw, 58px) !important; line-height: 1.05 !important; letter-spacing: -.02em; }
html body[class] .crmlms-cv .crmlms-cv-h1 em { color: var(--cv-pink); font-style: italic; }
html body[class] .crmlms-cv .crmlms-cv-h2 { font-weight: 700 !important; font-size: clamp(27px, 3.4vw, 36px) !important; line-height: 1.18 !important; }
html body[class] .crmlms-cv h3 { font-weight: 700 !important; font-size: 20px !important; line-height: 1.3 !important; }

/* Anteprima dell'amministratore */
.crmlms-cv-preview {
  background: var(--cv-yellow-soft); border-bottom: 2px solid var(--cv-yellow);
  padding: 12px 24px; font-size: 14.5px; font-weight: 600; text-align: center;
}

/* Pulsanti e link */
html body[class] .crmlms-cv a.crmlms-cv-btn,
html body[class] .crmlms-cv button.crmlms-cv-btn {
  display: inline-flex; align-items: center; justify-content: center;
  min-height: 54px; padding: 15px 26px !important; margin: 0 !important;
  border: 0 !important; border-radius: 14px !important;
  background: var(--cv-pink) !important; box-shadow: 0 8px 20px rgba(190, 24, 93, .22) !important;
  color: #fff !important; -webkit-text-fill-color: #fff !important;
  font: 700 17px/1.2 var(--cv-body) !important; text-decoration: none !important; text-transform: none !important; letter-spacing: 0 !important;
  cursor: pointer; transition: background .15s ease, transform .15s ease;
}
html body[class] .crmlms-cv a.crmlms-cv-btn:hover,
html body[class] .crmlms-cv button.crmlms-cv-btn:hover { background: var(--cv-pink-dark) !important; transform: translateY(-1px); }
html body[class] .crmlms-cv button.crmlms-cv-btn[disabled] { opacity: .65; cursor: wait; transform: none; }
html body[class] .crmlms-cv a.crmlms-cv-btn2 {
  display: inline-flex; align-items: center; justify-content: center;
  min-height: 54px; padding: 14px 24px !important; margin: 0 !important;
  border: 1px solid #e7d3dd !important; border-radius: 14px !important;
  background: #fff !important; box-shadow: none !important;
  color: var(--cv-ink) !important; -webkit-text-fill-color: var(--cv-ink) !important;
  font: 600 17px/1.2 var(--cv-body) !important; text-decoration: none !important;
}
html body[class] .crmlms-cv a.crmlms-cv-btn2:hover { border-color: var(--cv-pink) !important; }
html body[class] .crmlms-cv a:focus-visible,
html body[class] .crmlms-cv button:focus-visible { outline: 3px solid var(--cv-pink); outline-offset: 3px; }

/* ── Apertura ─────────────────────────────────────────────────────── */
.crmlms-cv-hero { padding: 56px 0; }
.crmlms-cv-hero-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 56px; align-items: center; }
.crmlms-cv-hero-txt { display: flex; flex-direction: column; gap: 22px; align-items: flex-start; min-width: 0; }
html body[class] .crmlms-cv .crmlms-cv-eyebrow {
  display: inline-flex; align-items: center; gap: 10px;
  padding: 9px 16px; margin: 0; border-radius: 999px;
  background: #fff; border: 1px solid #f4c6da;
  color: var(--cv-pink-dark); font-size: 12.5px; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; line-height: 1.35;
}
.crmlms-cv-dot { width: 9px; height: 9px; flex: none; border-radius: 50%; background: var(--cv-yellow); }
html body[class] .crmlms-cv .crmlms-cv-lead { font-size: 19px; line-height: 1.55; color: var(--cv-muted); }
.crmlms-cv-actions { display: flex; flex-wrap: wrap; gap: 12px; }
html body[class] .crmlms-cv .crmlms-cv-dove { font-size: 14.5px; color: var(--cv-muted); }
html body[class] .crmlms-cv .crmlms-cv-dove a { color: var(--cv-pink-dark) !important; font-weight: 600; text-decoration: underline !important; }

.crmlms-cv-visual { position: relative; height: 470px; min-width: 0; }
.crmlms-cv-sole { position: absolute; top: 0; right: 24px; width: 250px; height: 250px; border-radius: 50%; background: var(--cv-yellow); }
.crmlms-cv-orario {
  position: absolute; top: 84px; left: 0; right: 64px;
  padding: 24px; background: #fff; border: 1px solid var(--cv-line); border-radius: 24px;
  box-shadow: 0 18px 44px rgba(190, 24, 93, .14);
  display: flex; flex-direction: column; gap: 14px;
}
.crmlms-cv-orario-h { display: flex; justify-content: space-between; align-items: baseline; gap: 12px; }
.crmlms-cv-orario-h strong { font: 700 18px/1.2 var(--cv-display); }
.crmlms-cv-orario-h span { font-size: 13px; font-weight: 600; color: var(--cv-muted); }
.crmlms-cv-orario-g { display: grid; grid-template-columns: 58px minmax(0, 1fr); gap: 8px; align-items: stretch; font-size: 14px; font-weight: 600; }
.crmlms-cv-ora { display: flex; align-items: center; color: var(--cv-muted); font-variant-numeric: tabular-nums; }
.crmlms-cv-fascia { display: flex; align-items: center; padding: 0 16px; border-radius: 12px; color: var(--cv-muted); }
.crmlms-cv-fascia.is-tua { height: 96px; border-radius: 14px; background: var(--cv-yellow-soft); border: 2px solid var(--cv-yellow); color: var(--cv-ink); font-size: 16px; font-weight: 700; }
.crmlms-cv-fascia.is-silenzio { height: 38px; background: #ece6ea; }
.crmlms-cv-fascia.is-lezioni { height: 62px; background: var(--cv-pink-soft); }
.crmlms-cv-tasti {
  position: absolute; bottom: 0; left: 64px; right: 0; height: 72px;
  border-radius: 16px; border: 3px solid var(--cv-ink); overflow: hidden;
  background:
    repeating-linear-gradient(90deg, transparent 0 28px, #1e1b2e 28px 52px, transparent 52px 68px, #1e1b2e 68px 92px, transparent 92px 148px, #1e1b2e 148px 172px, transparent 172px 188px, #1e1b2e 188px 212px, transparent 212px 228px, #1e1b2e 228px 252px, transparent 252px 280px) 0 0 / 100% 62% no-repeat,
    repeating-linear-gradient(90deg, #fff 0 38px, #1e1b2e 38px 40px);
}

/* ── Tre modi ─────────────────────────────────────────────────────── */
.crmlms-cv-tre { padding: 52px 0; background: #fff; border-top: 1px solid var(--cv-line); border-bottom: 1px solid var(--cv-line); }
.crmlms-cv-cards { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 20px; margin-top: 24px; }
.crmlms-cv-card {
  padding: 24px; background: var(--cv-ground); border: 1px solid var(--cv-line); border-radius: 20px;
  display: flex; flex-direction: column; gap: 12px; min-width: 0;
}
.crmlms-cv-ico { width: 52px; height: 52px; border-radius: 14px; background: var(--cv-yellow-soft); display: flex; align-items: center; justify-content: center; color: var(--cv-ink); }
.crmlms-cv-ico svg { width: 26px; height: 26px; }
html body[class] .crmlms-cv .crmlms-cv-card p { font-size: 16px; line-height: 1.5; color: var(--cv-muted); }

/* ── Sala in cambio di musica ─────────────────────────────────────── */
.crmlms-cv-scambio { padding: 52px 0; background: var(--cv-pink); color: #fff; }
.crmlms-cv-scambio-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 56px; align-items: center; }
html body[class] .crmlms-cv .crmlms-cv-scambio .crmlms-cv-h2 { color: #fff !important; font-weight: 800 !important; font-size: clamp(30px, 3.8vw, 40px) !important; }
html body[class] .crmlms-cv .crmlms-cv-scambio p { margin-top: 14px; font-size: 18px; line-height: 1.5; color: #fff; }
html body[class] .crmlms-cv ul.crmlms-cv-voci { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 12px; }
html body[class] .crmlms-cv ul.crmlms-cv-voci li {
  display: flex; align-items: center; justify-content: space-between; gap: 16px; flex-wrap: wrap;
  margin: 0; padding: 15px 20px; border-radius: 14px;
  background: #fff; color: var(--cv-ink); font-size: 17px; font-weight: 600; list-style: none;
}
html body[class] .crmlms-cv ul.crmlms-cv-voci li::before { content: none; }
.crmlms-cv-voci strong { display: inline-flex; align-items: center; gap: 10px; color: var(--cv-pink-dark); font-weight: 700; white-space: nowrap; }
.crmlms-cv-voci svg { width: 20px; height: 20px; stroke-width: 2.4; }

/* ── Come funziona ────────────────────────────────────────────────── */
.crmlms-cv-come { padding: 52px 0; scroll-margin-top: 110px; }
html body[class] .crmlms-cv ol.crmlms-cv-passi { list-style: none; margin: 24px 0 0; padding: 0; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 20px; counter-reset: none; }
html body[class] .crmlms-cv ol.crmlms-cv-passi li { margin: 0; padding: 0; list-style: none; display: flex; flex-direction: column; gap: 10px; min-width: 0; }
html body[class] .crmlms-cv ol.crmlms-cv-passi li::before { content: none; }
.crmlms-cv-n { width: 44px; height: 44px; border-radius: 50%; background: var(--cv-yellow); display: flex; align-items: center; justify-content: center; font: 800 19px/1 var(--cv-display); color: var(--cv-ink); }
html body[class] .crmlms-cv .crmlms-cv-passi h3 { font-size: 19px !important; }
html body[class] .crmlms-cv .crmlms-cv-passi p { font-size: 15.5px; line-height: 1.5; color: var(--cv-muted); }

/* ── Tessera e modulo ─────────────────────────────────────────────── */
.crmlms-cv-tessera { padding: 56px 0 64px; background: var(--cv-yellow-soft); scroll-margin-top: 110px; }
.crmlms-cv-tessera-grid { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: 56px; align-items: start; }
.crmlms-cv-tessera-txt { display: flex; flex-direction: column; gap: 16px; position: sticky; top: 130px; }
html body[class] .crmlms-cv .crmlms-cv-tessera .crmlms-cv-h2 { font-weight: 800 !important; font-size: clamp(30px, 3.8vw, 40px) !important; }
html body[class] .crmlms-cv .crmlms-cv-tessera-txt p { font-size: 18px; line-height: 1.55; color: var(--cv-muted-2); }
html body[class] .crmlms-cv .crmlms-cv-tessera-txt p.crmlms-cv-small { font-size: 16px; }

.crmlms-cv-form, .crmlms-cv-ok {
  padding: 28px; background: #fff; border-radius: 24px; box-shadow: 0 18px 44px rgba(30, 27, 46, .10);
  display: flex; flex-direction: column; gap: 16px; min-width: 0;
}
.crmlms-cv-row { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; }
.crmlms-cv-field { display: flex; flex-direction: column; gap: 6px; min-width: 0; }
html body[class] .crmlms-cv .crmlms-cv-field label,
html body[class] .crmlms-cv .crmlms-cv-interessi legend { font: 600 14px/1.3 var(--cv-body); color: var(--cv-ink); margin: 0; padding: 0; }
html body[class] .crmlms-cv .crmlms-cv-field input,
html body[class] .crmlms-cv .crmlms-cv-field select,
html body[class] .crmlms-cv .crmlms-cv-field textarea {
  width: 100%; max-width: 100%; min-height: 48px; margin: 0; padding: 10px 14px;
  border: 1px solid #d9c9d2 !important; border-radius: 12px !important;
  background: #fff !important; color: var(--cv-ink) !important; box-shadow: none !important;
  font: 400 16px/1.4 var(--cv-body) !important;
}
html body[class] .crmlms-cv .crmlms-cv-field textarea { min-height: 96px; resize: vertical; }
html body[class] .crmlms-cv .crmlms-cv-field input:focus,
html body[class] .crmlms-cv .crmlms-cv-field select:focus,
html body[class] .crmlms-cv .crmlms-cv-field textarea:focus { outline: 2px solid var(--cv-pink); outline-offset: 1px; border-color: var(--cv-pink) !important; }
html body[class] .crmlms-cv .crmlms-cv-field [aria-invalid="true"] { border-color: var(--cv-err) !important; background: var(--cv-err-bg) !important; }
html body[class] .crmlms-cv .crmlms-cv-hint { font-size: 13px; color: var(--cv-muted); }
html body[class] .crmlms-cv .crmlms-cv-err { font-size: 13px; font-weight: 600; color: var(--cv-err); }
.crmlms-cv-err:empty { display: none; }

html body[class] .crmlms-cv fieldset.crmlms-cv-interessi { border: 0; margin: 0; padding: 0; min-width: 0; display: flex; flex-direction: column; gap: 8px; }
html body[class] .crmlms-cv label.crmlms-cv-chip input[type="radio"] { width: 18px; height: 18px; margin: 0; accent-color: #be185d; }
html body[class] .crmlms-cv label.crmlms-cv-chip:has(input:checked) { border-color: var(--cv-pink); background: var(--cv-pink-soft); }

/* Genitore: solo per gli studenti minorenni (con JavaScript compare quando serve) */
html body[class] .crmlms-cv fieldset.crmlms-cv-genitore {
  margin: 0; padding: 16px; min-width: 0; border: 2px solid var(--cv-yellow); border-radius: 16px; background: var(--cv-yellow-soft);
  display: flex; flex-direction: column; gap: 12px;
}
html body[class] .crmlms-cv fieldset.crmlms-cv-genitore legend { padding: 0 8px; font: 700 15px/1.3 var(--cv-body); color: var(--cv-ink); }
.crmlms-cv [data-cv-genitore][hidden] { display: none !important; }
.crmlms-cv-chips { display: flex; flex-wrap: wrap; gap: 8px; }
html body[class] .crmlms-cv label.crmlms-cv-chip {
  display: inline-flex; align-items: center; gap: 8px; min-height: 44px; padding: 8px 14px; margin: 0;
  border: 1px solid #d9c9d2; border-radius: 999px; background: #fff; cursor: pointer;
  font: 600 15px/1.2 var(--cv-body); color: var(--cv-ink);
}
html body[class] .crmlms-cv label.crmlms-cv-chip input { width: 18px; height: 18px; margin: 0; accent-color: #be185d; }
html body[class] .crmlms-cv label.crmlms-cv-chip:focus-within { outline: 2px solid var(--cv-pink); outline-offset: 2px; }

html body[class] .crmlms-cv .crmlms-cv-info {
  padding: 12px 14px; border: 1px solid var(--cv-line); border-radius: 12px; background: #fdfafb;
  font-size: 13px; line-height: 1.5; color: var(--cv-muted);
}
html body[class] .crmlms-cv .crmlms-cv-info a { color: var(--cv-pink-dark) !important; text-decoration: underline !important; }
/* Informativa a due livelli: il dettaglio si apre a un clic */
html body[class] .crmlms-cv .crmlms-cv-info details { margin: 8px 0 0; }
html body[class] .crmlms-cv .crmlms-cv-info summary { display: list-item; list-style: disclosure-closed inside; cursor: pointer; font-weight: 700; color: var(--cv-pink-dark); min-height: 28px; }
html body[class] .crmlms-cv .crmlms-cv-info details[open] > summary { list-style-type: disclosure-open; }
html body[class] .crmlms-cv .crmlms-cv-info summary:focus-visible { outline: 2px solid var(--cv-pink); outline-offset: 2px; }
html body[class] .crmlms-cv .crmlms-cv-info details p { margin: 8px 0 0; font-size: 13px; line-height: 1.5; color: var(--cv-muted); }
html body[class] .crmlms-cv label.crmlms-cv-check { display: flex; gap: 10px; align-items: flex-start; margin: 0; font: 400 15px/1.45 var(--cv-body); color: var(--cv-ink); cursor: pointer; }
html body[class] .crmlms-cv label.crmlms-cv-check input { flex: none; width: 20px; height: 20px; margin: 2px 0 0; accent-color: #be185d; }
html body[class] .crmlms-cv label.crmlms-cv-check em { color: var(--cv-muted); font-style: normal; font-size: 13px; }
html body[class] .crmlms-cv button.crmlms-cv-submit { width: 100%; }

.crmlms-cv-banner:empty { display: none; }
html body[class] .crmlms-cv .crmlms-cv-banner { padding: 12px 14px; border-radius: 12px; background: var(--cv-err-bg); color: var(--cv-err); font-size: 15px; font-weight: 600; }
html body[class] .crmlms-cv .crmlms-cv-ok { border: 2px solid var(--cv-yellow); }
html body[class] .crmlms-cv .crmlms-cv-ok h3 { font-size: 24px !important; }
html body[class] .crmlms-cv .crmlms-cv-ok p { font-size: 16.5px; color: var(--cv-muted-2); }

/* ── Pagina non ancora aperta ─────────────────────────────────────── */
.crmlms-cv-soon { max-width: 720px; margin: 0 auto; padding: 72px 24px 96px; display: flex; flex-direction: column; gap: 20px; align-items: flex-start; }

/* ── Schermi stretti ──────────────────────────────────────────────── */
@media (max-width: 980px) {
  .crmlms-cv-hero { padding: 36px 0 44px; }
  .crmlms-cv-hero-grid, .crmlms-cv-scambio-grid, .crmlms-cv-tessera-grid { grid-template-columns: minmax(0, 1fr); gap: 32px; }
  .crmlms-cv-tessera-txt { position: static; }
  .crmlms-cv-cards { grid-template-columns: minmax(0, 1fr); gap: 14px; }
  html body[class] .crmlms-cv ol.crmlms-cv-passi { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 24px 20px; }
  .crmlms-cv-visual { max-width: 560px; }
}
@media (max-width: 600px) {
  .crmlms-cv { font-size: 16.5px; }
  .crmlms-cv-in { padding: 0 20px; }
  .crmlms-cv-hero-txt { gap: 16px; }
  html body[class] .crmlms-cv .crmlms-cv-eyebrow { border-radius: 16px; font-size: 12px; letter-spacing: .1em; }
  html body[class] .crmlms-cv .crmlms-cv-lead { font-size: 17px; }
  .crmlms-cv-actions { width: 100%; }
  html body[class] .crmlms-cv .crmlms-cv-actions a { width: 100%; }
  .crmlms-cv-visual { height: 306px; }
  .crmlms-cv-sole { width: 150px; height: 150px; right: 0; }
  .crmlms-cv-orario { top: 44px; right: 0; padding: 16px; border-radius: 20px; gap: 10px; }
  .crmlms-cv-orario-h strong { font-size: 16px; }
  .crmlms-cv-orario-g { grid-template-columns: 52px minmax(0, 1fr); font-size: 13.5px; }
  .crmlms-cv-fascia { padding: 0 14px; }
  .crmlms-cv-fascia.is-tua { height: 76px; font-size: 15px; }
  .crmlms-cv-fascia.is-silenzio { height: 34px; }
  .crmlms-cv-fascia.is-lezioni { height: 48px; }
  .crmlms-cv-tasti { display: none; }
  .crmlms-cv-tre, .crmlms-cv-scambio, .crmlms-cv-come { padding: 36px 0; }
  .crmlms-cv-tessera { padding: 36px 0 44px; }
  html body[class] .crmlms-cv ol.crmlms-cv-passi { grid-template-columns: minmax(0, 1fr); }
  .crmlms-cv-row { grid-template-columns: minmax(0, 1fr); }
  .crmlms-cv-form, .crmlms-cv-ok { padding: 20px; border-radius: 20px; }
  html body[class] .crmlms-cv ul.crmlms-cv-voci li { flex-direction: column; align-items: flex-start; gap: 2px; padding: 12px 16px; font-size: 16px; }
  .crmlms-cv-voci svg { display: none; }
}

@media (prefers-reduced-motion: reduce) {
  html body[class] .crmlms-cv a.crmlms-cv-btn, html body[class] .crmlms-cv button.crmlms-cv-btn { transition: none; }
  html body[class] .crmlms-cv a.crmlms-cv-btn:hover, html body[class] .crmlms-cv button.crmlms-cv-btn:hover { transform: none; }
}
@media print {
  .crmlms-cv-preview, .crmlms-cv-visual, .crmlms-cv-form { display: none !important; }
}
