:root {
  --bg: #f3f5f7;
  --panel: #ffffff;
  --text: #111827;
  --muted: #5b6472;
  --line: #cfd6df;
  --head: #ffd824;
  --tax: #ffb6b0;
  --green: #92d050;
  --blue: #e2ebf1;
  --black: #050505;
  --accent: #1f4e5f;
  --planning-green: #76b947;
  --dash-section: #e2ebf1;
  --dash-tax: #ffb6b0;
  --dash-yellow: #ffff00;
  --dash-green: #92d050;
  --dash-cost: #ffb6b0;
  --status-planned: #e8f1ff;
  --status-confirmed: #fff4bf;
  --status-invoiced: #dbeafe;
  --status-done: #d9f2d0;
  --status-cancelled: #ffd6d6;
}

.modal-panel.pdf-invoice-panel {
  width: min(1120px, calc(100vw - 32px));
  max-height: min(760px, calc(100vh - 24px));
  overflow: auto;
}

.pdf-invoice-panel .pdf-invoice-fields {
  grid-template-columns: repeat(12, minmax(0, 1fr));
  align-items: end;
}

.pdf-invoice-fields .pdf-field-sm {
  grid-column: span 2;
}

.pdf-invoice-fields .pdf-field-md {
  grid-column: span 3;
}

.pdf-invoice-fields .pdf-field-lg {
  grid-column: span 4;
}

.pdf-invoice-fields .pdf-field-wide {
  grid-column: span 6;
}

.pdf-invoice-fields input {
  width: 100%;
  height: 38px;
}

@media (max-width: 900px) {
  .pdf-invoice-panel .pdf-invoice-fields {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .pdf-invoice-fields .pdf-field-sm,
  .pdf-invoice-fields .pdf-field-md,
  .pdf-invoice-fields .pdf-field-lg,
  .pdf-invoice-fields .pdf-field-wide {
    grid-column: span 1;
  }
}

* { box-sizing: border-box; }

[hidden] {
  display: none !important;
}

body {
  margin: 0;
  background: var(--bg);
  color: var(--text);
  font-family: Segoe UI, Arial, sans-serif;
  font-size: 15px;
}

.app-shell-header {
  position: sticky;
  top: 0;
  z-index: 40;
  background: var(--bg);
  box-shadow: 0 2px 7px rgba(17, 24, 39, .14);
}

.app-header {
  min-height: 72px;
  padding: 14px 20px;
  background: #fff7ed;
  border-bottom: 4px solid #f97316;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
}


.app-brand {
  display: flex;
  align-items: center;
  gap: 12px;
  min-width: 0;
}

.app-logo {
  display: block;
  width: auto;
  height: 36px;
  max-width: 140px;
  object-fit: contain;
  flex: 0 0 auto;
}

.report-warning {
  margin: 0 0 10px;
  padding: 9px 12px;
  border: 1px solid #b45309;
  border-radius: 6px;
  background: #fffbeb;
  color: #78350f;
  font-weight: 700;
}

@media (max-width: 640px) {
  .app-brand { gap: 8px; }
  .app-logo { height: 28px; max-width: 96px; }
}
.test-env-badge {
  display: inline-block;
  margin-bottom: 4px;
  padding: 3px 9px;
  border-radius: 6px;
  background: #c2410c;
  color: #fff;
  font-size: 13px;
  font-weight: 800;
  letter-spacing: .04em;
}

.test-env-strip {
  padding: 7px 20px;
  background: #f97316;
  color: #111827;
  font-weight: 800;
  text-align: center;
  border-bottom: 1px solid #c2410c;
}

h1, h2, p { margin: 0; }
h1 { font-size: 24px; font-weight: 700; }
h2 { font-size: 18px; }
p, .muted { color: var(--muted); }

.header-actions, .archive-actions, .toolbar, .filters {
  display: flex;
  align-items: end;
  gap: 10px;
  flex-wrap: wrap;
}

button, select, input {
  font: inherit;
}

button {
  border: 1px solid #b9c2cc;
  background: #fff;
  color: var(--text);
  border-radius: 6px;
  padding: 8px 12px;
  cursor: pointer;
}

button:hover { background: #eef3f6; }
button.primary {
  background: var(--accent);
  border-color: var(--accent);
  color: #fff;
}

label {
  display: grid;
  gap: 4px;
  color: var(--muted);
  font-size: 13px;
}

select, input {
  border: 1px solid #b9c2cc;
  border-radius: 6px;
  padding: 8px 10px;
  background: #fff;
  color: var(--text);
  min-height: 38px;
}

.tabs {
  display: flex;
  gap: 4px;
  overflow-x: auto;
  background: #e9edf1;
  border-bottom: 1px solid var(--line);
  padding: 0 10px;
}

.tab {
  border: 0;
  border-radius: 0;
  background: transparent;
  padding: 12px 14px;
  white-space: nowrap;
}

.tab.active {
  background: #fff;
  border-left: 1px solid var(--line);
  border-right: 1px solid var(--line);
  font-weight: 700;
}

main { padding: 18px; }
.view { display: none; }
.view.active { display: block; }

.toolbar, .filters, .archive-head, .stats, .cards, .dashboard-sheet, .table-wrap {
  margin-bottom: 14px;
}

.archive-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}

.archive-subnav {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin: -4px 0 10px;
}

.archive-subnav button.active {
  background: var(--accent);
  border-color: var(--accent);
  color: #fff;
}

.quick-form {
  display: grid;
  grid-template-columns: repeat(5, minmax(140px, 1fr));
  gap: 10px;
  align-items: end;
  background: var(--panel);
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 12px;
  margin-bottom: 14px;
}

.archive-invoice-form {
  position: sticky;
  top: 0;
  z-index: 8;
  box-shadow: 0 2px 10px rgba(17, 24, 39, .08);
}

.quick-form button {
  min-height: 38px;
}

.invoice-form {
  grid-template-columns: repeat(14, minmax(58px, 1fr));
  gap: 8px;
}

.invoice-form label {
  min-width: 0;
}

.invoice-form input,
.invoice-form select {
  width: 100%;
}

.invoice-form label:has(#quickDataCompetenza) {
  grid-column: 1 / span 2;
  grid-row: 1;
}

.invoice-form label:has(#quickDataFattura) {
  grid-column: 3 / span 2;
  grid-row: 1;
}

.invoice-form label:has(#quickNumero) {
  grid-column: 5 / span 2;
  grid-row: 1;
}

.invoice-form label:has(#quickCliente) {
  grid-column: 7 / span 6;
  grid-row: 1;
}

.invoice-form label:has(#quickTipologia) {
  grid-column: 13 / span 2;
  grid-row: 1;
}

.invoice-form label:has(#quickImponibile) {
  grid-column: 1 / span 2;
  grid-row: 2;
}

.invoice-form label:has(#quickRivalsa) {
  grid-column: 3 / span 2;
  grid-row: 2;
}

.invoice-form label:has(#quickBollo) {
  grid-column: 5 / span 2;
  grid-row: 2;
}

.invoice-form label:has(#quickTotale) {
  grid-column: 7 / span 4;
  grid-row: 2;
}

.invoice-form label:has(#quickInps) {
  grid-column: 11 / span 2;
  grid-row: 2;
}

.invoice-form label:has(#quickIrpef) {
  grid-column: 13 / span 2;
  grid-row: 2;
}

.invoice-paid-field {
  grid-column: 1 / span 2;
  grid-row: 3;
}

.invoice-collection-date-field {
  grid-column: 3 / span 2;
  grid-row: 3;
}

.invoice-description-field {
  grid-column: 5 / span 5;
  grid-row: 3;
}

#invoiceSubmitBtn {
  grid-column: 13;
  grid-row: 3;
}

#cancelInvoiceEditBtn {
  grid-column: 14;
  grid-row: 3;
}

#invoiceQuickForm:not(:has(#cancelInvoiceEditBtn:not([hidden]))) #invoiceSubmitBtn {
  grid-column: 13 / span 2;
}

.invoice-form select:disabled {
  background: #eef2f6;
  color: var(--text);
  opacity: 1;
}

.cost-form {
  grid-template-columns: 120px 120px minmax(170px, 1fr) minmax(180px, 1fr) 105px 150px;
  gap: 8px;
}

.other-form {
  grid-template-columns: 120px 120px 120px minmax(220px, 1fr) 110px minmax(170px, 1fr) 130px;
  gap: 8px;
}

.investment-form {
  grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
  gap: 8px;
}

#quickInvSaleWarning { grid-column: 1 / -1; margin: 0; }

.investment-form label {
  min-width: 0;
}

.investment-form input,
.investment-form select {
  width: 100%;
}

.select-field {
  display: grid;
  grid-template-columns: 1fr 38px;
  gap: 4px;
}

.select-field input {
  min-width: 0;
}

.pick-btn {
  padding: 0;
  min-height: 38px;
}

.editable-wrap {
  display: grid;
  grid-template-columns: minmax(150px, 1fr) 32px;
  gap: 4px;
  align-items: center;
}

.editable-wrap .editable {
  min-width: 0;
}

.cards {
  display: grid;
  grid-template-columns: repeat(4, minmax(140px, 1fr));
  gap: 6px;
}

.card {
  background: var(--panel);
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 7px 10px;
  min-height: 58px;
}

.card .label {
  color: var(--muted);
  font-size: 12px;
}

.card .value {
  margin-top: 2px;
  text-align: right;
  font-size: 18px;
  font-weight: 800;
}

.card.status-planned { background: var(--status-planned); }
.card.status-confirmed { background: var(--status-confirmed); }
.card.status-invoiced { background: var(--status-invoiced); }
.card.status-done { background: var(--status-done); }
.card.status-cancelled { background: var(--status-cancelled); }

.dashboard-unpaid-card {
  cursor: pointer;
}

.dashboard-unpaid-card.is-valued {
  background: var(--tax);
  border-color: var(--tax);
}

.dashboard-unpaid-card.is-empty {
  background: var(--panel);
  border-color: var(--line);
}

.dashboard-unpaid-card:hover {
  outline: 2px solid var(--accent);
  outline-offset: -2px;
}

#dashboardCards {
  grid-template-columns: repeat(9, minmax(0, 1fr));
  gap: 5px;
}

#dashboardCards .card {
  min-width: 0;
  padding: 7px 7px;
}

#dashboardCards .card .label {
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

#dashboardCards .card .value {
  font-size: 16px;
}

.invoice-planning-field {
  grid-column: 10 / span 3;
  grid-row: 3;
}

.invoice-planning-field button {
  min-height: 38px;
  width: 100%;
}

.field-hint {
  color: var(--muted);
  font-size: 12px;
  margin-top: 3px;
}

.planning-link-wrap input[readonly] {
  background: #eef2f6;
}

.planning-link-panel {
  width: min(1050px, 100%);
  max-height: calc(100dvh - 20px);
  grid-template-rows: auto auto minmax(0, 1fr) auto;
}

.planning-link-panel .planning-link-list {
  min-height: 0;
  max-height: none;
}

.planning-link-panel .modal-actions {
  margin-top: 0;
}

.pdf-invoice-panel {
  width: min(1080px, 100%);
}

.pdf-invoice-fields {
  display: grid;
  grid-template-columns: repeat(4, minmax(150px, 1fr));
  gap: 10px;
  margin: 12px 0 16px;
}

.pdf-invoice-fields label {
  display: grid;
  gap: 5px;
  color: var(--muted);
}

.pdf-invoice-fields input,
.pdf-invoice-fields select {
  min-width: 0;
}

.pdf-duplicate {
  border: 1px solid #dc2626;
  background: #fee2e2;
  color: #7f1d1d;
  padding: 10px 12px;
  border-radius: 6px;
  margin: 10px 0;
  font-weight: 700;
}

.planning-link-list {
  display: grid;
  gap: 6px;
  max-height: 55vh;
  overflow: auto;
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 8px;
  background: var(--panel);
}

.planning-link-section {
  display: grid;
  gap: 2px;
}

.planning-link-section + .planning-link-section {
  margin-top: 10px;
  padding-top: 10px;
  border-top: 2px solid var(--accent);
}

.planning-link-section > strong {
  position: sticky;
  top: -8px;
  z-index: 1;
  padding: 7px 6px;
  background: var(--panel);
  color: var(--accent);
}

.planning-link-row {
  display: grid;
  grid-template-columns: 24px 1fr;
  gap: 8px;
  align-items: center;
  padding: 6px;
  border-bottom: 1px solid var(--line);
}

.planning-link-row:last-child {
  border-bottom: 0;
}

.planning-link-heading {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin: 8px 0;
}

.planning-link-heading h3 {
  margin: 0;
  flex: 0 0 auto;
}

.planning-link-heading button {
  flex: 0 0 auto;
  white-space: nowrap;
}

.planning-link-balance {
  border: 1px solid var(--line);
  background: #f8fafc;
  padding: 10px 12px;
  border-radius: 6px;
  font-weight: 600;
  flex: 1;
  text-align: right;
}

.card .value span {
  font-size: 13px;
  font-weight: 500;
}

#planningSummary {
  grid-template-columns: repeat(10, minmax(0, 1fr));
  gap: 5px;
}

#planningSummary .card {
  min-height: 42px;
  padding: 5px 8px;
}

#planningSummary .card .label {
  font-size: 10px;
}

#planningSummary .card .value {
  font-size: 15px;
  line-height: 1.15;
}

#planningSummary .card .value span {
  font-size: 11px;
}

.dashboard-sheet, .table-wrap {
  background: var(--panel);
  border: 1px solid var(--line);
  overflow: auto;
}

.dashboard-subnav,
.report-subnav {
  display: flex;
  gap: 8px;
  margin-bottom: 10px;
  flex-wrap: wrap;
}

.dashboard-subnav button.active,
.report-subnav button.active {
  background: var(--accent);
  border-color: var(--accent);
  color: #fff;
}

.dashboard-panel {
  display: none;
}

.dashboard-panel.active {
  display: block;
}

#dashboardCostsPanel .cards,
#dashboardClientsPanel .cards,
#dashboardInvestmentsPanel .cards {
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  max-width: 980px;
}

#archiveTable {
  max-height: calc(100vh - 335px);
}

.invoice-group-summary td { background: #eaf3f7; border-top: 2px solid var(--accent); border-bottom: 2px solid var(--accent); }
.invoice-group-summary-content { display: flex; flex-wrap: wrap; align-items: center; gap: 7px 18px; padding: 4px 2px; }
.invoice-group-summary-content > strong { color: var(--accent); }
.invoice-group-summary-content > small { flex-basis: 100%; color: var(--muted); }
.invoice-group-toggle { min-width: 34px; padding: 6px 8px; }
.invoice-group-detail td { background: #f8fbfc; }
.invoice-group-detail-hidden { display: none; }
.invoice-group-warning td { background: #fff4bf; color: #7a5200; padding: 9px 12px; border-top: 2px solid #d5a000; }
.invoice-group-unverified td { background: #fffdf3; }

.invoice-card-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px; padding: 2px; }
#archiveTable:has(.invoice-card-grid) { max-height: none; overflow: visible; border: 0; background: transparent; }
.invoice-card { position: relative; display: grid; grid-template-columns: 1fr auto; gap: 8px 12px; min-width: 0; min-height: 172px; padding: 16px; text-align: left; background: var(--panel); color: var(--text); border: 1px solid var(--line); border-left: 5px solid #d5a000; border-radius: 8px; box-shadow: 0 1px 2px rgba(15, 23, 42, .06); }
.invoice-card:hover { border-color: var(--accent); transform: translateY(-1px); box-shadow: 0 4px 12px rgba(15, 23, 42, .12); }
.invoice-card.is-paid { border-left-color: #208a47; }
.invoice-card-client { font-size: 16px; font-weight: 800; min-width: 0; overflow-wrap: anywhere; }
.invoice-card-status { justify-self: end; align-self: start; padding: 3px 7px; border-radius: 999px; font-size: 12px; font-weight: 800; white-space: nowrap; }
.invoice-card-status.paid, .invoice-detail-status.paid { background: #dcfce7; color: #166534; }
.invoice-card-status.pending, .invoice-detail-status.pending { background: #fff4bf; color: #7a5200; }
.invoice-card-meta { font-size: 13px; color: var(--muted); }
.invoice-card-total { justify-self: end; display: flex; flex-direction: column; align-items: flex-end; font-size: 18px; font-weight: 900; color: var(--accent); }
.invoice-card-total small { margin-bottom: 2px; color: var(--muted); font-size: 11px; font-weight: 600; }
.invoice-card-description { grid-column: 1 / -1; color: var(--muted); overflow-wrap: anywhere; }
.invoice-card-lines, .invoice-card-warning { grid-column: 1 / -1; font-size: 12px; font-weight: 700; }
.invoice-card-warning { color: #9a6200; }
.empty-card { grid-column: 1 / -1; padding: 24px; text-align: center; color: var(--muted); background: var(--panel); border: 1px solid var(--line); border-radius: 8px; }
.invoice-detail-panel { width: min(920px, calc(100vw - 24px)); max-height: calc(100vh - 24px); overflow: auto; }
.invoice-detail-status { display: inline-block; margin-bottom: 14px; padding: 6px 10px; border-radius: 999px; font-weight: 800; }
.invoice-detail-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 10px; }
.invoice-detail-field { min-width: 0; padding: 11px; background: var(--bg); border: 1px solid var(--line); border-radius: 7px; }
.invoice-detail-field span { display: block; margin-bottom: 5px; color: var(--muted); font-size: 12px; }
.invoice-detail-field strong { display: block; overflow-wrap: anywhere; }
.invoice-detail-field.wide { grid-column: span 2; }
.invoice-detail-field.total { border-color: var(--accent); color: var(--accent); }
.invoice-detail-actions { margin-top: 15px; border-top: 1px solid var(--line); }
.invoice-detail-payment { display: flex; align-items: center; gap: 9px; margin-top: 15px; font-weight: 800; color: #166534; }
.invoice-detail-row-action { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 9px 0; border-bottom: 1px solid var(--line); }
.invoice-detail-buttons { display: flex; gap: 7px; flex: none; }
.icon-action { width: 38px; height: 36px; padding: 0; font-size: 20px; font-weight: 800; }
.icon-action.edit { background: #ffd824; border-color: #d5a000; color: #5c4300; }
.icon-action.delete { background: #dc2626; border-color: #b91c1c; color: #fff; }
.icon-action.payment { background: #22a35a; border-color: #168142; color: #fff; }
.invoice-form-panel { width: min(1180px, 100%); max-width: 100%; height: auto; max-height: 100%; overflow: hidden; grid-template-rows: auto minmax(0, 1fr); }
.invoice-form-panel .archive-invoice-form { margin: 0; max-width: 100%; min-height: 0; overflow-x: hidden; overflow-y: auto; overscroll-behavior: contain; grid-template-columns: repeat(4, minmax(0, 1fr)); align-items: end; }
.invoice-form-panel .invoice-form > * { grid-column: auto !important; grid-row: auto !important; min-width: 0; }
.invoice-form-panel .invoice-description-field,
.invoice-form-panel .invoice-planning-field { grid-column: span 2 !important; }
.invoice-form-panel #invoiceSubmitBtn,
.invoice-form-panel #cancelInvoiceEditBtn { align-self: end; }
.modal-open { overflow: hidden !important; overscroll-behavior: none; }
.invoice-payment-panel { width: min(430px, calc(100vw - 24px)); }
.invoice-payment-panel label { display: grid; gap: 6px; }
.invoice-detail-warning { margin-top: 12px; padding: 9px; background: #fff4bf; border: 1px solid #d5a000; border-radius: 6px; color: #7a5200; }

@media (max-width: 1250px) {
  .invoice-form-panel { width: min(980px, 100%); padding: 12px; }
  .invoice-form-panel .invoice-form { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .invoice-form-panel .invoice-description-field,
  .invoice-form-panel .invoice-planning-field { grid-column: span 2 !important; }
}

@media (max-width: 900px) {
  .modal:has(.invoice-form-panel) { padding: 8px; }
  .invoice-form-panel { width: 100%; max-width: 100%; height: auto; max-height: calc(100dvh - 16px); padding: 10px; }
  .invoice-form-panel .invoice-form { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 9px; padding: 10px; }
  .invoice-form-panel .modal-head { z-index: 2; margin: -10px -10px 0; padding: 10px; background: var(--panel); border-bottom: 1px solid var(--line); }
}

@media (max-width: 520px) {
  .invoice-form-panel .invoice-form { grid-template-columns: 1fr; }
  .invoice-form-panel .invoice-form > * { grid-column: auto !important; }
}

@media (max-width: 1150px) {
  .invoice-card-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .invoice-detail-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 650px) {
  .invoice-card-grid, .invoice-detail-grid { grid-template-columns: 1fr; }
  .invoice-detail-field.wide { grid-column: auto; }
  .invoice-detail-row-action { align-items: flex-start; }
}

#reportTable {
  max-height: calc(100vh - 210px);
}

#reportTable .total-row td {
  background: var(--dash-green);
  font-weight: 800;
}

.cost-dashboard-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(320px, 1fr));
  gap: 10px;
  margin-top: 10px;
}

.cost-dashboard-grid section {
  min-width: 0;
}

.cost-dashboard-grid h2 {
  margin: 4px 0 6px;
  font-size: 15px;
}

.cost-dashboard-grid .wide {
  grid-column: 1 / -1;
}

.client-dashboard-grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 10px;
  margin-top: 10px;
}

.client-dashboard-grid h2 {
  margin: 4px 0 6px;
  font-size: 15px;
}

.client-chart {
  background: var(--panel);
  border: 1px solid var(--line);
  padding: 10px;
  overflow: auto;
}

.client-chart-legend {
  display: flex;
  flex-wrap: wrap;
  gap: 14px;
  margin-bottom: 10px;
  font-weight: 700;
}

.client-chart-legend span {
  display: inline-flex;
  align-items: center;
  gap: 6px;
}

.client-chart-legend i {
  width: 16px;
  height: 16px;
  border: 1px solid #9aa6b2;
}

.client-chart-row {
  display: grid;
  grid-template-columns: minmax(190px, 280px) 1fr;
  gap: 10px;
  align-items: start;
  padding: 6px 0;
  border-bottom: 1px solid var(--line);
}

.client-chart-row:last-child {
  border-bottom: 0;
}

.client-chart-label {
  font-weight: 700;
  overflow-wrap: anywhere;
}

.client-chart-bars {
  display: grid;
  gap: 4px;
  min-width: 320px;
}

.client-chart-bar-line {
  display: grid;
  grid-template-columns: minmax(40px, 1fr) 110px;
  gap: 8px;
  align-items: center;
}

.client-chart-bar {
  display: block;
  height: 16px;
  min-width: 2px;
  border-radius: 2px;
}

.client-chart-bar-line b {
  text-align: right;
  font-variant-numeric: tabular-nums;
}

.client-chart-bar-line b em {
  display: block;
  color: var(--muted);
  font-size: 11px;
  font-style: normal;
  font-weight: 700;
}

.client-column-chart {
  min-width: 760px;
  display: flex;
  align-items: end;
  gap: 14px;
  padding-top: 8px;
}

.client-column-group {
  min-width: 160px;
  display: grid;
  gap: 8px;
  justify-items: center;
}

.client-column-bars {
  min-height: 190px;
  display: flex;
  align-items: end;
  gap: 6px;
  border-bottom: 2px solid #9aa6b2;
  padding: 0 6px;
}

.client-column-item {
  width: 46px;
  display: grid;
  grid-template-rows: 132px auto auto auto;
  gap: 4px;
  align-items: end;
  justify-items: center;
  text-align: center;
}

.client-column-item span {
  display: block;
  width: 26px;
  border-radius: 3px 3px 0 0;
}

.client-column-item b {
  font-size: 11px;
  font-variant-numeric: tabular-nums;
  white-space: nowrap;
}

.client-column-item em {
  color: var(--muted);
  font-size: 11px;
  font-style: normal;
  font-weight: 700;
  white-space: nowrap;
}

.client-column-item small {
  color: var(--muted);
  font-weight: 700;
}

.client-column-label {
  max-width: 160px;
  min-height: 38px;
  font-weight: 700;
  text-align: center;
  overflow-wrap: anywhere;
}

.client-trend-line-row {
  display: grid;
  grid-template-columns: minmax(190px, 280px) 1fr;
  gap: 10px;
  padding: 8px 0;
  border-bottom: 1px solid var(--line);
}

.client-trend-line-row:last-child {
  border-bottom: 0;
}

.client-trend-line {
  min-width: 420px;
  display: flex;
  align-items: end;
  gap: 10px;
}

.client-trend-mini {
  min-width: 92px;
  display: grid;
  grid-template-rows: 104px auto auto;
  gap: 4px;
  align-items: end;
  justify-items: center;
  text-align: center;
}

.client-trend-mini span {
  display: block;
  width: 34px;
  border-radius: 3px 3px 0 0;
}

.client-trend-mini b {
  font-size: 12px;
  font-variant-numeric: tabular-nums;
}

.client-trend-mini small {
  color: var(--muted);
  font-weight: 700;
}

.client-trend-chart {
  min-height: 260px;
  background: var(--panel);
  border: 1px solid var(--line);
  padding: 12px;
  display: flex;
  align-items: end;
  gap: 16px;
  overflow-x: auto;
}

.client-trend-item {
  min-width: 150px;
  display: grid;
  grid-template-rows: auto 180px auto auto;
  gap: 6px;
  align-items: end;
  text-align: center;
}

.client-trend-value {
  font-weight: 800;
  font-variant-numeric: tabular-nums;
}

.client-trend-bar-wrap {
  height: 180px;
  display: flex;
  align-items: end;
  justify-content: center;
  border-bottom: 2px solid #9aa6b2;
}

.client-trend-bar {
  width: 72px;
  background: var(--accent);
  border: 1px solid #173b49;
  border-radius: 4px 4px 0 0;
}

.client-trend-year {
  font-weight: 800;
}

.client-trend-item .positive {
  color: #1f7a34;
  font-weight: 700;
}

.client-trend-item .negative {
  color: #b42318;
  font-weight: 700;
}

#dashboardInvestmentsPanel.comparison-mode .investment-summary-section {
  grid-column: 1 / -1;
}

#costMacroTable,
#costCategoryTable,
#costMonthlyTable,
#clientRevenueTable,
#investmentTypeTable,
#investmentLossTable,
#investmentInstrumentTable,
#investmentMonthlyTable,
#investmentReturnDetailTable,
#investmentLossDetailTable {
  max-height: 360px;
}

#costMacroTable,
#costCategoryTable,
#investmentTypeTable,
#investmentLossTable,
#investmentInstrumentTable {
  overflow-x: auto;
  overflow-y: auto;
}

#costMonthlyTable,
#clientRevenueTable,
#investmentMonthlyTable,
#investmentReturnDetailTable,
#investmentLossDetailTable {
  overflow-x: auto;
  overflow-y: auto;
}

#costMacroTable table,
#costCategoryTable table,
#costMonthlyTable table,
#clientRevenueTable table,
#investmentTypeTable table,
#investmentLossTable table,
#investmentInstrumentTable table,
#investmentMonthlyTable table,
#investmentReturnDetailTable table,
#investmentLossDetailTable table {
  min-width: 620px;
  table-layout: auto;
  width: 100%;
}

#costMacroTable th,
#costMacroTable td,
#costCategoryTable th,
#costCategoryTable td,
#costMonthlyTable th,
#costMonthlyTable td,
#clientRevenueTable th,
#clientRevenueTable td,
#investmentTypeTable th,
#investmentTypeTable td,
#investmentLossTable th,
#investmentLossTable td,
#investmentInstrumentTable th,
#investmentInstrumentTable td,
#investmentMonthlyTable th,
#investmentMonthlyTable td,
#investmentReturnDetailTable th,
#investmentReturnDetailTable td,
#investmentLossDetailTable th,
#investmentLossDetailTable td {
  padding: 6px 8px;
  font-size: 13px;
  line-height: 1.25;
}

#costMacroTable th:first-child,
#costMacroTable td:first-child,
#costCategoryTable th:first-child,
#costCategoryTable td:first-child,
#investmentTypeTable th:first-child,
#investmentTypeTable td:first-child,
#investmentLossTable th:first-child,
#investmentLossTable td:first-child,
#investmentInstrumentTable th:first-child,
#investmentInstrumentTable td:first-child {
  width: 250px;
  min-width: 250px;
  white-space: normal;
  overflow-wrap: anywhere;
}

#costMonthlyTable th:first-child,
#costMonthlyTable td:first-child,
#clientRevenueTable th:first-child,
#clientRevenueTable td:first-child,
#investmentMonthlyTable th:first-child,
#investmentMonthlyTable td:first-child,
#investmentReturnDetailTable th:first-child,
#investmentReturnDetailTable td:first-child,
#investmentLossDetailTable th:first-child,
#investmentLossDetailTable td:first-child {
  width: 190px;
  min-width: 190px;
  white-space: normal;
}

#costMacroTable th.num,
#costMacroTable td.num,
#costCategoryTable th.num,
#costCategoryTable td.num,
#costMonthlyTable th.num,
#costMonthlyTable td.num,
#clientRevenueTable th.num,
#clientRevenueTable td.num,
#investmentTypeTable th.num,
#investmentTypeTable td.num,
#investmentLossTable th.num,
#investmentLossTable td.num,
#investmentInstrumentTable th.num,
#investmentInstrumentTable td.num,
#investmentMonthlyTable th.num,
#investmentMonthlyTable td.num,
#investmentReturnDetailTable th.num,
#investmentReturnDetailTable td.num,
#investmentLossDetailTable th.num,
#investmentLossDetailTable td.num {
  min-width: 105px;
  text-align: right;
  white-space: nowrap;
  font-weight: 700;
}

#dashboardInvestmentsPanel.comparison-mode #investmentTypeTable th.num,
#dashboardInvestmentsPanel.comparison-mode #investmentTypeTable td.num,
#dashboardInvestmentsPanel.comparison-mode #investmentLossTable th.num,
#dashboardInvestmentsPanel.comparison-mode #investmentLossTable td.num,
#dashboardInvestmentsPanel.comparison-mode #investmentInstrumentTable th.num,
#dashboardInvestmentsPanel.comparison-mode #investmentInstrumentTable td.num,
#dashboardInvestmentsPanel.comparison-mode #investmentMonthlyTable th.num,
#dashboardInvestmentsPanel.comparison-mode #investmentMonthlyTable td.num {
  min-width: 82px;
  padding-left: 5px;
  padding-right: 5px;
}

#dashboardInvestmentsPanel.comparison-mode #investmentTypeTable th,
#dashboardInvestmentsPanel.comparison-mode #investmentLossTable th,
#dashboardInvestmentsPanel.comparison-mode #investmentInstrumentTable th,
#dashboardInvestmentsPanel.comparison-mode #investmentMonthlyTable th {
  white-space: normal;
  line-height: 1.1;
}

#costMacroTable,
#costCategoryTable {
  overflow-x: hidden;
}

#costMonthlyTable {
  overflow-x: hidden;
}

#costMacroTable table,
#costCategoryTable table,
#costMonthlyTable table {
  min-width: 0;
  table-layout: fixed;
}

#costMacroTable th,
#costMacroTable td,
#costCategoryTable th,
#costCategoryTable td,
#costMonthlyTable th,
#costMonthlyTable td {
  padding: 7px 9px;
  font-size: 14px;
}

#costMacroTable th:first-child,
#costMacroTable td:first-child,
#costCategoryTable th:first-child,
#costCategoryTable td:first-child {
  width: 56%;
  min-width: 0;
}

#costMonthlyTable th:first-child,
#costMonthlyTable td:first-child {
  width: 38%;
  min-width: 0;
}

#costMacroTable th.num,
#costMacroTable td.num,
#costCategoryTable th.num,
#costCategoryTable td.num,
#costMonthlyTable th.num,
#costMonthlyTable td.num {
  width: auto;
  min-width: 0;
}

#costMacroTable .total-row td,
#costCategoryTable .total-row td,
#costMonthlyTable .total-row td,
#clientRevenueTable .total-row td,
#investmentTypeTable .total-row td,
#investmentLossTable .total-row td,
#investmentInstrumentTable .total-row td,
#investmentMonthlyTable .total-row td,
#investmentReturnDetailTable .total-row td,
#investmentLossDetailTable .total-row td {
  background: var(--dash-green);
  font-weight: 800;
}

#planningTable {
  max-height: 34vh;
  border-color: #b9c4cf;
}

#planningTable table {
  min-width: 1900px;
  table-layout: fixed;
  font-size: 13px;
}

#planningTable .action-col { width: 82px; }
#planningTable .col-id { width: 58px; }
#planningTable .col-data { width: 125px; }
#planningTable .col-ora { width: 90px; }
#planningTable .col-cliente { width: 220px; }
#planningTable .col-localita { width: 180px; }
#planningTable .col-km,
#planningTable .col-persone { width: 95px; }
#planningTable .col-tempo-percorrenza { width: 135px; }
#planningTable .col-lordo-orario { width: 125px; }
#planningTable .col-attivita { width: 170px; }
#planningTable .col-descrizione { width: 230px; }
#planningTable .col-ore { width: 95px; }
#planningTable .col-importo { width: 110px; }
#planningTable .col-stato { width: 145px; }
#planningTable .col-note { width: 210px; }

#planningTable tbody tr.status-planned td { background: color-mix(in srgb, var(--status-planned) 72%, #fff); }
#planningTable tbody tr.status-confirmed td { background: color-mix(in srgb, var(--status-confirmed) 72%, #fff); }
#planningTable tbody tr.status-invoiced td { background: color-mix(in srgb, var(--status-invoiced) 72%, #fff); }
#planningTable tbody tr.status-done td { background: color-mix(in srgb, var(--status-done) 72%, #fff); }
#planningTable tbody tr.status-cancelled td { background: color-mix(in srgb, var(--status-cancelled) 72%, #fff); }

#planningTable .editable {
  background: rgba(255, 255, 255, .84);
  width: 100%;
  min-width: 0;
  min-height: 32px;
  padding: 4px 6px;
}

#planningTable .status-select {
  font-weight: 700;
}

#planningClientSummary {
  max-height: 42vh;
  border: 1px solid #9aa6b2;
  box-shadow: inset 0 1px 0 #fff;
  overflow-y: auto;
  overflow-x: hidden;
}

.planning-toolbar {
  background: #ffffff;
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 10px;
  align-items: end;
}

.planning-form {
  grid-template-columns: 130px 115px minmax(190px, 1.2fr) minmax(150px, 1fr) 90px 90px 135px 130px;
  gap: 8px;
}

.planning-form label {
  min-width: 0;
}

.planning-form input,
.planning-form select {
  width: 100%;
}

.planning-form label:nth-of-type(3) { grid-column: span 2; }
.planning-form label:nth-of-type(4) { grid-column: span 2; }
.planning-form label:nth-of-type(10) { grid-column: span 2; }
.planning-form label:nth-of-type(11) { grid-column: span 2; }
.planning-form label:nth-of-type(15) { grid-column: span 3; }
.planning-form button {
  grid-column: span 2;
  min-width: 150px;
}

table {
  border-collapse: collapse;
  width: 100%;
  min-width: 760px;
}

th, td {
  border: 1px solid var(--line);
  padding: 4px 6px;
  vertical-align: middle;
}

th {
  background: #eef2f6;
  text-align: left;
  position: sticky;
  top: 0;
  z-index: 3;
  box-shadow: 0 1px 0 var(--line);
}

#planningTable th,
#planningClientSummary th,
#archiveTable th {
  position: sticky;
  top: 0;
  z-index: 5;
}

#planningClientSummary .planning-matrix thead tr:first-child th {
  top: 0;
  height: 26px;
  z-index: 10;
}

#planningClientSummary .planning-matrix thead tr:nth-child(2) th {
  top: 26px;
  height: 26px;
  z-index: 9;
}

#planningClientSummary .planning-matrix thead .left-head {
  z-index: 30;
}

#planningClientSummary .planning-matrix thead .company-head {
  z-index: 31;
}

#planningClientSummary tbody tr:last-child td {
  background: #eef2f6;
  font-weight: 800;
}

.planning-matrix {
  table-layout: fixed;
  font-size: 11px;
  border-collapse: separate;
  border-spacing: 0;
}

.planning-matrix-shell {
  display: flex;
  align-items: flex-start;
  min-width: 0;
}

.planning-fixed-matrix {
  flex: 0 0 305px;
  width: 305px;
  min-width: 305px;
  max-width: 305px;
}

.planning-weeks-scroll {
  flex: 1 1 auto;
  min-width: 0;
  overflow-x: auto;
  overflow-y: hidden;
}

.planning-weeks-matrix {
  min-width: 3100px;
}

.planning-matrix th,
.planning-matrix td {
  padding: 4px 5px;
  text-align: center;
  white-space: nowrap;
  border-color: #aab3bd;
}

.planning-matrix .left-head {
  background: #e32616;
  color: #fff;
  text-align: left;
  width: 185px;
}

.planning-matrix .company-head {
  background: #e32616;
  color: #fff;
  width: 120px;
  height: 26px;
  box-shadow: inset 0 -1px 0 #aab3bd, inset 1px 0 0 #aab3bd;
}

.planning-matrix .month-head,
.planning-matrix .week-head {
  background: #e32616;
  color: #fff;
  font-weight: 800;
}

.planning-matrix .week-head {
  width: 56px;
}

.planning-matrix .client-cell {
  text-align: left;
  font-weight: 700;
  background: #fff;
  width: 185px;
}

.planning-matrix .total-company {
  background: #fff6bf;
  font-weight: 700;
}

.planning-matrix .week-filled {
  background: #fff;
  color: #000;
  font-weight: 400;
}

.planning-matrix .planning-status-line {
  display: flex;
  flex-direction: column;
  gap: 1px;
  align-items: stretch;
  margin: 1px 0;
  padding: 3px;
  border-radius: 2px;
  text-align: center;
  line-height: 1.05;
  min-width: 48px;
}

.planning-matrix .planning-status-line.status-planned { background: var(--status-planned); }
.planning-matrix .planning-status-line.status-confirmed { background: var(--status-confirmed); }
.planning-matrix .planning-status-line.status-invoiced { background: var(--status-invoiced); }
.planning-matrix .planning-status-line.status-done { background: var(--status-done); }
.planning-matrix .planning-status-line.status-cancelled { background: var(--status-cancelled); }

.planning-matrix .planning-status-line span {
  font-size: 9px;
  font-weight: 700;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  text-align: center;
}

.planning-matrix .planning-status-line strong {
  display: block;
  font-weight: 800;
  font-size: 11px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.planning-matrix .week-empty {
  background: #fff;
}

.planning-matrix .planning-click-cell {
  cursor: pointer;
}

.planning-matrix .planning-click-cell:hover {
  outline: 2px solid var(--accent);
  outline-offset: -2px;
}

.planning-matrix .planning-total-row td {
  background: #ffff00;
  font-weight: 800;
}

.planning-matrix .planning-total-row .client-cell,
.planning-matrix .planning-total-row .total-company {
  background: #ffff00;
}

#planningClientSummary .planning-matrix thead tr:first-child .left-head {
  top: 0;
  z-index: 95;
}

#planningClientSummary .planning-matrix thead tr:nth-child(2) .left-head {
  top: 26px;
  z-index: 95;
}

#planningClientSummary .planning-matrix thead .company-head {
  position: sticky;
  top: 0;
  left: 185px;
  z-index: 96;
  background: #e32616;
  color: #fff;
  height: 26px;
  background-clip: padding-box;
}

#planningClientSummary .planning-matrix thead .company-sub-head {
  top: 26px;
  left: 185px;
  z-index: 96;
}

#planningClientSummary .planning-matrix .month-head {
  z-index: 70;
}

#planningClientSummary .planning-matrix .week-head {
  z-index: 69;
}

#planningClientSummary .planning-matrix .client-cell {
  top: auto;
  z-index: 5;
}

#planningClientSummary .planning-matrix .total-company {
  left: 185px;
  top: auto;
  z-index: 6;
}

#planningClientSummary .planning-matrix thead tr:first-child th {
  top: 0 !important;
  z-index: 30 !important;
}

#planningClientSummary .planning-matrix thead tr:nth-child(2) th {
  top: 26px !important;
  z-index: 29 !important;
}

#planningClientSummary .planning-matrix thead .left-head {
  width: 185px !important;
  min-width: 185px !important;
  max-width: 185px !important;
  z-index: 120 !important;
  background: #e32616 !important;
}

#planningClientSummary .planning-matrix thead .company-head {
  width: 120px !important;
  min-width: 120px !important;
  max-width: 120px !important;
  z-index: 121 !important;
  background: #e32616 !important;
  color: #fff !important;
  box-shadow: inset 0 -1px 0 #aab3bd, inset 1px 0 0 #aab3bd, 6px 0 0 #e32616;
}

#planningClientSummary .planning-matrix thead .company-sub-head {
  top: 26px !important;
}

#planningClientSummary .planning-matrix .month-head,
#planningClientSummary .planning-matrix .week-head {
  z-index: 20 !important;
}

#planningClientSummary .planning-matrix tbody .client-cell {
  z-index: 1 !important;
}

#planningClientSummary .planning-matrix tbody .total-company {
  z-index: 1 !important;
}

#planningClientSummary {
  overflow: auto;
}

#planningClientSummary .planning-matrix {
  min-width: 3400px;
}

#planningClientSummary .planning-matrix .left-head,
#planningClientSummary .planning-matrix .company-head,
#planningClientSummary .planning-matrix .client-cell,
#planningClientSummary .planning-matrix .total-company {
  position: static !important;
  left: auto !important;
  top: auto !important;
  z-index: auto !important;
}

#planningClientSummary .planning-matrix thead .left-head,
#planningClientSummary .planning-matrix thead .company-head,
#planningClientSummary .planning-matrix thead .month-head,
#planningClientSummary .planning-matrix thead .week-head {
  position: sticky !important;
}

#planningClientSummary .planning-matrix thead tr:first-child .left-head,
#planningClientSummary .planning-matrix thead tr:first-child .company-head,
#planningClientSummary .planning-matrix thead tr:first-child .month-head {
  top: 0 !important;
  z-index: 40 !important;
}

#planningClientSummary .planning-matrix thead tr:nth-child(2) .left-head,
#planningClientSummary .planning-matrix thead tr:nth-child(2) .company-head,
#planningClientSummary .planning-matrix thead tr:nth-child(2) .week-head {
  top: 26px !important;
  z-index: 39 !important;
}

#planningClientSummary .planning-matrix thead .left-head {
  width: 185px !important;
  min-width: 185px !important;
  max-width: 185px !important;
}

#planningClientSummary .planning-matrix thead .company-head {
  width: 120px !important;
  min-width: 120px !important;
  max-width: 120px !important;
  box-shadow: inset 0 -1px 0 #aab3bd, inset 1px 0 0 #aab3bd;
}

#planningClientSummary .planning-matrix .left-head,
#planningClientSummary .planning-matrix .client-cell {
  width: 185px !important;
  min-width: 185px !important;
  max-width: 185px !important;
}

#planningClientSummary .planning-matrix .company-head,
#planningClientSummary .planning-matrix .total-company {
  width: 120px !important;
  min-width: 120px !important;
  max-width: 120px !important;
}

#planningClientSummary .planning-matrix thead .left-head,
#planningClientSummary .planning-matrix thead .company-head,
#planningClientSummary .planning-matrix tbody .client-cell,
#planningClientSummary .planning-matrix tbody .total-company {
  position: sticky !important;
  background-clip: padding-box;
}

#planningClientSummary .planning-matrix thead .left-head,
#planningClientSummary .planning-matrix tbody .client-cell {
  left: 0 !important;
}

#planningClientSummary .planning-matrix thead .company-head,
#planningClientSummary .planning-matrix tbody .total-company {
  left: 185px !important;
}

#planningClientSummary .planning-matrix thead tr:first-child .left-head,
#planningClientSummary .planning-matrix thead tr:first-child .company-head {
  top: 0 !important;
  z-index: 90 !important;
}

#planningClientSummary .planning-matrix thead tr:nth-child(2) .left-head,
#planningClientSummary .planning-matrix thead tr:nth-child(2) .company-head {
  top: 26px !important;
  z-index: 89 !important;
}

#planningClientSummary .planning-matrix tbody .client-cell {
  z-index: 20 !important;
  white-space: normal !important;
  overflow-wrap: anywhere;
  word-break: normal;
  line-height: 1.2;
}

#planningClientSummary .planning-matrix tbody .total-company {
  z-index: 21 !important;
}

#planningClientSummary .planning-matrix thead .left-head,
#planningClientSummary .planning-matrix thead .company-head {
  background: #e32616 !important;
  color: #fff !important;
}

#planningClientSummary .planning-matrix tbody .client-cell {
  background: #fff !important;
}

#planningClientSummary .planning-matrix tbody .total-company {
  background: #fff6bf !important;
}

#planningClientSummary .planning-matrix tbody .planning-total-row .client-cell,
#planningClientSummary .planning-matrix tbody .planning-total-row .total-company {
  background: #ffff00 !important;
}

td.num, th.num, input.num, .editable.num {
  text-align: right;
  font-variant-numeric: tabular-nums;
}

.dash-row-header td { background: var(--head); font-weight: 800; }
.dash-row-section td { background: var(--dash-section); font-weight: 800; }
.dash-row-tax td { background: var(--dash-tax); }
.dash-row-cost td { background: var(--dash-cost); }
.dash-row-yellow td { background: var(--dash-yellow); }
.dash-row-green td { background: var(--dash-green); }
.dash-row-total td, .dash-row-final td { font-weight: 800; }
.dash-row-spacer td { background: var(--black); height: 22px; padding: 0; border-color: var(--black); }

.dashboard-comparison {
  min-width: 860px;
  font-size: 14px;
}

.dashboard-comparison .row-label {
  min-width: 185px;
  position: sticky;
  left: 0;
  z-index: 2;
  background: inherit;
}

.dashboard-comparison .dash-row-header .row-label {
  z-index: 4;
}

.dashboard-comparison .year-head,
.dashboard-comparison .metric-head {
  text-align: center;
}

.dashboard-comparison td {
  height: 28px;
}

.dashboard-comparison .dash-row-header .metric-0,
.dashboard-comparison .dash-row-header .metric-1,
.dashboard-comparison .dash-row-header .metric-2,
.dashboard-comparison .dash-row-header .metric-3 {
  background: var(--head);
}

.dashboard-comparison .dash-row-section .metric-0 { background: var(--dash-section); }
.dashboard-comparison .dash-row-tax .metric-0 { background: var(--dash-tax); }
.dashboard-comparison .dash-row-cost .metric-0 { background: var(--dash-cost); }
.dashboard-comparison .dash-row-yellow .metric-0 { background: var(--dash-yellow); }
.dashboard-comparison .dash-row-green .metric-0 { background: var(--dash-green); }
}

.stats {
  background: var(--panel);
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 10px 12px;
  line-height: 1.5;
}

.edit-hint {
  margin: 8px 0;
  color: var(--muted);
  font-size: 13px;
}

.editable {
  width: 100%;
  min-width: 90px;
  border: 1px solid #c9d3df;
  border-radius: 4px;
  background: #fff;
  padding: 4px 6px;
  color: var(--ink);
  font-variant-numeric: tabular-nums;
}

.readonly-cell {
  width: 100%;
  min-width: 90px;
  border: 1px solid #c9d3df;
  border-radius: 4px;
  background: #eef3f8;
  padding: 4px 6px;
  color: var(--ink);
  font-variant-numeric: tabular-nums;
}

.action-col {
  width: 72px;
  text-align: center;
}

.col-id {
  width: 58px;
  min-width: 58px;
  max-width: 64px;
}

.col-id .editable,
.col-id .readonly-cell {
  min-width: 48px;
  width: 54px;
}

#archiveTable table {
  table-layout: auto;
}

#archiveTable .col-data-cassa,
#archiveTable .col-data-competenza,
#archiveTable .col-data-fattura,
#archiveTable .col-data-incasso,
#archiveTable .col-data-acquisto,
#archiveTable .col-data-vendita {
  min-width: 190px;
}

#archiveTable .col-categoria,
#archiveTable .col-cliente,
#archiveTable .col-nome-titolo,
#archiveTable .col-tipologia-titolo,
#archiveTable .col-tipo-documento,
#archiveTable .col-tipologia-cliente,
#archiveTable .col-macro-categoria,
#archiveTable .col-localita {
  min-width: 190px;
}

#archiveTable .col-descrizione,
#archiveTable .col-note {
  min-width: 230px;
}

#archiveTable .col-importo,
#archiveTable .col-lordo-orario,
#archiveTable .col-imponibile,
#archiveTable .col-rivalsa,
#archiveTable .col-valore,
#archiveTable .col-valore-vendita,
#archiveTable .col-spese-acquisto,
#archiveTable .col-spese-vendita,
#archiveTable .col-totale-fattura,
#archiveTable .col-inps-stimata,
#archiveTable .col-irpef-stimata,
#archiveTable .col-prezzo-unitario,
#archiveTable .col-prezzo-vendita,
#archiveTable .col-valore-attuale,
#archiveTable .col-rendimento {
  min-width: 130px;
}

#archiveTable .col-km,
#archiveTable .col-persone,
#archiveTable .col-tempo-percorrenza {
  min-width: 120px;
}

#archiveTable .col-anno-competenza,
#archiveTable .col-anno-cassa,
#archiveTable .col-anno-incasso {
  min-width: 125px;
}

#archiveTable .col-deducibile,
#archiveTable .col-incassata,
#archiveTable .col-venduto,
#archiveTable .col-stato,
#archiveTable .col-ambito {
  min-width: 115px;
}

.row-delete-btn,
.row-edit-btn,
.planning-row-delete-btn {
  padding: 4px 7px;
  min-height: 28px;
  font-size: 12px;
  width: 100%;
  margin: 1px 0;
}

.editable:hover {
  border-color: #88a9ba;
  background: #f8fcff;
}

.editable:focus {
  outline: 2px solid #5c8fa5;
  border-color: #3f7288;
  background: #fff;
}

.dirty #saveBtn,
.dirty #saveArchiveBtn,
.dirty #savePlanningBtn {
  background: #b45309;
  color: #fff;
  border-color: #92400e;
}

.select-col { width: 38px; text-align: center; }

.toast {
  position: fixed;
  right: 16px;
  bottom: 16px;
  max-width: min(420px, calc(100vw - 32px));
  background: #111827;
  color: #fff;
  padding: 12px 14px;
  border-radius: 8px;
  opacity: 0;
  transform: translateY(8px);
  transition: 180ms ease;
  pointer-events: none;
}

.toast.show {
  opacity: 1;
  transform: translateY(0);
}

.modal {
  position: fixed;
  inset: 0;
  z-index: 50;
  display: grid;
  place-items: center;
  background: rgba(17, 24, 39, .42);
  padding: 18px;
}

.modal[hidden] {
  display: none;
}

.modal-panel {
  width: min(620px, 100%);
  min-width: 0;
  max-height: min(720px, calc(100vh - 36px));
  background: #fff;
  border: 1px solid var(--line);
  border-radius: 8px;
  box-shadow: 0 18px 60px rgba(17, 24, 39, .25);
  padding: 14px;
  display: grid;
  gap: 10px;
  overflow: hidden;
}

.unpaid-panel {
  width: min(1100px, 100%);
}

.unpaid-date {
  min-width: 145px;
}

.modal-panel > * {
  min-width: 0;
}

.modal-head {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 10px;
}

.modal-list {
  overflow: auto;
  border: 1px solid var(--line);
  max-height: 520px;
}

.modal-item {
  width: 100%;
  border: 0;
  border-bottom: 1px solid var(--line);
  border-radius: 0;
  text-align: left;
  padding: 10px 12px;
}

.modal-item strong {
  display: block;
}

.modal-item span {
  display: block;
  color: var(--muted);
  font-size: 12px;
  margin-top: 2px;
}

.modal-subtitle {
  margin: 3px 0 0;
  color: var(--muted);
  font-size: 13px;
}

.modal-actions {
  display: flex;
  justify-content: flex-end;
  gap: 10px;
}

.import-map-panel {
  width: min(560px, calc(100vw - 24px));
  max-height: calc(100vh - 24px);
  grid-template-rows: auto auto minmax(120px, 1fr) minmax(120px, .7fr) auto;
}

.import-map-help {
  color: var(--muted);
  font-size: 13px;
}

.import-map-grid {
  max-height: none;
  min-height: 0;
  overflow: auto;
  border: 1px solid var(--line);
  border-radius: 6px;
  background: #fff;
  width: 100%;
}

.import-map-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 4px;
  width: 100%;
  border-bottom: 1px solid var(--line);
  padding: 9px;
  color: var(--muted);
}

.import-map-row strong {
  display: block;
  color: var(--text);
  max-width: 100%;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.import-map-row span {
  font-size: 11px;
  line-height: 1.1;
}

.import-map-row select {
  width: 100%;
  min-width: 0;
  max-width: 100%;
  font-size: 13px;
  padding: 6px 8px;
  min-height: 34px;
}

.import-preview-section {
  min-height: 0;
  display: grid;
  grid-template-rows: auto minmax(0, 1fr);
  gap: 8px;
}

.import-preview {
  max-height: 220px;
  min-height: 0;
  max-width: 100%;
  overflow-y: auto;
  overflow-x: hidden;
  display: grid;
  gap: 8px;
  padding-right: 4px;
}

.import-map-panel .modal-actions {
  position: sticky;
  bottom: 0;
  z-index: 3;
  background: #fff;
  border-top: 1px solid var(--line);
  padding-top: 10px;
}

.import-preview-row {
  min-width: 0;
  border: 1px solid var(--line);
  border-radius: 6px;
  padding: 8px;
  background: #fff;
  display: grid;
  gap: 4px;
  font-size: 12px;
}

.import-preview-row > strong {
  font-size: 13px;
}

.import-preview-row div {
  display: grid;
  grid-template-columns: minmax(0, 120px) minmax(0, 1fr);
  gap: 8px;
  min-width: 0;
}

.import-preview-row span {
  color: var(--muted);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.import-preview-row b {
  font-weight: 600;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.settings-panel {
  background: var(--panel);
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 16px;
}

.settings-subnav {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin: 14px 0;
  border-bottom: 1px solid var(--line);
  padding-bottom: 10px;
}

.settings-subtab.active {
  background: var(--accent);
  border-color: var(--accent);
  color: #fff;
}

.settings-subtab.danger {
  border-color: #d66;
}

.settings-section {
  display: none;
}

.settings-section.active {
  display: block;
}

.settings-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(160px, 1fr));
  gap: 14px;
  margin-top: 14px;
}

.settings-color-title {
  grid-column: 1 / -1;
  margin: 8px 0 -4px;
  padding-top: 10px;
  border-top: 1px solid var(--line);
  font-size: 15px;
}

.settings-color-title:first-child {
  border-top: 0;
  padding-top: 0;
}

.settings-grid input[type="color"] {
  width: 100%;
  height: 44px;
  padding: 3px;
}

.settings-actions {
  margin-top: 16px;
}

.backup-toolbar {
  display: flex;
  align-items: end;
  gap: 10px;
  flex-wrap: wrap;
  margin: 16px 0;
}

.backup-toolbar label {
  min-width: min(520px, 100%);
  flex: 1;
}

.backup-counts {
  margin-top: 10px;
  min-width: 0;
  max-width: 520px;
}

.backup-counts td:first-child {
  font-weight: 600;
}

.danger-box {
  margin-top: 16px;
  border: 1px solid #dc2626;
  background: #fff1f1;
  border-radius: 8px;
  padding: 14px;
  display: grid;
  gap: 12px;
}

.delete-archive-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}

.delete-archive-list {
  display: grid;
  grid-template-columns: repeat(3, minmax(180px, 1fr));
  gap: 8px;
}

.delete-archive-item {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  align-items: center;
  gap: 8px;
  background: var(--panel);
  border: 1px solid var(--line);
  border-radius: 6px;
  padding: 8px 10px;
  min-width: 0;
}

.delete-archive-item span {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.delete-archive-item b {
  font-variant-numeric: tabular-nums;
}

.danger-button {
  background: #b91c1c;
  border-color: #991b1b;
  color: #fff;
  justify-self: start;
}

.danger-button:hover {
  background: #991b1b;
}

@media (max-width: 760px) {
  .app-header { align-items: stretch; flex-direction: column; }
  main { padding: 10px; }
  .cards { grid-template-columns: 1fr; }
  .archive-head { align-items: stretch; flex-direction: column; }
  .quick-form { grid-template-columns: 1fr; }
  .invoice-form { grid-template-columns: 1fr; }
  .settings-grid { grid-template-columns: 1fr; }
  .cost-dashboard-grid { grid-template-columns: 1fr; }
  .cost-dashboard-grid .wide { grid-column: auto; }
  .modal-actions { flex-direction: column; }
  .header-actions, .archive-actions, .toolbar, .filters, .backup-toolbar, .settings-subnav { align-items: stretch; }
  button, select, input { width: 100%; }
  .delete-archive-list { grid-template-columns: 1fr; }
  #archiveTable { max-height: calc(100vh - 440px); }
  #reportTable { max-height: calc(100vh - 260px); }
  #planningTable { max-height: calc(100vh - 420px); }
  table { min-width: 920px; }
}

.subscription-subnav {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-bottom: 8px;
}
.main-planning-view .subscription-subnav { display: none; }
.subscription-subnav button.active { background: var(--accent); color: #fff; }
.subscription-panel { display: none; }
.subscription-panel.active { display: block; }
.subscription-dashboard-toolbar { display: flex; justify-content: flex-end; margin: 0 0 8px; }
.subscription-expiry-button { display: inline-flex; align-items: center; gap: 9px; min-height: 38px; font-weight: 800; }
.subscription-expiry-button.has-expiring { border-color: #d39b00; background: #fff8d7; color: #704f00; }
.subscription-expiry-count { display: inline-grid; place-items: center; min-width: 27px; height: 27px; padding: 0 7px; border-radius: 999px; background: var(--accent); color: #fff; font-size: .9rem; }
.subscription-expiry-button.has-expiring .subscription-expiry-count { background: #d39b00; color: #fff; }
.subscription-expiry-panel { width: min(1050px, 100%); }
.subscription-expiry-table { max-height: min(620px, calc(100vh - 150px)); }
.subscription-expiry-table table { min-width: 760px; }
.subscription-expiry-table thead th { position: sticky; top: 0; z-index: 2; background: #eaf0f4; }
.subscription-expiry-status { display: inline-block; padding: 3px 8px; border-radius: 999px; font-weight: 800; white-space: nowrap; }
.subscription-expiry-status.expiring { background: #fff1b8; color: #795600; }
.subscription-expiry-status.expired { background: #ffd8d8; color: #a1141c; }
.subscription-box {
  background: var(--panel);
  border-radius: 14px;
  padding: 18px;
  margin-top: 18px;
  box-shadow: 0 1px 4px rgba(0,0,0,.08);
}
.month-client-summary-head { display: flex; align-items: flex-end; justify-content: space-between; gap: 16px; margin-bottom: 12px; }
.month-client-summary-head h2 { margin: 0 0 4px; }
.month-client-summary-head p { margin: 0; }
.month-client-summary-head label { display: grid; gap: 5px; min-width: 180px; }
.month-client-summary-table { position: relative; max-height: 68vh; overflow: auto; }
.month-client-summary-table table { min-width: 1320px; }
.month-client-summary-table thead { position: sticky; top: 0; z-index: 10; }
.month-client-summary-table thead th { position: sticky; top: 0; z-index: 10; background: #eaf0f4; box-shadow: 0 2px 0 var(--line); }
.month-client-heading th { padding: 8px 10px; background: var(--accent); color: #fff; text-align: left; }
.month-client-total th,
.month-client-total td { background: #eaf0f4; font-weight: 800; border-bottom: 2px solid var(--accent); }
.month-client-summary-table tfoot th,
.month-client-summary-table tfoot td { position: sticky; bottom: 0; z-index: 2; background: var(--dash-green); font-weight: 900; }
.month-client-empty { color: var(--muted); font-style: italic; text-align: center; }
@media (max-width: 700px) {
  .month-client-summary-head { align-items: stretch; flex-direction: column; }
  .month-client-summary-head label { min-width: 0; }
  .month-client-summary-box { padding: 12px; }
}
.subscription-form {
  margin-bottom: 18px;
  align-items: end;
}
.subscription-type-form { grid-template-columns: repeat(8, minmax(0, 1fr)); }
.subscription-type-form > label,
.subscription-type-form > button,
.subscription-type-form select,
.subscription-type-form input { min-width: 0; width: 100%; }
.patient-entry-form { grid-template-columns: repeat(6, minmax(0, 1fr)); }
.patient-entry-form > label,
.patient-entry-form > button,
.patient-entry-form select,
.patient-entry-form input { min-width: 0; width: 100%; }
.entry-popup {
  position: fixed;
  top: 50%;
  left: 50%;
  z-index: 110;
  width: min(1500px, calc(100vw - 32px));
  max-height: calc(100vh - 32px);
  overflow: auto;
  transform: translate(-50%, -50%);
  box-shadow: 0 0 0 100vmax rgba(15, 23, 42, .38), 0 18px 50px rgba(15, 23, 42, .24);
}
.entry-popup[hidden] { display: none; }
.entry-popup-title { grid-column: 1 / -1; margin: 0 0 2px; font-size: 1.25rem; }
.subscription-list-toolbar { display: flex; justify-content: flex-start; margin: 0 0 10px; }
#subscriptionCards { grid-template-columns: repeat(5, minmax(0, 1fr)); }
.table-sort-button {
  min-height: 0;
  padding: 0;
  border: 0;
  background: transparent;
  color: inherit;
  font: inherit;
  font-weight: 700;
}
.table-sort-button:hover { text-decoration: underline; }
.formula-status { font-weight: 700; }
.formula-status-active { background: #dff3dc; color: #245b28; }
.formula-status-inactive { background: #fee2e2; color: #991b1b; }
.patient-subscription-form {
  grid-template-columns: 1.2fr 1.2fr 1.25fr 1fr 1fr .72fr .72fr .85fr;
  column-gap: 12px;
  row-gap: 12px;
}
.patient-subscription-form > label,
.patient-subscription-form > button,
.patient-subscription-form select,
.patient-subscription-form input { min-width: 0; width: 100%; }
.patient-subscription-form #subscriptionFormulaHelp { display: none; }
.subscription-payment-check {
  min-height: 38px;
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 8px 10px;
  border: 1px solid #b9c2cc;
  border-radius: 6px;
  background: #f7fff4;
  color: var(--text);
}
.patient-subscription-form .subscription-payment-check input { width: auto; min-height: 0; margin: 0; }
.attendance-schedule-form {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}
.attendance-schedule-form label[hidden] { display: none; }
.attendance-schedule-form label, .attendance-schedule-form input, .attendance-schedule-form select { min-width: 0; width: 100%; }
.schedule-help, #scheduleSlots, #scheduleAddSlot { grid-column: 1 / -1; }
.schedule-help { margin: 0; }
.schedule-slot { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)) auto; gap: 10px; align-items: end; padding: 10px 0; border-bottom: 1px solid #d5dde5; }
@media (max-width: 600px) {
  .schedule-slot { grid-template-columns: 1fr; }
}
#subscriptionAttendancePanel .attendance-schedule-form {
  gap: 8px;
  padding: 8px 10px;
  margin-bottom: 6px;
}
.automatic-attendance-button { white-space: nowrap; padding-inline: 10px; }
.subscription-form .wide-field { grid-column: span 2; }
.attendance-edit-form {
  border: 2px solid var(--planning-green);
  border-radius: 12px;
  padding: 14px;
  background: #f7fff4;
}
.attendance-modal-panel { width: min(1050px, 100%); }
.attendance-modal-panel .attendance-edit-form { margin: 0; grid-template-columns: repeat(4, minmax(140px, 1fr)); }
.attendance-entry-summary { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; margin: 10px 0 14px; }
.attendance-entry-summary > div { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 10px 14px; border-radius: 8px; background: #eef3f7; color: var(--muted); }
.attendance-entry-summary > div:last-child { background: #dff3dc; color: #245b28; }
.attendance-entry-summary strong { font-size: 1.35rem; color: var(--text); }
.attendance-week-head { display: flex; align-items: end; flex-wrap: wrap; gap: 6px 12px; margin: 4px 0; }
.attendance-toolbar { margin: 0; flex: 1 1 720px; }
.attendance-week-title { margin: 0; font-size: 1.15rem; white-space: nowrap; }
.attendance-week-step { min-width: 42px; font-size: 1.2rem; font-weight: 700; padding-inline: 10px; }
#subscriptionAttendancePanel #attendanceSummary { margin-bottom: 4px; }
#attendancePlanning {
  height: calc(100vh - 235px);
  min-height: 300px;
  overflow: auto;
  overscroll-behavior: contain;
}
.attendance-week-grid {
  min-width: 1180px;
  table-layout: fixed;
  border-collapse: separate;
  border-spacing: 0;
}
.attendance-week-grid thead th {
  position: sticky;
  top: 0;
  z-index: 3;
  background: var(--head);
  text-align: center;
  min-width: 145px;
}
.attendance-week-grid thead th span { display: block; font-size: .78rem; font-weight: 500; margin-top: 3px; }
.attendance-week-grid thead th small { font-size: .78rem; font-weight: 500; margin-left: 6px; }
.attendance-week-grid .attendance-time {
  position: sticky;
  left: 0;
  z-index: 2;
  width: 70px;
  min-width: 70px;
  background: #eef2f5;
  text-align: center;
  font-variant-numeric: tabular-nums;
}
.attendance-week-grid thead .attendance-time { z-index: 4; background: var(--head); }
.attendance-slot {
  height: 42px;
  min-height: 42px;
  padding: 4px !important;
  vertical-align: top;
  position: relative;
  background: #fff;
}
.attendance-slot:hover { background: #f6fbf3; }
.attendance-slot.occupied-scheduled { background: #eef3f7; }
.attendance-slot.occupied-present { background: #dff3dc; }
.attendance-slot.occupied-absent { background: #fff0ed; }
.attendance-slot.occupied-cancelled { background: #eef1f3; }
.attendance-slot.occupied:hover { filter: brightness(.98); }
.attendance-add-slot {
  width: 100%;
  min-height: 30px;
  border: 1px dashed transparent;
  background: transparent;
  color: #8a98a6;
  padding: 2px;
}
.attendance-slot:hover .attendance-add-slot { border-color: #a9c69a; color: var(--accent); }
.attendance-slot.has-appointments .attendance-add-slot {
  position: absolute;
  right: 4px;
  bottom: 2px;
  z-index: 3;
  width: 22px;
  min-height: 20px;
  padding: 0;
  opacity: 0;
}
.attendance-slot.has-appointments:hover .attendance-add-slot,
.attendance-slot.has-appointments:focus-within .attendance-add-slot { opacity: 1; }
.attendance-appointments {
  position: relative;
  z-index: 2;
  display: grid;
  grid-template-columns: 1fr;
  gap: 4px;
}
.attendance-appointments.many { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.attendance-slot-block {
  height: auto;
  border-radius: 7px;
  box-shadow: inset 0 0 0 3px #2f6f3e;
}
.attendance-slot-block.occupied-scheduled { box-shadow: inset 0 0 0 3px #64748b; }
.attendance-slot-block.occupied-present { box-shadow: inset 0 0 0 3px #2f7d32; }
.attendance-slot-block.occupied-absent { box-shadow: inset 0 0 0 3px #c24131; }
.attendance-slot-block.occupied-cancelled { box-shadow: inset 0 0 0 3px #6b7280; }
.attendance-card {
  display: grid;
  grid-template-columns: 1fr;
  grid-template-areas: "patient";
  align-content: start;
  gap: 3px;
  border-left: 4px solid var(--planning-green);
  border-radius: 7px;
  background: #fff;
  margin-bottom: 4px;
  overflow: hidden;
  min-height: 34px;
  box-shadow: 0 1px 3px rgba(17, 24, 39, .16);
}
.attendance-card.scheduled { border-left-color: #aeb9c3; background: #fff; }
.attendance-card.present { border-left-color: #43a047; background: #dff3dc; }
.attendance-card.absent { border-left-color: #d66a5e; background: #fff0ed; }
.attendance-card.extra { border-left-color: #e0a000; }
.attendance-card.cancelled { border-left-color: #8a98a6; background: #eef1f3; opacity: .65; text-decoration: line-through; }
.attendance-card-main {
  grid-area: patient;
  border: 0;
  background: transparent;
  text-align: left;
  padding: 4px 6px;
  display: flex;
  align-items: flex-start;
  min-width: 0;
  font-size: .82rem;
}
.attendance-card-main strong { width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.state-confirmation-badge { display: inline-grid; place-items: center; flex: 0 0 auto; min-width: 19px; height: 19px; padding: 0 5px; border-radius: 999px; color: #fff; font-size: 11px; font-weight: 900; line-height: 1; vertical-align: middle; text-decoration: none; }
.state-confirmation-badge.automatic { background: #2563eb; }
.state-confirmation-badge.manual { background: #238636; }
.state-confirmation-legend { display: flex; align-items: center; justify-content: flex-end; flex-wrap: wrap; gap: 6px; margin: -2px 0 5px; color: var(--muted); font-size: .78rem; }
.unified-activity-list { display: grid; gap: 4px; margin-bottom: 4px; }
.unified-activity-card { border: 2px solid #1f4e5f; border-radius: 7px; overflow: hidden; background: #e8f1ff; }
.unified-activity-card.status-done { background: #d9f2d0; border-color: #2f7d32; }
.unified-activity-card.status-invoiced { background: #dbeafe; border-color: #2563a5; }
.unified-activity-card.status-cancelled { background: #ffd6d6; border-color: #b42318; }
.unified-activity-card.cross-client-overlap,
.attendance-card.cross-client-overlap { background: #ffd6d6 !important; border: 3px solid #dc3545 !important; box-shadow: 0 0 0 2px rgba(220, 53, 69, .18); }
.unified-activity-card > button { width: 100%; border: 0; background: transparent; color: var(--text); text-align: left; padding: 5px 7px; display: grid; gap: 2px; }
.unified-activity-card > button strong { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.unified-activity-card > button span,.unified-activity-card > button small { color: var(--muted); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.unified-activity-card > .attendance-appointments { padding: 0 5px 5px; }
.unified-time-range { font-size: .72rem; font-weight: 700; color: var(--muted); margin: 0 2px 4px; }
.unified-attendance-group { border: 2px solid #2f7d32; border-radius: 7px; padding: 4px; margin-bottom: 4px; background: #dff3dc; }
.unified-client-groups { display: grid; grid-template-columns: repeat(auto-fit, minmax(145px, 1fr)); gap: 5px; align-items: stretch; }
.unified-client-groups .unified-attendance-group { margin-bottom: 0; min-width: 0; }
.unified-attendance-group.hourly-warning { border-color: #c98200; background: #fff4bf; }
.unified-attendance-group header { display: flex; justify-content: space-between; gap: 5px; align-items: center; padding: 1px 3px 4px; }
.unified-attendance-group header > span { display: flex; align-items: center; justify-content: flex-end; gap: 5px; }
.unified-attendance-group header small { color: var(--muted); text-align: right; }
.unified-create-activity { min-width: 28px; padding: 3px 6px; border: 1px solid #c18b00; background: #ffd824; color: #111827; border-radius: 5px; font-weight: 700; }
.unified-slot-actions { display: inline-flex; align-items: center; justify-content: center; gap: 4px; }
.unified-add-hourly { min-width: 25px; min-height: 25px; padding: 1px 5px; border: 1px solid #247a3a; border-radius: 5px; background: #2f9e4f; color: #fff; font-weight: 800; line-height: 1; }
.unified-planning-modal-panel { width: min(1450px, calc(100vw - 24px)); max-height: calc(100vh - 24px); overflow: auto; }
.unified-planning-form { margin: 0; }
@media (max-width: 760px) {
  .unified-planning-modal-panel { width: calc(100vw - 12px); max-height: calc(100vh - 12px); padding: 10px; }
  .unified-planning-form { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 480px) {
  .unified-planning-form { grid-template-columns: 1fr; }
}
.compensation-toolbar { display: flex; align-items: end; gap: 10px; flex-wrap: wrap; margin: 8px 0; }
.compensation-toolbar label { min-width: 210px; }
.compensation-table select { min-width: 210px; }
.compensation-status-da-fatturare td { background: #fff4bf; }
.compensation-status-dati-mancanti td { background: #ffe5bf; }
.compensation-status-fatturato td { background: #dbeafe; }
.compensation-status-pagato td { background: #d9f2d0; }
.compensation-status-non-rilevante td { background: #eef1f3; color: var(--muted); }
.attendance-card-actions { grid-area: actions; display: flex; flex-direction: row; gap: 2px; padding: 3px; }
.attendance-card-actions button { padding: 1px 4px; min-width: 24px; font-size: .68rem; }
.attendance-day-row { border-left: 5px solid var(--planning-green); }
.attendance-extra-row { background: #fff4bf; }
.attendance-personalized { font-weight: 700; color: var(--accent); }
.subscription-actions { display: flex; flex-wrap: wrap; gap: 5px; }
.subscription-actions button { padding: 6px 9px; font-size: .82rem; }
.patient-records { display: grid; gap: 14px; }
.patient-list-toolbar { display: flex; justify-content: flex-start; align-items: end; gap: 10px; margin: 0 0 12px; }
.patient-list-toolbar label { width: min(380px, 100%); }
.patient-list { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 10px; }
.client-summary-list { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; }
.client-summary-card { position: relative; width: 100%; display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)) auto; gap: 8px; align-items: center; padding: 14px 16px; text-align: left; background: #fff; }
.client-summary-card > strong, .client-summary-card > span:not(.patient-list-arrow) { grid-column: 1 / -1; }
.client-summary-card > span:not(.patient-list-arrow), .client-summary-card small { color: var(--muted); }
.client-summary-card > div { display: grid; gap: 2px; }
.client-summary-card:hover { border-color: var(--planning-green); background: #f5fbf2; }
.client-month-record header label { display: grid; gap: 4px; min-width: 180px; }
.client-month-cards { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 9px; }
.client-month-cards .card { min-height: 82px; }
.client-year-comparison-note { margin: 0 0 9px; color: var(--muted); font-size: .85rem; }
.client-month-table { margin-top: 12px; }
.client-month-table table { min-width: 1180px; }
.client-month-table th { white-space: nowrap; }
.client-month-table .comparison-separator { border-left: 3px solid var(--accent); }
.client-month-table tfoot th, .client-month-table tfoot td { font-weight: 800; background: #eaf0f4; }
.client-month-cards small { color: var(--muted); margin-top: 4px; }
.patient-list-item { width: 100%; display: grid; grid-template-columns: 1fr auto; align-items: center; gap: 7px 10px; padding: 13px 16px; text-align: left; background: #fff; }
.patient-list-item > span:not(.patient-list-arrow):not(.patient-list-status) { grid-column: 1 / -1; }
.patient-list-item > .patient-client-grid { grid-column: 1 / -1; }
.patient-list-item:hover { border-color: var(--planning-green); background: #f5fbf2; }
.patient-list-item span { color: var(--muted); }
.patient-client-grid { display: grid; grid-template-columns: 1fr; gap: 4px 10px; min-width: 0; }
.patient-client-grid.two-columns { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.patient-client-grid span { min-width: 0; overflow-wrap: anywhere; color: var(--muted); font-size: .78rem; }
.patient-client-more { grid-column: 1 / -1; color: var(--accent) !important; font-weight: 700; }
.patient-relationship { color: var(--muted); font-size: .78rem; }
.patient-list-arrow { color: var(--accent) !important; font-size: 1.5rem; }
.patient-list-status { display: inline-flex; align-items: center; justify-content: flex-end; gap: 9px; }
.patient-subscription-face { display: inline-grid; place-items: center; width: 25px; height: 25px; border: 2px solid currentColor; border-radius: 50%; font-size: 19px; font-weight: 900; line-height: 1; background: #fff; }
.patient-subscription-face.active { color: #238636 !important; }
.patient-subscription-face.expiring { color: #d39b00 !important; }
.patient-subscription-face.expired { color: #d1242f !important; }
.patient-subscription-face.none { color: #87939c !important; }
.patient-back-button { margin-bottom: 10px; }
.patient-record { border: 1px solid var(--line); border-radius: 12px; padding: 14px; background: #fff; }
.patient-record.patient-record-focus { outline: 3px solid var(--planning-green); box-shadow: 0 0 0 5px rgba(91, 181, 62, .18); }
.patient-record > header { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 12px; }
.patient-record > header > div { display: grid; gap: 3px; }
.patient-record-link, .table-link { border: 0; background: transparent; padding: 0; min-height: 0; color: var(--accent); font-weight: 700; text-align: left; }
.patient-record-link { font-size: 1.08rem; }
.patient-record-title { font-size: 1.08rem; color: var(--accent); }
.patient-record-link:hover, .table-link:hover { background: transparent; text-decoration: underline; }
.patient-record header span, .patient-subscription-card span { color: var(--muted); font-size: .78rem; }
.patient-subscription-card { width: 100%; display: grid; grid-template-columns: 1.1fr 1.25fr .55fr .55fr .68fr .68fr .68fr .52fr 1.35fr; gap: 10px; align-items: center; padding: 11px; border: 1px solid transparent; border-radius: 9px; background: #f5f8fa; margin-top: 8px; text-align: left; color: var(--text); }
.patient-subscription-card:hover { background: #eef7ea; border-color: var(--planning-green); }
.patient-subscription-card > div { display: grid; gap: 3px; min-width: 0; }
.patient-subscription-card strong { overflow-wrap: anywhere; }
.patient-progress { grid-template-columns: 1fr auto !important; }
.patient-progress span { grid-column: 1 / -1; }
.patient-progress progress { width: 100%; height: 13px; accent-color: var(--planning-green); }
.patient-progress strong { font-size: .82rem; }
.subscription-billing-icons { display: flex !important; grid-template-columns: repeat(2, 30px); justify-content: center; gap: 6px !important; }
.subscription-billing-icon { display: inline-grid; place-items: center; width: 30px; height: 30px; border: 1px solid; border-radius: 7px; font-size: 16px !important; font-weight: 800; line-height: 1; color: #172033 !important; }
.subscription-billing-icon.pending { background: #ffd824; border-color: #c99500; }
.subscription-billing-icon.done { background: #35a853; border-color: #187934; color: #fff !important; }
#subscriptionEntriesModal .subscription-entries-panel {
  width: min(1050px, 100%);
  max-height: min(720px, calc(100vh - 36px));
  max-height: min(720px, calc(100dvh - 36px));
  grid-template-rows: auto minmax(0, 1fr);
  overflow: hidden;
}
#subscriptionEntriesModal .modal-head { align-items: flex-start; flex-wrap: wrap; }
#subscriptionEntriesModal .modal-head > div:first-child { flex: 1 1 220px; min-width: 0; overflow-wrap: anywhere; }
#subscriptionEntriesTable { min-height: 0; overflow: auto; overscroll-behavior: contain; -webkit-overflow-scrolling: touch; }
#subscriptionEntriesTable table { min-width: 760px; }
#subscriptionEntriesTable thead th { position: sticky; top: 0; z-index: 1; background: #edf2f6; }
.subscription-entries-head-actions { display: flex; align-items: center; gap: 8px; }
.compact-actions { gap: 4px; flex-wrap: nowrap; }
.compact-actions button { min-width: 28px; min-height: 28px; padding: 1px 6px; font-size: .82rem; line-height: 1; }
.compact-actions [data-edit-formula],
.compact-actions [data-edit-subscription],
.compact-actions [data-edit-attendance],
.compact-actions [data-renew-same],
.compact-actions [data-renew-different],
[data-edit-patient],
.row-edit-btn {
  background: #fff3b0;
  border-color: #d6a900;
  color: #7a5700;
  font-weight: 700;
}
.compact-actions [data-delete-formula],
.compact-actions [data-delete-attendance],
.row-delete-btn,
.planning-row-delete-btn {
  background: #fee2e2;
  border-color: #dc3545;
  color: #b42318;
  font-weight: 700;
}
.attendance-add-slot { color: #168454; font-weight: 800; }
.attendance-add-slot:hover,
.attendance-add-slot:focus-visible { background: #dcfce7; border-color: #22a06b; color: #087443; }
#subscriptionEntriesInsert,
#newPatientBtn,
#newFormulaBtn,
#newSubscriptionBtn,
#newAttendanceBtn,
#automaticAttendanceBtn {
  background: #168454;
  border-color: #168454;
  color: #fff;
}
.subscription-entry-row.occupied-scheduled { background: #eef3f7; }
.subscription-entry-row.occupied-present { background: #dff3dc; }
.subscription-entry-row.occupied-absent { background: #fff0ed; }
.subscription-entry-row.occupied-cancelled { background: #eef1f3; color: #66717d; }

@media (max-width: 760px) {
  .subscription-subnav {
    display: grid;
    grid-template-columns: 1fr 1fr;
  }
  .subscription-subnav button { width: 100%; }
  .subscription-form .wide-field { grid-column: span 1; }
  .patient-subscription-form, .subscription-type-form, .patient-entry-form, .attendance-modal-panel .attendance-edit-form { grid-template-columns: 1fr; }
  #subscriptionCards { grid-template-columns: 1fr; }
  .attendance-entry-summary { grid-template-columns: 1fr; }
  .patient-record > header { align-items: stretch; flex-direction: column; }
  .patient-list-item { grid-template-columns: 1fr auto; }
  .client-summary-list { grid-template-columns: 1fr; }
  .client-summary-card { grid-template-columns: 1fr 1fr; }
  .client-summary-card .patient-list-arrow { position: absolute; right: 12px; top: 12px; }
  .client-month-cards { grid-template-columns: 1fr 1fr; }
  .client-month-record > header { align-items: stretch; }
  .patient-list-item span:not(.patient-list-arrow):not(.patient-list-status):not(.patient-subscription-face) { grid-column: 1 / -1; }
  .patient-client-grid.two-columns { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .patient-list-toolbar { align-items: stretch; flex-direction: column; }
  .patient-list-toolbar label, .patient-list-toolbar button { width: 100%; }
  .attendance-appointments,
  .attendance-appointments.many { grid-template-columns: 1fr; }
  .patient-subscription-card { grid-template-columns: 1fr 1fr; }
  .subscription-billing-icons { justify-content: start; }
  .patient-progress { grid-column: 1 / -1; }
  .attendance-schedule-form { grid-template-columns: 1fr; }
  .attendance-toolbar { align-items: stretch; }
  .attendance-week-head { display: block; }
  .attendance-week-title { margin-bottom: 8px; white-space: normal; }
  .attendance-toolbar label, .attendance-toolbar select, .attendance-toolbar input { width: 100%; }
  #subscriptionsView .table-wrap { overflow-x: auto; }
  #attendancePlanning { height: calc(100vh - 300px); min-height: 360px; overflow: auto; }
  .attendance-week-grid { min-width: 1040px; }
  .attendance-week-grid thead th { min-width: 125px; }
  .attendance-week-title { font-size: 1rem; }
}

@media (min-width: 761px) and (max-width: 1200px) {
  .patient-list { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .subscription-type-form { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  .patient-entry-form { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  #subscriptionCards { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}

.invoice-form-panel { container-type: inline-size; }
.invoice-form-panel .archive-invoice-form { grid-template-columns: repeat(12, minmax(0, 1fr)) !important; }
.invoice-form-panel .invoice-form label:has(#quickDataCompetenza),
.invoice-form-panel .invoice-form label:has(#quickDataFattura) { grid-column: span 2 !important; }
.invoice-form-panel .invoice-form label:has(#quickNumero) { grid-column: span 2 !important; }
.invoice-form-panel .invoice-form label:has(#quickCliente) { grid-column: span 4 !important; }
.invoice-form-panel .invoice-form label:has(#quickTipologia) { grid-column: span 2 !important; }
.invoice-form-panel .invoice-form label:has(#quickActivity) { grid-column: 1 / -1 !important; }
@media screen and (max-width: 760px) {
  #invoiceFormModal #invoiceQuickForm > * { grid-column: 1 / -1 !important; }
}
.invoice-form-panel .invoice-form label:has(#quickImponibile),
.invoice-form-panel .invoice-form label:has(#quickRivalsa),
.invoice-form-panel .invoice-form label:has(#quickBollo),
.invoice-form-panel .invoice-form label:has(#quickTotale),
.invoice-form-panel .invoice-form label:has(#quickInps),
.invoice-form-panel .invoice-form label:has(#quickIrpef) { grid-column: span 2 !important; }
.invoice-form-panel .invoice-paid-field { grid-column: span 2 !important; }
.invoice-form-panel .invoice-collection-date-field { grid-column: span 2 !important; }
.invoice-form-panel .invoice-description-field { grid-column: span 4 !important; }
.invoice-form-panel .invoice-planning-field { grid-column: span 8 !important; }
.invoice-form-panel #invoiceSubmitBtn,
.invoice-form-panel #cancelInvoiceEditBtn { grid-column: span 2 !important; }

.invoice-form-panel input,
.invoice-form-panel select,
.invoice-form-panel .select-field,
.invoice-form-panel .select-field input {
  min-width: 0;
  width: 100%;
}

@container (max-width: 800px) {
  .invoice-form-panel .archive-invoice-form { grid-template-columns: repeat(6, minmax(0, 1fr)) !important; }
  .invoice-form-panel .invoice-form > * { grid-row: auto !important; }
  .invoice-form-panel .invoice-form label:has(#quickDataCompetenza),
  .invoice-form-panel .invoice-form label:has(#quickDataFattura),
  .invoice-form-panel .invoice-form label:has(#quickNumero) { grid-column: span 2 !important; }
  .invoice-form-panel .invoice-form label:has(#quickCliente),
  .invoice-form-panel .invoice-form label:has(#quickTipologia),
  .invoice-form-panel .invoice-description-field,
  .invoice-form-panel .invoice-planning-field { grid-column: span 6 !important; }
  .invoice-form-panel .invoice-form label:has(#quickImponibile),
  .invoice-form-panel .invoice-form label:has(#quickRivalsa),
  .invoice-form-panel .invoice-form label:has(#quickBollo),
  .invoice-form-panel .invoice-form label:has(#quickTotale),
  .invoice-form-panel .invoice-form label:has(#quickInps),
  .invoice-form-panel .invoice-form label:has(#quickIrpef),
  .invoice-form-panel .invoice-paid-field,
  .invoice-form-panel .invoice-collection-date-field,
  .invoice-form-panel #invoiceSubmitBtn,
  .invoice-form-panel #cancelInvoiceEditBtn { grid-column: span 3 !important; }
}

@container (max-width: 320px) {
  .invoice-form-panel .archive-invoice-form { grid-template-columns: 1fr !important; }
  .invoice-form-panel .invoice-form > * { grid-column: 1 !important; }
}

#subscriptionCards {
  display: block;
  overflow-x: auto;
  overscroll-behavior-inline: contain;
  padding-bottom: 3px;
}

#subscriptionCards .economic-summary-grid { display: grid; grid-template-columns: 145px repeat(8, minmax(150px, 1fr)); gap: 5px; min-width: 1390px; align-items: stretch; }
.economic-summary-header { display: grid; place-items: center; min-height: 27px; padding: 3px 6px; border-radius: 7px; background: #e2ebf1; color: var(--text); font-size: 11px; font-weight: 800; line-height: 1.1; text-align: center; }
.economic-summary-corner { min-height: 27px; }
.economic-summary-row-label { display: flex; align-items: center; min-height: 44px; padding: 4px 9px; border-radius: 7px; background: var(--accent); color: #fff; font-weight: 800; line-height: 1.15; }
.economic-summary-cell { min-width: 0; }
.economic-summary-cell.card { min-height: 44px; padding: 5px 9px; }
.economic-summary-cell .value { display: flex; align-items: center; justify-content: flex-end; height: 100%; margin: 0; font-size: 1rem; }
.economic-summary-row-label.total { background: #356b3f; }
.economic-summary-cell.total { background: #e3f2df; border-color: #76b947; font-weight: 900; }

@media print {
  @page {
    size: A4 landscape;
    margin: 10mm;
  }

  * {
    -webkit-print-color-adjust: exact;
    print-color-adjust: exact;
  }

  body {
    background: #fff;
    color: #000;
    font-size: 10px;
  }

  .app-shell-header, .toolbar, .archive-head, .filters, .stats, .toast, .quick-form, .edit-hint { display: none !important; }
  main { padding: 0; }
  .view { display: none !important; }
  .view.active { display: block !important; }
  .cards {
    display: grid;
    grid-template-columns: repeat(6, 1fr);
    gap: 4px;
    margin-bottom: 8px;
  }
  .card {
    border: 1px solid #777;
    box-shadow: none;
    padding: 6px;
    min-height: auto;
  }
  .card .label { font-size: 8px; color: #333; }
  .card .value { font-size: 13px; color: #000; }
  .dashboard-sheet, .table-wrap {
    border: 0;
    overflow: visible;
    max-height: none !important;
    margin-bottom: 8px;
  }
  .select-col { display: none; }
  input.editable {
    border: 0;
    padding: 0;
    color: #000;
    background: transparent;
    min-width: 0;
    width: 100%;
  }
  table {
    min-width: 0;
    width: 100%;
    font-size: 9px;
    page-break-inside: auto;
  }
  .planning-matrix {
    min-width: 0;
    table-layout: fixed;
    font-size: 5.5px;
  }
  .planning-matrix th,
  .planning-matrix td {
    padding: 1px;
    white-space: normal;
  }
  .planning-matrix .left-head,
  .planning-matrix .client-cell {
    width: 42px;
  }
  .planning-matrix .hours-head,
  .planning-matrix .company-head,
  .planning-matrix .week-head {
    width: auto;
  }
  .planning-matrix .week-filled span {
    font-size: 4.8px;
  }
  th, td {
    padding: 3px 4px;
    border: 1px solid #777;
  }
  th {
    position: static;
    background: #d9e2ea !important;
    color: #000;
    box-shadow: none;
  }
  tr {
    page-break-inside: avoid;
    page-break-after: auto;
  }
}

/* v324: pazienti raggruppati per cliente, anche su tablet e smartphone. */
.patient-client-columns { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 280px), 1fr)); gap: 16px; align-items: start; }
.patient-client-column { min-width: 0; }
.patient-client-column h3 { margin: 0 0 12px; overflow-wrap: anywhere; }
.patient-client-stack { display: grid; gap: 10px; }
.patient-client-stack .patient-list-item { width: 100%; min-width: 0; }
.patient-record-actions { display: flex; flex-wrap: wrap; gap: 8px; }
.patient-record-actions button:disabled { opacity: .5; cursor: not-allowed; }

/* v325 */
.patient-client-stack { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.patient-client-columns { grid-template-columns: repeat(auto-fit, minmax(min(100%, 480px), 1fr)); }
.unified-slot-actions .attendance-add-slot, .unified-slot-actions .unified-add-hourly { background: #299e49; color: white; border: 1px solid #21813d; border-radius: 4px; min-width: 28px; min-height: 28px; opacity: 1; }
@media (max-width: 600px) { .patient-client-stack { grid-template-columns: 1fr; } }

/* v326: azioni presenza e attivita sempre visibili e con colori coerenti. */
#newAttendanceBtn,
.attendance-slot .unified-slot-actions .attendance-add-slot,
.attendance-slot.has-appointments .unified-slot-actions .attendance-add-slot {
  background: #b9e3fa;
  border: 1px solid #569ac2;
  color: #123e58;
}
#newUnifiedPlanningBtn,
.attendance-slot .unified-slot-actions .unified-add-hourly {
  background: #299e49;
  border: 1px solid #21813d;
  color: #fff;
}
.attendance-slot .unified-slot-actions { display: flex; justify-content: flex-start; gap: 6px; margin-top: 4px; }
.attendance-slot .unified-slot-actions .attendance-add-slot,
.attendance-slot.has-appointments .unified-slot-actions .attendance-add-slot,
.attendance-slot .unified-slot-actions .unified-add-hourly {
  position: static;
  width: 32px;
  min-width: 32px;
  min-height: 32px;
  padding: 2px;
  opacity: 1;
  flex: 0 0 32px;
  font-weight: 800;
  border-radius: 5px;
}
#newAttendanceBtn:hover, #newUnifiedPlanningBtn:hover,
.attendance-slot .unified-slot-actions button:hover { filter: brightness(.94); }
@media (pointer: coarse) {
  .attendance-slot .unified-slot-actions .attendance-add-slot,
  .attendance-slot.has-appointments .unified-slot-actions .attendance-add-slot,
  .attendance-slot .unified-slot-actions .unified-add-hourly { min-height: 44px; min-width: 44px; flex-basis: 44px; }
}

#navigationTree { display:grid; grid-template-columns:repeat(auto-fit,minmax(min(100%,300px),1fr));gap:12px;margin:16px 0; }
#navigationTree details { border:1px solid var(--line,#bcc9d6);padding:12px;border-radius:8px; }
.navigation-choice { display:flex;gap:10px;align-items:center;margin:12px 0; }
.navigation-choice input { width:20px;height:20px; }
.navigation-children { padding-left:12px; }
.navigation-actions { display:flex;flex-wrap:wrap;gap:8px;margin:16px 0; }
[hidden] { display:none !important; }

/* v328: configurazione navigazione compatta. */
#navigationTree { grid-template-columns: repeat(auto-fill, minmax(min(100%, 230px), 1fr)); gap: 10px; align-items: start; }
#navigationTree details { padding: 10px; min-width: 0; }
#navigationTree .navigation-choice { margin: 8px 0; min-height: 28px; }
#navigationTree .navigation-children { padding-left: 4px; }
#navigationTree .navigation-children button { padding: 6px 8px; font-size: 12px; max-width: 100%; white-space: normal; }
#navigationStart { max-width: 420px; }

.attendance-week-grid .planning-closed { background:#ffd6d6 !important; border:2px solid #bd2020 !important; }
#closureForm,.client-record-fields { display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,220px),1fr));gap:12px;margin:16px 0; }
.client-record-fields dd { margin:4px 0 12px;overflow-wrap:anywhere; }

#patientStatusTotals { align-self:center;font-weight:600;white-space:normal; }
#clientRecordModal .modal-panel { width:min(1500px,96vw); max-width:96vw; }

.nav-root-drop { grid-column:1/-1; border:2px dashed #3984ab; padding:16px; background:#e7f3fb; }
.nav-move-node { border:1px solid #c4d2dd; border-radius:6px; padding:10px; min-width:0; }
.nav-move-heading { display:flex; flex-wrap:wrap; gap:8px; justify-content:space-between; margin-bottom:10px; }
.nav-move-heading [draggable=true] { cursor:grab; font-weight:600; }
.nav-move-heading label { display:flex; align-items:center; gap:5px; }
.nav-move-heading input { width:18px; }
.nav-move-children { display:grid; gap:8px; margin-top:8px; }
.nav-move-node select { width:100%; }
.custom-navigation .dashboard-subnav,.custom-navigation .report-subnav,.custom-navigation .subscription-subnav,.custom-navigation .settings-subnav,.custom-navigation #archiveSubnav { display:none !important; }
.custom-navigation #tabs { flex-direction:column; gap:0; overflow:visible; min-width:0; }
.nav-button-row { display:flex; gap:4px; overflow-x:auto; max-width:100%; }
.nav-submenu-row { display:flex; flex-wrap:wrap; gap:4px; padding:4px 0; border-top:1px solid var(--line); }
.nav-submenu-row .tab { padding:7px 10px; border-radius:4px; }
.nav-runtime-group { border:1px solid #bac8d3; background:var(--panel,#fff); padding:8px; border-radius:6px; }
.nav-runtime-group summary { cursor:pointer; padding:4px; }
.nav-runtime-group[open] { display:flex; flex-direction:column; }
.nav-runtime-group button,.nav-runtime-group details { margin:4px; }

/* v336 Sostituzioni */
.sost-panel{width:min(1200px,96vw);max-height:92vh;overflow:auto}.sost-fields{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:12px;margin:12px 0}.sost-fields label{display:flex;flex-direction:column;gap:5px}.sost-fields input,.sost-fields select{width:100%;min-width:0}.sost-panel form{margin:16px 0}.sost-week-cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:8px}.sost-card{background:#e3f1ff;color:#123b59;text-align:left;padding:12px}.sost-passive{background:#fff0df;color:#663c10}.sost-panel details{margin:16px 0}.sost-panel table{min-width:850px}@media(max-width:550px){.sost-fields{grid-template-columns:1fr}.sost-panel{padding:12px}}

/* v338: colore cliente condiviso dalle attività della griglia. */
.attendance-week-grid .client-colored{background:var(--client-bg)!important;border-color:var(--client-border)!important;border-left:4px solid var(--client-border)!important;color:#142c40}.attendance-week-grid .client-colored > button{background:transparent!important;color:inherit}.attendance-week-grid .sost-card{width:100%;white-space:normal;line-height:1.4;margin:4px 0}

/* v339: colori personalizzabili e testo leggibile anche su fondi scuri. */
.attendance-week-grid .client-colored{color:var(--client-text,#142c40)}
.attendance-week-grid .client-colored > button,.attendance-week-grid .client-colored > button small,.attendance-week-grid .client-colored > button span,.attendance-week-grid .client-colored > header{color:inherit}
.planning-colors-panel{width:min(800px,94vw);max-height:90vh;overflow:auto}
.planning-color-row{display:flex;align-items:center;gap:16px;padding:8px 0;flex-wrap:wrap}
.planning-color-row>span{flex:1;min-width:160px}.planning-color-row label{display:flex;align-items:center;gap:8px}
.planning-color-row input[type=color]{width:60px;height:38px;padding:3px}.planning-color-row input[type=checkbox]{width:20px;height:20px}
.planning-colors-panel fieldset{margin:12px 0}

/* v345: schede compatte e modulo sostituzioni su due righe desktop. */
.attendance-week-grid button.sost-attach-icon{display:inline-flex;align-items:center;justify-content:center;width:34px;min-width:34px;height:34px;padding:6px;margin:4px;flex:0 0 auto}
#sostForm .sost-fields>label{min-width:0;justify-content:flex-end}
#sostForm .sost-fields input[type=checkbox]{width:22px;height:22px;align-self:flex-start;margin:8px 0}
@media(min-width:1000px){#sostForm .sost-fields{grid-template-columns:repeat(7,minmax(0,1fr));gap:12px}#sostForm .sost-fields>label:last-child{grid-column:span 2}}
@media(min-width:551px) and (max-width:999px){#sostForm .sost-fields{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(pointer:coarse){.attendance-week-grid button.sost-attach-icon{width:44px;height:44px}}

/* v346: azioni presenza/collaboratore dentro la scheda attività. */
.attendance-week-grid .planning-card-actions{display:flex;align-items:center;gap:6px;padding:4px;flex-wrap:wrap}
.attendance-week-grid .planning-card-actions>button{display:inline-flex;align-items:center;justify-content:center;flex:0 0 auto;width:34px;min-width:34px;height:34px;padding:6px;margin:0}
@media(pointer:coarse){.attendance-week-grid .planning-card-actions>button{width:44px;height:44px}}

/* v347: annulla il vecchio posizionamento del + nelle celle occupate. */
.attendance-slot .planning-card-actions .attendance-add-slot,
.attendance-slot.has-appointments .planning-card-actions .attendance-add-slot{
 position:static;inset:auto;z-index:auto;opacity:1;background:#b9e3fa;color:#123e58;border:1px solid #569ac2;border-radius:5px;font-weight:800;
}

/* v348: solo intestazione del giorno corrente. */
.attendance-week-grid thead th.planning-today-header:not(.planning-closed){background:#bfe5b5!important;color:#173c20}

/* v349: schermate smartphone, senza modificare dati e calcoli. */
@media screen and (max-width: 760px) {
  .app-shell-header { position: static; }
  .app-header { padding: 10px; gap: 10px; }
  .app-header h1 { font-size: 20px; }
  #dbInfo { overflow-wrap: anywhere; font-size: 12px; }
  .test-env-strip { padding: 5px 10px; font-size: 12px; }
  .header-actions { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 6px; }
  .header-actions .subscription-expiry-button { font-size: 12px; padding: 8px; justify-content: space-between; }
  .tabs { padding: 4px 8px; gap: 6px; }
  .tabs > button { width: auto; flex: 0 0 auto; white-space: nowrap; }
  main { padding: 8px; }
  .view, .subscription-panel, .subscription-box, .patient-record { min-width: 0; }
  .subscription-box, .patient-record { padding: 10px; }
  button, select, input:not([type=checkbox]):not([type=radio]):not([type=color]), textarea { min-height: 44px; }
  select, input, textarea { font-size: 16px; min-width: 0; max-width: 100%; }
  input[type=checkbox], input[type=radio] { width: 22px; min-height: 22px; flex-shrink: 0; }
  label { min-width: 0; }
  .toolbar > label, .filters > label, .compensation-toolbar > label { flex: 1 1 140px; min-width: 0; }
  .patient-list { grid-template-columns: 1fr; }
  .patient-list-item { min-height: 76px; }
  .patient-list-item strong { overflow-wrap: anywhere; }
  .patient-list-toolbar { gap: 8px; }
  .client-summary-card { gap: 12px; padding: 12px; }
  .client-month-cards { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .table-wrap, .dashboard-sheet { max-width: 100%; overflow: auto; -webkit-overflow-scrolling: touch; }
  #archiveTable, #reportTable, #planningTable { max-height: 65vh; min-height: 220px; }
  #attendancePlanning { height: 65vh; height: 65dvh; min-height: 320px; max-width: 100%; }
  .attendance-week-grid { min-width: 1530px; }
  .attendance-week-grid thead th { min-width: 208px; }
  .attendance-week-grid .attendance-time { width: 64px; min-width: 64px; }
  .attendance-week-grid .planning-card-actions > button,
  .attendance-week-grid button.sost-attach-icon,
  .attendance-slot .unified-slot-actions .attendance-add-slot,
  .attendance-slot .unified-slot-actions .unified-add-hourly { width: 44px; min-width: 44px; height: 44px; min-height: 44px; flex-basis: 44px; }
  .compact-actions { flex-wrap: wrap; }
  .compact-actions button, .attendance-card-actions button { min-width: 44px; min-height: 44px; }
  .modal { padding: 6px; }
  .modal .modal-panel { width: 100%; max-width: 100%; max-height: calc(100vh - 12px); max-height: calc(100dvh - 12px); padding: 12px; overflow: auto; overscroll-behavior: contain; }
  .modal-head { align-items: center; gap: 10px; }
  .modal-head > button { width: auto; flex-shrink: 0; }
  .modal .sost-fields, #sostForm .sost-fields { grid-template-columns: 1fr; }
  .modal .sost-fields > label { grid-column: auto; }
  .planning-color-row > span { flex-basis: 100%; }
  .nav-runtime-group { min-width: 150px; flex-shrink: 0; }
}
@media screen and (max-width: 760px) {
  .attendance-toolbar { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 6px; }
  .attendance-toolbar > button, .attendance-toolbar > label { grid-column: span 3; min-width: 0; }
  .attendance-toolbar > #attendancePrevWeek, .attendance-toolbar > #attendanceNextWeek { grid-column: span 1; }
  .attendance-toolbar > #attendanceCurrentWeek { grid-column: span 4; }
  .attendance-toolbar > button { padding: 8px 5px; font-size: 13px; }
}

/* v350: importi leggibili e azioni compatte su smartphone. */
@media screen and (max-width: 760px) {
  #dashboardCards, #planningSummary, .client-month-cards {
    grid-template-columns: repeat(auto-fit, minmax(min(100%, 155px), 1fr));
    gap: 8px;
  }
  .card, .client-summary-card > div { min-width: 0; }
  .card .value, #dashboardCards .card .value, #planningSummary .card .value {
    font-size: 16px; line-height: 1.35; font-variant-numeric: tabular-nums;
    overflow-wrap: anywhere;
  }
  #dashboardCards .card .label { white-space: normal; overflow: visible; }
  .client-summary-card strong, .client-month-cards small, .invoice-detail-field strong { overflow-wrap: anywhere; }
  .invoice-card { grid-template-columns: minmax(0, 1fr); min-height: 0; padding: 12px; }
  .invoice-card-status, .invoice-card-total { justify-self: start; align-items: flex-start; max-width: 100%; overflow-wrap: anywhere; white-space: normal; }
  .invoice-form-panel .archive-invoice-form { grid-template-columns: minmax(0, 1fr) !important; }
  .invoice-form-panel .invoice-form > * { grid-column: 1 !important; grid-row: auto !important; }
  .header-actions > button, .toolbar > button, .archive-actions > button,
  .patient-record-actions > button, .subscription-actions > button,
  .navigation-actions > button, .modal-actions > button {
    width: auto; max-width: 100%; min-height: 36px; padding: 7px 10px;
    font-size: 13px; line-height: 1.25; white-space: normal;
  }
  .modal-actions { flex-direction: row; flex-wrap: wrap; gap: 8px; }
  .tabs > button, .subscription-subnav > button { min-height: 36px; padding: 7px 10px; font-size: 13px; }
  .compact-actions button { width: auto; padding: 5px 8px; }
  .header-actions .subscription-expiry-button { gap: 5px; }
  .subscription-expiry-count { flex-shrink: 0; }
  .attendance-toolbar > button { width: 100%; padding: 6px; min-height: 36px; font-size: 12px; }
  .attendance-week-grid .planning-card-actions > button,
  .attendance-week-grid button.sost-attach-icon,
  .attendance-slot .unified-slot-actions .attendance-add-slot,
  .attendance-slot .unified-slot-actions .unified-add-hourly {
    width: 36px; min-width: 36px; height: 36px; min-height: 36px; flex-basis: 36px; padding: 4px;
  }
  .attendance-week-grid .planning-card-actions, .attendance-slot .unified-slot-actions { gap: 8px; }
}
@media screen and (max-width: 360px) {
  .client-summary-card { grid-template-columns: minmax(0, 1fr); }
  .attendance-toolbar > label { grid-column: 1 / -1; }
}
@media screen and (max-width: 760px) {
  .dashboard-subnav, .report-subnav, .settings-subnav { display: flex; flex-wrap: wrap; gap: 6px; }
  .dashboard-subnav > button, .report-subnav > button, .settings-subnav > button {
    width: auto; flex: 0 1 auto; min-height: 36px; padding: 7px 10px; font-size: 13px;
  }
  .toolbar:not(.attendance-toolbar) > button { align-self: flex-end; }
}

/* v351: icone azioni planning, stessi comandi su desktop e smartphone. */
.attendance-toolbar > :is(#planningClosuresButton,#planningColorsOpen,#sostOpen,#newAttendanceBtn,#automaticAttendanceBtn,#newUnifiedPlanningBtn) {
 display:inline-flex; align-items:center; justify-content:center; width:40px; min-width:40px; height:40px; min-height:40px; padding:8px; flex:0 0 40px;
}
.attendance-toolbar > button svg { flex-shrink:0; pointer-events:none; }
@media screen and (max-width:760px) {
 .attendance-toolbar > :is(#planningClosuresButton,#planningColorsOpen,#sostOpen,#newAttendanceBtn,#automaticAttendanceBtn,#newUnifiedPlanningBtn) { grid-column:span 1; justify-self:start; }
}

/* v353: calendario mensile con soli clienti, senza importi o presenze. */
.month-grid { display:grid; grid-template-columns:repeat(7,minmax(0,1fr)); gap:4px; }
.month-heading { text-align:center; padding:8px; background:var(--head); font-weight:700; }
.month-day { min-width:0; min-height:110px; padding:5px; background:white; border:1px solid var(--line); border-radius:5px; }
.month-date { width:auto; min-height:32px; padding:4px 8px; font-weight:700; margin-bottom:4px; }
.month-client { display:block; background:var(--client-bg); color:var(--client-text,#142c40); border-left:3px solid var(--client-border); border-radius:4px; padding:5px; margin:3px 0; overflow-wrap:anywhere; font-size:13px; }
.outside-month { background:#edf0f3; }
.month-today { background:#bfe5b5; }
.month-closed { background:#ffd6d6; border-color:#bd2020; }
#attendancePlanning.monthly-planning { height:auto; max-height:75vh; }
@media(max-width:760px) { .month-grid { min-width:665px; } .month-day { min-height:95px; } }

/* v354: telefoni in orizzontale, inclusi schermi oltre il breakpoint mobile. */
@media screen and (orientation: landscape) and (max-height: 600px) and (max-width: 1100px) {
  .app-shell-header { position:static; }
  .app-header { flex-direction:row; align-items:center; padding:6px 10px; gap:10px; }
  .app-header > div { min-width:0; }
  .app-header h1 { font-size:17px; }
  #dbInfo { font-size:11px; overflow-wrap:anywhere; }
  
.test-env-badge { font-size:10px; padding:2px 6px; }
  .test-env-strip { font-size:11px; padding:3px 8px; }
  .header-actions { display:flex; flex-wrap:wrap; justify-content:flex-end; gap:5px; }
  .header-actions > button { width:auto; min-height:36px; padding:5px 8px; font-size:12px; }
  .header-actions .subscription-expiry-button { max-width:175px; font-size:11px; }
  main { padding:8px; }
  .tabs > button { width:auto; flex-shrink:0; min-height:36px; padding:6px 10px; }
  .attendance-week-head { display:block; }
  .attendance-toolbar { display:flex; flex-wrap:wrap; gap:6px; align-items:end; }
  .attendance-toolbar > label { flex:0 1 165px; min-width:0; }
  .attendance-toolbar > button { width:auto; }
  .attendance-toolbar select, .attendance-toolbar input { width:100%; min-width:0; }
  #dashboardCards, #planningSummary { grid-template-columns:repeat(auto-fit,minmax(155px,1fr)); }
  .patient-list { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .client-summary-list { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .client-summary-card { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .client-summary-card > div { min-width:0; overflow-wrap:anywhere; }
  .table-wrap, .dashboard-sheet { max-width:100%; overflow:auto; }
  #attendancePlanning { height:70vh; height:70dvh; min-height:180px; }
  #attendancePlanning.monthly-planning { height:auto; max-height:80vh; max-height:80dvh; }
  #archiveTable, #reportTable, #planningTable { max-height:70vh; max-height:70dvh; min-height:160px; }
  .modal { padding:6px; }
  .modal .modal-panel { width:100%; max-width:100%; max-height:calc(100vh - 12px); max-height:calc(100dvh - 12px); padding:10px; overflow:auto; overscroll-behavior:contain; }
  .modal-head { align-items:center; gap:8px; }
  .modal-head > button { width:auto; }
  .modal .unified-planning-form, .attendance-modal-panel .attendance-edit-form,
  .modal .sost-fields, #sostForm .sost-fields { grid-template-columns:repeat(2,minmax(0,1fr)); }
  #sostForm .sost-fields > label { grid-column:auto; }
  .modal label, .modal input, .modal select { min-width:0; max-width:100%; }
  .card .value { overflow-wrap:anywhere; }
}
@media screen and (max-width:1100px) {
  .modal { padding-left:max(6px,env(safe-area-inset-left)); padding-right:max(6px,env(safe-area-inset-right)); }
}

/* Filtri degli abbonamenti e planning giornaliero. */
#patientSubscriptionsTable thead input { display:block; width:100%; min-width:90px; margin-top:6px; font-weight:normal; }
#subscriptionFiltersClear { margin-bottom:8px; }
.unified-client-groups { grid-template-columns:repeat(2,minmax(0,1fr)); }
.unified-client-groups > .unified-attendance-group { grid-column:1 / -1; }
.subscription-patient-card { position:relative; min-width:0; }
.subscription-patient-card .attendance-card-main { padding-right:18px; }
.patient-collaborator-button { position:absolute; right:1px; bottom:1px; min-height:18px; padding:0 2px; border:0; background:transparent; font-size:12px; }
.daily-planning .attendance-week-grid { min-width:0; width:100%; table-layout:fixed; }
.daily-planning .attendance-week-grid .attendance-time { width:65px; }
.daily-planning .unified-client-groups { grid-template-columns:repeat(auto-fit,minmax(130px,1fr)); }

/* Planning: posizione e altezza indipendenti per appuntamento. */
.individual-time-grid tbody th, .individual-time-grid tbody td { padding:0!important; vertical-align:top; }
.individual-time-grid tbody .attendance-time { top:auto; }
.timed-axis, .timed-day { position:relative; }
.timed-axis span { position:absolute; left:0; right:0; padding:4px 1px; font-size:12px; }
.individual-time-grid .timed-day-cell { background:#fff; }
.timed-empty-slot { position:absolute; left:0; right:0; width:100%; border:0; border-top:1px solid #d4dce5; border-radius:0; background:transparent; padding:0; min-height:0; }
.timed-empty-slot:hover { background:#f2f7fa; }
.time-event { position:absolute; --lane-width:min(160px,calc((100% - 8px)/var(--lanes))); left:calc(4px + var(--lane)*var(--lane-width)); width:calc(var(--lane-width) - 3px); margin:0!important; box-sizing:border-box; min-height:0; overflow:hidden; }
.patient-time-card { display:block; border-radius:5px; }
.patient-time-card .attendance-card-main { position:absolute; inset:0; height:100%; width:100%; padding:3px; display:flex; justify-content:flex-start; align-items:flex-start; min-height:0; }
.patient-time-card .attendance-card-main strong { writing-mode:horizontal-tb; width:100%; max-height:100%; text-align:left; overflow:hidden; text-overflow:clip; white-space:normal; overflow-wrap:anywhere; font-size:13px; line-height:1.2; }
.timed-activity { border-radius:5px; }
.timed-activity > button { width:100%; height:100%; border:0; background:transparent; padding:4px; white-space:normal; overflow:hidden; font-size:12px; }
.timed-replacement .sost-card { height:100%; margin:0!important; overflow:auto; font-size:11px; }
.individual-time-grid thead { position:sticky; top:0; z-index:4; }
.individual-time-grid thead th { position:static; }
.individual-time-grid .timed-actions-row td, .individual-time-grid .timed-actions-row th { background:#f5f8fb; padding:4px!important; border-bottom:2px solid #b5c5d4; }
.individual-time-grid thead .attendance-time { position:sticky; left:0; }
.timed-actions { display:flex; flex-direction:column; align-items:center; gap:2px; }
.timed-actions > span { font-size:11px; font-weight:600; }
.timed-actions .unified-slot-actions { gap:4px; flex-wrap:nowrap; }
.timed-actions .unified-slot-actions button { position:static; opacity:1; width:32px; min-width:32px; height:32px; min-height:32px; flex:0 0 32px; box-sizing:border-box; padding:1px; display:inline-flex; align-items:center; justify-content:center; line-height:1; }
.timed-actions .sost-attach-icon { background:#e7edf3; border:1px solid #aabccc; border-radius:5px; color:#19445b; }
.timed-actions .attendance-add-slot { background:#a7ddf5; border-color:#3282a8; color:#075377; }
@media(pointer:coarse), (max-width:760px) { .timed-actions .unified-slot-actions button { width:36px; min-width:36px; height:44px; min-height:44px; flex-basis:36px; } }

/* 01.19: azioni soltanto sull'orario e icone coerenti. */
.timed-actions[popover] { position:fixed; inset:auto; margin:0; padding:10px; border:1px solid #aabccc; border-radius:8px; background:#fff; color:#19445b; box-shadow:0 4px 18px #15394e33; gap:8px; }
.timed-actions[popover]:not(:popover-open) { display:none; }
.attendance-toolbar > button:has(svg), .timed-actions .unified-slot-actions button {
  width:42px!important; min-width:42px!important; height:42px!important; min-height:42px!important; flex:0 0 42px;
  display:inline-flex; align-items:center; justify-content:center; padding:8px!important;
  border:1px solid #aabccc!important; border-radius:6px!important; background:#f4f8fb!important; color:#19445b!important;
}
.attendance-toolbar > button:has(svg):hover, .timed-actions .unified-slot-actions button:hover { background:#dcecf6!important; }
.attendance-toolbar > button svg, .timed-actions button svg { width:22px; height:22px; stroke-width:1.8; }

/* Stati delle presenze: indicatori distinti dal colore del cliente. */
.attendance-state-marker { display:inline-flex; width:18px; height:18px; flex:none; border:1px solid #bac4cf; border-radius:4px; background:#f5f7fa; vertical-align:middle; }
.attendance-state-marker svg { width:100%; height:100%; }
.attendance-state-marker.state-scheduled, .attendance-card .attendance-card-main .attendance-state-marker.state-scheduled { color:#d4a000; }
.attendance-state-marker.state-present, .attendance-card .attendance-card-main .attendance-state-marker.state-present { color:#1b8d45; }
.attendance-state-marker.state-pending, .attendance-card .attendance-card-main .attendance-state-marker.state-pending { color:#fff; background:#657384; }
.attendance-state-marker.state-absent, .attendance-card .attendance-card-main .attendance-state-marker.state-absent { color:#111; }
.attendance-state-marker.state-cancelled, .attendance-card .attendance-card-main .attendance-state-marker.state-cancelled { color:#7c8792; }
.patient-time-card { container-type:inline-size; }
.patient-time-card .attendance-card-main { display:grid; grid-template-columns:18px minmax(0,1fr); grid-template-rows:minmax(0,1fr) auto; align-content:stretch; align-items:start; gap:2px 3px; }
.patient-time-card .attendance-card-main strong { grid-column:1 / -1; grid-row:1; min-width:0; }
.patient-time-card .attendance-state-marker { grid-column:1; grid-row:2; }
.patient-time-card .attendance-remaining { grid-column:2; grid-row:2; align-self:center; }
.attendance-remaining-short { display:none; }
@container (max-width:100px) {
  .attendance-card-main { grid-template-columns:12px minmax(0,1fr)!important; gap:1px 2px!important; padding:2px!important; }
  .attendance-card-main strong { font-size:11px!important; line-height:1.1!important; }
  .attendance-card-main .attendance-state-marker { width:12px; height:12px; }
  .attendance-card-main .attendance-remaining { font-size:9px; }
  .attendance-remaining-label { display:none; }
  .attendance-remaining-short { display:inline; }
  .short-appointment .attendance-card-main { grid-template-columns:12px minmax(0,1fr) auto!important; }
}
.attendance-remaining { display:block; grid-column:1 / -1; color:#263645; font-size:11px; line-height:1.15; white-space:normal; text-align:left; font-weight:600; }
.attendance-state-legend { display:flex; flex-wrap:wrap; align-items:center; gap:8px 16px; margin:8px 0; font-size:12px; }
.attendance-state-legend > span { display:inline-flex; gap:5px; align-items:center; }

.patient-time-card.short-appointment .attendance-card-main { grid-template-columns:14px minmax(0,1fr) auto; grid-template-rows:minmax(0,1fr); gap:2px; padding:2px; align-items:center; }
.patient-time-card.short-appointment .attendance-card-main strong { grid-column:2; grid-row:1; }
.patient-time-card.short-appointment .attendance-state-marker { grid-column:1; grid-row:1; width:14px; height:14px; }
.patient-time-card.short-appointment .attendance-remaining { grid-column:3; grid-row:1; font-size:10px; }

/* Presenza delegata: indicatore derivato dalla sostituzione passiva collegata. */
.attendance-passive-marker { display:inline-flex; justify-content:center; align-items:center; min-width:13px; height:13px; padding:0 2px; border-radius:3px; background:#255c91; color:#fff; font-size:10px; line-height:1; font-weight:800; vertical-align:middle; }
.month-substitution { display:block; width:100%; min-height:0; text-align:left; padding:3px 5px; font-size:inherit; white-space:normal; }
#attendancePassiveSubstitution { border-color:#255c91; color:#255c91; }
#attendancePassiveSubstitution:disabled { opacity:.55; }
/* Le funzioni escluse non occupano spazio, anche nelle pagine miste. */
.package-excluded { display: none !important; }
#packageView { padding: 16px; overflow-wrap: anywhere; }
#packageView li { margin: 8px 0; }

/* Accesso stabile al pacchetto, fuori dalle preferenze di navigazione. */
#tabs .package-help { margin-left:auto; margin-block:4px; margin-inline-start:auto; border:1px solid var(--line); border-radius:50%; width:36px; height:36px; min-height:36px; padding:0; flex:0 0 36px; align-self:center; }
#tabs .package-help::before { content:none; }
#tabs .package-help:not(:first-child) { margin-left:16px; margin-inline-start:auto; }

.service-bar { padding:10px 16px; font-weight:600; overflow-wrap:anywhere; border-bottom:1px solid var(--line); }
.service-bar.gialla { background:#fff2b8; color:#674c00; }
.service-bar.rossa { background:#ffe0e0; color:#8d1420; }
.service-info dl { display:grid; grid-template-columns:max-content minmax(0,1fr); gap:8px 16px; }
.service-info dd { margin:0; }
#servicePinForm { display:grid; gap:10px; max-width:360px; padding:12px 0; }
#servicePinForm label { display:grid; gap:4px; }
@media print { .service-bar, #servicePinPanel { display:none !important; } }

.service-readonly button:disabled, .service-readonly input:disabled, .service-readonly select:disabled, .service-readonly textarea:disabled { opacity:.55; cursor:not-allowed; }

/* Finché il PIN è provvisorio nessun archivio viene caricato. */
#mandatoryPinPanel{max-width:36rem;margin:2rem auto;padding:1rem;}
body.pin-obbligatorio #tabs,body.pin-obbligatorio .header-actions,body.pin-obbligatorio main> :not(#mandatoryPinPanel){display:none!important;}

#printBrand{display:none;}
@media print{#printBrand{display:block!important;font-weight:700;font-size:14px;margin-bottom:8mm;}body.pin-obbligatorio #printBrand{display:none!important;}}