/* =====================================================================
 * style.css — SOLO GRUPA · Modulo d'ordine serramenti
 * Palette: bianco · grigio scuro · arancione
 * Sezioni: 1 base · 2 toolbar · 3 editor · 4 serramenti · 5 coprifili
 *          6 modali/archivio/impostazioni · 7 documento (anteprima+stampa)
 *          8 responsive · 9 stampa
 * ===================================================================== */

:root {
  --orange: #f28a1e;
  --orange-2: #f7a04b;
  --orange-soft: #fff3e6;
  --orange-line: #f6c18d;
  --dark: #2e3239;
  --dark-2: #444a53;
  --grey: #6b717b;
  --line: #d4d7dc;
  --line-2: #e7e9ec;
  --bg: #f2f3f5;
  --white: #fff;
  --row-alt: #f4f6fa;
  --red: #c62828;
  --red-soft: #fdecec;
  --green: #2e7d32;
  --radius: 8px;
  --shadow: 0 1px 2px rgba(0,0,0,.06), 0 2px 8px rgba(0,0,0,.05);
  --font: "Segoe UI", system-ui, -apple-system, "Helvetica Neue", Arial, sans-serif;
}

/* ============================ 1. BASE ================================ */
*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }
body {
  margin: 0; font-family: var(--font); font-size: 14px; color: var(--dark);
  background: var(--bg); line-height: 1.35;
}
body.modal-open { overflow: hidden; }
button, input, select, textarea { font: inherit; color: inherit; }
input, select, textarea {
  width: 100%; border: 1px solid var(--line); border-radius: 5px; background: var(--white);
  padding: 7px 8px; min-height: 36px; outline: none; transition: border-color .15s, box-shadow .15s;
}
textarea { resize: vertical; min-height: 36px; }
input:focus, select:focus, textarea:focus { border-color: var(--orange); box-shadow: 0 0 0 3px rgba(242,138,30,.18); }
input.err, select.err, textarea.err, .err > .vgrid, .chips.err, .cw.err .chips {
  border-color: var(--red) !important; background: var(--red-soft); box-shadow: 0 0 0 2px rgba(198,40,40,.15);
}
input.warn { border-color: #e0a100; background: #fff8e1; }
.upper { text-transform: uppercase; }
.num { text-align: center; }
[hidden] { display: none !important; }
.print-only { display: none; }

.btn {
  display: inline-flex; align-items: center; justify-content: center; gap: 6px;
  border: 1px solid var(--line); background: var(--white); border-radius: 6px;
  padding: 9px 16px; min-height: 40px; cursor: pointer; font-weight: 600; letter-spacing: .2px;
}
.btn:hover { border-color: var(--grey); }
.btn.primary { background: var(--dark); border-color: var(--dark); color: #fff; }
.btn.primary:hover { background: #1f2227; }
.btn.accent { background: var(--orange); border-color: var(--orange); color: #fff; }
.btn.accent:hover { background: #df7a10; }
.btn.danger { color: var(--red); border-color: #e9b7b7; }
.btn.danger:hover { background: var(--red-soft); }
.btn.sm { padding: 5px 10px; min-height: 32px; font-size: 13px; }
.link-btn { background: none; border: 0; color: var(--orange); font-weight: 600; cursor: pointer; padding: 4px 0; text-align: left; }
.link-btn:hover { text-decoration: underline; }
.mini { border: 1px solid var(--line); background: #fafafa; border-radius: 5px; padding: 0 10px; cursor: pointer; font-size: 12px; font-weight: 700; color: var(--dark-2); }
.mini:hover { background: var(--orange-soft); border-color: var(--orange); }
.hint { color: var(--grey); font-size: 12.5px; margin: 6px 0 0; }

/* ============================ 2. TOOLBAR ============================= */
.topbar {
  position: sticky; top: 0; z-index: 50; display: flex; align-items: center; gap: 14px;
  background: var(--dark); color: #fff; padding: 8px 16px; box-shadow: 0 2px 8px rgba(0,0,0,.2);
  border-bottom: 3px solid var(--orange);
}
.topbar-brand { display: flex; align-items: center; gap: 10px; min-width: 0; }
.brand-logo { height: 44px; width: auto; background: #fff; border-radius: 6px; padding: 3px 8px; }
.foot-logo { height: 34px; width: auto; opacity: .85; margin-bottom: 4px; }
.brand-txt { display: flex; flex-direction: column; line-height: 1.15; min-width: 0; }
.brand-txt strong { font-size: 14px; letter-spacing: .3px; }
.brand-txt span { font-size: 12px; color: #c9ccd1; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 220px; }
.toolbar { display: flex; gap: 6px; flex-wrap: wrap; flex: 1; justify-content: center; }
.tbtn {
  display: inline-flex; align-items: center; gap: 7px; background: rgba(255,255,255,.08);
  border: 1px solid rgba(255,255,255,.14); color: #fff; border-radius: 6px; padding: 8px 13px;
  min-height: 42px; cursor: pointer; font-weight: 600; font-size: 13.5px; text-transform: uppercase; letter-spacing: .3px;
}
.tbtn:hover { background: rgba(255,255,255,.16); }
.tbtn.accent { background: var(--orange); border-color: var(--orange); }
.tbtn.accent:hover { background: #df7a10; }
.tbtn .ic { font-size: 16px; line-height: 1; }
@media (max-width: 1640px) {
  .tbtn { padding: 7px 10px; font-size: 12.5px; gap: 5px; }
  .brand-txt span { max-width: 150px; }
}
@media (max-width: 2000px) and (min-width: 1101px) {
  .tbtn[data-action="settings"] span:not(.ic), .tbtn[data-action="toggle-menu"] span:not(.ic) { display: none; }
  .autosave span { max-width: 120px; white-space: normal; line-height: 1.2; }
}
@media (max-width: 1500px) and (min-width: 1101px) { .brand-txt { display: none; } }
@media (max-width: 1320px) and (min-width: 1101px) { .tbtn { padding: 7px 8px; gap: 4px; } .chk-pill { padding: 6px 10px; } }
@media (max-width: 2000px) and (min-width: 1101px) { .autosave span { display: none; } }
.tmenu { position: relative; }
.tmenu-list {
  display: none; position: absolute; right: 0; top: calc(100% + 6px); background: #fff; color: var(--dark);
  border-radius: 8px; box-shadow: 0 8px 28px rgba(0,0,0,.22); min-width: 270px; padding: 6px; z-index: 60;
}
.tmenu.open .tmenu-list { display: block; }
.tmenu-list button { display: block; width: 100%; text-align: left; border: 0; background: none; padding: 10px 12px; border-radius: 5px; cursor: pointer; }
.tmenu-list button:hover { background: var(--orange-soft); }
.tmenu-list hr { border: 0; border-top: 1px solid var(--line-2); margin: 4px 0; }
.autosave { display: flex; align-items: center; gap: 7px; font-size: 12px; color: #c9ccd1; white-space: nowrap; }
.autosave i { width: 9px; height: 9px; border-radius: 50%; background: #8a9099; }
.autosave.ok i { background: #4caf50; }
.autosave.warn i { background: var(--orange); }
.autosave.busy i { background: #ffd54f; animation: pulse .8s infinite alternate; }
@keyframes pulse { to { opacity: .3; } }

/* ============================ 3. EDITOR ============================== */
.editor { max-width: 1680px; margin: 0 auto; padding: 16px; display: flex; flex-direction: column; gap: 14px; }
.card { background: var(--white); border-radius: var(--radius); box-shadow: var(--shadow); border: 1px solid var(--line-2); }
.sec { padding: 0 14px 14px; overflow: hidden; }
.sec-h {
  margin: 0 -14px 12px; padding: 8px 14px; font-size: 15px; font-weight: 800; letter-spacing: .3px; color: var(--dark);
  background: linear-gradient(180deg, var(--orange-2), var(--orange)); border-bottom: 1px solid #e07c12;
}
.sec-h small { font-weight: 600; font-size: 12px; }
.sec-sub { font-weight: 600; font-size: 13px; }

.doc-header { display: grid; grid-template-columns: auto 1fr auto; gap: 20px; align-items: center; padding: 12px 18px; position: relative; overflow: hidden; }
.doc-header::after {
  content: ""; position: absolute; right: -10px; top: 0; bottom: 0; width: 70px; pointer-events: none;
  background: repeating-linear-gradient(115deg, transparent 0 10px, #e2e4e8 10px 18px, transparent 18px 24px, var(--orange) 24px 34px);
  opacity: .85;
}
.dh-logo { height: 76px; width: auto; }
.dh-title { border-left: 3px solid var(--orange); padding-left: 18px; }
.dh-title h1 { margin: 0; font-size: 34px; font-weight: 900; letter-spacing: .5px; color: var(--dark); line-height: 1.05; }
.dh-title p { margin: 3px 0 0; font-weight: 700; color: var(--dark-2); }
.dh-title .dh-doc { font-weight: 500; font-size: 14px; color: var(--grey); }
.dh-title .dh-doc b { color: var(--orange); font-weight: 800; }
.dh-lab { font-size: 11.5px; font-weight: 700; color: var(--grey); text-transform: uppercase; }
.dh-fields { grid-column: 1 / -1; display: grid; grid-template-columns: minmax(260px,1.2fr) minmax(220px,1fr) 190px; gap: 12px; padding-top: 12px; margin-right: 60px; border-top: 1px solid var(--line-2); position: relative; z-index: 1; }
.ref-sum { margin: 0; padding: 8px 10px; background: var(--row-alt); border-radius: 6px; font-size: 14px; line-height: 1.35; }
.ref-sum small { color: var(--grey); font-size: 12px; }
.doc .f.fstack { flex-direction: column; align-items: stretch; gap: .2mm; }
.doc .f.fstack .fv { white-space: nowrap; font-weight: 700; font-size: 6.6pt; min-height: 3.2mm; }
.dh-side { display: flex; flex-direction: column; gap: 8px; align-items: stretch; margin-right: 60px; z-index: 1; }
.tipo-switch { display: flex; gap: 8px; border: 2px solid var(--orange); border-radius: 10px; padding: 6px; background: #fff; }
.tipo-switch.err { border-color: var(--red); background: var(--red-soft); }
.tipo-opt { position: relative; cursor: pointer; }
.tipo-opt input { position: absolute; opacity: 0; width: 1px; height: 1px; }
.tipo-opt span {
  display: flex; align-items: center; gap: 8px; padding: 8px 14px; border-radius: 6px;
  font-weight: 900; font-size: 18px; letter-spacing: .3px; color: var(--dark);
}
.tipo-opt span::before {
  content: ""; width: 20px; height: 20px; border: 2.5px solid var(--dark); border-radius: 4px; background: #fff;
  display: inline-flex; align-items: center; justify-content: center; font-size: 15px; line-height: 1;
}
.tipo-opt input:checked + span { background: var(--orange-soft); }
.tipo-opt input:checked + span::before { content: "✓"; background: var(--orange); border-color: var(--orange); color: #fff; }
.tipo-opt input:focus-visible + span { box-shadow: 0 0 0 3px rgba(242,138,30,.35); }
.stato-sel { display: flex; align-items: center; gap: 8px; font-size: 12px; font-weight: 700; color: var(--grey); text-transform: uppercase; }
.stato-sel select { min-height: 32px; padding: 4px 8px; font-weight: 700; color: var(--dark); }

.ordine-banner {
  display: none; background: var(--orange); color: #fff; font-weight: 900; font-size: 20px; letter-spacing: .5px;
  text-align: center; padding: 12px 16px; border-radius: var(--radius); box-shadow: var(--shadow);
}
body.is-ordine .ordine-banner { display: block; }

.grid-4 { display: grid; grid-template-columns: 1.35fr 1fr .9fr 1.45fr; gap: 14px; }
.grid-2 { display: grid; grid-template-columns: minmax(0,1.8fr) minmax(0,.7fr); gap: 14px; }
.fgrid { display: grid; grid-template-columns: 1fr 1fr; gap: 9px 10px; }
.fgrid.one { grid-template-columns: 1fr; }
.span2 { grid-column: span 2; }
.fld { display: flex; flex-direction: column; gap: 3px; font-size: 12px; font-weight: 700; color: var(--dark-2); text-transform: uppercase; letter-spacing: .2px; }
.fld input, .fld select, .fld textarea { text-transform: none; font-weight: 500; font-size: 14px; letter-spacing: 0; color: var(--dark); }
.fld input.upper { text-transform: uppercase; }
.fld-pair { display: grid; grid-template-columns: 1fr 1.3fr; gap: 8px; }
.req { color: var(--orange); }
.inline-btn { display: flex; gap: 6px; }
.inline-btn input { flex: 1; font-weight: 700 !important; }

.cfg { display: flex; flex-direction: column; gap: 10px; }
.cfg-g { display: grid; grid-template-columns: 110px 1fr; gap: 6px 8px; align-items: center; }
.cfg-l { font-weight: 800; font-size: 13px; }
.altro-inp { grid-column: 2; min-height: 32px; }
.chips { display: flex; flex-wrap: wrap; gap: 5px; }
.chip {
  border: 1px solid var(--line); background: #fff; border-radius: 16px; padding: 5px 11px; cursor: pointer;
  font-size: 13px; font-weight: 600; min-height: 32px; display: inline-flex; align-items: center; gap: 5px;
}
.chip::before { content: ""; width: 12px; height: 12px; border: 1.5px solid var(--grey); border-radius: 3px; }
.chip.on { background: var(--orange-soft); border-color: var(--orange); color: #9a4d00; }
.chip.on::before { background: var(--orange); border-color: var(--orange); box-shadow: inset 0 0 0 2px #fff; }
.chip:hover { border-color: var(--orange); }
.chip.sm { padding: 3px 8px; min-height: 30px; font-size: 12.5px; }

/* ============================ 4. SERRAMENTI ========================== */
.items-sec { padding-bottom: 12px; }
.items-head { display: flex; align-items: stretch; justify-content: space-between; margin: 0 -14px 0; background: linear-gradient(180deg, var(--orange-2), var(--orange)); }
.items-head .sec-h { margin: 0; background: none; border: 0; flex: 1; }
.items-tools { display: flex; align-items: center; gap: 12px; padding: 0 14px; font-size: 12.5px; color: var(--dark); font-weight: 600; white-space: nowrap; }
.mm-tag { background: #fff; border-radius: 12px; padding: 3px 10px; }
.count { background: var(--dark); color: #fff; border-radius: 12px; padding: 3px 10px; }
.scalate-note { display: none; margin: 10px 0 0; padding: 7px 12px; border-left: 4px solid var(--orange); background: var(--orange-soft); font-weight: 700; font-size: 13px; color: #8a4500; }
body.is-ordine .scalate-note { display: block; }

.items-scroll { overflow-x: auto; margin: 10px -14px 0; padding: 0 14px 4px; -webkit-overflow-scrolling: touch; }
.items-grid { min-width: 1500px; }
.ig-head, .item {
  display: grid;
  grid-template-columns: 38px 52px minmax(100px,1fr) 196px minmax(120px,1fr) 48px 74px 74px 118px 92px 172px 184px minmax(150px,1.6fr) 100px;
  gap: 0;
}
.ig-head > div {
  background: var(--dark); color: #fff; font-weight: 700; font-size: 11.5px; text-align: center; padding: 8px 4px;
  border-right: 1px solid #5a6069; display: flex; flex-direction: column; justify-content: center; align-items: center; line-height: 1.15;
}
.ig-head > div:first-child { border-top-left-radius: 5px; }
.ig-head > div:last-child { border-top-right-radius: 5px; border-right: 0; }
.ig-head small { font-weight: 500; font-size: 10px; opacity: .85; }
.ig-head .al4 { display: grid; grid-template-columns: repeat(4,1fr); width: 100%; margin-top: 4px; border-top: 1px solid #5a6069; padding-top: 3px; }
.ig-head .al4 i { font-style: normal; }
.item { border-bottom: 1px solid var(--line); border-left: 1px solid var(--line); background: #fff; position: relative; }
.item:nth-child(even) { background: var(--row-alt); }
.item.flash { animation: flash .9s; }
@keyframes flash { from { background: #ffe0bd; } }
.item.err { box-shadow: inset 0 0 0 2px var(--red); }
.item > .c { border-right: 1px solid var(--line); padding: 5px 4px; display: flex; align-items: center; min-width: 0; }
.item .c input, .item .c select, .item .c textarea { min-height: 34px; padding: 5px 6px; font-size: 13.5px; }
.c-pos { justify-content: center; }
.pos-n { font-weight: 900; font-size: 18px; color: var(--dark); }
.item .mm { font-size: 15px !important; font-weight: 700; text-align: center; letter-spacing: .3px; }
.c-ap { gap: 4px; }
.c-tip { flex-direction: column; align-items: stretch !important; gap: 3px; justify-content: center; }
.item .c .tip-altro { min-height: 30px; font-size: 12.5px; }
.mod2 { display: flex; flex-direction: column; gap: 3px; width: 100%; }
.item .c .mod2 .cat-link { align-self: flex-start; }
.item .c .mod2 select { min-height: 30px; padding: 3px 4px; font-size: 12.5px; }
.item .c .mod2 select[data-f="modello"] { font-weight: 700; }
.item .c .mod2 select:disabled { background: #f3f4f6; color: #999; }
.ap-ico { color: var(--dark-2); display: inline-flex; flex: 0 0 22px; }
.c-vet .vgrid { display: grid; grid-template-columns: 1fr 1fr; gap: 2px 4px; width: 100%; padding: 2px; border: 1px solid transparent; border-radius: 4px; }
.vchk { display: flex; align-items: center; gap: 4px; font-size: 12.5px; cursor: pointer; white-space: nowrap; }
.item .c .vchk input, .vchk input { width: 15px; height: 15px; min-height: 0; padding: 0; accent-color: var(--orange); margin: 0; flex: 0 0 auto; }
.c-al .al4 { display: grid; grid-template-columns: repeat(4,1fr); gap: 3px; width: 100%; }
.c-al .al4 label { display: block; }
.c-al .al4 i { display: none; font-style: normal; font-size: 10.5px; font-weight: 700; color: var(--grey); text-align: center; }
.c-al .mm { font-size: 13.5px !important; padding: 5px 2px !important; }
.c-note textarea { min-height: 34px; height: 38px; }
.c-act { flex-wrap: wrap; gap: 3px; justify-content: center; align-content: center; }
.ib {
  border: 1px solid var(--line); background: #fff; border-radius: 5px; min-width: 27px; height: 27px; cursor: pointer;
  font-size: 13px; display: inline-flex; align-items: center; justify-content: center; gap: 4px; padding: 0 4px;
}
.ib span { display: none; font-size: 12px; font-weight: 600; }
.ib:hover { border-color: var(--orange); background: var(--orange-soft); }
.ib.danger:hover { border-color: var(--red); background: var(--red-soft); }
.item.has-override [data-item-action="details"] { border-color: var(--orange); background: var(--orange); color: #fff; }
.item-details {
  grid-column: 1 / -1; display: flex; flex-wrap: wrap; gap: 10px 18px; padding: 10px 12px 12px 50px;
  background: var(--orange-soft); border-top: 1px dashed var(--orange-line); border-right: 1px solid var(--line);
}
.item-details label { display: flex; align-items: center; gap: 6px; font-size: 12.5px; font-weight: 700; }
.item-details select { width: 200px; min-height: 32px; padding: 4px; }
.item-details input { width: 140px; min-height: 32px; }
.item-details .grow { flex: 1; min-width: 300px; }
.item-details .grow input { width: auto; flex: 1; }
.items-foot { display: flex; align-items: center; gap: 14px; flex-wrap: wrap; margin-top: 12px; }

/* ============================ 5. COPRIFILI =========================== */
.copr-scroll { overflow-x: auto; -webkit-overflow-scrolling: touch; }
.copr-head, .copr { display: grid; grid-template-columns: 26px minmax(130px,1fr) minmax(160px,1.1fr) 56px 92px minmax(150px,1.1fr) 150px 96px; gap: 8px; align-items: center; min-width: 930px; }
.copr .cf select:disabled { background: #f3f4f6; color: #999; }
.ro-v { display: inline-flex; align-items: center; justify-content: center; min-height: 36px; width: 100%; padding: 4px 6px; border-radius: 5px; background: #eef0f3; font-weight: 700; font-size: 13px; white-space: nowrap; }
.copr-act { display: flex; gap: 3px; justify-content: flex-end; }
.copr-legacy { grid-column: 1 / -1; font-size: 12px; color: #8a4500; background: var(--orange-soft); border-left: 3px solid var(--orange); padding: 4px 8px; }
.copr.flash { animation: flash .9s; }
.copr-head { font-size: 11.5px; font-weight: 700; color: #fff; background: var(--dark); padding: 7px 8px; border-radius: 5px 5px 0 0; }
.copr { padding: 7px 8px; border: 1px solid var(--line); border-top: 0; }
.copr:nth-child(even) { background: var(--row-alt); }
.copr .pos-n { font-size: 15px; text-align: center; }
.cw { display: flex; align-items: center; gap: 6px; border-radius: 6px; }
.cw .chips { flex-wrap: nowrap; }
.cw .mm.sm { width: 70px; min-height: 30px; }
.cbar { display: flex; flex-direction: column; gap: 2px; }
.cbar input { font-weight: 700; font-size: 15px; }
.cbx { font-size: 10.5px; color: var(--grey); text-align: center; line-height: 1.25; }
.cbx b { color: var(--dark-2); font-weight: 700; }
.big-notes { min-height: 190px; font-size: 14px; line-height: 1.5; background: repeating-linear-gradient(#fff 0 27px, #eceef1 27px 28px); }
.app-foot { text-align: center; color: var(--grey); font-size: 12px; margin: 4px 0 20px; }

/* ===================== 6. MODALI · ARCHIVIO · IMPOSTAZIONI ============ */
.modal-wrap {
  position: fixed; inset: 0; background: rgba(25,28,33,.55); z-index: 100; display: flex; align-items: center; justify-content: center;
  padding: 16px; animation: fade .15s;
}
@keyframes fade { from { opacity: 0; } }
.modal { background: #fff; border-radius: 10px; width: 100%; max-width: 560px; max-height: calc(100vh - 32px); display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,.35); overflow: hidden; }
.modal.wide { max-width: 1180px; }
.modal-h { display: flex; align-items: center; justify-content: space-between; padding: 12px 16px; background: var(--dark); color: #fff; border-bottom: 3px solid var(--orange); }
.modal-h h3 { margin: 0; font-size: 16px; letter-spacing: .3px; }
.modal-h .x { background: none; border: 0; color: #fff; font-size: 18px; cursor: pointer; width: 34px; height: 34px; border-radius: 5px; }
.modal-h .x:hover { background: rgba(255,255,255,.12); }
.modal-b { padding: 16px; overflow: auto; }
.modal-b p { margin: 0 0 10px; }
.modal-f { display: flex; justify-content: flex-end; gap: 8px; padding: 12px 16px; border-top: 1px solid var(--line-2); background: #fafbfc; flex-wrap: wrap; }
.big-q { font-size: 17px; font-weight: 700; }
.send-sum { display: grid; grid-template-columns: 110px 1fr; gap: 5px 10px; margin: 0 0 12px; padding: 10px 12px; background: var(--row-alt); border-radius: 6px; }
.send-sum dt { font-weight: 700; color: var(--grey); font-size: 12.5px; text-transform: uppercase; }
.send-sum dd { margin: 0; }
.steps { margin: 0; padding-left: 20px; } .steps li { margin: 3px 0; }
.errlist { margin: 0 0 8px; padding-left: 18px; color: var(--red); } .errlist li { margin: 4px 0; }

.toast-wrap, #toasts { position: fixed; bottom: 18px; left: 50%; transform: translateX(-50%); z-index: 200; display: flex; flex-direction: column; gap: 8px; align-items: center; pointer-events: none; }
.toast { background: var(--dark); color: #fff; padding: 10px 18px; border-radius: 20px; box-shadow: 0 6px 20px rgba(0,0,0,.25); opacity: 0; transform: translateY(10px); transition: .25s; font-weight: 600; font-size: 13.5px; }
.toast.in { opacity: 1; transform: none; }
.toast.ok { border-left: 4px solid #4caf50; }
.toast.err { background: var(--red); }

.arch-tools { display: flex; gap: 10px; align-items: center; margin-bottom: 12px; flex-wrap: wrap; }
.arch-tools input { flex: 1; min-width: 220px; }
.arch-tools select { width: 190px; }
.arch-scroll { overflow: auto; max-height: 62vh; border: 1px solid var(--line-2); border-radius: 6px; }
table.arch { width: 100%; border-collapse: collapse; font-size: 13.5px; }
table.arch th { position: sticky; top: 0; background: var(--dark); color: #fff; text-align: left; padding: 9px 10px; font-size: 12px; text-transform: uppercase; z-index: 1; }
table.arch td { padding: 8px 10px; border-bottom: 1px solid var(--line-2); vertical-align: middle; }
table.arch td small { display: block; color: var(--grey); font-size: 11.5px; }
table.arch .tdoc { display: block; margin-top: 1px; font-size: 11px; font-weight: 700; color: var(--orange); }
table.arch tr.current td { background: var(--orange-soft); }
table.arch .empty { text-align: center; color: var(--grey); padding: 30px; }
.arch-act { white-space: nowrap; text-align: right; }
.arch-act .btn { margin-left: 4px; }
.stato-pill { width: auto; min-height: 30px; padding: 3px 8px; font-weight: 700; font-size: 12px; border-radius: 14px; }
.s-bozza { background: #eceff1; } .s-inviato { background: #e3f2fd; color: #0d47a1; }
.s-confermato { background: #e8f5e9; color: var(--green); } .s-in-produzione { background: var(--orange-soft); color: #9a4d00; }
.s-completato { background: #2e7d32; color: #fff; } .s-annullato { background: var(--red-soft); color: var(--red); }

.set-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
.set-grid fieldset { border: 1px solid var(--line); border-radius: 8px; padding: 10px 14px 14px; margin: 0; display: flex; flex-direction: column; gap: 9px; }
.set-grid fieldset.full { grid-column: 1 / -1; }
.set-grid legend { font-weight: 800; padding: 0 6px; color: var(--orange); text-transform: uppercase; font-size: 12.5px; letter-spacing: .3px; }
.chk { display: flex; align-items: center; gap: 8px; font-size: 13px; cursor: pointer; }
.chk input { width: 18px; height: 18px; min-height: 0; padding: 0; accent-color: var(--orange); }
.logo-prev { border: 1px dashed var(--line); border-radius: 6px; padding: 10px; text-align: center; background: #fafbfc; }
.logo-prev img { max-height: 70px; max-width: 100%; }
.row-btns { display: flex; gap: 8px; flex-wrap: wrap; }

.preview-modal .modal-b { background: #6b717b; padding: 16px; }
.preview-scroll { overflow: auto; }
.preview-page { background: #fff; width: 297mm; min-height: 210mm; padding: 7mm; margin: 0 auto; box-shadow: 0 4px 20px rgba(0,0,0,.3); }

/* ================== 7. DOCUMENTO (anteprima + stampa) ================= */
.doc { width: 100%; overflow: hidden; padding: 0 .4mm .4mm 0; font-family: Arial, "Helvetica Neue", Helvetica, sans-serif; color: #1f2329; font-size: 7.6pt; line-height: 1.25; }
.doc * { box-sizing: border-box; }
.doc .doc-head { display: grid; grid-template-columns: 44mm 1fr 72mm 14mm; align-items: center; gap: 4mm; margin-bottom: 2.5mm; }
.doc .doc-logo { border-right: 0.6mm solid var(--orange); padding-right: 4mm; }
.doc .doc-logo img { width: 100%; height: auto; display: block; }
.doc .doc-title h1 { margin: 0; font-size: 19pt; font-weight: 900; letter-spacing: .3pt; line-height: 1; color: var(--dark); }
.doc .doc-title p { margin: 1mm 0 0; font-size: 9.5pt; font-weight: 700; color: var(--dark-2); }
.doc .doc-tipo { border: 0.5mm solid var(--orange); border-radius: 2.5mm; padding: 1.5mm 3mm; }
.doc .doc-tipo-row { display: flex; justify-content: space-around; }
.doc .doc-tipo-note { background: var(--orange-soft); border-radius: 1.5mm; text-align: center; font-weight: 700; font-size: 8.5pt; margin-top: 1mm; padding: .8mm; }
.doc .doc-stripes { display: flex; gap: 1.2mm; height: 14mm; transform: skewX(-22deg); justify-content: flex-end; padding-right: 3.5mm; }
.doc .doc-stripes i { width: 3mm; background: #d9dce0; }
.doc .doc-stripes i:last-child { background: var(--orange); width: 4mm; }
.doc .opt { display: inline-flex; align-items: center; gap: 1mm; margin-right: 2.2mm; white-space: nowrap; }
.doc .opt.big { font-size: 12.5pt; font-weight: 900; }
.doc .opt.big .cb { width: 4.2mm; height: 4.2mm; font-size: 9pt; border-width: .45mm; }
.doc .opt.sm { font-size: 6.2pt; margin-right: 0; gap: .7mm; }
.doc .opt.sm .cb { width: 2.4mm; height: 2.4mm; font-size: 5.5pt; }
.doc .cb {
  display: inline-flex; align-items: center; justify-content: center; width: 2.8mm; height: 2.8mm;
  border: .3mm solid #333; border-radius: .5mm; font-size: 6.5pt; font-weight: 900; line-height: 1; flex: 0 0 auto;
}
.doc .cb.on { background: var(--orange); border-color: var(--orange); color: #fff; }

.doc .doc-boxes { display: grid; margin-bottom: 2mm !important; grid-template-columns: 1.2fr .9fr 1.02fr 1.65fr; gap: 2.5mm; margin-bottom: 2.5mm; }
.doc .dbox { border: .3mm solid #c3c7cd; border-radius: 1.5mm; overflow: hidden; break-inside: avoid; }
.doc .dbox h3 {
  margin: 0; background: linear-gradient(180deg, var(--orange-2), var(--orange)); color: #1f2329;
  font-size: 8.6pt; font-weight: 900; padding: .9mm 2.2mm; letter-spacing: .2pt;
}
.doc .dbox h3 small { font-size: 6.8pt; font-weight: 600; }
.doc .dbody { padding: 1.4mm 2.2mm; }
.doc .f { display: flex; align-items: baseline; gap: 1.2mm; padding: .2mm 0; min-width: 0; }
.doc .fl { font-weight: 700; white-space: nowrap; color: #444; }
.doc .fv { flex: 1; border-bottom: .2mm solid #8d939b; min-height: 3.6mm; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.doc .f.strong .fv { font-weight: 900; font-size: 8.6pt; }
.doc .frow { display: flex; gap: 2.5mm; }
.doc .frow .f { flex: 1; }
.doc .frow .f.grow { flex: 2; }
.doc .frow .f.sm { flex: 0 0 auto; }
.doc .frow .f.sm .fv { min-width: 9mm; overflow: visible; }
.doc .cfg-row { display: flex; align-items: center; flex-wrap: wrap; padding: 1mm 0; font-size: 6.8pt; }
.doc .cfg-row .opt { margin-right: 1.6mm; }
.doc .cfg-row b { width: 18mm; font-size: 7.2pt; }

.doc .bar {
  background: linear-gradient(180deg, var(--orange-2), var(--orange)); color: #1f2329; padding: 1mm 2.5mm;
  border-radius: 1.5mm 1.5mm 0 0; font-size: 9pt; font-weight: 600; display: flex; align-items: center;
}
.doc .bar b { font-weight: 900; font-size: 10pt; }
.doc .bar-mm { margin-left: auto; font-size: 7pt; font-weight: 700; background: #fff; border-radius: 3mm; padding: .2mm 2mm; }
.doc table { width: 100%; border-collapse: collapse; table-layout: fixed; }
.doc .tbl-srm thead { display: table-header-group; }
.doc .tbl-srm tfoot { display: table-row-group; }
.doc .tbl-srm th { background: var(--dark); color: #fff; font-size: 6.9pt; font-weight: 700; padding: .8mm .5mm; border: .2mm solid #5f656e; text-align: center; line-height: 1.1; }
.doc .tbl-srm th small { display: block; font-weight: 400; font-size: 5.8pt; opacity: .9; }
.doc .tbl-srm td { border: .2mm solid #c3c7cd; padding: .45mm .8mm; line-height: 1.12; vertical-align: middle; word-wrap: break-word; overflow-wrap: anywhere; }
.doc .tbl-srm tbody tr { break-inside: avoid; page-break-inside: avoid; }
.doc .tbl-srm tbody tr:nth-child(even) td { background: #f2f4f8; }
.doc .tbl-srm tfoot td { font-size: 7pt; text-align: right; background: #fafbfc; color: #444; }
.doc col.c-pos { width: 7mm; } .doc col.c-qta { width: 8mm; } .doc col.c-ubi { width: 18.5mm; } .doc col.c-mod { width: 36mm; }
.doc col.c-tip { width: 31mm; } .doc col.c-mis { width: 13mm; } .doc col.c-ap { width: 17mm; }
.doc col.c-tel { width: 10mm; } .doc col.c-vet { width: 33.5mm; } .doc col.c-al { width: 7.5mm; }
.doc col.c-note { width: auto; }
.doc td.pos { text-align: center; font-weight: 900; font-size: 10pt; }
.doc td.num { text-align: center; font-weight: 700; }
.doc td.num small { display: inline; margin-left: .5mm; font-weight: 400; font-size: 5.6pt; color: #777; }
.doc td.tip { font-weight: 700; }
.doc td.mod { font-weight: 700; font-size: 6.8pt; color: #1f2329; }
.doc td.mod small { display: inline; margin-left: 1mm; font-weight: 400; font-size: 5.6pt; color: #777; letter-spacing: .2pt; }
.doc td.mod .fin { display: block; margin-top: .5mm; padding-top: .4mm; border-top: .2mm dotted #aaa; font-weight: 400; font-size: 5.7pt; line-height: 1.18; color: #333; }
.doc td.mod .fin span { display: inline; }
.doc td.mod .fin b { font-weight: 700; color: #1f2329; }
.doc td.mis { text-align: center; font-weight: 900; font-size: 9.5pt; letter-spacing: .2pt; }
.doc td.ap { text-align: center; font-size: 6.6pt; font-weight: 700; }
.doc td.ap svg { display: inline-block; vertical-align: middle; margin-right: .6mm; width: 3.4mm; height: 3.4mm; }
.doc td.ap { white-space: nowrap; }
.doc td.vet .vgrid { display: grid; grid-template-columns: 1.15fr 1fr; gap: .15mm .8mm; }
.doc td.vet .vspec { font-size: 6.5pt; font-style: italic; margin-top: .5mm; border-top: .2mm dotted #aaa; padding-top: .3mm; }
.doc td.note { font-size: 7pt; }
.doc td.empty { text-align: center; color: #888; padding: 4mm; }

.doc .doc-bottom { display: grid; grid-template-columns: 1.2fr .75fr 1.75fr; gap: 2.5mm; margin-top: 2.5mm; break-inside: avoid; page-break-inside: avoid; }
.doc .tbl-copr th { background: #e9ebee; font-size: 6.8pt; padding: .7mm; border: .2mm solid #c3c7cd; }
.doc .tbl-copr th small { display: block; font-weight: 400; font-size: 5.8pt; }
.doc .tbl-copr td { border: .2mm solid #c3c7cd; padding: .5mm 1.2mm; font-size: 7.5pt; }
.doc .tbl-copr td small { font-size: 5.8pt; color: #666; }
.doc .tbl-copr th:nth-child(1) { width: 13mm; } .doc .tbl-copr th:nth-child(2) { width: 11mm; } .doc .tbl-copr th:nth-child(3) { width: 19mm; } .doc .tbl-copr th:nth-child(5) { width: 13mm; }
.doc .copr-note { margin: 0; padding: .6mm 2mm; font-size: 6.2pt; font-style: italic; color: #555; }
.doc .notes-body { min-height: 16mm; font-size: 7.6pt; background: repeating-linear-gradient(#fff 0 4.4mm, #d8dbe0 4.4mm 4.6mm); line-height: 4.6mm; padding-top: 0; }
.doc .side { display: flex; flex-direction: column; gap: 1.5mm; }
.doc .info-legend { display: grid; grid-template-columns: .8fr 1.2fr; gap: 2mm; }
.doc .info { display: flex; gap: 1.5mm; align-items: flex-start; font-style: italic; font-size: 6.3pt; line-height: 1.15; }
.doc .info p { margin: 0; }
.doc .info .i { flex: 0 0 6mm; height: 6mm; border-radius: 50%; border: .5mm solid var(--orange); color: var(--orange); font-weight: 900; font-style: normal; display: flex; align-items: center; justify-content: center; font-size: 10pt; font-family: Georgia, serif; }
.doc .legend .dbody { display: grid; grid-template-columns: 1fr 1fr; gap: .3mm 1.5mm; font-size: 6.3pt; padding: .8mm 1.5mm; }
.doc .legend em { grid-column: 1 / -1; }
.doc .legend span { display: flex; align-items: center; gap: 1mm; white-space: nowrap; font-size: 6pt; }
.doc .legend em { font-size: 5.8pt; color: #666; }
.doc .signs { display: grid; grid-template-columns: 1fr 1fr; gap: 2mm; }
.doc .sign h3 { background: #e9ebee !important; font-size: 6.8pt !important; }
.doc .sign .dbody { display: grid; grid-template-columns: 22mm 1fr; gap: 2mm; align-items: end; }
.doc .stamp { height: 10mm; border: .3mm solid #555; border-radius: .5mm; font-size: 6pt; color: #888; padding: .5mm 1mm; }
.doc .sl { display: grid; grid-template-columns: auto 1fr; gap: 3mm 1mm; align-items: end; font-size: 7pt; font-weight: 700; }
.doc .sl i { border-bottom: .2mm solid #333; height: 3.5mm; }
.doc .doc-foot { margin-top: 2mm; text-align: center; font-size: 6.4pt; color: #666; border-top: .2mm solid #ddd; padding-top: 1mm; display: flex; align-items: center; justify-content: center; gap: 4mm; }
.doc .doc-foot .sws { display: inline-flex; align-items: center; gap: 1.5mm; font-size: 5.8pt; color: #888; white-space: nowrap; }
.doc .doc-foot .sws img { height: 4.2mm; width: auto; }
.schema-ap { vertical-align: middle; }

/* ============================ 7b. CATALOGO ============================ */
.cat-link { border: 0; background: none; color: var(--orange); font-weight: 700; font-size: 11.5px; cursor: pointer; padding: 1px 2px; text-align: left; }
.cat-link:hover { text-decoration: underline; }
.catalog-modal { max-width: 1320px !important; height: calc(100vh - 32px); }
.catalog-modal .modal-b { background: var(--bg); padding: 0 16px 16px; display: flex; flex-direction: column; }
.cat-target { margin: 12px 0 0; padding: 8px 12px; background: var(--orange-soft); border-left: 4px solid var(--orange); border-radius: 4px; font-size: 13.5px; }
.cat-tabs { position: sticky; top: 0; z-index: 3; display: flex; align-items: center; gap: 6px; padding: 12px 0 8px; background: var(--bg); flex-wrap: wrap; }
.cat-tab { border: 1px solid var(--line); background: #fff; border-radius: 20px; padding: 8px 16px; font-weight: 700; cursor: pointer; font-size: 13.5px; }
.cat-tab.on { background: var(--dark); color: #fff; border-color: var(--dark); box-shadow: inset 0 -3px 0 var(--orange); }
.cat-count { margin-left: auto; font-size: 12.5px; color: var(--grey); font-weight: 600; }
.cat-tools { position: sticky; top: 54px; z-index: 3; display: grid; grid-template-columns: minmax(220px,2fr) repeat(3, minmax(150px,1fr)); gap: 8px; padding-bottom: 10px; background: var(--bg); }
.cat-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(255px, 1fr)); gap: 14px; align-content: start; }
.cat-group { grid-column: 1 / -1; margin: 8px 0 -4px; font-size: 14px; font-weight: 900; letter-spacing: .4px; color: var(--dark); border-bottom: 3px solid var(--orange); padding-bottom: 4px; }
.cat-empty { grid-column: 1 / -1; text-align: center; color: var(--grey); padding: 40px; }
.cat-foot { font-size: 11.5px; color: var(--grey); margin: 14px 0 0; text-align: center; }
.pc { background: #fff; border-radius: 10px; border: 1px solid var(--line-2); box-shadow: var(--shadow); overflow: hidden; display: flex; flex-direction: column; transition: transform .15s, box-shadow .15s; }
.pc:hover { transform: translateY(-2px); box-shadow: 0 6px 18px rgba(0,0,0,.12); }
.pc-img { position: relative; display: block; width: 100%; aspect-ratio: 16 / 10; border: 0; padding: 0; background: var(--dark); cursor: zoom-in; overflow: hidden; }
.pc-img > img:first-child { width: 100%; height: 100%; object-fit: cover; display: block; }
.pc-img .pc-ov { position: absolute; right: 4%; bottom: 0; height: 88%; width: auto; max-width: 55%; object-fit: contain; filter: drop-shadow(0 4px 8px rgba(0,0,0,.35)); }
.pc-img.noimg { display: flex; align-items: center; justify-content: center; color: #aaa; font-size: 13px; background: #eef0f3; cursor: default; }
.pc-img.draw { background: #fff; border-bottom: 1px solid var(--line-2); }
.pc-img.light { background: #f4f5f7; border-bottom: 1px solid var(--line-2); }
.pc-img.light > img:first-child { object-fit: contain; padding: 8px; }
.pc-img.draw img { object-fit: contain !important; padding: 10px; }
.pc-partner { position: absolute; left: 8px; top: 8px; background: rgba(255,255,255,.92); color: var(--dark); font-size: 11px; font-weight: 800; border-radius: 4px; padding: 2px 7px; letter-spacing: .3px; }
.pc-body { padding: 10px 12px 4px; flex: 1; }
.pc-cat { display: inline-block; font-size: 10.5px; font-weight: 800; letter-spacing: .4px; color: #9a4d00; background: var(--orange-soft); border-radius: 3px; padding: 2px 6px; text-transform: uppercase; }
.pc h4 { margin: 6px 0 2px; font-size: 17px; font-weight: 900; color: var(--dark); }
.pc-sub { margin: 0; font-size: 12.5px; color: var(--grey); }
.pc-code { margin: 4px 0 0; font-size: 12px; color: var(--grey); }
.pc-fin { display: flex; flex-wrap: wrap; gap: 4px; margin-top: 6px; }
.pc-fin span { font-size: 11px; border: 1px solid var(--line); border-radius: 10px; padding: 1px 7px; }
.pc-act { display: flex; gap: 6px; padding: 10px 12px 12px; flex-wrap: wrap; }
.pc-act .btn { flex: 1; white-space: nowrap; font-size: 12px; padding: 6px 8px; }
.cat-detail { max-width: 1180px !important; }
.dt { display: grid; grid-template-columns: minmax(0,1.1fr) minmax(0,1fr); gap: 20px; }
.dt-main { margin: 0; background: #f4f5f7; border-radius: 8px; overflow: hidden; display: flex; flex-direction: column; }
.dt-main img { width: 100%; max-height: 62vh; object-fit: contain; background: #fff; }
.dt-main.draw img { padding: 20px; min-height: 260px; }
.dt-main figcaption { font-size: 12px; color: var(--grey); padding: 6px 10px; }
.dt-thumbs { display: flex; gap: 6px; margin-top: 8px; flex-wrap: wrap; }
.dt-th { width: 76px; height: 56px; border: 2px solid var(--line); border-radius: 5px; padding: 0; background: #fff; cursor: pointer; overflow: hidden; }
.dt-th img { width: 100%; height: 100%; object-fit: cover; }
.dt-th.on { border-color: var(--orange); }
.dt-noimg { height: 240px; display: flex; align-items: center; justify-content: center; background: #f4f5f7; color: var(--grey); border-radius: 8px; }
.dt-info h2 { margin: 6px 0 2px; font-size: 26px; font-weight: 900; }
.dt-sub { margin: 0 0 10px; color: var(--grey); }
.dt-info h3 { font-size: 13px; text-transform: uppercase; letter-spacing: .4px; margin: 14px 0 6px; color: var(--orange); }
.dt-info h3 small { color: var(--grey); text-transform: none; }
.dt-meta { display: grid; grid-template-columns: 120px 1fr; gap: 4px 10px; margin: 0; font-size: 13.5px; }
.dt-meta dt { font-weight: 700; color: var(--grey); font-size: 12px; text-transform: uppercase; }
.dt-meta dd { margin: 0; }
.dt-feat { margin: 0; padding-left: 18px; font-size: 13.5px; } .dt-feat li { margin: 3px 0; }
.dt-tech { width: 100%; border-collapse: collapse; font-size: 13px; }
.dt-tech th { text-align: left; font-weight: 600; color: var(--dark-2); padding: 5px 8px; border-bottom: 1px solid var(--line-2); width: 52%; }
.dt-tech td { padding: 5px 8px; border-bottom: 1px solid var(--line-2); font-weight: 700; }
.dt-tech tr:nth-child(odd) { background: var(--row-alt); }
.dt-notes { margin: 10px 0 0; padding-left: 16px; font-size: 11.5px; color: var(--grey); }
.dt-add { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; margin-top: 16px; padding: 12px; background: var(--orange-soft); border-radius: 8px; }
.dt-add small { font-weight: 500; text-transform: none; color: var(--grey); }

/* ===================== 7c. RIEMPIMENTO / PANNELLI ZERO5 ================ */
.vchk.wide { grid-column: 1 / -1; }
.item .c .gspec { min-height: 28px; padding: 3px 6px; font-size: 12px; margin-top: 3px; }
.doc td.vet .pan > div { min-width: 0; }
.fill-sw { display: flex; gap: 4px; margin-bottom: 4px; width: 100%; }
.fs-opt { flex: 1; display: flex; align-items: center; justify-content: center; gap: 4px; border: 1px solid var(--line); border-radius: 5px; padding: 3px 4px; font-size: 12px; font-weight: 700; cursor: pointer; background: #fff; }
.fs-opt input { width: 13px; height: 13px; min-height: 0 !important; padding: 0 !important; margin: 0; accent-color: var(--orange); }
.fs-opt.on { border-color: var(--orange); background: var(--orange-soft); color: #9a4d00; }
.item .c-vet { flex-direction: column; align-items: stretch; }
.item .c .ptype { min-height: 30px; padding: 3px 4px; font-size: 12.5px; }
.pz { display: flex; gap: 6px; align-items: center; margin-top: 4px; }
.pz-img { border: 1px solid var(--line); background: #fff; border-radius: 4px; padding: 2px; cursor: pointer; width: 34px; height: 64px; flex: 0 0 auto; }
.pz-img img { width: 100%; height: 100%; object-fit: contain; }
.pz-txt { display: flex; flex-direction: column; line-height: 1.15; min-width: 0; }
.pz-txt small { font-size: 10px; color: var(--grey); font-weight: 700; }
.pz-txt b { font-size: 14px; }
.pz-pick { margin-top: 4px; border: 1px dashed var(--orange); background: var(--orange-soft); color: #9a4d00; border-radius: 5px; padding: 5px; font-weight: 700; font-size: 12px; cursor: pointer; }
.c-vet.err .pz-pick, .c-vet.err .fill-sw { box-shadow: 0 0 0 2px var(--red); border-radius: 5px; }
.cat-grid.z5 { grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); }
.pc-z5 .z5img { aspect-ratio: 5 / 9; background: #fff; border-bottom: 1px solid var(--line-2); }
.pc-z5 .z5img img { object-fit: contain !important; padding: 8px; }
.pc-z5 .pc-body { padding: 6px 10px 0; text-align: center; }
.pc-z5 .z5code { font-size: 18px; margin: 2px 0; letter-spacing: .3px; }
.pc-z5 .pc-sub { font-size: 11px; }
.pc-z5 .pc-act { padding: 8px 10px 10px; }
.pc-z5.sel { outline: 3px solid var(--orange); }
.z5-cur { position: absolute; top: 6px; left: 6px; background: var(--orange); color: #fff; font-size: 10.5px; font-weight: 800; padding: 2px 6px; border-radius: 3px; }
.dt-z5 .dt-main.draw img { max-height: 66vh; }
.doc td.vet .pan { display: flex; gap: 1.2mm; align-items: center; }
.doc td.vet .pan img { height: 8mm; width: auto; border: .2mm solid #ccc; background: #fff; flex: 0 0 auto; }
.doc td.vet .pan span { display: block; font-size: 5.8pt; line-height: 1.2; white-space: normal; }

/* ===================== 7d. CONTROLLO DATI (rosso/giallo/verde) ===================== */
.st-chip { display: inline-flex; align-items: center; justify-content: center; width: 20px; height: 20px; border-radius: 50%; font-size: 12px; font-weight: 900; color: #fff; vertical-align: middle; margin-left: 4px; }
.st-chip.st-ok { background: #2e7d32; } .st-chip.st-warning { background: #f2b705; color: #3a2a00; } .st-chip.st-error { background: var(--red); }
.c-pos { flex-direction: column; gap: 4px; }
.st-dot { width: 11px; height: 11px; border-radius: 50%; background: #cfd3d8; cursor: help; }
.st-dot.st-ok { background: #2e7d32; } .st-dot.st-warning { background: #f2b705; } .st-dot.st-error { background: var(--red); } .st-dot.st-none { background: #e3e6ea; }
.chk-pill { display: inline-flex; align-items: center; gap: 6px; border: 0; border-radius: 16px; padding: 6px 12px; font-weight: 800; font-size: 12.5px; cursor: pointer; white-space: nowrap; }
.chk-pill i { font-style: normal; }
.chk-pill.st-ok { background: #2e7d32; color: #fff; } .chk-pill.st-warning { background: #f2b705; color: #3a2a00; } .chk-pill.st-error { background: var(--red); color: #fff; }
.wrn, input.wrn, select.wrn { box-shadow: 0 0 0 2px #f2b705 !important; border-color: #f2b705 !important; border-radius: 5px; }
.toast.warn { background: #f2b705; color: #3a2a00; }
.chk-sum { display: grid; grid-template-columns: repeat(auto-fit, minmax(170px, 1fr)); gap: 6px; margin: 0 0 12px; }
.chk-sum .cs { display: flex; align-items: center; gap: 8px; padding: 8px 10px; border-radius: 6px; font-size: 12px; font-weight: 800; letter-spacing: .2px; }
.chk-sum .cs b { width: 22px; height: 22px; border-radius: 50%; display: inline-flex; align-items: center; justify-content: center; color: #fff; flex: 0 0 auto; }
.chk-sum .st-ok { background: #e8f5e9; } .chk-sum .st-ok b { background: #2e7d32; }
.chk-sum .st-warning { background: #fff8e1; } .chk-sum .st-warning b { background: #f2b705; color: #3a2a00; }
.chk-sum .st-error { background: var(--red-soft); } .chk-sum .st-error b { background: var(--red); }
.chk-h { margin: 10px 0 6px; font-size: 14px; } .err-h { color: var(--red); } .wrn-h { color: #8a6500; }
.chk-list { list-style: none; margin: 0 0 8px; padding: 0; display: flex; flex-direction: column; gap: 4px; }
.chk-list button { width: 100%; text-align: left; border: 1px solid; border-radius: 6px; padding: 7px 10px; cursor: pointer; font-size: 13.5px; display: flex; justify-content: space-between; gap: 10px; align-items: center; }
.chk-list button small { white-space: nowrap; font-weight: 700; opacity: .75; }
.chk-list.is-err button { background: var(--red-soft); border-color: #f0b8b8; color: #8e1c1c; }
.chk-list.is-wrn button { background: #fff8e1; border-color: #f3dc8f; color: #5c4400; }
.chk-list button:hover { filter: brightness(.97); }
.chk-ok { background: #e8f5e9; color: #1b5e20; padding: 10px 12px; border-radius: 6px; font-weight: 700; }
.chk-misure { background: var(--orange); color: #fff; border-radius: 8px; padding: 10px 14px; margin-bottom: 12px; font-size: 14px; line-height: 1.45; }
.chk-box { border-radius: 8px; padding: 10px 12px; margin-bottom: 12px; }
.chk-box h4 { margin: 0 0 6px; font-size: 14px; }
.chk-box.is-err { background: #fff5f5; border: 1px solid #f0b8b8; } .chk-box.is-err h4 { color: var(--red); }
.chk-box.is-wrn { background: #fffbeb; border: 1px solid #f3dc8f; } .chk-box.is-wrn h4 { color: #8a6500; }
.chk-box p { margin: 0 0 6px; font-size: 13px; }
.chk-ack { display: flex; gap: 8px; align-items: flex-start; font-size: 13.5px; cursor: pointer; margin-top: 6px; }
.chk-ack input { width: 18px; height: 18px; min-height: 0; padding: 0; margin-top: 1px; flex: 0 0 auto; accent-color: var(--orange); }
.chk-ack.strong { font-weight: 700; background: #fff; border: 2px solid var(--orange); border-radius: 6px; padding: 10px; }
.chk-resp { border: 1px solid var(--line); border-radius: 8px; padding: 12px; margin: 12px 0; background: #fafbfc; }
.chk-resp h4 { margin: 0 0 6px; color: var(--red); font-size: 14px; }
.chk-resp p { margin: 0 0 6px; font-size: 13px; }
.modal-f .btn:disabled { opacity: .45; cursor: not-allowed; }
.rules-t { width: 100%; border-collapse: collapse; font-size: 13px; }
.rules-t th { text-align: left; font-size: 11.5px; text-transform: uppercase; color: var(--grey); padding: 4px 6px; border-bottom: 1px solid var(--line); }
.rules-t td { padding: 4px 6px; border-bottom: 1px solid var(--line-2); }
.rules-t select { min-height: 30px; padding: 3px 6px; width: auto; }
.rules-t .mod { color: var(--orange); font-weight: 700; }
.hist { margin: 0 0 12px; background: #fff; border-radius: 8px; padding: 8px 12px; font-size: 13px; }
.hist summary { cursor: pointer; font-weight: 800; }
.hist-inv { display: flex; gap: 6px; flex-wrap: wrap; margin: 8px 0; }
.hist-t { width: 100%; border-collapse: collapse; margin-top: 6px; }
.hist-t th, .hist-t td { text-align: left; padding: 4px 6px; border-bottom: 1px solid var(--line-2); vertical-align: top; }
.hist-t th { font-size: 11px; text-transform: uppercase; color: var(--grey); }

/* --------------------- 7e. FINITURA PROFILO E FERMAVETRO --------------------- */
.fin-chip { display: flex; align-items: center; gap: 6px; width: 100%; margin-top: 4px; padding: 3px 6px; border: 1px solid var(--line); border-radius: 6px; background: #fff; cursor: pointer; text-align: left; font: inherit; min-height: 34px; }
.fin-chip:hover { border-color: var(--orange); }
.fin-chip.miss { border-color: #e0a100; background: #fff8e1; }
.fin-chip.err { border-color: var(--red); background: #fdecec; }
.fin-chip .fin-sw { display: inline-flex; flex: 0 0 auto; font-size: 15px; }
.fin-chip .fin-t { display: flex; flex-direction: column; min-width: 0; line-height: 1.15; }
.fin-chip .fin-t b { font-size: 11.5px; overflow-wrap: anywhere; }
.fin-chip .fin-t small { font-size: 10.5px; color: var(--grey); }
.sw { display: inline-block; width: 18px; height: 24px; border-radius: 3px; border: 1px solid #b9bec5; background-size: cover; background-position: center; vertical-align: middle; }
.sw.half { width: 11px; } .sw.half + .sw.half { margin-left: 1px; }
.sw.empty { background: repeating-linear-gradient(45deg, #fff, #fff 3px, #e6e6e6 3px, #e6e6e6 6px); }
.fin-modal.modal { max-width: 1060px; }
.fin-m h4 { margin: 0 0 8px; font-size: 14px; letter-spacing: .4px; }
.fin-m h5 { margin: 12px 0 6px; font-size: 12px; color: var(--grey); letter-spacing: .4px; }
.fin-sec { border: 1px solid var(--line-2); border-radius: 10px; padding: 12px; margin-bottom: 12px; background: #fff; }
.fin-types { display: flex; gap: 8px; flex-wrap: wrap; }
.fin-types .ft { display: inline-flex; align-items: center; gap: 6px; padding: 8px 14px; border: 1.5px solid var(--line); border-radius: 8px; font-weight: 800; cursor: pointer; }
.fin-types .ft { white-space: nowrap; }
.fin-types .ft input[type=radio] { width: 16px; height: 16px; min-height: 0; margin: 0; padding: 0; flex: 0 0 auto; accent-color: var(--orange); }
.fin-types .ft.on { border-color: var(--orange); background: var(--orange-soft); }
.fin-desc { margin: 10px 0 0; display: flex; align-items: center; gap: 8px; }
.fin-info { margin: 0; background: #f4f6f8; border-radius: 8px; padding: 8px 10px; font-size: 13px; }
.fin-hint { margin: 8px 0 0; font-size: 12.5px; color: var(--grey); }
.fin-src { margin: 0; font-size: 11px; color: var(--grey); }
.sw-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(84px, 1fr)); gap: 6px; }
.swb { display: flex; flex-direction: column; align-items: stretch; gap: 3px; padding: 4px; border: 2px solid transparent; border-radius: 8px; background: #fff; cursor: pointer; font: inherit; }
.swb i { display: block; height: 58px; border-radius: 5px; border: 1px solid #c3c7cd; background-size: cover; background-position: center; }
.swb span { font-size: 11px; line-height: 1.15; text-align: center; font-weight: 600; }
.swb span small { display: block; color: var(--grey); font-weight: 400; }
.swb:hover { border-color: var(--line); }
.swb.on { border-color: var(--orange); background: var(--orange-soft); }
.fin-bi { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
.fin-bi .sw-grid { grid-template-columns: repeat(auto-fill, minmax(72px, 1fr)); }
.fin-bi .swb i { height: 44px; }
.fv-cards { display: flex; gap: 12px; flex-wrap: wrap; }
.fvc { position: relative; display: flex; flex-direction: column; align-items: center; gap: 4px; width: 150px; padding: 22px 10px 10px; border: 2px solid var(--line); border-radius: 10px; background: #fff; cursor: pointer; font: inherit; }
.fvc img { width: 100px; height: 108px; object-fit: contain; }
.fvc b { font-size: 15px; font-weight: 600; }
.fvc em { position: absolute; top: 5px; left: 8px; font-style: normal; font-size: 10.5px; letter-spacing: .6px; color: var(--grey); }
.fvc em.standard { color: #2e7d32; font-weight: 800; }
.fvc.on { border-color: var(--red); box-shadow: 0 0 0 2px rgba(200, 40, 40, .12); }

.fin-adm input[type=text] { min-height: 28px; padding: 3px 6px; width: 120px; }
.fin-adm .sw { width: 16px; height: 20px; }
.fin-add { display: flex; gap: 6px; flex-wrap: wrap; margin-bottom: 6px; }
.fin-add input { flex: 1 1 140px; min-height: 32px; }
@media (max-width: 760px) { .fin-bi { grid-template-columns: 1fr; } }

/* ============================ 8. RESPONSIVE =========================== */
@media (max-width: 1420px) {
  .toolbar .tbtn span:not(.ic) { font-size: 12px; }
  .grid-4 { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 1100px) {
  .topbar { flex-wrap: wrap; }
  .toolbar { order: 3; flex-basis: 100%; justify-content: flex-start; }
  .autosave { margin-left: auto; }
  .doc-header { grid-template-columns: auto 1fr; }
  .dh-side { grid-column: 1 / -1; flex-direction: row; justify-content: space-between; align-items: center; margin-right: 50px; flex-wrap: wrap; }
  .dh-fields { margin-right: 50px; grid-template-columns: 1fr 1fr 170px; }
  .grid-2 { grid-template-columns: 1fr; }
}
/* Tablet: tabella con scorrimento orizzontale (gestito da .items-scroll) */

/* Smartphone: una scheda per ogni serramento */
@media (max-width: 760px) {
  body { font-size: 15px; }
  .editor { padding: 10px; gap: 10px; }
  .topbar { padding: 6px 10px; gap: 8px; }
  .brand-logo { height: 34px; }
  .brand-txt { display: none; }
  .topbar-brand { flex: 1; }
  .dh-title { margin-right: 22px; }
  .toolbar { flex-wrap: nowrap; overflow-x: auto; gap: 5px; padding-bottom: 2px; -webkit-overflow-scrolling: touch; }
  .tbtn { flex: 0 0 auto; padding: 6px 10px; flex-direction: column; gap: 1px; font-size: 10.5px; min-height: 48px; }
  .tbtn .ic { font-size: 18px; }
  .tmenu { position: static; }
  .tmenu-list { position: fixed; left: 10px; right: 10px; top: auto; }
  .doc-header { grid-template-columns: 1fr; gap: 10px; padding: 12px; }
  .doc-header::after { width: 36px; }
  .dh-logo { height: 46px; }
  .dh-title { padding-left: 12px; }
  .dh-title h1 { font-size: 24px; }
  .dh-title p { font-size: 12.5px; }
  .dh-side { margin-right: 26px; flex-direction: column; align-items: stretch; }
  .dh-fields { grid-template-columns: 1fr; margin-right: 22px; }
  .tipo-switch { justify-content: space-between; }
  .tipo-opt span { font-size: 16px; padding: 8px; }
  .ordine-banner { font-size: 16px; }
  .grid-4 { grid-template-columns: 1fr; }
  .fgrid { grid-template-columns: 1fr; }
  .span2 { grid-column: auto; }
  .cfg-g { grid-template-columns: 1fr; }
  .altro-inp { grid-column: auto; }
  input, select, textarea { font-size: 16px; min-height: 42px; } /* evita zoom iOS */

  .items-head { flex-direction: column; }
  .items-tools { padding: 0 14px 8px; }
  .items-scroll { overflow: visible; margin: 10px 0 0; padding: 0; }
  .items-grid { min-width: 0; }
  .ig-head { display: none; }
  .item {
    display: grid; grid-template-columns: 1fr 1fr; gap: 8px 10px; border: 1px solid var(--line); border-radius: 10px;
    padding: 12px; margin-bottom: 12px; background: #fff !important; box-shadow: var(--shadow);
  }
  .item > .c { border: 0; padding: 0; flex-direction: column; align-items: stretch; gap: 3px; }
  .item > .c::before { content: attr(data-label); font-size: 11.5px; font-weight: 700; color: var(--grey); text-transform: uppercase; }
  .item > .c-qta { order: 1; } .item > .c-ante { order: 2; } .item > .c-ubi { order: 3; } .item > .c-mod { order: 3; } .item > .c-tip { order: 4; }
  .item > .c-l { order: 5; } .item > .c-h { order: 6; } .item > .c-ap { order: 7; } .item > .c-tel { order: 8; }
  .item > .c-vet { order: 9; } .item > .c-al { order: 10; } .item > .c-note { order: 11; } .item > .c-act { order: 12; } .item > .item-details { order: 13; }
  .item > .c-pos { grid-column: 1 / -1; flex-direction: row; justify-content: flex-start; align-items: center; background: var(--dark); color: #fff; margin: -12px -12px 2px; padding: 8px 12px; border-radius: 10px 10px 0 0; }
  .item > .c-pos::before { content: "SERRAMENTO POS."; color: #fff; margin-right: 8px; }
  .item > .c-pos .pos-n { color: var(--orange); }
  .c-ubi, .c-mod, .c-tip, .c-vet, .c-al, .c-note, .c-act { grid-column: 1 / -1; }
  .item .c input, .item .c select, .item .c textarea { min-height: 44px; font-size: 16px; }
  .item .mm { font-size: 18px !important; }
  .item .c .mod2 { flex-direction: row; flex-wrap: wrap; gap: 8px; }
  .item .c .mod2 .cat-link { flex-basis: 100%; font-size: 14px; padding: 4px 0; }
  .item .c .mod2 select { min-height: 44px; font-size: 16px; flex: 1; min-width: 0; }
  .c-ap { display: grid !important; grid-template-columns: 30px 1fr; align-items: center; }
  .c-ap::before { grid-column: 1 / -1; }
  .ap-ico svg { width: 28px; height: 28px; }
  .c-vet .vgrid { grid-template-columns: 1fr 1fr; gap: 6px; }
  .vchk { font-size: 15px; padding: 8px; border: 1px solid var(--line); border-radius: 6px; }
  .item .c .vchk input { width: 20px; height: 20px; min-height: 0; }
  .c-al .al4 i { display: block; }
  .c-act { flex-direction: row !important; justify-content: space-between; gap: 6px; padding-top: 6px !important; border-top: 1px solid var(--line-2) !important; }
  .c-act::before { display: none; }
  .ib { height: 40px; min-width: 40px; flex: 1; }
  .ib span { display: inline; }
  .item-details { padding: 12px; margin: 0 -12px -12px; flex-direction: column; border-radius: 0 0 10px 10px; }
  .item-details label { flex-direction: column; align-items: stretch; }
  .item-details select, .item-details input, .item-details .grow { width: 100%; min-width: 0; }

  .copr-head { display: none; }
  .copr { grid-template-columns: 1fr 1fr; border: 1px solid var(--line); border-radius: 8px; margin-bottom: 8px; gap: 8px; }
  .copr .pos-n { text-align: left; }
  .copr .pos-n::before { content: "Coprifilo "; font-size: 12px; color: var(--grey); }
  .copr .cf { grid-column: 1 / -1; display: flex; flex-direction: column; gap: 3px; }
  .copr .cf::before { content: attr(data-label); font-size: 11.5px; font-weight: 700; color: var(--grey); text-transform: uppercase; }
  .copr { min-width: 0; }
  .copr .cf.ro { grid-column: auto; }
  .copr-act { grid-column: 1 / -1; justify-content: space-between; border-top: 1px solid var(--line-2); padding-top: 6px; }
  .copr .cf select { min-height: 44px; font-size: 16px; }

  .modal-wrap { padding: 0; align-items: flex-end; }
  .chk-pill span { display: none; }
  .chk-sum { grid-template-columns: 1fr 1fr; }
  .item > .c-pos .st-dot { margin-left: auto; }
  .catalog-modal { height: 94vh; }
  .cat-tabs, .cat-tools { position: static; }
  .cat-tools { grid-template-columns: 1fr 1fr; }
  .cat-tools input { grid-column: 1 / -1; }
  .cat-grid { grid-template-columns: 1fr; }
  .cat-grid.z5 { grid-template-columns: 1fr 1fr; }
  .fs-opt { font-size: 15px; padding: 8px; }
  .item .c .ptype { min-height: 44px; font-size: 16px; }
  .pz-img { width: 48px; height: 90px; }
  .dt { grid-template-columns: 1fr; }
  .dt-add { grid-template-columns: 1fr; }
  .cat-count { margin-left: 0; width: 100%; }
  .modal, .modal.wide { max-width: none; max-height: 94vh; border-radius: 14px 14px 0 0; }
  .set-grid { grid-template-columns: 1fr; }
  .send-sum { grid-template-columns: 1fr; }
  table.arch thead { display: none; }
  table.arch, table.arch tbody, table.arch tr, table.arch td { display: block; width: 100%; }
  table.arch tr { border-bottom: 2px solid var(--line); padding: 8px 0; }
  table.arch td { border: 0; padding: 3px 10px; display: flex; justify-content: space-between; gap: 10px; }
  table.arch td::before { content: attr(data-label); font-weight: 700; color: var(--grey); font-size: 12px; }
  table.arch td.arch-act { flex-wrap: wrap; justify-content: flex-start; }
  table.arch td.arch-act::before { display: none; }
  .preview-page { transform-origin: top left; }
}

/* ============================ 9. STAMPA =============================== */
@page {
  size: A4 landscape;
  margin: 7mm 7mm 8mm;
  @bottom-right { content: "Pag. " counter(page) " / " counter(pages); font-family: Arial, sans-serif; font-size: 7pt; color: #777; }
}
@media print {
  html, body { background: #fff !important; margin: 0; padding: 0; }
  body { -webkit-print-color-adjust: exact; print-color-adjust: exact; }
  .no-print, .topbar, #editor, #modal-root, #toasts { display: none !important; }
  .print-only { display: block !important; }
  #print-area { width: 100%; }
  .doc a { color: inherit; text-decoration: none; }
}
.rules-t input[type=checkbox] { width: 18px; height: 18px; min-height: 0; margin: 0; padding: 0; accent-color: var(--orange); }

/* PDF generato come file (fuori schermo) */
.pdf-render { position: fixed; left: -12000px; top: 0; width: 283mm; background: #fff; }
.send-ch { border: 1px solid var(--line-2); border-radius: 8px; padding: 8px 12px; margin-top: 10px; background: #f8f9fa; }
.send-ch h4 { margin: 0 0 4px; font-size: 13px; }
.send-ch p { margin: 3px 0; font-size: 13px; }
.t-red { color: var(--red); }

.busy-ov { position: fixed; inset: 0; z-index: 3000; background: rgba(20, 24, 30, .45); display: flex; align-items: center; justify-content: center; }
.busy-ov > div { background: #fff; border-radius: 10px; padding: 16px 22px; font-weight: 700; display: flex; align-items: center; gap: 12px; box-shadow: 0 10px 30px rgba(0,0,0,.25); }
.spin { width: 18px; height: 18px; border: 3px solid #e6e6e6; border-top-color: var(--orange); border-radius: 50%; animation: spin .8s linear infinite; }
@keyframes spin { to { transform: rotate(360deg); } }
.gas-box { border: 1px dashed var(--line); border-radius: 8px; padding: 8px 10px; margin: 6px 0; }
.inl { display: flex; gap: 6px; } .inl input { flex: 1; }
.t-ok { color: #2e7d32; }

/* ===================== VERSIONE ONLINE (cloud.js) ===================== */
body.cloud-locked { overflow: hidden; }
#cloud-ov { position: fixed; inset: 0; z-index: 5000; background: linear-gradient(135deg, #1f2329 0%, #2b3038 60%, #3a2a1c 100%); display: flex; align-items: center; justify-content: center; padding: 20px; }
.cl-box { background: #fff; border-radius: 14px; padding: 28px 30px; width: 100%; max-width: 400px; box-shadow: 0 20px 60px rgba(0,0,0,.35); text-align: center; }
.cl-logo { max-width: 220px; max-height: 70px; object-fit: contain; margin-bottom: 8px; }
.cl-box h1 { margin: 4px 0 0; font-size: 20px; letter-spacing: .5px; }
.cl-sub { margin: 2px 0 18px; color: var(--grey); font-size: 13px; }
.cl-env { color: #b45309; }
.cl-form { display: flex; flex-direction: column; gap: 12px; text-align: left; }
.cl-form label { display: flex; flex-direction: column; gap: 4px; font-size: 12px; font-weight: 700; color: #444; text-transform: uppercase; letter-spacing: .3px; }
.cl-form input { min-height: 42px; padding: 8px 12px; border: 1.5px solid var(--line); border-radius: 8px; font: inherit; font-size: 15px; text-transform: none; }
.cl-form input:focus { outline: none; border-color: var(--orange); }
.cl-form .btn { min-height: 44px; font-size: 15px; }
.cl-link { background: none; border: 0; color: var(--grey); text-decoration: underline; cursor: pointer; font: inherit; font-size: 13px; }
.cl-msg { margin: 0 0 6px; font-size: 14px; line-height: 1.45; }
.cl-err { margin: 0; padding: 8px 10px; border-radius: 8px; background: #fdecec; color: #a12020; font-size: 13px; }
.cl-err.ok { background: #e8f5e9; color: #1b5e20; }
.cl-wait { display: flex; align-items: center; justify-content: center; gap: 10px; color: var(--grey); }

.cl-user { position: relative; }
.cl-btn { display: inline-flex; align-items: center; gap: 6px; height: 34px; padding: 0 10px; border: 1px solid var(--line); border-radius: 17px; background: #fff; color: #1f2329; cursor: pointer; font: inherit; font-size: 12.5px; max-width: 220px; }
.cl-btn small { opacity: .75; font-size: 10.5px; letter-spacing: .4px; }
.cl-nome { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 110px; font-weight: 700; }
.cl-sync[data-s="ok"] { color: #4caf50; } .cl-sync[data-s="pend"] { color: #ffb300; } .cl-sync[data-s="err"] { color: #ef5350; }
.cl-menu { position: absolute; right: 0; top: 40px; z-index: 1200; min-width: 240px; background: #fff; color: #222; border-radius: 10px; box-shadow: 0 10px 30px rgba(0,0,0,.25); padding: 6px; display: flex; flex-direction: column; }
.cl-menu[hidden] { display: none; }
.cl-menu .cl-info { padding: 8px 10px; border-bottom: 1px solid var(--line-2); margin-bottom: 4px; font-size: 13px; }
.cl-menu button { text-align: left; padding: 9px 10px; border: 0; background: none; border-radius: 6px; cursor: pointer; font: inherit; font-size: 14px; }
.cl-menu button:hover { background: var(--orange-soft); }
@media (max-width: 1760px) { .cl-nome { display: none; } .cl-btn { padding: 0 8px; } }

.org-tag { display: inline-block; margin-top: 2px; padding: 1px 6px; border-radius: 4px; background: #eef2f7; color: #36506e; font-size: 11px; font-weight: 700; }
#arch-org { min-height: 36px; }

.au-tools { display: flex; gap: 12px; align-items: center; flex-wrap: wrap; margin-bottom: 12px; }
.au-list { display: flex; flex-direction: column; gap: 12px; }
.au-org { border: 1px solid var(--line); border-radius: 10px; padding: 10px 12px; background: #fff; }
.au-org.off { background: #f7f7f7; opacity: .85; }
.au-h { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.au-cod { font-family: ui-monospace, Menlo, monospace; background: #1f2329; color: #fff; padding: 1px 6px; border-radius: 4px; font-size: 12px; }
.au-tipo { font-size: 11px; color: var(--grey); letter-spacing: .4px; }
.au-off { font-size: 11px; color: #fff; background: var(--red); padding: 1px 6px; border-radius: 4px; }
.au-h .au-act { margin-left: auto; display: inline-flex; gap: 6px; flex-wrap: wrap; }
.au-det { font-size: 12.5px; color: var(--grey); margin: 4px 0 6px; }
.au-t { width: 100%; border-collapse: collapse; font-size: 13px; }
.au-t td { padding: 6px 6px; border-top: 1px solid var(--line-2); }
.au-t tr.off td { color: #999; }
.au-t td.au-act { text-align: right; white-space: nowrap; }
.au-t td.au-act .btn { margin-left: 6px; }
.au-form { display: flex; flex-direction: column; gap: 8px; }
.au-sub { margin: 10px 0 0; font-size: 13px; letter-spacing: .3px; }
@media (max-width: 1320px) and (min-width: 1101px) { .cl-btn small { display: none; } .cl-btn { padding: 0 9px; } }
@media (max-width: 760px) { .cl-btn small { display: none; } .cl-btn { height: 30px; padding: 0 8px; } }

.au-modo { display: flex; flex-direction: column; gap: 4px; margin-top: 8px; padding: 8px 10px; border: 1px dashed var(--line); border-radius: 8px; font-size: 13px; }
.au-modo input[type=radio] { width: 16px; height: 16px; min-height: 0; margin: 0 6px 0 0; accent-color: var(--orange); }
.au-cred { display: flex; flex-direction: column; gap: 8px; background: #f4f6f8; border-radius: 8px; padding: 10px 12px; margin: 8px 0; }
.au-cred small { display: block; color: var(--grey); font-size: 11px; text-transform: uppercase; letter-spacing: .4px; }
.au-cred b { font-size: 15px; word-break: break-all; }
.au-pwd { font-family: ui-monospace, Menlo, monospace; font-size: 18px !important; letter-spacing: 1px; }