/* NOWY — Visualizzatore fatture XML (page-specific). Requires nowy-core.css + strumenti.css. */

.fx-loader.is-loaded .dropzone{ padding-block: var(--space-6); }
.fx-loader.is-loaded .dropzone__hint{ display: none; }
.fx-loader.is-loaded .toolbar{ display: none; }
.fx-listwrap{ max-height: 420px; overflow-y: auto; }
.fx-file{ max-width: 280px; word-break: break-all; }
.fx-errcell{ color: #7A170F; }
#fx-list tr.is-current td{ background: var(--brand-50); }
#fx-list .btn--sm{ --btn-h: 34px; --btn-px: 14px; }
.fx-addmore{ margin-top: var(--space-3); }
.t-err{ color: var(--color-danger); font-weight: var(--weight-medium); }

.fx-viewer{ scroll-margin-top: calc(var(--nav-h) + 12px); }
.fx-viewer__bar{
  position: sticky; top: calc(var(--nav-h) + 8px); z-index: 5;
  display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: var(--space-3);
  padding: var(--space-3) var(--space-4);
  margin-bottom: var(--space-4);
  background: rgba(255,255,255,.94);
  backdrop-filter: saturate(1.2);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-full);
}
.fx-viewer__bar .icon-btn[disabled]{ opacity: .35; pointer-events: none; }
.fx-viewer__bar .t-small{ min-width: 64px; text-align: center; font-variant-numeric: tabular-nums; }
@media (max-width: 639px){ .fx-viewer__bar{ border-radius: var(--radius-lg); position: static; } .fx-viewer__bar .toolbar{ width: 100%; justify-content: center; } }

/* --- Invoice document ---------------------------------------------------- */
.inv{
  display: grid; gap: var(--space-6);
  padding: clamp(var(--space-5), 3.4vw, var(--space-12));
  background: var(--color-surface);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-lg);
  box-shadow: var(--shadow-card);
  min-width: 0;
}
.inv-head{
  display: flex; flex-wrap: wrap; align-items: flex-end; justify-content: space-between; gap: var(--space-5) var(--space-10);
  padding-bottom: var(--space-6); border-bottom: 1px solid var(--color-border-strong);
}
.inv-title{ margin-top: var(--space-3); font-size: var(--text-h2); line-height: 1.1; letter-spacing: var(--tracking-heading); font-weight: var(--weight-medium); }
.inv-title:focus{ outline: none; }
.inv-sub{ margin-top: var(--space-2); color: var(--color-fg-2); }
.inv-sub strong{ font-weight: var(--weight-medium); color: var(--color-fg); }
.inv-head__total{ display: grid; justify-items: end; gap: 2px; text-align: right; }
.inv-head__amount{ font-size: clamp(1.75rem, 1.2rem + 2vw, 2.75rem); line-height: 1; letter-spacing: var(--tracking-display); font-weight: var(--weight-medium); font-variant-numeric: tabular-nums; color: var(--color-accent); }
@media (max-width: 559px){ .inv-head__total{ justify-items: start; text-align: left; } }

.inv-parties{ display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--space-4); }
.inv-parties--minor{ grid-template-columns: minmax(0, 1fr); }
.inv-party{ display: grid; gap: var(--space-2); align-content: start; padding: var(--space-5); background: var(--color-bg); border-radius: var(--radius-md); min-width: 0; }
.inv-party__name{ font-size: var(--text-h3); line-height: 1.25; letter-spacing: var(--tracking-title); font-weight: var(--weight-medium); overflow-wrap: anywhere; }
.inv-party__addr{ font-size: var(--text-small); color: var(--color-fg-2); }
@media (max-width: 719px){ .inv-parties{ grid-template-columns: 1fr; } }

.inv-dl{ display: grid; grid-template-columns: auto minmax(0, 1fr); gap: 4px var(--space-4); margin: var(--space-2) 0 0; font-size: var(--text-small); }
.inv-dl dt{ color: var(--color-fg-3); }
.inv-dl dd{ margin: 0; overflow-wrap: anywhere; }

.inv-block{ display: grid; gap: var(--space-3); min-width: 0; }
.inv-block__title{ font-size: var(--text-body); font-weight: var(--weight-medium); letter-spacing: var(--tracking-title); }
.inv-facts{ list-style: none; margin: 0; padding: 0; display: grid; gap: 6px; font-size: var(--text-small); color: var(--color-fg-2); }
.inv-facts .t-label{ display: inline-block; min-width: 9.5em; color: var(--color-fg-3); }
.inv-causale{ color: var(--color-fg); }

.inv-lines td{ font-size: var(--text-small); }
.inv-descr{ min-width: 220px; max-width: 520px; white-space: normal; }
.inv-code{ font-size: 12px; white-space: nowrap; }
.inv-extra{ display: block; margin-top: 2px; font-size: var(--text-caption); color: var(--color-fg-3); }
.inv-lines abbr{ text-decoration: none; border-bottom: 1px dotted currentColor; cursor: help; }

.inv-split{ display: grid; grid-template-columns: minmax(0, 1.4fr) minmax(0, 1fr); gap: var(--space-6); align-items: start; }
@media (max-width: 899px){ .inv-split{ grid-template-columns: 1fr; } }
.inv-sum{ margin: 0; display: grid; border-top: 1px solid var(--color-border); }
.inv-sum > div{ display: flex; justify-content: space-between; gap: var(--space-4); padding: 9px 0; border-bottom: 1px solid var(--color-border); font-size: var(--text-small); }
.inv-sum dt{ color: var(--color-fg-2); }
.inv-sum dd{ margin: 0; font-variant-numeric: tabular-nums; white-space: nowrap; }
.inv-sum .strong dt, .inv-sum .strong dd{ color: var(--color-fg); font-weight: var(--weight-medium); font-size: var(--text-body); }
.inv-sum .accent dd{ color: var(--color-accent); }

.inv-pay{ display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 320px), 1fr)); gap: var(--space-3); }
.inv-pay__item{ display: grid; gap: var(--space-3); padding: var(--space-5); border: 1px solid var(--color-border); border-radius: var(--radius-md); min-width: 0; }
.inv-pay__top{ display: grid; gap: 2px; }
.inv-pay__amount{ font-size: var(--text-h3); font-weight: var(--weight-medium); font-variant-numeric: tabular-nums; }
.inv-pay__top strong{ font-weight: var(--weight-medium); color: var(--color-fg); }
.inv-iban{ display: flex; flex-wrap: wrap; align-items: center; gap: 4px var(--space-3); padding: 10px 12px; background: var(--color-bg); border-radius: var(--radius-sm); }
.inv-iban__v{ font-size: 13.5px; letter-spacing: .02em; overflow-wrap: anywhere; flex: 1 1 auto; }
.icon-btn--sm{ width: 32px; height: 32px; }
.icon-btn--sm svg{ width: 15px; height: 15px; }

.inv-foot{ padding-top: var(--space-4); border-top: 1px solid var(--color-border); overflow-wrap: anywhere; }

/* --- Controls (checker) --------------------------------------------------- */
.inv-checks{
  display: grid; gap: var(--space-3);
  padding: var(--space-5);
  border-radius: var(--radius-md);
  border: 1px solid var(--color-border);
  border-left: 4px solid #1A7F4B;
  background: #F6FBF8;
}
.inv-checks--warn{ border-left-color: #B26A00; background: #FFFAF2; }
.inv-checks--err{ border-left-color: #B42318; background: #FFF7F6; }
.inv-checks__head{ display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: var(--space-3); }
.inv-checks__counts{ display: flex; flex-wrap: wrap; gap: 6px; }
.inv-checks__verdict{ font-weight: var(--weight-medium); }
.inv-checks__list{ list-style: none; margin: 0; padding: 0; display: grid; gap: 6px; }
.chk{ display: grid; grid-template-columns: 76px minmax(0, 1fr); gap: var(--space-3); padding: 10px 12px; background: var(--color-surface); border-radius: var(--radius-sm); font-size: var(--text-small); }
.chk p{ overflow-wrap: anywhere; }
.chk__lv{ align-self: start; justify-self: start; padding: 2px 8px; border-radius: var(--radius-full); font-size: 11px; font-weight: var(--weight-semibold); letter-spacing: .04em; text-transform: uppercase; }
.chk--err .chk__lv{ background: #FDECEA; color: #A41F15; }
.chk--warn .chk__lv{ background: #FEF3E2; color: #8A4B00; }
.chk__area{ display: block; font-family: var(--font-mono); font-size: 11px; letter-spacing: .04em; color: var(--color-fg-3); }
.chk__area abbr{ text-decoration: none; }
.inv-checks__passed summary{ cursor: pointer; font-size: var(--text-small); font-weight: var(--weight-medium); color: var(--color-fg-2); width: fit-content; border-radius: 4px; }
.inv-checks__passed ul{ list-style: none; margin: var(--space-3) 0 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 300px), 1fr)); gap: 4px var(--space-5); font-size: var(--text-small); }
.inv-checks__passed li{ display: flex; gap: 8px; align-items: flex-start; }
.inv-checks__passed li svg{ flex: none; width: 15px; height: 15px; margin-top: 3px; color: #1A7F4B; }
.inv-checks__passed .chk__area{ display: inline; margin-right: 4px; }
.inv-checks__note{ margin-top: 2px; }
@media (max-width: 479px){ .chk{ grid-template-columns: 1fr; gap: 4px; } }

/* --- Print: only the open invoice ---------------------------------------- */
@media print{
  @page{ margin: 12mm; }
  :root, .theme-light{
    --color-bg: #F4F5F8; --color-surface: #fff; --color-surface-2: #F4F5F8;
    --color-fg: #14131A; --color-fg-2: #2A2D3A; --color-fg-3: #5A5768;
    --color-border: #E3E0D9; --color-border-strong: #CFCBC2; --color-accent: #293A81;
  }
  body{ font-size: 10.5px; }
  .notice, .fx-loader, #fx-status, .fx-viewer__bar, #fx-results > .panel, .inv-checks__passed, .no-print{ display: none !important; }
  #fx-results, .fx-viewer{ display: block !important; }
  .stack{ gap: 0 !important; }
  .inv{ border: 0; padding: 0; box-shadow: none !important; gap: 12px; }
  .inv-head{ padding-bottom: 10px; }
  .inv-title{ font-size: 20px; }
  .inv-head__amount{ font-size: 22px; }
  .inv-party{ padding: 10px; background: #F4F5F8 !important; -webkit-print-color-adjust: exact; print-color-adjust: exact; }
  .inv-party__name{ font-size: 13px; }
  .table-wrap{ overflow: visible !important; border: 1px solid #CFCBC2; }
  .dtable{ font-size: 9.5px; }
  .dtable th, .dtable td{ padding: 4px 6px; }
  .dtable thead th{ position: static; background: #F4F5F8 !important; -webkit-print-color-adjust: exact; print-color-adjust: exact; }
  .dtable tr, .inv-pay__item, .inv-party, .chk{ break-inside: avoid; }
  .inv-descr{ min-width: 0; max-width: none; }
  .inv-checks{ padding: 8px 10px; -webkit-print-color-adjust: exact; print-color-adjust: exact; }
  .inv-split{ grid-template-columns: minmax(0, 1.4fr) minmax(0, 1fr); gap: 12px; }
  .inv-parties{ grid-template-columns: 1fr 1fr; }
  .inv-pay{ grid-template-columns: 1fr 1fr; }
  .pill{ -webkit-print-color-adjust: exact; print-color-adjust: exact; }
}
@media (max-width: 899px){ #fx-list{ min-width: 820px; } }
