/* admin.css — aggiunte del Pannello duepuntip all'interfaccia di Wagtail.
   Usa le variabili di Wagtail (--w-color-…) così regge tema chiaro e scuro. */

.cms-pagina { padding-bottom: 64px; max-width: 1400px; }
.cms-pagina h2 { margin: 32px 0 12px; }
.cms-pagina h3 { margin: 20px 0 8px; }
.cms-aiuto { background: var(--w-color-surface-field-inactive, #f6f6f8); border-left: 3px solid var(--w-color-secondary, #007d7e);
             padding: 14px 18px; border-radius: 4px; max-width: 80ch; margin: 12px 0 20px; }
.cms-meta { color: var(--w-color-text-meta, #6b6b6b); font-size: .92em; }
.cms-vuoto { padding: 24px 0; color: var(--w-color-text-meta, #6b6b6b); }
.cms-azioni, .cms-azioni-riga { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; margin: 12px 0; }
.cms-azioni-riga { margin: 0; }
.cms-in-linea { display: inline-flex; gap: 6px; align-items: center; flex-wrap: wrap; }
.cms-in-linea input[type="text"] { max-width: 180px; padding: 4px 8px; }
.cms-etichetta { display: inline-block; padding: 2px 10px; border-radius: 999px; font-size: .8em; font-weight: 600;
                 background: var(--w-color-surface-field-inactive, #eef); color: var(--w-color-text-label, #333); white-space: nowrap; }
.cms-etichetta--verde { background: #d3f9d8; color: #1b5e20; }
.cms-etichetta--rossa { background: #ffe3e3; color: #a51111; }
.cms-stato--sperimentale { background: #fff3bf; color: #7a5300; }
.cms-stato--da_costruire { background: #e9ecef; color: #495057; }
.cms-conta { display: inline-block; min-width: 1.6em; padding: 0 .4em; border-radius: 999px; background: #c92a2a; color: #fff; font-size: .8em; text-align: center; }
.cms-schede { display: flex; flex-wrap: wrap; gap: 4px; margin: 8px 0 20px; border-bottom: 1px solid var(--w-color-border-field-default, #ddd); }
.cms-schede a { padding: 10px 14px; text-decoration: none; color: var(--w-color-text-label, #333); border-bottom: 3px solid transparent; font-weight: 600; }
.cms-schede a[aria-current="page"] { border-color: var(--w-color-secondary, #007d7e); color: var(--w-color-secondary, #007d7e); }
.cms-schede--regia { margin-top: 0; }
.cms-filtri { display: flex; flex-wrap: wrap; gap: 10px; align-items: center; margin: 12px 0 16px; }
.cms-filtri input[type="search"] { max-width: 420px; }
.cms-griglia { display: grid; gap: 16px; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); }
.cms-griglia--font { grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); }
.cms-griglia--set { grid-template-columns: repeat(auto-fill, minmax(200px, 1fr)); margin-bottom: 16px; }
.cms-card { display: block; background: var(--w-color-surface-page, #fff); border: 1px solid var(--w-color-border-field-default, #e2e2e2);
            border-radius: 8px; padding: 18px 20px; text-decoration: none; color: inherit; }
.cms-card--scelta { outline: 2px solid var(--w-color-secondary, #007d7e); }
.cms-card--regia { border-left: 4px solid var(--w-color-secondary, #007d7e); }
.cms-card__testa { display: flex; justify-content: space-between; gap: 12px; align-items: baseline; flex-wrap: wrap; }
.cms-card h2, .cms-card h3, .cms-card h4 { margin: 0 0 6px; }
.cms-riquadri { display: grid; gap: 16px; margin-bottom: 32px; }
.cms-riquadri .cms-card { padding: 22px 24px; }
.cms-plugin { margin-bottom: 16px; }
.cms-numeri { display: flex; flex-wrap: wrap; gap: 24px; margin: 8px 0 16px; }
.cms-numeri div { display: grid; }
.cms-numeri strong { font-size: 2rem; line-height: 1; }
.cms-tabella td { vertical-align: top; }
.cms-tabella--stretta { max-width: 760px; }
.cms-luce { display: inline-block; width: 10px; height: 10px; border-radius: 50%; background: #adb5bd; vertical-align: middle; }
.cms-luce--ok { background: #2f9e44; } .cms-luce--giallo { background: #f59f00; } .cms-luce--rosso { background: #e03131; }
.cms-dafare, .cms-funzioni { list-style: none; padding: 0; margin: 0; display: grid; gap: 6px; }
.cms-dafare li { padding-left: 16px; position: relative; }
.cms-dafare li::before { content: ""; position: absolute; left: 0; top: .55em; width: 8px; height: 8px; border-radius: 50%; background: #adb5bd; }
.cms-esito--rosso::before { background: #e03131 !important; } .cms-esito--giallo::before { background: #f59f00 !important; }
.cms-funzioni li { display: flex; flex-wrap: wrap; gap: 10px; align-items: center; padding: 8px 0; border-bottom: 1px solid var(--w-color-border-field-default, #eee); }
.cms-funzioni form { margin-left: auto; }
.cms-dati { display: grid; grid-template-columns: max-content 1fr; gap: 8px 24px; margin: 16px 0; }
.cms-dati dt { font-weight: 700; } .cms-dati dd { margin: 0; }
.cms-nuovo td { font-weight: 700; }
.cms-passi { display: grid; gap: 16px; padding-left: 20px; max-width: 900px; }
.cms-passi form { margin-top: 8px; }

/* semaforo nell'editor */
.cms-semaforo { border: 1px solid var(--w-color-border-field-default, #ddd); border-radius: 8px; padding: 12px 16px; margin-bottom: 8px; }
.cms-semaforo__testa { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.cms-semaforo__vedi { margin-left: auto; }
.cms-semaforo .cms-luce { width: 14px; height: 14px; }
.cms-semaforo--verde .cms-luce { background: #2f9e44; } .cms-semaforo--giallo .cms-luce { background: #f59f00; } .cms-semaforo--rosso .cms-luce { background: #e03131; }
.cms-semaforo ul { margin: 10px 0 0; padding-left: 20px; }
.cms-esito--rosso { color: #c92a2a; }

/* moduli della regia */
.cms-modulo fieldset { border: 1px solid var(--w-color-border-field-default, #ddd); border-radius: 8px; padding: 16px 20px 20px; margin: 0 0 20px; }
.cms-modulo legend { font-weight: 700; padding: 0 6px; }
.cms-modulo label { display: grid; gap: 4px; font-weight: 600; margin: 8px 0; }
.cms-campi { display: grid; gap: 4px 16px; grid-template-columns: repeat(auto-fill, minmax(240px, 1fr)); }
.cms-largo { grid-column: 1 / -1; }
.cms-scelte { display: grid; gap: 10px; grid-template-columns: repeat(auto-fill, minmax(230px, 1fr)); }
.cms-scelta { display: grid !important; grid-template-columns: auto 1fr; gap: 2px 10px !important; align-items: start; border: 1px solid var(--w-color-border-field-default, #ddd);
              border-radius: 8px; padding: 12px 14px; cursor: pointer; font-weight: 400 !important; }
.cms-scelta input { grid-row: span 3; margin-top: 4px; }
.cms-scelta span, .cms-scelta em { font-size: .9em; color: var(--w-color-text-meta, #666); }
.cms-scelta:has(input:checked) { border-color: var(--w-color-secondary, #007d7e); box-shadow: 0 0 0 1px var(--w-color-secondary, #007d7e); }
.cms-scelta--vuota { opacity: .75; }
.cms-scelta-riga { display: flex !important; align-items: center; gap: 8px; font-weight: 400 !important; }

/* libreria */
.cms-tema__prova { padding: 18px; display: grid; gap: 8px; margin-bottom: 12px; border: 1px solid rgba(0,0,0,.08); }
.cms-tema__occhiello { font-size: .72rem; letter-spacing: .14em; margin: 0; }
.cms-tema__titolo { font-size: 1.6rem; margin: 0; line-height: 1.1; }
.cms-tema__bottone { justify-self: start; padding: 8px 14px; font-size: .85rem; font-weight: 600; }
.cms-palette { display: flex; align-items: center; gap: 6px; padding: 14px; border-radius: 6px; margin-bottom: 10px; border: 1px solid rgba(0,0,0,.08); }
.cms-palette span { width: 22px; height: 22px; border-radius: 50%; border: 1px solid rgba(0,0,0,.1); }
.cms-palette strong { margin-left: auto; font-size: 1.4rem; }
.cms-palette em { font-style: normal; font-size: .8rem; padding: 6px 10px; border-radius: 4px; font-weight: 600; }
.cms-font-prova { font-size: 1.6rem; margin: 0 0 4px; line-height: 1.2; }
.cms-icone { display: grid; gap: 8px; grid-template-columns: repeat(auto-fill, minmax(96px, 1fr)); }
.cms-icone figure, .cms-icona-scelta { margin: 0; display: grid; justify-items: center; gap: 6px; padding: 12px 6px; border: 1px solid var(--w-color-border-field-default, #e5e5e5);
                                       border-radius: 6px; font-size: 26px; background: var(--w-color-surface-page, #fff); color: inherit; cursor: pointer; }
.cms-icone figcaption, .cms-icona-scelta span { font-size: 11px; color: var(--w-color-text-meta, #666); word-break: break-all; text-align: center; }
.cms-icona-scelta:hover, .cms-icona-scelta:focus-visible { border-color: var(--w-color-secondary, #007d7e); }
.cms-colore { display: inline-block; width: 14px; height: 14px; border-radius: 3px; border: 1px solid rgba(0,0,0,.2); vertical-align: middle; margin-right: 6px; }
.cms-ricetta { padding-left: 18px; }

/* selettore di icone */
.cms-icona-apri { margin-top: 6px; }
.cms-icona-anteprima { display: inline-flex; font-size: 28px; vertical-align: middle; margin-left: 10px; }
.cms-finestra { position: fixed; inset: 0; z-index: 1000; background: rgba(0,0,0,.45); display: grid; place-items: center; padding: 24px; }
.cms-finestra[hidden] { display: none; }
.cms-finestra__box { background: var(--w-color-surface-page, #fff); color: var(--w-color-text-context, #222); border-radius: 10px; width: min(960px, 100%);
                     max-height: 86vh; overflow: auto; padding: 18px 20px; box-shadow: 0 30px 80px rgba(0,0,0,.35); }
.cms-finestra__testa { display: flex; gap: 8px; margin-bottom: 14px; position: sticky; top: -18px; background: inherit; padding: 6px 0; }
.cms-finestra__testa input { flex: 1; }
.cms-icone--scelta { grid-template-columns: repeat(auto-fill, minmax(90px, 1fr)); }

/* tema: anteprima colori */
.cms-mini-sito { display: grid; gap: 6px; padding: 18px; border-radius: 8px; max-width: 420px; border: 1px solid rgba(0,0,0,.1); margin: 12px 0; }
.cms-mini-occhiello { font-size: .7rem; letter-spacing: .14em; font-weight: 700; }
.cms-mini-bottone { justify-self: start; padding: 8px 14px; border-radius: 4px; font-weight: 600; }
.cms-mini-alt { padding: 8px 12px; border: 1px solid; border-radius: 4px; font-size: .85em; }
.cms-contrasti { list-style: none; padding: 0; display: grid; gap: 2px; }
.cms-ok { color: #2b8a3e; } .cms-ko { color: #c92a2a; font-weight: 700; }
input.cms-colore, input[type="color"] { width: 64px; height: 40px; padding: 2px; }

/* editor: per i clienti l'aspetto delle sezioni e i comandi di struttura non ci sono
   (il server rifiuta comunque ogni modifica: nucleo/permessi.py) */
.cms-cliente .w-panel:has(> .w-panel__content > .cms-aspetto) { display: none !important; }
.cms-cliente #corpo-root > [data-streamfield-stream-container] > div:not([data-streamfield-child]) { display: none !important; }
.cms-cliente .cms-sezione-bloccata > section > .w-panel__header .w-panel__controls { display: none !important; }
.cms-evidenziato { outline: 3px solid #f59f00 !important; outline-offset: 4px; border-radius: 4px; transition: outline-color .4s; }

/* marchio */
.cms-logo { width: 44px; height: 44px; border-radius: 10px; background: #115CFA; color: #fff; display: grid; place-items: center;
            font: 800 21px/1 system-ui, sans-serif; letter-spacing: -.04em; margin: 0 auto; }