/* Piattaforma Brigaplan: stessi colori e caratteri della vetrina (sito/pubblico/index.html) */
:root {
  --paper: #F1F4F3; --paper-2: #E6ECEB; --sheet: #FBFCFC; --ink: #14212A; --muted: #55646D;
  --line: #C8D1D4; --line-strong: #9AA7AE; --accent: #C44917; --accent-deep: #A93E12; --on-accent: #FFFFFF;   /* #C44917: bianco sopra 4,87:1 (WCAG AA) */
  --blue: #2A68AE; --focus: #2A68AE; --ok: #2A7043; --ok-bg: #DCEFE2; --warn-bg: #FBEBD9; --err: #B3261E; --err-bg: #F9DEDC;
  --z-hot: #F6DCCD; --z-cold: #D3EAEE;
  --f-display: "Archivo", "Arial Narrow", "Helvetica Neue", Arial, sans-serif;
  --f-body: "Public Sans", system-ui, -apple-system, "Segoe UI", Roboto, "PingFang SC", "Microsoft YaHei", sans-serif;
  --f-mono: "IBM Plex Mono", ui-monospace, "SF Mono", Menlo, Consolas, monospace;
  --maxw: 1180px; --r: 10px;
  color-scheme: light;
}
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    --paper: #0E1519; --paper-2: #131C21; --sheet: #121C21; --ink: #E4EAEC; --muted: #93A3AA;
    --line: #2A3840; --line-strong: #46565F; --accent: #FF7440; --accent-deep: #FF9468; --on-accent: #1A0E08;
    --blue: #6FA8E6; --focus: #6FA8E6; --ok: #7BD39A; --ok-bg: #173323; --warn-bg: #3A2A17; --err: #FFB4AB; --err-bg: #4A1D1A;
    --z-hot: #4A2A1D; --z-cold: #163A3F;
    color-scheme: dark;
  }
}
:root[data-theme="dark"] {
  --paper: #0E1519; --paper-2: #131C21; --sheet: #121C21; --ink: #E4EAEC; --muted: #93A3AA;
  --line: #2A3840; --line-strong: #46565F; --accent: #FF7440; --accent-deep: #FF9468; --on-accent: #1A0E08;
  --blue: #6FA8E6; --focus: #6FA8E6; --ok: #7BD39A; --ok-bg: #173323; --warn-bg: #3A2A17; --err: #FFB4AB; --err-bg: #4A1D1A;
  --z-hot: #4A2A1D; --z-cold: #163A3F;
  color-scheme: dark;
}
*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }
body { margin: 0; background: var(--paper); color: var(--ink); font-family: var(--f-body); font-size: 1rem; line-height: 1.55;
  -webkit-font-smoothing: antialiased; min-height: 100vh; display: flex; flex-direction: column; }
h1, h2, h3 { font-family: var(--f-display); font-stretch: 112%; line-height: 1.1; margin: 0; letter-spacing: -0.01em; text-wrap: balance; }
h1 { font-size: clamp(1.6rem, 1.2rem + 1.6vw, 2.3rem); font-weight: 800; }
h2 { font-size: 1.2rem; font-weight: 750; margin-bottom: 12px; }
p { margin: 0; }
a { color: var(--blue); }
:focus-visible { outline: 3px solid var(--focus); outline-offset: 2px; }
.wrap { width: 100%; max-width: var(--maxw); margin: 0 auto; padding: 0 16px; }

/* testata */
.top { background: var(--sheet); border-bottom: 1px solid var(--line); position: sticky; top: 0; z-index: 5; }
.top .wrap { display: flex; align-items: center; justify-content: space-between; gap: 12px; min-height: 60px; flex-wrap: wrap; }
.logo { display: inline-flex; align-items: center; gap: 9px; text-decoration: none; color: var(--ink); font-family: var(--f-display);
  font-stretch: 118%; font-size: 1.25rem; font-weight: 500; }
.logo b { font-weight: 850; color: var(--accent); }
.logo svg { width: 24px; height: 24px; flex: none; }
.lm-wall, .lm-line { fill: none; stroke: var(--ink); stroke-width: 2.2; }
.lm-line { stroke-width: 1.4; }
.lm-acc { fill: var(--accent); }
.top-azioni { display: flex; align-items: center; gap: 14px; flex-wrap: wrap; font-size: .95rem; }
.top-azioni > a { color: var(--ink); text-decoration: none; font-weight: 600; }
.top-azioni > a:hover { color: var(--accent); }
.lingue { display: inline-flex; gap: 2px; border: 1px solid var(--line); border-radius: 999px; padding: 2px; }
.lingue a { text-decoration: none; color: var(--muted); padding: 3px 9px; border-radius: 999px; font-size: .85rem; font-weight: 600; }
.lingue a[aria-current] { background: var(--ink); color: var(--paper); }
.in-linea { display: inline; margin: 0; }
button.link { background: none; border: 0; padding: 0; color: var(--blue); font: inherit; cursor: pointer; text-decoration: underline; }
.top-azioni button.link { color: var(--ink); font-weight: 600; text-decoration: none; }

/* contenuto */
.contenuto { flex: 1; padding-top: 28px; padding-bottom: 40px; }
.piede { color: var(--muted); font-size: .85rem; padding-top: 18px; padding-bottom: 28px; border-top: 1px solid var(--line); display: grid; gap: 4px; }
.scheda { background: var(--sheet); border: 1px solid var(--line); border-radius: var(--r); padding: 28px 24px; margin: 0 auto; }
.scheda.stretta { max-width: 520px; }
.scheda.media { max-width: 720px; }
.scheda h1 { margin-bottom: 6px; }
.sotto { color: var(--muted); }
.scheda > .sotto { margin-bottom: 20px; }
.piccolo { font-size: .9rem; color: var(--muted); margin-top: 14px; }
.testata { display: flex; justify-content: space-between; align-items: flex-start; gap: 16px; margin-bottom: 22px; flex-wrap: wrap; }
.briciole { font-size: .9rem; margin-bottom: 4px; }

/* moduli */
.modulo { display: grid; gap: 16px; }
.modulo label { display: grid; gap: 6px; font-weight: 600; font-size: .95rem; }
.modulo small { font-weight: 400; color: var(--muted); }
input, select, textarea { font: inherit; color: var(--ink); background: var(--paper); border: 1px solid var(--line-strong); border-radius: 8px;
  padding: 10px 12px; width: 100%; min-height: 44px; }
textarea { resize: vertical; }
input[type="checkbox"], input[type="radio"] { width: auto; min-height: 0; accent-color: var(--accent); }
input[type="file"] { padding: 8px; background: var(--sheet); }
.due { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
@media (max-width: 560px) { .due { grid-template-columns: 1fr; } }
fieldset { border: 0; padding: 0; margin: 0; display: grid; gap: 8px; }
legend { font-weight: 600; font-size: .95rem; margin-bottom: 6px; }
.scelta-tipo { grid-template-columns: 1fr 1fr; }
@media (max-width: 560px) { .scelta-tipo { grid-template-columns: 1fr; } }
.modulo label.opzione { display: flex; gap: 10px; align-items: flex-start; border: 1px solid var(--line-strong); border-radius: 8px; padding: 12px; cursor: pointer; font-weight: 400; }
.opzione:has(input:checked) { border-color: var(--accent); box-shadow: inset 0 0 0 1px var(--accent); }
.opzione span { display: grid; gap: 2px; }
.opzione small { color: var(--muted); }
.modulo label.spunta { display: flex; gap: 10px; align-items: flex-start; font-weight: 400; }
.spunta input { margin-top: 4px; }
.nascosto { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.btn { display: inline-flex; align-items: center; justify-content: center; gap: 8px; min-height: 46px; padding: 10px 20px; border-radius: 8px;
  border: 1.5px solid transparent; font: inherit; font-weight: 700; text-decoration: none; cursor: pointer; }
.btn-primary { background: var(--accent); color: var(--on-accent); }
.btn-primary:hover { background: var(--accent-deep); }
.btn-ghost { border-color: var(--ink); color: var(--ink); background: transparent; }
.btn-ghost:hover { background: var(--ink); color: var(--paper); }
.btn-sm { min-height: 38px; padding: 6px 14px; font-size: .9rem; }
.btn[disabled] { opacity: .5; cursor: not-allowed; }
.bottoni { display: flex; gap: 10px; flex-wrap: wrap; }

/* avvisi e stati */
.avviso { background: var(--warn-bg); border-radius: 8px; padding: 12px 14px; margin-bottom: 18px; }
.avviso.ok { background: var(--ok-bg); border-left: 4px solid var(--ok); }
.avviso.errore { background: var(--err-bg); color: var(--ink); border-left: 4px solid var(--err); }
.avviso ul { margin: 0; padding-left: 18px; }
.stato { display: inline-block; font-size: .8rem; font-weight: 700; padding: 4px 10px; border-radius: 999px; background: var(--paper-2); color: var(--muted); white-space: nowrap; }
.stato-in_lavorazione, .stato-anteprima_in_controllo, .stato-in_revisione, .stato-progetto_richiesto { background: var(--warn-bg); color: var(--ink); }
.stato-anteprima_pronta { background: var(--ok-bg); color: var(--ok); }
.stato-attesa_cliente { background: var(--z-cold); color: var(--ink); }
.stato-errore { background: var(--err-bg); color: var(--err); }

/* elenco dei progetti */
.elenco-progetti { list-style: none; margin: 0; padding: 0; display: grid; gap: 10px; }
.elenco-progetti a { display: grid; grid-template-columns: 1fr auto; gap: 2px 14px; align-items: center; background: var(--sheet); border: 1px solid var(--line);
  border-radius: var(--r); padding: 14px 16px; text-decoration: none; color: var(--ink); }
.elenco-progetti a:hover { border-color: var(--line-strong); }
.elenco-progetti .nome { font-weight: 700; font-size: 1.05rem; }
.elenco-progetti .dettagli { color: var(--muted); font-size: .9rem; grid-column: 1; }
.elenco-progetti .stato { grid-column: 2; grid-row: 1 / span 2; }
@media (max-width: 480px) { .elenco-progetti a { grid-template-columns: 1fr; } .elenco-progetti .stato { grid-column: 1; grid-row: auto; justify-self: start; margin-top: 6px; } }
.vuoto { background: var(--sheet); border: 1px dashed var(--line-strong); border-radius: var(--r); padding: 32px 24px; text-align: center; display: grid; gap: 8px; }

/* pagina del progetto */
.griglia-progetto { display: grid; grid-template-columns: minmax(0, 1.2fr) minmax(0, 1fr); gap: 18px; align-items: start; }
@media (max-width: 900px) { .griglia-progetto { grid-template-columns: 1fr; } }
/* pagina del progetto: sul PC pianta | dialogo, poi il 3D a larghezza piena (la barra del visore ha bisogno di spazio) */
@media (min-width: 901px) { .griglia-progetto > .sezione-3d { grid-column: 1 / -1; grid-row: 2; } .griglia-progetto > .sezione-3d ~ section { grid-column: 2; grid-row: 1; } }
.sezione-3d h2 { margin-top: 0; }
.pianta-controllo { max-width: 1100px; }
.riquadro { background: var(--sheet); border: 1px solid var(--line); border-radius: var(--r); padding: 18px; margin-bottom: 18px; min-width: 0; }
.pianta { margin: 0 0 14px; }
.pianta img { width: 100%; height: auto; display: block; border: 1px solid var(--line); border-radius: 6px; background: #fff; }
.pianta figcaption { font-size: .85rem; color: var(--muted); margin-top: 6px; }
.vista3d { display: grid; gap: 8px; justify-items: start; }
.vista3d iframe { width: 100%; aspect-ratio: 4 / 3; border: 1px solid var(--line); border-radius: 6px; background: var(--paper-2); }
.nota-progettista { margin-top: 12px; background: var(--paper-2); border-radius: 8px; padding: 10px 12px; }
.attesa { display: flex; align-items: center; gap: 10px; background: var(--warn-bg); padding: 12px 14px; border-radius: 8px; }
.pallino { width: 10px; height: 10px; border-radius: 50%; background: var(--accent); flex: none; }
@media (prefers-reduced-motion: no-preference) { .pallino { animation: pulsa 1.2s ease-in-out infinite; } }
@keyframes pulsa { 50% { opacity: .25; } }
.messaggi { list-style: none; margin: 0 0 14px; padding: 0; display: grid; gap: 10px; max-height: 70vh; overflow-y: auto; }
.msg { border-radius: 10px; padding: 10px 12px; max-width: 92%; }
.msg .chi { display: block; font-size: .75rem; font-weight: 700; color: var(--muted); text-transform: uppercase; letter-spacing: .04em; margin-bottom: 2px; }
.msg .testo { white-space: pre-wrap; overflow-wrap: anywhere; }
.msg .testo.md { white-space: normal; }
.msg .testo.md p { margin: 0 0 .5em; }
.msg .testo.md > :last-child { margin-bottom: 0; }
.msg .testo.md ul, .msg .testo.md ol { margin: .2em 0 .6em; padding-left: 1.3em; }
.msg .testo.md ul { list-style: disc; }
.msg .testo.md ul ul { list-style: circle; margin-bottom: .2em; }
.msg .testo.md ol { list-style: decimal; }
.msg .testo.md li { margin: .15em 0; }
.msg.cliente { background: var(--z-hot); justify-self: end; }
.msg.assistente { background: var(--paper-2); justify-self: start; }
.msg.sistema { background: transparent; color: var(--muted); font-size: .9rem; justify-self: center; text-align: center; display: flex; gap: 8px; align-items: center; }
.risposta { gap: 10px; }
.esito { margin-top: 14px; }

/* tabelle di controllo */
.tabella { width: 100%; border-collapse: collapse; font-size: .9rem; display: block; overflow-x: auto; }
.tabella th, .tabella td { text-align: left; padding: 7px 8px; border-bottom: 1px solid var(--line); vertical-align: top; }
.tabella th { color: var(--muted); font-weight: 600; white-space: nowrap; }
.corto { max-width: 360px; overflow-wrap: anywhere; font-family: var(--f-mono); font-size: .8rem; }
.testo-mail { white-space: pre-wrap; max-width: 420px; overflow-wrap: anywhere; font-size: .85rem; }
.verifiche { white-space: pre-wrap; font-family: var(--f-mono); font-size: .8rem; max-height: 420px; overflow: auto; background: var(--paper); padding: 10px; border-radius: 6px; }
details summary { cursor: pointer; font-weight: 600; margin-top: 10px; }
@media (max-width: 600px) { .vista3d iframe { aspect-ratio: auto; height: 70vh; min-height: 420px; } }
.vista3d.piena { justify-items: stretch; }
.vista3d.piena iframe { aspect-ratio: auto; height: 70vh; min-height: 420px; }
.vista3d.piena .btn { justify-self: start; }
.btn-google { width: 100%; background: var(--sheet); color: var(--ink); border-color: var(--line-strong); font-weight: 600; }
.btn-google:hover { border-color: var(--ink); }
.btn-google svg { width: 18px; height: 18px; }
.oppure { display: flex; align-items: center; gap: 12px; color: var(--muted); font-size: .9rem; margin: 16px 0; }
.oppure::before, .oppure::after { content: ""; flex: 1; border-top: 1px solid var(--line); }
[hidden] { display: none !important; }
.fascia { margin-top: 14px; border: 1px solid var(--line); border-radius: 8px; padding: 12px 14px; }
.fascia h3 { font-size: 1rem; margin-bottom: 8px; }
.fascia dl { display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; margin: 0 0 6px; }
.fascia dl div { background: var(--paper-2); border-radius: 6px; padding: 8px 10px; }
.fascia dt { font-size: .8rem; color: var(--muted); }
.fascia dd { margin: 0; font-weight: 700; font-family: var(--f-display); font-size: 1.1rem; white-space: nowrap; }
@media (max-width: 420px) { .fascia dl { grid-template-columns: 1fr; } }
.banner-prova { background: var(--ink); color: var(--paper); text-align: center; font-size: .85rem; padding: 6px 16px; }
.completo { margin-top: 18px; border-top: 1px solid var(--line); padding-top: 16px; display: grid; gap: 10px; }
.completo h3 { font-size: 1.1rem; }
.opzione .prezzo { color: var(--ink); font-weight: 700; margin-top: 4px; }
.dati-account { display: grid; gap: 8px; margin: 18px 0 24px; }
.dati-account div { display: grid; grid-template-columns: 180px 1fr; gap: 10px; border-bottom: 1px solid var(--line); padding-bottom: 8px; }
.dati-account dt { color: var(--muted); font-size: .9rem; }
.dati-account dd { margin: 0; overflow-wrap: anywhere; }
@media (max-width: 520px) { .dati-account div { grid-template-columns: 1fr; gap: 2px; } }
.spazio-sopra { margin-top: 28px; }
.btn-pericolo { background: transparent; color: var(--err); border-color: var(--err); }
.btn-pericolo:hover { background: var(--err); color: var(--paper); }
.piede .societa { font-size: .8rem; }
.piede a { color: var(--muted); }
.spunta a { color: var(--blue); }
.msg.staff { background: var(--z-cold); justify-self: start; }
.msg.istruzione { background: var(--warn-bg); justify-self: center; font-size: .9rem; }
.versioni { display: flex; gap: 6px; align-items: center; flex-wrap: wrap; margin-bottom: 10px; color: var(--muted); font-size: .9rem; }
.versioni a { display: inline-grid; place-items: center; min-width: 32px; height: 32px; border: 1px solid var(--line-strong); border-radius: 6px; text-decoration: none; color: var(--ink); }
.versioni a[aria-current] { background: var(--ink); color: var(--paper); border-color: var(--ink); }
.riepilogo { display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap: 12px; margin-bottom: 18px; }
.cifra { background: var(--sheet); border: 1px solid var(--line); border-radius: var(--r); padding: 12px 14px; display: grid; gap: 2px; }
.cifra span { color: var(--muted); font-size: .85rem; font-weight: 600; }
.cifra b { font-family: var(--f-display); font-size: 1.7rem; line-height: 1.1; }
.cifra small { color: var(--muted); font-size: .8rem; }
.cifra.calda { border-color: var(--accent); box-shadow: inset 3px 0 0 var(--accent); }
.confronto { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 12px; }
.preventivo { border: 1px solid var(--line); border-radius: 8px; padding: 12px 14px; display: grid; gap: 6px; align-content: start; }
.importo { font-family: var(--f-display); font-size: 1.5rem; font-weight: 800; }
.importo small { font-family: var(--f-body); font-size: .8rem; font-weight: 400; color: var(--muted); }
.testo-note { white-space: pre-wrap; overflow-wrap: anywhere; }
.elenco-progetti .voce { display: grid; grid-template-columns: 1fr auto; gap: 2px 14px; background: var(--sheet); border: 1px solid var(--line); border-radius: var(--r); padding: 14px 16px; }
.lista-rivenditori { display: grid; gap: 8px; }
.mostra-3d { width: 100%; min-height: 120px; border-style: dashed; }
.salta { position: absolute; left: 8px; top: -60px; z-index: 10; background: var(--ink); color: var(--paper); padding: 10px 14px; border-radius: 6px; font-weight: 700; }
.salta:focus { top: 8px; }
.blocco-png { max-width: 100%; max-height: 360px; border: 1px solid var(--line); border-radius: 6px; background: #fff; margin: 8px 0; }

/* Controllo: visite della vetrina, tabelline affiancate */
.tabelle-visite { display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap: 12px; align-items: start; }
