:root { --bg:#0f172a; --card:#111827; --muted:#94a3b8; --text:#e5e7eb; --danger:#ef4444; }
* { box-sizing: border-box; font-family: ui-sans-serif, system-ui, -apple-system, Segoe UI, Roboto; }
/* html background evita la riga bianca nella safe-area-top su iOS/Capacitor WKWebView */
html { background: #0b1220; overscroll-behavior: none; }
body { margin:0; background: var(--bg); color: var(--text); overscroll-behavior: none; }
a { color: #93c5fd; text-decoration: none; }
/* Nessuno z-index qui: altrimenti i modal position:fixed dentro <main> restano sotto la topbar (stacking context). */
.container { max-width: 1100px; margin: 24px auto; padding: 0 16px; position: relative; }
main.container h1 {
  text-align: center;
  margin-top: 0;
  margin-bottom: 1.25rem;
}
.topbar { display:flex; justify-content: space-between; align-items:center; padding: 12px 16px; background:#0b1220; border-bottom: 1px solid #1f2937; position: sticky; top:0; z-index: 9100; }
.brand { font-weight: 700; }
nav a { margin-right: 12px; }
.user { margin: 0 8px; color: var(--muted); }
.logout { color: var(--danger); }

/* Notification bell responsive display.  On large screens show the
   desktop bell inside the navigation; on tablet/mobile hide it and
   instead show the mobile bell placed next to the menu toggle. */
#notif-link-mobile { display: none; }
#notif-link { display: inline-block; }
@media (max-width: 1200px) {
  #notif-link-mobile {
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
  }
  #notif-link { display: none !important; }
}

/* Modern notification bell styling */
#notif-link svg, #notif-link-mobile svg {
  transition: all 0.2s ease;
  filter: drop-shadow(0 1px 2px rgba(0,0,0,0.1));
}

#notif-link:hover svg, #notif-link-mobile:hover svg {
  stroke: #f59e0b;
  transform: scale(1.1);
  filter: drop-shadow(0 2px 4px rgba(0,0,0,0.2));
}

/* Enhanced notification badge */
#notif-badge, #notif-badge-mobile {
  animation: pulse 2s infinite;
  box-shadow: 0 2px 4px rgba(239, 68, 68, 0.3);
}

@keyframes pulse {
  0% { transform: scale(1); }
  50% { transform: scale(1.05); }
  100% { transform: scale(1); }
}

/* Highlight high priority tickets with a red accent.  The word "Alta"
   will stand out so that users can quickly identify critical items. */
.priority-high {
  color: var(--danger);
  font-weight: bold;
}

/* Spaziatura verticale tra campi e pulsanti nei form dentro le card */
.card form > button,
.card form > .button {
  margin-top: 8px;
}

/* Brand link (desktop + mobile) */
.brand-link {
  display: flex;
  align-items: center;
  gap: 8px;
  justify-content: flex-start;
}
.brand-logo {
  height: 48px;
  width: auto;
  vertical-align: middle;
}
.brand-title {
  font-weight: 700;
  font-size: 22px;
  font-family: 'Montserrat', ui-sans-serif, system-ui;
  vertical-align: middle;
}

/* Mobile topbar icon buttons */
.topbar-icon-btn {
  display: none;
  align-items: center;
  justify-content: center;
  width: 40px;
  height: 40px;
  padding: 0;
  border-radius: 12px;
  background: rgba(31, 41, 55, 0.72);
  border: 1px solid rgba(148, 163, 184, 0.22);
  color: #e5e7eb;
  cursor: pointer;
  text-decoration: none;
  flex-shrink: 0;
  transition: background-color 0.18s ease, border-color 0.18s ease, transform 0.12s ease;
}
.topbar-icon-btn:hover,
.topbar-icon-btn:focus-visible {
  background: rgba(51, 65, 85, 0.85);
  border-color: rgba(148, 163, 184, 0.35);
}
.topbar-icon-glyph {
  font-size: 22px;
  line-height: 1;
}
.topbar-notif-badge {
  display: none;
  position: absolute;
  top: 2px;
  right: 2px;
  background: #ef4444;
  color: #ffffff;
  border-radius: 999px;
  padding: 0 5px;
  font-size: 10px;
  font-weight: bold;
  min-width: 18px;
  height: 18px;
  line-height: 18px;
  text-align: center;
  box-sizing: border-box;
  pointer-events: none;
}
.topbar-notif-btn {
  position: relative;
  overflow: visible;
}
.topbar-icon-btn svg {
  display: block;
  flex-shrink: 0;
}
.topbar-notif-btn svg {
  width: 20px;
  height: 20px;
}

/* Drawer backdrop + panel (tablet/mobile) */
.nav-backdrop {
  position: fixed;
  inset: 0;
  z-index: 9180;
  background: rgba(0, 0, 0, 0.32);
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transition: opacity 0.25s ease, visibility 0.25s ease;
}
.nav-backdrop.show {
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
}
.mobile-drawer {
  position: fixed;
  top: max(12px, env(safe-area-inset-top, 0px));
  left: 12px;
  bottom: calc(var(--mobile-dock-clearance, 120px) + 8px);
  width: min(300px, calc(100vw - 24px));
  z-index: 9190;
  display: flex;
  flex-direction: column;
  border-radius: 20px;
  background: rgba(17, 24, 39, 0.9);
  -webkit-backdrop-filter: blur(16px);
  backdrop-filter: blur(16px);
  border: 1px solid rgba(148, 163, 184, 0.18);
  box-shadow: 0 24px 48px rgba(0, 0, 0, 0.42);
  transform: translateX(calc(-100% - 28px));
  transition: transform 0.28s cubic-bezier(0.32, 0.72, 0, 1);
  overflow: hidden;
  pointer-events: none;
}
.mobile-drawer.open {
  transform: translateX(0);
  pointer-events: auto;
}
.mobile-drawer-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 14px 16px 10px;
  border-bottom: 1px solid rgba(148, 163, 184, 0.12);
  flex-shrink: 0;
}
.mobile-drawer-title {
  font-weight: 700;
  font-size: 17px;
  letter-spacing: 0.02em;
}
.mobile-drawer-close {
  width: 36px;
  height: 36px;
  border: none;
  border-radius: 0;
  background: transparent;
  color: #e5e7eb;
  font-size: 26px;
  line-height: 1;
  cursor: pointer;
  box-shadow: none;
  outline: none;
  -webkit-tap-highlight-color: transparent;
}
.mobile-drawer-close:hover {
  color: #f8fafc;
  background: transparent;
}
.mobile-drawer-close:focus-visible {
  outline: 2px solid rgba(148, 163, 184, 0.45);
  outline-offset: 2px;
  border-radius: 4px;
}
.mobile-drawer-body {
  flex: 1;
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
  padding: 8px 10px 12px;
}
.mobile-drawer-footer {
  flex-shrink: 0;
  padding: 12px 16px calc(12px + env(safe-area-inset-bottom, 0px));
  border-top: 1px solid rgba(148, 163, 184, 0.12);
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.mobile-drawer-user {
  font-size: 13px;
  color: var(--muted);
  line-height: 1.35;
  word-break: break-word;
}
.mobile-drawer-logout {
  align-self: flex-start;
  font-weight: 600;
}
.mobile-drawer-section {
  margin-bottom: 14px;
}
.mobile-drawer-section:last-child {
  margin-bottom: 0;
}
.mobile-drawer-section-label {
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: #64748b;
  padding: 4px 10px 6px;
}
.mobile-drawer-link {
  display: block;
  margin: 2px 0;
  padding: 11px 12px;
  border-radius: 12px;
  color: #e5e7eb;
  text-decoration: none;
  transition: background-color 0.15s ease, color 0.15s ease;
}
.mobile-drawer-link:hover,
.mobile-drawer-link:focus-visible {
  background: rgba(51, 65, 85, 0.65);
  color: #f8fafc;
}
.mobile-drawer-link--active {
  background: rgba(56, 189, 248, 0.14);
  color: #bae6fd;
  font-weight: 600;
}

/* Tablet/mobile: hide desktop nav, show drawer controls */
@media (max-width: 1200px) {
  #menuToggle {
    display: inline-flex !important;
  }
  .main-nav--desktop {
    display: none !important;
  }
}

.main-nav a, .main-nav span { 
  margin: 8px 16px; 
  padding: 8px 16px;
  border-radius: 6px;
  transition: background-color 0.18s ease, color 0.18s ease;
}
.main-nav a:hover { background-color: #1f2937; }

/* Desktop nav: lightweight hover + current-page underline */
@media (min-width: 1201px) {
  .main-nav a.dock-item {
    position: relative;
    transform-origin: center center;
    transform: scale(1);
    transition: transform 0.12s ease, background-color 0.18s ease, color 0.18s ease;
    display: inline-block;
    backface-visibility: hidden;
    -webkit-font-smoothing: antialiased;
  }
  .main-nav a.dock-item:hover,
  .main-nav a.dock-item:focus-visible {
    transform: scale(1.03);
    background-color: rgba(148, 163, 184, 0.14);
  }
  .main-nav a.dock-item.nav-current::after {
    content: "";
    position: absolute;
    left: 7px;
    right: 7px;
    bottom: -4px;
    height: 1.5px;
    border-radius: 2px;
    background: linear-gradient(90deg, #38bdf8, #60a5fa);
    opacity: 0.95;
  }
  .main-nav a.dock-item.nav-current {
    color: #dbeafe;
  }
}
/* PC: AmministraBot sempre allineato a sinistra e menu compatto */
@media (min-width: 1201px) {
  .brand { width: auto !important; text-align: left !important; margin-bottom: 0; }
  .brand-link { justify-content: flex-start !important; }
  .main-nav {
    display: flex;
    align-items: center;
  }
  .main-nav a,
  .main-nav span {
    margin: 0 4px;
    padding: 4px 6px;
  }
}

.card { background: var(--card); border: 1px solid #1f2937; border-radius: 16px; padding: 16px; margin-bottom: 16px; }
.narrow { max-width: 520px; margin: 0 auto; }
label { display:block; margin: 8px 0 4px; color: var(--muted); }
input, select, textarea { width: 100%; padding: 10px; border-radius: 10px; border:1px solid #334155; background:#0b1220; color:#e5e7eb; box-sizing: border-box; }
/* iOS Safari auto-zooms focused form controls when font-size < 16px.
   Keep controls at 16px on touch iOS to prevent focus zoom jumps. */
@supports (-webkit-touch-callout: none) {
  @media (max-width: 1024px) {
    input,
    select,
    textarea {
      font-size: 16px;
    }
  }
}
textarea {
  min-height: 5.5rem;
  line-height: 1.45;
  resize: vertical;
}
.overlay-modal textarea,
.modal-panel textarea {
  min-height: 6.75rem;
}
/* checkbox/radio: mai width:100% (altrimenti il box occupa tutta la riga e spinge la label fuori dalla card) */
input[type="checkbox"],
input[type="radio"] {
  width: auto;
  max-width: none;
  padding: 0;
  margin: 0;
  vertical-align: middle;
}
button { margin-top: 0; min-height: 40px; padding: 10px 14px; border-radius: 12px; border: 1px solid #334155; background:#1f2937; color: #e5e7eb; cursor: pointer; box-sizing: border-box; line-height: 1.25; }
button:hover { border-color: #475569; }
.btn, .btn-secondary, .btn-danger { min-height: 40px; padding: 10px 14px; box-sizing: border-box; margin: 0; }
/* Link con classe .button (es. Reset in Lavori) stessa altezza dei pulsanti */
a.button { min-height: 40px; padding: 10px 14px; box-sizing: border-box; display: inline-flex; align-items: center; justify-content: center; }
.button { min-height: 40px; padding: 10px 14px; border:1px solid #334155; border-radius:12px; display:inline-flex; align-items:center; justify-content:center; background:#1f2937; color: #e5e7eb; box-sizing: border-box; line-height: 1.25; text-decoration: none; }
/* Tipografia uniforme per tutti i pulsanti */
button,
.button,
.btn,
.btn-secondary,
.btn-danger {
  font-size: 14px;
  font-weight: 500;
}
.table { width:100%; border-collapse: collapse; }
.table th { text-align:left; padding: 10px; border-bottom: 1px solid #1f2937; }
.table td { text-align:left; padding: 10px; border-bottom: 1px solid #1f2937; }
.table th.text-center, .table td.text-center { text-align:center; }
/* Scheda condominio: colonne numeriche/date morosità (tabella principale) */
#condo-morosita-body table.table td.text-center,
#condo-morosita-body table.table th.text-center {
  text-align: center;
}
.table th.table-actions-col,
.table td.table-actions-col {
  text-align: center !important;
  vertical-align: middle;
}
.muted { color: var(--muted); }
.grid3 { display:grid; grid-template-columns: repeat(3,1fr); gap: 12px; }
.grid2 { display:grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.grid2 > * { min-width: 0; }
.stat { background:#0b1220; border:1px solid #1f2937; border-radius: 16px; padding: 16px; }
.stat .label { color: var(--muted); }
.stat .value { font-size: 28px; font-weight:700; margin-top: 6px; }
.stat-centered { text-align: center; }

/* Global modern look: glass cards + hover glow */
.card,
.stat,
.settings-card {
  background: linear-gradient(150deg, rgba(26, 34, 56, 0.78), rgba(17, 24, 39, 0.7));
  border: 1px solid rgba(148, 163, 184, 0.22);
  box-shadow: 0 10px 28px rgba(2, 6, 23, 0.28);
  backdrop-filter: blur(9px);
  -webkit-backdrop-filter: blur(9px);
  transition: transform 0.24s ease, box-shadow 0.24s ease, border-color 0.24s ease;
}
.card:hover,
.stat:hover,
.settings-card:hover {
  transform: translateY(-3px);
  border-color: rgba(96, 165, 250, 0.55);
  box-shadow: 0 16px 36px rgba(2, 6, 23, 0.45), 0 0 0 1px rgba(96, 165, 250, 0.2), 0 0 24px rgba(56, 189, 248, 0.18);
}
.dashboard-modern .dashboard-stat-card .value {
  font-size: 30px;
  letter-spacing: 0.2px;
}

/* Global staggered reveal for cards/stat blocks */
.ui-reveal-item {
  opacity: 0;
  transform: translateY(14px) scale(0.985);
}
.ui-animate-in .ui-reveal-item {
  animation: ui-card-reveal 0.52s cubic-bezier(.2, .75, .3, 1) both;
  animation-delay: calc(var(--ui-reveal-order, 0) * 55ms);
}
@keyframes ui-card-reveal {
  from {
    opacity: 0;
    transform: translateY(14px) scale(0.985);
  }
  to {
    opacity: 1;
    transform: translateY(0) scale(1);
  }
}

@media (prefers-reduced-motion: reduce) {
  .ui-reveal-item,
  .ui-animate-in .ui-reveal-item {
    opacity: 1;
    transform: none;
    animation: none;
  }
  .card,
  .stat,
  .settings-card {
    transition: none;
  }
}

/* Allinea gruppi di card statistiche al centro (dettaglio condominio / fornitore) */
.grid3--stats-centered {
  justify-items: center;
}
.grid3--stats-centered .stat {
  width: 100%;
  max-width: 360px;
}
.grid2.grid3--stats-centered {
  justify-content: center;
  justify-items: center;
}
.grid2.grid3--stats-centered .stat {
  width: 100%;
  max-width: 360px;
}

/* Il mio condominio: filtro + Reset allineati in altezza */
.bacheca-scope-form {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 10px 12px;
}
.bacheca-scope-form .bacheca-scope-label {
  margin: 0;
}
.bacheca-scope-form .bacheca-scope-select {
  flex: 1 1 220px;
  min-width: 160px;
  min-height: 40px;
  height: 40px;
  box-sizing: border-box;
  border-radius: 10px;
  padding: 8px 12px;
}
.bacheca-scope-form .bacheca-scope-reset {
  margin: 0;
  min-height: 40px;
  height: 40px;
  box-sizing: border-box;
  display: inline-flex;
  align-items: center;
}

/* Data + ora pubblicazione programmata (picker nativi) */
.bacheca-publish-datetime-row {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 10px;
  margin-top: 6px;
}
.bacheca-publish-datetime-row .bacheca-publish-date {
  flex: 1 1 160px;
  min-width: 140px;
  min-height: 40px;
  padding: 8px 10px;
  border-radius: 10px;
  box-sizing: border-box;
}
.bacheca-publish-datetime-row .bacheca-publish-time {
  flex: 0 1 140px;
  min-height: 40px;
  padding: 8px 10px;
  border-radius: 10px;
  box-sizing: border-box;
}
.alert { background: #2b1215; border:1px solid #7f1d1d; color:#fecaca; padding: 8px 12px; border-radius: 12px; margin-bottom: 10px; }
.timeline { list-style: none; padding:0; margin:0; }
.timeline li { display:flex; gap: 12px; padding: 10px 0; border-bottom: 1px solid #1f2937; }
.timeline .time { color: var(--muted); min-width: 140px; }

/* Notifiche (dashboard / frammento API): su schermi stretti data e testo in colonna */
@media (max-width: 640px) {
  .timeline--notifications > li {
    flex-direction: column;
    align-items: flex-start;
    gap: 6px;
  }
  .timeline--notifications .time {
    min-width: 0;
    width: 100%;
    font-size: 0.88rem;
  }
  .timeline--notifications .desc {
    width: 100%;
    min-width: 0;
  }
  .timeline--notifications .desc a {
    display: block;
    line-height: 1.45;
  }
}
/* Timeline ticket: data + blocco descrizione/azioni allineati in altezza al centro */
.timeline--ticket > li {
  align-items: center;
}
/* Solo timeline ticket: layout flex testo | azioni (non usare su ul.timeline della bacheca) */
.timeline--ticket .desc {
  display: flex;
  flex-wrap: nowrap;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  flex: 1;
  min-width: 0;
}
.timeline--ticket .timeline-desc-body {
  flex: 1;
  min-width: 0;
  overflow-wrap: anywhere;
  word-break: break-word;
}
.timeline--ticket .timeline-desc-actions {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 12px;
  flex-shrink: 0;
  margin-left: auto;
}
.timeline-delete-form {
  display: inline-block;
  margin: 0;
}
.timeline-delete-btn {
  background: none !important;
  border: none !important;
  color: #e74c3c !important;
  cursor: pointer;
  padding: 4px 6px;
}
.internal-comments-list {
  list-style: none;
  padding: 0;
  margin: 0;
}
.internal-comment-item {
  padding: 10px 0;
  border-bottom: 1px solid #1f2937;
}
.internal-comment-line {
  display: flex;
  flex-wrap: nowrap;
  align-items: center;
  gap: 10px 12px;
  width: 100%;
}
.internal-comment-text-wrap {
  flex: 1;
  min-width: 0;
  overflow-wrap: anywhere;
  word-break: break-word;
}
.internal-comment-actions {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 12px;
  flex-shrink: 0;
  margin-left: auto;
}
.internal-comment-edit-form {
  margin-top: 10px;
  width: 100%;
  box-sizing: border-box;
}
.internal-comment-edit-form-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 8px;
}
.internal-comments-help {
  margin: 0 0 12px 0;
  font-size: 0.9rem;
}
@media (min-width: 769px) {
  html:not(.cap-native) .internal-comments-help-swipe {
    display: none;
  }
  /* Desktop: actions always visible on right */
  .internal-comment-actions {
    margin-left: auto;
    flex-shrink: 0;
  }
  .internal-comment-item[data-swipeable="0"] .internal-comment-actions {
    display: none;
  }
}
@media (max-width: 768px), html.cap-native {
  /* Swipeable items: overflow hidden so actions stay clipped to right */
  .internal-comment-item[data-swipeable="1"] {
    overflow: hidden;
  }
  /* The line itself becomes the sliding rail */
  .internal-comment-item[data-swipeable="1"] .internal-comment-line {
    width: calc(100% + 76px);
    min-width: calc(100% + 76px);
    transition: transform 0.22s ease;
    will-change: transform;
  }
  .internal-comment-item[data-swipeable="1"] .internal-comment-text-wrap {
    flex: 1 1 0;
    min-width: 0;
  }
  .internal-comment-item[data-swipeable="1"] .internal-comment-actions {
    flex: 0 0 76px;
    width: 76px;
    justify-content: flex-end;
    padding-right: 4px;
  }
  .internal-comment-item[data-swipeable="1"].is-swiped .internal-comment-line {
    transform: translateX(-76px);
  }
  /* Other users' comments: hide actions entirely */
  .internal-comment-item[data-swipeable="0"] .internal-comment-actions {
    display: none;
  }
}
.timeline-pubblica-help {
  font-size: 0.9rem;
  line-height: 1.45;
  margin: 0 0 12px 0;
  max-width: 52rem;
  text-align: justify;
  hyphens: auto;
  -webkit-hyphens: auto;
}

/* Testi esplicativi (help) allineati in modo ordinato */
.help-text-block {
  text-align: justify;
  line-height: 1.45;
  hyphens: auto;
  -webkit-hyphens: auto;
}
.bacheca-admin-hint {
  font-size: 0.88rem;
  margin: 0 0 12px 0;
  line-height: 1.45;
  text-align: justify;
}
.timeline-pubblica-label {
  font-weight: 600;
  color: #86efac;
  margin-right: 4px;
}
.timeline-pubblica-toggle-form {
  display: inline-block;
  margin-left: 0;
  vertical-align: middle;
}
.timeline-pubblica-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 32px;
  height: 32px;
  min-width: 32px;
  padding: 0;
  box-sizing: border-box;
  border: 1px solid rgba(148, 163, 184, 0.35);
  background: rgba(15, 23, 42, 0.35);
  color: #94a3b8;
  border-radius: 8px;
  cursor: pointer;
  line-height: 1;
}
.timeline-pubblica-btn:hover {
  border-color: rgba(148, 163, 184, 0.55);
  color: #cbd5e1;
}
.timeline-pubblica-btn.is-on {
  border-color: rgba(34, 197, 94, 0.55);
  color: #22c55e;
  background: rgba(34, 197, 94, 0.1);
}
.timeline-pubblica-btn.is-on:hover {
  border-color: rgba(34, 197, 94, 0.75);
  color: #4ade80;
}

/* Mobile: barra bassa: tratto icone un filo più marcato */
@media (max-width: 768px) {
  .mobile-bottom-bar .bottom-icon-line svg path,
  .mobile-bottom-bar .bottom-icon-line svg rect {
    stroke-width: 2.1 !important;
  }
}
.footer { color: var(--muted); text-align:center; padding: 24px; }

/* Colour classes for dashboard notifications.  Notifications for new
   tickets are highlighted in the danger colour; closures use a green
   accent; announcements appear in white; generic aggiornamenti hanno
   un blu tenue; i commenti interni usano un colore neutro/bianco per
   non confondersi con gli aggiornamenti operativi.  Solo il link
   viene colorato per non toccare la colonna timestamp. */
.notif-open a { color: var(--danger); }
.notif-close a { color: #22c55e; }
.notif-announcement a { color: #ffffff; }
.notif-update a { color: #93c5fd; }
.notif-pending a { color: #fbbf24; }
.notif-comment a { color: #ffffff; }
@media (max-width: 640px) {
  .timeline--ticket li {
    flex-direction: row;
    align-items: flex-start;
    gap: 8px;
  }
  .timeline--ticket .time {
    min-width: 92px;
    width: 92px;
    font-size: 12px;
    margin-bottom: 0;
  }
  .timeline--ticket .desc {
    flex-wrap: nowrap;
    width: calc(100% - 100px);
    align-items: flex-start;
  }
  .timeline--ticket .timeline-desc-actions {
    margin-left: auto;
    width: auto;
    justify-content: flex-end;
  }
  .timeline--ticket .desc a {
    word-wrap: break-word;
    white-space: normal;
  }
}
.kanban {
  /*
    Use auto‑fitting columns with a minimum width to improve readability.
    The previous implementation defined a fixed 6‑column grid. On smaller
    screens or when the viewport is narrow this caused each column to shrink
    excessively, making the contents hard to read. Using ``auto‑fit`` with a
    ``minmax`` constraint allows the layout to adapt: columns will wrap
    onto multiple rows if there isn’t enough horizontal space. Each column
    will always be at least 220px wide but can grow to fill the available
    space. The ``gap`` property maintains consistent spacing between
    columns.
  */
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  gap: 12px;
}
.column {
  background:#0b1220;
  border:1px solid #1f2937;
  border-radius: 16px;
  padding: 8px;
  /* Minimum height ensures even empty columns remain visible */
  min-height: 120px;
  /* Limit height so that roughly three tickets are visible at once.  A
     scroll bar appears when the content exceeds this size, allowing
     users to access older items without overwhelming the page. */
  max-height: 320px;
  overflow-y: auto;
}

/* Refined scrollbars for Kanban columns.  The default scrollbars looked
   out of place against the dark theme.  Give them a thin profile with
   muted colours so they blend into the column backgrounds while still
   remaining visible when needed.  On browsers that support the
   standardised ``scrollbar-width`` and ``scrollbar-color`` properties the
   latter are used; for WebKit the pseudo elements are specified. */
.kanban .column::-webkit-scrollbar {
  width: 6px;
  height: 6px;
}
.kanban .column::-webkit-scrollbar-track {
  background: #0b1220;
  border-radius: 4px;
}
.kanban .column::-webkit-scrollbar-thumb {
  background: #334155;
  border-radius: 4px;
}
.kanban .column {
  /* Use thin scrollbars on Firefox/Edge */
  scrollbar-width: thin;
  scrollbar-color: #334155 #0b1220;
}

/*
  Style multi‑select dropdowns used in the bulletin board so their scrollbars
  match the dark theme.  Without custom styling the native scrollbars appear
  light and out of place against the dark cards.  The rules below mirror
  those used for the Kanban columns: a thin thumb on a dark track.  The
  ``select[multiple]`` selector targets all multi‑selects globally.  If you
  introduce other multi‑selects later they will automatically benefit from
  this styling.
*/
select[multiple]::-webkit-scrollbar {
  width: 6px;
  height: 6px;
}
select[multiple]::-webkit-scrollbar-track {
  background: #0b1220;
  border-radius: 4px;
}
select[multiple]::-webkit-scrollbar-thumb {
  background: #334155;
  border-radius: 4px;
}
select[multiple] {
  /* Enable thin scrollbars on Firefox/Edge */
  scrollbar-width: thin;
  scrollbar-color: #334155 #0b1220;
}

/*
  Ensure wide tables remain usable on small screens.  When the viewport
  shrinks below 768px the default table layout causes columns to cram
  together, making text illegible.  Instead, allow the table to scroll
  horizontally.  The ``display: block`` declaration enables overflow
  scrolling and ``white-space: nowrap`` prevents cells from wrapping
  unexpectedly.  Users can swipe sideways to see off‑screen columns.  On
  larger screens the table retains its normal behaviour.
*/
@media (max-width: 768px) {
  /* Reduce padding to maximise visible content on narrow devices.  We intentionally
     avoid forcing tables into a horizontally scrolling container because
     users reported that horizontal scrolling made it hard to read data on
     smaller screens.  Instead the page will scroll normally so all
     columns remain visible. */
  table.table th,
  table.table td {
    padding: 8px;
  }
}

/* Settings page layout refinements */
.settings-grid {
  display: grid;
  gap: 16px;
  grid-template-columns: minmax(320px, 1fr) minmax(480px, 1.6fr);
  min-width: 0;
}

.settings-card {
  background: linear-gradient(150deg, rgba(26, 34, 56, 0.78), rgba(17, 24, 39, 0.7));
  border: 1px solid rgba(148, 163, 184, 0.22);
  border-radius: 16px;
  padding: 16px;
  min-width: 0;
  overflow: hidden;
}
.settings-card h2 {
  font-size: 1.1rem;
  color: #e5e7eb;
}
.settings-card h3 {
  line-height: 1.25;
}
.settings-card .grid2 > * {
  min-width: 0;
}
.settings-card label {
  overflow-wrap: anywhere;
}

@media (max-width: 980px) {
  .settings-grid {
    grid-template-columns: 1fr;
  }
}

/* Settings mobile safety: avoid content escaping cards */
.settings-card .table-responsive {
  max-width: 100%;
  overflow-x: auto;
}

.settings-user-agent {
  max-width: 260px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

@media (max-width: 768px) {
  .settings-grid {
    grid-template-columns: 1fr !important;
  }
  /* Any settings card with inline grid span must collapse on phones. */
  .settings-grid > .settings-card[style*="grid-column"] {
    grid-column: span 1 !important;
  }
  /* Inline `grid-column: span 2` blocks in settings form must collapse to 1 column */
  .settings-card .grid2 > div[style*="grid-column"] {
    grid-column: span 1 !important;
  }
  .settings-card {
    padding: 12px;
  }
  .settings-card .table th,
  .settings-card .table td {
    padding: 8px 6px;
  }
  .settings-user-agent {
    max-width: 180px;
  }
}

/* Contract forms: date input must not overflow card on mobile */
.contract-keep-section input[type="date"],
.supplier-contract-keep-section input[type="date"] {
  width: 100%;
  max-width: 100%;
  min-width: 0;
  box-sizing: border-box;
}
.column-title { font-weight:700; margin-bottom: 8px; color:#cbd5e1; }
.ticket .code { font-weight:700; }
.inline { display:flex; gap: 6px; margin-top: 8px; }
.scope-form { display:flex; gap:12px; align-items:center; }
@media (max-width: 1100px) {
  /* Maintain auto‑fit behaviour on smaller screens */
  .kanban {
    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  }
}
/* Stack grids in a single column on narrow screens to prevent
   forms from being squeezed into tiny columns. */
@media (max-width: 768px) {
  .grid2 {
    grid-template-columns: 1fr;
  }
  .grid3 {
    grid-template-columns: 1fr;
  }
}
@media (max-width: 700px) {
  /* Single column view for very narrow screens */
  .kanban {
    grid-template-columns: 1fr;
  }
}
.button { min-height: 40px; padding: 10px 14px; border:1px solid #334155; border-radius:12px; display:inline-flex; align-items:center; justify-content:center; background:#1f2937; color: #e5e7eb; box-sizing: border-box; line-height: 1.25; text-decoration: none; }
/* Toolbar: allineamento verticale di input, pulsanti e testo (Condomini, Fornitori, Dashboard) */
.toolbar {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.5rem;
  margin: 8px 0;
}
.toolbar .input,
.toolbar input[type="text"],
.toolbar input[type="search"],
.toolbar select,
.toolbar button,
.toolbar .btn,
.toolbar a.button {
  margin: 0;
  min-height: 40px;
  height: 40px;
  padding: 8px 12px;
  box-sizing: border-box;
  border-radius: 10px;
}
.toolbar .input,
.toolbar input[type="text"],
.toolbar input[type="search"],
.toolbar select {
  width: auto;
  min-width: 160px;
  flex: 1;
  max-width: 320px;
}
.toolbar small { margin: 0; line-height: 40px; }

/* Dashboard: Filtro condominio + select + Tutti su una riga */
.scope-form-inline .scope-form-row {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
}
.scope-form-inline .scope-form-row label { margin: 0; }
.scope-form-inline .scope-form-row select {
  width: auto;
  min-width: 180px;
  max-width: 320px;
  min-height: 40px;
  height: 40px;
}
.scope-form-inline .scope-form-row button { margin: 0; }
.dashboard-scope-row {
  justify-content: center;
  flex-wrap: nowrap;
}
.dashboard-scope-form {
  display: flex;
  justify-content: center;
}
.dashboard-scope-row select {
  min-width: 130px;
  max-width: 220px;
  width: 180px;
}

/* Filtri avanzati (Lavori): stessa altezza campi e pulsanti, allineamento */
.filter-form-row {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-end;
  gap: 12px;
  margin-top: 8px;
}
.filter-form-group {
  display: flex;
  flex-direction: column;
  min-width: 0;
}
.filter-form-group label { margin: 0 0 4px 0; }
.filter-form-group input,
.filter-form-group select {
  min-height: 40px;
  height: 40px;
  padding: 10px 12px;
  box-sizing: border-box;
}
.filter-form-group.filter-form-date {
  flex: 0 0 auto;
}
.filter-form-group.filter-form-date input {
  min-width: 100px;
  max-width: 140px;
  width: 130px;
}
.filter-form-actions {
  display: inline-flex;
  gap: 8px;
  align-items: center;
  margin-left: auto;
  align-self: flex-end;
  justify-content: flex-end;
}
.filter-form-actions button,
.filter-form-actions a.button {
  min-height: 40px;
  min-width: 90px;
  padding: 10px 14px;
  margin: 0;
  box-sizing: border-box;
}
@media (max-width: 768px) {
  .filter-form-row { flex-direction: column; align-items: stretch; gap: 16px; }
  .filter-form-group.filter-form-date input {
    min-width: 0;
    max-width: 160px;
    width: 160px;
  }
  .filter-form-actions {
    width: 100%;
    justify-content: flex-end;
    margin-top: 8px;
  }
  .filter-form-actions button,
  .filter-form-actions a.button {
    min-width: 90px;
  }
}

/* Mobile: floating dock (glassmorphism) — nascosta su desktop */
.mobile-bottom-bar {
  display: none;
}
@media (max-width: 768px) {
  :root {
    --mobile-dock-height: 68px;
    --mobile-dock-bottom-gap: 22px;
    --mobile-dock-clearance: calc(
      var(--mobile-dock-height) + var(--mobile-dock-bottom-gap) + 28px + env(safe-area-inset-bottom, 0px)
    );
  }
  .mobile-bottom-bar.mobile-dock {
    display: flex !important;
    position: fixed;
    z-index: 99990;
    left: max(12px, env(safe-area-inset-left, 0px));
    right: max(12px, env(safe-area-inset-right, 0px));
    width: auto;
    max-width: min(640px, 100%);
    margin-left: auto;
    margin-right: auto;
    bottom: calc(var(--mobile-dock-bottom-gap) + env(safe-area-inset-bottom, 0px));
    min-height: var(--mobile-dock-height);
    padding: 10px 16px 10px 18px;
    align-items: stretch;
    gap: 8px;
    overflow: hidden;
    border-radius: 28px;
    background: rgba(15, 23, 42, 0.55);
    backdrop-filter: blur(20px) saturate(1.35);
    -webkit-backdrop-filter: blur(20px) saturate(1.35);
    border: 1px solid rgba(255, 255, 255, 0.14);
    box-shadow:
      0 8px 30px rgba(0, 0, 0, 0.28),
      0 2px 10px rgba(0, 0, 0, 0.18),
      inset 0 1px 0 rgba(255, 255, 255, 0.1);
    box-sizing: border-box;
    -webkit-transform: translateZ(0);
    transform: translateZ(0);
  }
  @supports not ((backdrop-filter: blur(1px)) or (-webkit-backdrop-filter: blur(1px))) {
    .mobile-bottom-bar.mobile-dock {
      background: rgba(15, 23, 42, 0.94);
    }
  }
  .mobile-bottom-bar .dock-item {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 5px;
    flex: 1;
    min-width: 0;
    padding: 6px 4px;
    font-size: 10px;
    line-height: 1.15;
    color: #94a3b8;
    text-decoration: none;
    border-radius: 20px;
    min-height: 48px;
    text-align: center;
    transition: color 0.22s ease;
    position: relative;
    z-index: 2;
    -webkit-tap-highlight-color: transparent;
  }
  .mobile-bottom-bar .bottom-icon {
    flex-shrink: 0;
    margin: 0 auto;
  }
  .mobile-bottom-bar .bottom-label {
    display: block;
    width: auto;
    max-width: none;
    text-align: center;
    overflow: visible;
    text-overflow: clip;
  }
  .mobile-bottom-bar .dock-item:hover:not(.mobile-bottom-link--active),
  .mobile-bottom-bar .dock-item:focus-visible:not(.mobile-bottom-link--active) {
    color: #e2e8f0;
    background: rgba(255, 255, 255, 0.06);
  }
  .mobile-bottom-bar .dock-item.mobile-bottom-link--active {
    color: #f8fafc;
  }
  body {
    padding-bottom: var(--mobile-dock-clearance);
  }
  .footer {
    padding-bottom: calc(20px + var(--mobile-dock-clearance));
  }
  #scrollTop {
    display: none !important;
  }
  .mobile-bottom-bar .bottom-icon {
    width: 26px;
    height: 26px;
  }
  .mobile-bottom-bar .bottom-label {
    font-size: 10px;
    letter-spacing: 0.01em;
  }
}

/* Icone bottom nav (outline vs fill come tab attiva) */
.mobile-bottom-bar .bottom-icon {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 24px;
  height: 24px;
}
.mobile-bottom-bar .bottom-icon svg {
  width: 100%;
  height: 100%;
  position: absolute;
  left: 0;
  top: 0;
}
.mobile-bottom-bar a.mobile-bottom-link--active .bottom-label {
  color: #f1f5f9;
  font-weight: 600;
}
.mobile-bottom-bar a.mobile-bottom-link:not(.mobile-bottom-link--active) .bottom-icon-line {
  color: #94a3b8;
  opacity: 0.92;
}
.mobile-bottom-bar a.mobile-bottom-link--active .bottom-icon {
  filter: none;
}
.mobile-bottom-bar a.mobile-bottom-link--active .bottom-icon-line {
  color: #ffffff;
  opacity: 1;
}
@media (prefers-reduced-motion: reduce) {
  .mobile-bottom-bar .dock-item {
    transition: none;
  }
  .mobile-dock-pill {
    transition: none !important;
  }
}
/* Variante “fill” non usata: teniamo solo il tratto + alone */
.mobile-bottom-bar .bottom-icon-fill {
  display: none !important;
}

/* --- Custom tweaks for release 4.0 --- */
/* Allow vertical overflow so that action menus do not introduce nested
   scrollbars inside responsive tables.  Horizontal scrolling remains
   enabled on small screens. */
.table-responsive {
  overflow-y: visible;
}

/* Invert the colour of the calendar pickers in date inputs so that
   they remain visible against the dark background. */
input[type="date"]::-webkit-calendar-picker-indicator {
  filter: invert(1);
}

/* Dark-themed scrollbars for the searchable select dropdowns.  Without
   these rules the scrollbars appear light and out of place against the
   dark UI. */
.searchable-select select::-webkit-scrollbar {
  width: 6px;
  height: 6px;
}
.searchable-select select::-webkit-scrollbar-track {
  background: #0b1220;
  border-radius: 4px;
}
.searchable-select select::-webkit-scrollbar-thumb {
  background: #334155;
  border-radius: 4px;
}
.searchable-select select {
  scrollbar-width: thin;
  scrollbar-color: #334155 #0b1220;
}

/* Mobile/Tablet: topbar compatta a una riga (hamburger | logo | campanella) */
@media (max-width: 1200px) {
  .topbar {
    display: grid;
    grid-template-columns: 44px minmax(0, 1fr) 44px;
    align-items: center;
    gap: 10px;
    flex-wrap: nowrap;
    min-height: 56px;
    padding: 10px 12px;
    padding-top: max(10px, env(safe-area-inset-top, 0px));
    background: rgba(11, 18, 32, 0.94);
    -webkit-backdrop-filter: blur(8px);
    backdrop-filter: blur(8px);
  }
  .topbar-menu-btn {
    grid-column: 1;
    justify-self: start;
  }
  .topbar-brand-slot {
    grid-column: 2;
    justify-self: center;
    width: auto;
    text-align: center;
    margin-bottom: 0;
  }
  .topbar-brand-slot .brand-link {
    justify-content: center;
  }
  .topbar-brand-slot .brand-title {
    display: none;
  }
  .topbar-brand-slot .brand-logo {
    height: 52px;
    width: auto;
    max-width: min(220px, 72vw);
    object-fit: contain;
  }
  .topbar-notif-btn {
    grid-column: 3;
    justify-self: end;
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
  }
}

@media (min-width: 1201px) {
  .nav-backdrop,
  .mobile-drawer {
    display: none !important;
  }
  #menuToggle {
    display: none !important;
  }
}

/* Quando il menù mobile o una modal sono aperti, blocca lo scroll della pagina sottostante */
body.menu-open,
body.modal-open {
  overflow: hidden;
}
/* Con modal aperto, la topbar non compete in stacking: il pannello resta sempre cliccabile */
body.modal-open .topbar {
  z-index: 1000;
}

/* Toast notifications appear in the bottom‑right corner when triggered. They fade
   in/out using the ``show`` class. */
#toast {
  position: fixed;
  bottom: 20px;
  right: 20px;
  background: #334155;
  color: #e5e7eb;
  padding: 12px 16px;
  border-radius: 8px;
  opacity: 0;
  transition: opacity 0.3s ease;
  z-index: 9999;
}
#toast.show { opacity: 1; }

/* Modal overlay per form "Aggiungi condominio / fornitore" */
.overlay-modal {
  display: none;
  position: fixed;
  inset: 0;
  background: rgba(0, 0, 0, 0.7);
  /* Sopra topbar (9100) e bottom-nav mobile (99990); il body abbassa la topbar quando il modal è aperto */
  z-index: 100100;
  align-items: flex-start;
  justify-content: center;
  padding: 80px 16px 16px 16px; /* lascia spazio per header/menu su desktop */
  box-sizing: border-box;
}
.overlay-modal.show {
  display: flex;
}
/* Modal centrato (es. Modifica dettagli sinistro) */
.overlay-modal.overlay-modal--centered {
  align-items: center;
  justify-content: center;
}
.overlay-modal .modal-panel {
  background: var(--card, #1f2937);
  border: 1px solid #334155;
  border-radius: 12px;
  max-width: 440px;
  width: 100%;
  max-height: 88vh;
  overflow-y: auto;
  padding: 16px;
}
.overlay-modal .modal-panel h3 { margin-top: 0; }
.overlay-modal .modal-close {
  float: right;
  margin: -8px -8px 12px 12px;
  background: transparent;
  border: none;
  color: var(--text, #e5e7eb);
  cursor: pointer;
  font-size: 1.2rem;
  line-height: 1;
}
/* Mobile: modal in alto, sempre visibile e chiudibile */
@media (max-width: 768px) {
  .overlay-modal {
    align-items: flex-start;
    justify-content: flex-start;
    /* Più spazio sotto header / floating dock così il pannello non finisce sotto la barra */
    padding: 128px 12px calc(var(--mobile-dock-clearance, 118px) + 12px) 12px;
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
  }
  /* Schede condominio morosità (e analoghi): pannello centrato come desktop */
  .overlay-modal.overlay-modal--center-strong-mobile {
    align-items: center;
    justify-content: center;
    padding: 72px 12px calc(var(--mobile-dock-clearance, 118px) + 12px);
  }
  .overlay-modal .modal-panel {
    flex-shrink: 0;
    margin: 0 auto;
    max-height: 80vh;
  }
  .overlay-modal .modal-close {
    position: sticky;
    top: 0;
    float: none;
    display: block;
    width: 100%;
    text-align: right;
    padding: 8px 0 12px;
    margin: 0 0 8px 0;
    border-bottom: 1px solid #334155;
    font-size: 1.5rem;
    z-index: 1;
    background: var(--card, #1f2937);
  }
}

/* Morosità: dettaglio tabella annidata (specificità > .table td { text-align:left }) */
#condo-morosita-body table.table td.morosita-detail-num,
#condo-morosita-body table.table th.morosita-detail-num {
  text-align: center;
  vertical-align: middle;
}
#condo-morosita-body table.table th.morosita-detail-col-dettagli {
  text-align: justify;
}
#condo-morosita-body table.table td.morosita-detail-num.morosita-detail-cell-text {
  text-align: justify;
  vertical-align: middle;
}
.morosita-stato-scaduta {
  color: #ef4444;
  font-weight: 700;
}
.morosita-diffida-regenerate-btn {
  background: none;
  border: none;
  padding: 0;
  margin: 0;
  color: #eab308;
  font: inherit;
  font-weight: 600;
  cursor: pointer;
  text-decoration: underline;
  text-underline-offset: 3px;
}
.morosita-diffida-regenerate-btn:hover {
  color: #facc15;
}
.timeline-item--morosita-sync {
  border-left: 3px solid #ca8a04;
  padding-left: 10px;
  margin-left: 2px;
}
.timeline-time--morosita-sync {
  color: #eab308;
  font-weight: 700;
}
.morosita-diffida-download-link {
  color: #60a5fa;
  font-weight: 500;
  text-decoration: underline;
  text-underline-offset: 3px;
}
.morosita-detail-empty {
  display: inline-block;
  min-width: 1ch;
  text-align: center;
  color: #64748b;
  font-weight: 500;
}
.morosita-detail-truncate {
  display: -webkit-box;
  -webkit-line-clamp: 1;
  -webkit-box-orient: vertical;
  overflow: hidden;
  max-width: min(320px, 36vw);
  cursor: pointer;
  vertical-align: top;
  word-break: break-word;
}
.morosita-detail-truncate.is-expanded {
  -webkit-line-clamp: unset;
  display: block;
  max-width: none;
}

/* Morosità: tabella rate (allineata allo stile della tabella passaggi) */
#condo-morosita-body .morosita-installments-wrap {
  max-width: 100%;
}
#condo-morosita-body .morosita-installments-table th,
#condo-morosita-body .morosita-installments-table td {
  font-size: 0.95rem;
}
@media (max-width: 768px) {
  #condo-morosita-body .morosita-installments-heading strong {
    font-size: 0.9rem;
  }
  #condo-morosita-body .morosita-installments-table {
    min-width: 100% !important;
  }
  #condo-morosita-body .morosita-installments-table th,
  #condo-morosita-body .morosita-installments-table td {
    padding: 6px 8px;
    font-size: 0.85rem;
  }
}

/* Modal (morosità, sinistro, …): input data non a tutta larghezza su schermi piccoli */
@media (max-width: 768px) {
  .overlay-modal .modal-panel input[type="date"],
  .overlay-modal .modal-panel input[type="datetime-local"] {
    max-width: 11.5rem;
    width: auto;
    min-height: 2.25rem;
    box-sizing: border-box;
    font-size: 0.95rem;
    padding: 0.35rem 0.5rem;
  }
}

/* Scheda condominio: anagrafica mobile compatta ma sempre leggibile */
@media (max-width: 768px) {
  .condo-anagrafica-card .table-responsive {
    overflow-x: auto !important;
    overflow-y: visible;
    -webkit-overflow-scrolling: touch;
  }
  .condo-anagrafica-card .condo-anagrafica-table {
    min-width: 760px;
    width: 760px;
  }
  .condo-anagrafica-card .condo-anagrafica-head h2 {
    font-size: 1rem !important;
    line-height: 1.25;
  }
  .condo-anagrafica-card .condo-anagrafica-hint {
    font-size: 0.78rem !important;
    margin-bottom: 8px;
  }
  .condo-anagrafica-card .condo-anagrafica-table th,
  .condo-anagrafica-card .condo-anagrafica-table td {
    display: table-cell !important;
    width: auto !important;
    max-width: none !important;
    box-sizing: border-box;
    padding: 6px 8px !important;
    border-bottom: 1px solid #1f2937 !important;
    vertical-align: top;
  }
  .condo-anagrafica-card .condo-anagrafica-table th {
    font-size: 0.76rem !important;
    font-weight: 600 !important;
    color: #94a3b8 !important;
    white-space: normal !important;
    word-break: break-word !important;
    overflow-wrap: anywhere !important;
    line-height: 1.35 !important;
    max-width: 120px;
  }
  .condo-anagrafica-card .condo-anagrafica-table td {
    font-size: 0.88rem !important;
    min-width: 0;
  }
  .condo-anagrafica-card .anagrafica-view {
    display: block !important;
    width: 100%;
  }
  .condo-anagrafica-card .anagrafica-value,
  .condo-anagrafica-card .anagrafica-link {
    display: block !important;
    width: 100% !important;
    max-width: 100% !important;
    font-size: 0.88rem !important;
    line-height: 1.35 !important;
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
  }
  .condo-anagrafica-card .anagrafica-cell.expanded .anagrafica-value,
  .condo-anagrafica-card .anagrafica-cell.expanded .anagrafica-link {
    white-space: pre-wrap !important;
    word-break: break-word !important;
    overflow: visible !important;
    text-overflow: clip !important;
  }
  .condo-anagrafica-card .anagrafica-edit,
  .condo-anagrafica-card input.anagrafica-edit {
    display: none;
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    font-size: 0.88rem !important;
    padding: 6px 8px !important;
    box-sizing: border-box !important;
  }
  .condo-anagrafica-card.is-anagrafica-editing .anagrafica-view {
    display: none !important;
  }
  .condo-anagrafica-card.is-anagrafica-editing .anagrafica-edit {
    display: block !important;
  }
  .condo-anagrafica-card .anagrafica-actions .button,
  .condo-anagrafica-card .anagrafica-actions button {
    font-size: 0.8rem !important;
    padding: 6px 10px !important;
  }
}

/* Bacheca avvisi modal: lascia trasparenza per vedere bottom-nav */
.bacheca-avviso-modal {
  background: rgba(0, 0, 0, 0.15) !important;
  padding: 80px 16px 96px 16px !important;
}
@media (max-width: 768px) {
  .bacheca-avviso-modal {
    padding-top: 132px !important;
    padding-bottom: calc(var(--mobile-dock-clearance, 118px) + 12px) !important;
  }
}

.bacheca-avvisi-item,
.bacheca-doc-item {
  cursor: pointer;
}

/* Riga avviso/documento: testo a sinistra, pin allineato a destra */
.bacheca-item-row {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 10px;
  width: 100%;
}
.bacheca-item-main {
  flex: 1;
  min-width: 0;
}
.bacheca-pin-wrap {
  flex-shrink: 0;
  margin-left: auto;
  padding-top: 1px;
}
.bacheca-pin-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 26px;
  height: 26px;
  padding: 0;
  border: 1px solid rgba(148, 163, 184, 0.35);
  background: rgba(15, 23, 42, 0.35);
  color: #94a3b8;
  border-radius: 6px;
  cursor: pointer;
  font-size: 12px;
  line-height: 1;
}
.bacheca-pin-btn:hover {
  border-color: rgba(251, 191, 36, 0.45);
  color: #fbbf24;
  background: rgba(251, 191, 36, 0.08);
}
.bacheca-pin-btn[aria-pressed="true"] {
  border-color: rgba(251, 191, 36, 0.55);
  color: #fbbf24;
}
.bacheca-pin-btn:disabled {
  opacity: 0.55;
  cursor: wait;
}

/* Nuovo avviso / documento: evidenzia scelta attiva */
.bacheca-kind-toggle.bacheca-kind-toggle--active {
  outline: 2px solid #22c55e;
  outline-offset: 3px;
  box-shadow: 0 0 0 1px rgba(34, 197, 94, 0.35);
}

/* Opzioni pubblicazione: allineate a sinistra, dentro la card (no overflow su mobile) */
.card .bacheca-new-form {
  min-width: 0;
  width: 100%;
  align-items: stretch;
}
/* Evita che input hidden o campi a metà riga rompano la griglia a 2 colonne */
.bacheca-new-form .bacheca-grid-row-full {
  grid-column: 1 / -1;
  min-width: 0;
  width: 100%;
  box-sizing: border-box;
}
.bacheca-new-form .bacheca-publish-options {
  flex-direction: column !important;
  align-items: stretch !important;
}
@media (min-width: 640px) {
  .bacheca-new-form .bacheca-publish-options {
    flex-direction: column !important;
  }
}
.bacheca-publish-options {
  display: flex;
  flex-direction: column;
  gap: 12px;
  align-items: stretch;
  width: 100%;
  max-width: 100%;
  box-sizing: border-box;
}
.bacheca-publish-option {
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  align-items: flex-start;
  gap: 10px;
  font-size: 0.9rem;
  line-height: 1.35;
  max-width: 100%;
  width: 100%;
  min-width: 0;
  text-align: left;
  box-sizing: border-box;
}
.bacheca-publish-option input[type="checkbox"] {
  width: auto !important;
  max-width: none !important;
  margin-top: 3px;
  flex: 0 0 auto;
  flex-shrink: 0;
}
@media (min-width: 640px) {
  .bacheca-publish-options {
    flex-direction: row;
    flex-wrap: wrap;
    align-items: center;
    gap: 16px 24px;
  }
}

/* Lista documenti (non modal): link discreti */
.bacheca-doc-inline-actions {
  margin-top: 10px;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 6px 10px;
  font-size: 0.9rem;
}
.bacheca-doc-link {
  color: #86efac;
  text-decoration: none;
  border-bottom: 1px solid transparent;
  padding: 2px 0;
}
.bacheca-doc-link:hover {
  border-bottom-color: currentColor;
}
.bacheca-doc-sep {
  color: #64748b;
  user-select: none;
}
.bacheca-doc-filename {
  font-size: 0.85rem;
  word-break: break-word;
  max-width: 100%;
}
.bacheca-modal-attachments-actions {
  flex-direction: column !important;
  align-items: flex-start !important;
}
.bacheca-modal-att-row {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 6px 10px;
  margin-bottom: 8px;
  font-size: 0.9rem;
  max-width: 100%;
}
.bacheca-modal-att-row .bacheca-doc-link {
  word-break: break-word;
}

.bacheca-unread-badge {
  display: inline-block;
  margin-left: 8px;
  padding: 2px 8px;
  border-radius: 6px;
  font-size: 0.75rem;
  font-weight: 600;
  color: #0f172a;
  background: #facc15;
  vertical-align: middle;
}
.bacheca-headline-row {
  display: flex;
  flex-wrap: nowrap;
  justify-content: space-between;
  align-items: flex-start;
  gap: 10px;
  width: 100%;
}
.bacheca-headline-left {
  flex: 1;
  min-width: 0;
}
.bacheca-headline-right {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-shrink: 0;
  margin-left: auto;
}
.bacheca-condo-codes {
  font-size: 0.85rem;
  white-space: nowrap;
}
.bacheca-envelope {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 28px;
  height: 28px;
  border-radius: 6px;
  flex-shrink: 0;
}
.bacheca-envelope svg {
  width: 16px;
  height: 16px;
  min-width: 16px;
  min-height: 16px;
  display: block;
  flex-shrink: 0;
  aspect-ratio: 1 / 1;
  object-fit: contain;
}
.bacheca-envelope--unread {
  background: rgba(250, 204, 21, 0.22);
  color: #facc15;
  border: 1px solid rgba(250, 204, 21, 0.55);
}
.bacheca-envelope--read {
  color: #94a3b8;
  border: 1px solid rgba(148, 163, 184, 0.35);
  background: rgba(15, 23, 42, 0.35);
}
.table-row-icon-actions {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 12px;
  flex-wrap: nowrap;
  line-height: 1;
}
/* Il form non crea una scatola che sposta le icone rispetto al link penna */
.table-row-icon-actions form {
  display: contents;
  margin: 0;
  padding: 0;
  border: 0;
}
.table-actions-col .table-row-icon-actions {
  width: 100%;
  box-sizing: border-box;
}
/* Azioni tabella: quadrato fisso 32×32 — SVG e glifi centrati allo stesso modo */
.table-icon-btn {
  box-sizing: border-box;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 32px;
  height: 32px;
  padding: 0;
  margin: 0;
  border: none;
  background: transparent;
  color: #94a3b8;
  border-radius: 8px;
  cursor: pointer;
  text-decoration: none;
  line-height: 1;
  flex-shrink: 0;
  -webkit-appearance: none;
  appearance: none;
  font-family: inherit;
}
.table-icon-btn svg {
  width: 16px;
  height: 16px;
  flex-shrink: 0;
  display: block;
}
/* Glifi testuali (✓ ↻): Arial bold evita emoji colorate su iOS/Android */
.icon-action-glyph {
  font-family: Arial, sans-serif;
  font-weight: bold;
  line-height: 1;
  font-size: 1.05rem;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}
.table-icon-btn:hover {
  color: #e5e7eb;
  background: rgba(148, 163, 184, 0.1);
}
.table-icon-btn--danger {
  color: #f87171;
}
.table-icon-btn--danger:hover {
  color: #fca5a5;
  background: rgba(239, 68, 68, 0.1);
}
.table-icon-btn--success {
  color: #4ade80;
}
.table-icon-btn--success:hover {
  color: #86efac;
  background: rgba(34, 197, 94, 0.1);
}

.admin-users-filter-actions {
  display: flex;
  gap: 8px;
  align-items: flex-end;
  justify-content: flex-end;
}
.admin-users-filter-footer {
  grid-column: span 2;
  margin-top: 8px;
  display: flex;
  justify-content: flex-end;
  align-items: center;
  gap: 12px;
}
.admin-users-filter-apply,
.admin-users-filter-reset {
  white-space: nowrap;
}
@media (max-width: 640px) {
  .admin-users-filter-actions {
    width: 100%;
    justify-content: flex-end;
    align-items: center;
  }
  .admin-users-filter-footer {
    width: 100%;
    gap: 8px;
  }
}

.notif-filter-toolbar {
  flex-wrap: nowrap;
}
.notif-filter-toolbar label {
  white-space: nowrap;
}
.notif-filter-toolbar .notif-filter-select {
  min-width: 140px;
  max-width: 220px;
  flex: 0 1 200px;
}
@media (max-width: 640px) {
  .notif-filter-toolbar {
    gap: 6px;
  }
  .notif-filter-toolbar .notif-filter-select {
    min-width: 0;
    max-width: none;
    flex: 1 1 auto;
  }
}

/* Scheda fornitore: utenti collegati — una riga per utente, testo + azione allineati */
.supplier-linked-users-card {
  max-width: min(960px, 100%);
}
.supplier-linked-users-list {
  list-style: none;
  padding: 0;
  margin: 12px 0 0 0;
}
.supplier-linked-user-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 12px;
  align-items: center;
  padding: 12px 0;
  border-bottom: 1px solid rgba(148, 163, 184, 0.22);
}
.supplier-linked-user-row:last-child {
  border-bottom: none;
}
.supplier-linked-user-label {
  min-width: 0;
  word-break: break-word;
}
.supplier-linked-user-remove-form {
  margin: 0;
  flex-shrink: 0;
}
.supplier-deadlines-card {
  max-width: min(960px, 100%);
}
.supplier-deadlines-header {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
}
.ticket-attachments-list {
  list-style: none;
  padding: 0;
  margin: 0;
}
.ticket-attachment-row {
  display: flex;
  flex-wrap: nowrap;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 10px 0;
  border-bottom: 1px solid rgba(148, 163, 184, 0.28);
}
.ticket-attachment-row:last-child {
  border-bottom: none;
}
.ticket-attachment-row-main {
  flex: 1;
  min-width: 0;
  word-break: break-word;
}
.ticket-attachment-actions {
  flex-shrink: 0;
  display: inline-flex;
  align-items: center;
}
.ticket-visibility-toggle-wrap {
  margin-top: 20px;
  display: flex;
  align-items: center;
  justify-content: flex-end;
  flex-wrap: wrap;
  gap: 10px;
}
.ticket-visibility-toggle-form {
  margin: 0;
  display: inline-flex;
  align-items: center;
  gap: 8px;
}
.ticket-visibility-toggle-btn {
  width: 30px;
  height: 30px;
}
.ticket-visibility-toggle-label {
  font-size: 0.92rem;
  color: #94a3b8;
}
.bacheca-pending-label {
  color: #fbbf24;
  font-weight: 600;
  font-size: 0.85rem;
}
.bacheca-pinned-alert {
  color: #fbbf24 !important;
  font-weight: 600 !important;
}
/*
 * Checkbox + testo in grid2: .grid2 > * { min-width: 0 } comprime i flex annidati;
 * NON usare min-width:0 sul testo o va a capo lettera per lettera.
 */
.bacheca-new-form .bacheca-publish-option--single {
  flex-direction: row !important;
  flex-wrap: nowrap !important;
  align-items: flex-start !important;
  width: 100% !important;
  max-width: 100% !important;
}
.bacheca-new-form .bacheca-publish-option--single input[type="checkbox"] {
  width: auto !important;
  max-width: none !important;
  flex: 0 0 auto;
  margin-top: 4px;
}
.bacheca-publish-option-label {
  flex: 1 1 auto;
  /* evita collasso a larghezza ~0 del flex item (causa wrap per carattere) */
  min-width: 12em;
  display: block;
  word-break: normal;
  overflow-wrap: break-word;
  white-space: normal;
  line-height: 1.4;
}
.bacheca-publish-option--single .bacheca-publish-option-label {
  white-space: normal;
}
.bacheca-publish-option--single span {
  /* legacy: se manca la classe label */
  word-break: normal;
  overflow-wrap: break-word;
  min-width: 12em;
}

.bacheca-hidden {
  display: none !important;
}

.bacheca-item-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 10px;
  align-items: center;
}

/* Pulsanti Modifica dati / Modifica anagrafica: stesse dimensioni e allineati */
.anagrafica-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  align-items: stretch;
  justify-content: flex-end;
  margin-top: 8px;
}
.anagrafica-actions > a.button,
.anagrafica-actions > #anagrafica-edit-btn,
.anagrafica-actions > button.button.anagrafica-action-btn {
  flex: 1 1 0;
  min-width: 180px;
  max-width: 260px;
  box-sizing: border-box;
  text-align: center;
}
.anagrafica-actions #anagrafica-save-cancel {
  display: inline-flex;
  gap: 8px;
}
.anagrafica-actions #anagrafica-save-cancel button {
  min-width: 0;
}
@media (max-width: 480px) {
  .anagrafica-actions {
    flex-direction: column;
    align-items: stretch;
  }
  .anagrafica-actions > a.button,
  .anagrafica-actions > #anagrafica-edit-btn,
  .anagrafica-actions > button.button.anagrafica-action-btn {
    min-width: 0;
    max-width: none;
    width: 100%;
  }
}

/* A simple wrapper for responsive tables.  When a table is wrapped
   inside ``.table-responsive`` it will scroll horizontally on small
   screens instead of compressing columns. */
.table-responsive {
  width: 100%;
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
}
.table-responsive table {
  width: 100%;
  min-width: 600px;
}

/* Lavori: toggle vista tabella/card (mobile) + card flip */
.tickets-list-toolbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  flex-wrap: wrap;
  margin: 10px 0 12px;
}
.entity-list-quickfilter {
  flex: 1 1 220px;
  min-width: 0;
  margin-bottom: 0 !important;
}
.tickets-view-toggle {
  display: none;
  align-items: stretch;
  padding: 3px;
  border-radius: 12px;
  background: rgba(31, 41, 55, 0.85);
  border: 1px solid rgba(148, 163, 184, 0.2);
}
.tickets-view-toggle-btn {
  border: none;
  background: transparent;
  color: #94a3b8;
  font-size: 13px;
  font-weight: 600;
  padding: 8px 14px;
  border-radius: 9px;
  cursor: pointer;
  transition: background-color 0.15s ease, color 0.15s ease;
}
.tickets-view-toggle-btn.is-active {
  background: rgba(56, 189, 248, 0.18);
  color: #e0f2fe;
}
.tickets-visible-count {
  margin-left: auto;
}
.tickets-view-panel--cards {
  display: none;
}
.tickets-cards-grid {
  display: flex;
  flex-direction: column;
  gap: 12px;
}
.tickets-cards-empty {
  margin: 8px 0;
}
.ticket-flip-card {
  perspective: 1100px;
}
.ticket-flip-card-inner {
  position: relative;
  min-height: 148px;
  transform-style: preserve-3d;
  transition: transform 0.55s cubic-bezier(0.4, 0.2, 0.2, 1);
}
.ticket-flip-card.is-flipped .ticket-flip-card-inner {
  transform: rotateY(180deg);
}
.ticket-flip-face {
  position: relative;
  border-radius: 16px;
  border: 1px solid rgba(148, 163, 184, 0.18);
  background: linear-gradient(155deg, rgba(30, 41, 59, 0.95), rgba(17, 24, 39, 0.92));
  box-shadow: 0 10px 28px rgba(0, 0, 0, 0.28);
  backface-visibility: hidden;
  -webkit-backface-visibility: hidden;
}
.ticket-flip-face--front {
  display: flex;
  flex-direction: column;
  min-height: 148px;
  padding: 14px 14px 12px;
  cursor: pointer;
}
.ticket-flip-face--back {
  position: absolute;
  inset: 0;
  transform: rotateY(180deg);
  display: flex;
  flex-direction: column;
  padding: 12px 14px 10px;
  cursor: pointer;
  overflow: hidden;
}
.ticket-card-top {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 10px;
  margin-bottom: 8px;
}
.ticket-card-code-slot,
.ticket-card-condo-slot {
  min-width: 0;
  max-width: 46%;
}
.ticket-card-code {
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0.03em;
  color: #7dd3fc;
}
.ticket-card-condo {
  display: block;
  font-size: 11px;
  color: #94a3b8;
  text-align: right;
  line-height: 1.3;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.ticket-card-link {
  text-decoration: none;
}
.ticket-card-link:hover,
.ticket-card-link:focus-visible {
  text-decoration: underline;
}
a.ticket-card-condo.ticket-card-link {
  text-decoration: underline;
  text-underline-offset: 2px;
  color: #93c5fd;
}
.ticket-card-title {
  margin: 0;
  flex: 1;
  display: flex;
  align-items: center;
  justify-content: center;
  text-align: center;
  font-size: 16px;
  line-height: 1.35;
  font-weight: 700;
  color: #f8fafc;
  padding: 4px 2px 10px;
}
.ticket-card-created {
  align-self: flex-end;
  font-size: 11px;
  color: #64748b;
}
.ticket-card-back-body {
  flex: 1;
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
  padding-right: 2px;
  position: relative;
}
.ticket-card-back-scroll-hint {
  display: none;
  position: sticky;
  bottom: 0;
  left: 0;
  right: 0;
  margin-top: 6px;
  padding: 10px 4px 2px;
  text-align: center;
  font-size: 10px;
  line-height: 1.2;
  color: #94a3b8;
  pointer-events: none;
  background: linear-gradient(to bottom, rgba(17, 24, 39, 0), rgba(17, 24, 39, 0.92) 55%);
}
.ticket-card-back-body--has-more .ticket-card-back-scroll-hint {
  display: block;
}
.ticket-card-back-body--interacting .ticket-card-back-scroll-hint {
  display: none !important;
}
.ticket-card-open-link {
  display: inline-block;
  margin-bottom: 8px;
  font-weight: 700;
  font-size: 13px;
}
.ticket-card-back-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 8px 10px;
  margin-top: 6px;
}
.ticket-card-back-field--wide {
  grid-column: 1 / -1;
}
.ticket-card-back-label {
  display: block;
  font-size: 10px;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  color: #64748b;
  margin-bottom: 2px;
}
.ticket-card-back-value {
  font-size: 13px;
  color: #e5e7eb;
  line-height: 1.35;
  word-break: break-word;
}
.ticket-card-desc {
  margin: 2px 0 0;
  font-size: 12px;
  line-height: 1.45;
  color: #cbd5e1;
}
.ticket-card-desc-hint {
  display: block;
  margin-top: 4px;
  font-size: 11px;
}
.ticket-card-back-hint {
  margin: 8px 0 0;
  font-size: 10px;
  text-align: center;
  flex-shrink: 0;
}

@media (max-width: 768px) {
  #tickets-filters-card .filter-form-actions {
    width: 100%;
  }
  .tickets-view-toggle {
    display: inline-flex;
  }
  .tickets-list-root--view-table .tickets-view-panel--cards {
    display: none !important;
  }
  .tickets-list-root--view-cards .tickets-view-panel--table {
    display: none !important;
  }
  .tickets-list-root--view-cards .tickets-view-panel--cards {
    display: block;
  }
}

@media (min-width: 769px) {
  .tickets-view-toggle {
    display: none !important;
  }
  .tickets-view-panel--cards {
    display: none !important;
  }
  .tickets-list-root--view-cards .tickets-view-panel--table,
  .tickets-list-root--view-table .tickets-view-panel--table {
    display: block;
  }
}

/* Searchable select styling: a small search box above a select to filter options */
.searchable-select { margin-bottom: 12px; }
.searchable-select { position: relative; }
.searchable-select .search-input {
  margin-bottom: 6px;
  width: 100%;
  padding: 8px;
  border-radius: 8px;
  border: 1px solid #334155;
  background: #0b1220;
  color: #e5e7eb;
}
/* The underlying select is positioned absolutely so that it appears as a dropdown
   below the input when revealed via JavaScript. */
.searchable-select select {
  position: absolute;
  top: 100%;
  left: 0;
  width: 100%;
  max-height: 200px;
  overflow-y: auto;
  border: 1px solid #334155;
  border-radius: 8px;
  background: #0b1220;
  z-index: 1000;
  /* Initially hidden; the script toggles display */
}

/* Style action buttons inline in admin tables */
.actions {
  display: flex;
  gap: 4px;
  align-items: center;
}
.actions a, .actions button {
  padding: 4px 8px;
  font-size: 0.8rem;
}
.actions form {
  margin: 0;
}

/* Drop‑down menu for actions. Instead of three separate buttons per row,
   use a compact "Azioni" button that toggles a menu. The menu appears
   below the button and contains links and form buttons. */
.actions-menu {
  position: relative;
  display: inline-block;
}
.actions-menu button {
  padding: 4px 8px;
  font-size: 0.8rem;
  border: 1px solid #334155;
  border-radius: 8px;
  background: #1f2937;
  color: #e5e7eb;
  cursor: pointer;
}
.actions-menu button:hover {
  border-color: #475569;
}
.actions-menu .menu {
  display: none;
  position: absolute;
  right: 0;
  top: 100%;
  min-width: 120px;
  background: #0b1220;
  border: 1px solid #334155;
  border-radius: 8px;
  z-index: 1000;
  box-shadow: 0 4px 8px rgba(0,0,0,0.4);
}
.actions-menu .menu a,
.actions-menu .menu button {
  display: block;
  width: 100%;
  padding: 6px 8px;
  font-size: 0.8rem;
  color: #e5e7eb;
  text-align: left;
  border: none;
  background: none;
  cursor: pointer;
}
.actions-menu .menu a:hover,
.actions-menu .menu button:hover {
  background: #1f2937;
}
.actions-menu .menu form {
  margin: 0;
}
/* Tendina Azioni: sfondo sempre coerente col tema scuro (evita bianco) */
.card .actions-menu .menu,
.actions-menu .menu {
  background: #0b1220 !important;
  color: #e5e7eb;
  border: 1px solid #334155;
}
.card .actions-menu .menu a,
.card .actions-menu .menu button,
.actions-menu .menu a,
.actions-menu .menu button {
  color: #e5e7eb !important;
  background: transparent !important;
}
.card .actions-menu .menu a:hover,
.card .actions-menu .menu button:hover,
.actions-menu .menu a:hover,
.actions-menu .menu button:hover {
  background: #1f2937 !important;
  color: #e5e7eb !important;
}
.card .actions-menu .menu .muted,
.actions-menu .menu .muted {
  color: #94a3b8 !important;
}

/* === Sinistri: riga dettaglio espansa e icona toggle === */
.sinistro-detail-cell {
  background: #1e293b !important;
  color: #e2e8f0;
  padding: 12px 16px;
  border-bottom: 1px solid #334155;
  font-size: 14px;
  line-height: 1.45;
  -webkit-text-size-adjust: 100%;
  text-size-adjust: 100%;
}
/* Non usare .sinistro-detail-row sui figli: coincide con la classe della <tr> espansa */
#condo-sinistri-body td.sinistro-detail-cell .sinistro-detail-dl {
  margin: 0;
  display: grid;
  grid-template-columns: auto 1fr;
  gap: 4px 16px;
  align-items: baseline;
  max-width: 720px;
}
#condo-sinistri-body td.sinistro-detail-cell .sinistro-detail-dl dt {
  margin: 0;
  padding: 0;
  font-size: 13px;
  font-weight: 600;
  color: #94a3b8;
  text-align: left;
  white-space: nowrap;
}
#condo-sinistri-body td.sinistro-detail-cell .sinistro-detail-dl dd {
  margin: 0;
  padding: 0;
  font-size: 14px;
  font-weight: 400;
  color: #e2e8f0;
  text-align: left;
  line-height: 1.45;
  word-break: break-word;
  overflow-wrap: anywhere;
}
#condo-sinistri-body td.sinistro-detail-cell .sinistro-detail-dl dd a {
  font-size: 14px;
  font-weight: 500;
}
.sinistro-toggle { width: 28px; text-align: center; }
.sinistro-chevron {
  font-size: 0.9rem;
  font-weight: 300;
  color: #94a3b8;
  user-select: none;
}
.sinistro-desc-col {
  text-align: justify;
  min-width: 160px;
}
#condo-sinistri-body .sinistro-desc-col button {
  white-space: normal;
  word-break: break-word;
  line-height: 1.35;
}
@media (max-width: 768px) {
  #condo-sinistri-body .table-responsive {
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
  }
  #condo-sinistri-body .table {
    min-width: 720px;
  }
  #condo-sinistri-body .sinistro-desc-col {
    min-width: 42vw;
    max-width: 52vw;
  }
}

/* === Dark scrollbars + no nested table scrollbars === */
/* Global (Firefox) */
html, body, * { scrollbar-width: thin; scrollbar-color: #334155 #0b1220; }
/* Global (WebKit) */
::-webkit-scrollbar { width: 10px; height: 10px; }
::-webkit-scrollbar-track { background: #0b1220; }
::-webkit-scrollbar-thumb { background: #334155; border-radius: 10px; border: 2px solid #0b1220; }
::-webkit-scrollbar-thumb:hover { background: #475569; }
/* Select lists (best effort; native single-select dropdowns may be OS-styled) */
select { scrollbar-width: thin; scrollbar-color: #334155 #0b1220; }
select::-webkit-scrollbar { width: 10px; }
select::-webkit-scrollbar-track { background: #0b1220; }
select::-webkit-scrollbar-thumb { background: #334155; border-radius: 8px; border: 2px solid #0b1220; }
/* Avoid vertical scrollbar inside table wrapper when opening 'Azioni' */
.table-responsive { overflow-y: visible !important; }
.actions-menu { position: relative; }
.actions-menu .menu { position: absolute; z-index: 2000; }

/* --- Anagrafica condominio: tabella larga a due colonne --- */
.condo-anagrafica-card .condo-anagrafica-table {
  font-size: 1rem;
}
.condo-anagrafica-card .condo-anagrafica-table th,
.condo-anagrafica-card .condo-anagrafica-table td {
  font-size: inherit;
}
.condo-anagrafica-table th {
  width: 18%;
  white-space: normal;
  word-break: break-word;
  overflow-wrap: anywhere;
  vertical-align: top;
  font-weight: 600;
  line-height: 1.35;
  padding-right: 10px;
}
.condo-anagrafica-table td {
  width: 32%;
  min-width: 0;
}
/* Celle anagrafica: testo troncato; clic per espandere e vedere il testo completo */
.condo-anagrafica-table .anagrafica-cell {
  cursor: pointer;
  max-width: 100%;
}
.condo-anagrafica-table .anagrafica-value {
  display: block;
  max-width: 100%;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  vertical-align: bottom;
}
.condo-anagrafica-table .anagrafica-edit {
  display: none;
  width: 100%;
  max-width: 100%;
  box-sizing: border-box;
  font-size: inherit;
}
.condo-anagrafica-card.is-anagrafica-editing .anagrafica-edit {
  display: block;
}
.condo-anagrafica-card.is-anagrafica-editing .anagrafica-cell {
  overflow: visible;
  white-space: normal;
}
.condo-anagrafica-table .anagrafica-cell.expanded .anagrafica-value {
  max-width: none;
  white-space: pre-wrap;
  word-break: break-word;
  overflow: visible;
  text-overflow: clip;
}
.condo-anagrafica-table .anagrafica-link {
  text-decoration: underline;
}
@media (min-width: 769px) and (max-width: 900px) {
  .condo-anagrafica-table tr {
    display: block;
    margin-bottom: 8px;
  }
  .condo-anagrafica-table th,
  .condo-anagrafica-table td {
    display: block;
    width: 100%;
  }
}

/* --- Tag @menzioni nei commenti (solo sottolineatura, coerente col tema) --- */
.tag-highlight {
  background-color: transparent;
  color: inherit;
  padding: 0;
  border-radius: 0;
  font-weight: inherit;
  border: none;
  text-decoration: underline;
  text-underline-offset: 2px;
  text-decoration-color: var(--muted, #94a3b8);
}

/* --- Tag notifications styling (allineate ai commenti interni, testo bianco) --- */
.notif-tag {
  border-left: 4px solid #4b5563;
  background-color: transparent;
}

.notif-tag .desc a,
.notif-tag .desc a:link,
.notif-tag .desc a:visited,
.notif-tag .desc a:hover,
.notif-tag .desc a:active {
  color: #ffffff;
  font-weight: normal;
}

.notif-tag .desc a .tag-prefix {
  font-weight: 600;
}

/* --- Hotfix: disattiva evidenziazione bordo sui campi "Cerca al volo" --- */
.toolbar .input:focus {
  outline: none;
  box-shadow: none;
  border-color: #334155;
}

/* --- Autocomplete @admin nei commenti interni (tema scuro) --- */
.internal-comment-tag-suggestions {
  position: fixed;
  z-index: 10050;
  min-width: 220px;
  max-height: 200px;
  overflow-y: auto;
  display: none;
  background: var(--card, #111827);
  color: var(--text, #e5e7eb);
  border: 1px solid #334155;
  border-radius: 8px;
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.45);
}
.internal-comment-tag-suggestions [role="option"] {
  padding: 8px 12px;
  cursor: pointer;
  border-bottom: 1px solid #1f2937;
  color: var(--text, #e5e7eb);
  font-size: 0.95rem;
}
.internal-comment-tag-suggestions [role="option"]:last-child {
  border-bottom: none;
}
.internal-comment-tag-suggestions [role="option"]:hover,
.internal-comment-tag-suggestions [role="option"]:focus {
  background: #1e293b;
}

/* --- Modal allegati ticket: righe coerenti col tema scuro --- */
#ticket-upload-modal.modal-allegati .ticket-upload-row,
#ticket-upload-modal .ticket-upload-row {
  background: var(--bg, #0f172a);
  border: 1px solid #334155;
  color: var(--text, #e5e7eb);
}
#ticket-upload-modal .ticket-upload-row label {
  color: var(--muted, #94a3b8);
}
#ticket-upload-modal .ticket-upload-row input[type="text"] {
  background: var(--card, #111827);
  color: var(--text, #e5e7eb);
  border: 1px solid #475569;
  border-radius: 8px;
  padding: 8px 10px;
}
#ticket-upload-modal .ticket-upload-row input[type="text"]::placeholder {
  color: #64748b;
}
#ticket-upload-modal .ticket-upload-row input[type="file"] {
  color: var(--muted, #94a3b8);
  color-scheme: dark;
  max-width: 100%;
}
#ticket-upload-modal .modal-panel {
  color-scheme: dark;
}

/* --- Pulsante Modifica in basso a destra nella card Dettagli --- */
.ticket-details-modifica-row {
  margin-top: 1.25rem;
  display: flex;
  justify-content: flex-end;
  align-items: center;
}

/* Modal modifica dettagli: come allegati — parte più in basso, sotto topbar/header */
#ticket-details-edit-modal.overlay-modal {
  align-items: flex-start;
  justify-content: center;
  padding: 104px 16px 24px 16px;
}

/* --- Modal modifica dettagli ticket (coerente tema scuro) --- */
.ticket-details-edit-modal-panel {
  max-width: 560px;
  max-height: min(90vh, 900px);
  overflow-y: auto;
  color-scheme: dark;
}
#ticket-details-edit-modal .ticket-details-edit-modal-panel label {
  display: block;
  margin-top: 10px;
  margin-bottom: 4px;
  font-size: 0.9rem;
  color: var(--muted, #94a3b8);
}
#ticket-details-edit-modal .ticket-details-edit-modal-panel label:first-of-type {
  margin-top: 0;
}
#ticket-details-edit-modal .ticket-details-edit-modal-panel input[type="text"],
#ticket-details-edit-modal .ticket-details-edit-modal-panel input[type="email"],
#ticket-details-edit-modal .ticket-details-edit-modal-panel textarea {
  width: 100%;
  box-sizing: border-box;
  background: var(--bg, #0f172a);
  color: var(--text, #e5e7eb);
  border: 1px solid #475569;
  border-radius: 8px;
  padding: 8px 10px;
}
#ticket-details-edit-modal .ticket-details-edit-modal-panel textarea {
  resize: vertical;
  min-height: 80px;
}
#ticket-details-edit-modal .ticket-details-edit-actions {
  margin-top: 16px;
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

/* Login mobile: solo testo brand azzurro */
@media (max-width: 768px) {
  body.page-login .topbar-brand-slot .brand-logo {
    display: none !important;
  }
  body.page-login .topbar-brand-slot .brand-title {
    display: inline !important;
    color: #38bdf8;
    font-family: 'Montserrat', system-ui, sans-serif;
    font-weight: 700;
    font-size: 1.05rem;
    letter-spacing: 0.02em;
  }
}

/* Hint sopra elenco card (mobile) */
.tickets-cards-hint {
  margin: 0 0 10px 0;
  font-size: 0.9rem;
  text-align: center;
  line-height: 1.4;
}
.tickets-cards-hint[hidden] {
  display: none !important;
}
.tickets-list-root--view-cards .tickets-cards-hint:not([hidden]) {
  display: block;
}

/* Card elenco: niente hover che ruba il tap; flip card isolate */
.card.card--list-host:hover {
  transform: none;
  box-shadow: 0 10px 28px rgba(2, 6, 23, 0.28);
  border-color: rgba(148, 163, 184, 0.22);
}
.card.card--list-host .ticket-flip-card {
  -webkit-tap-highlight-color: transparent;
}
.ticket-card-sub {
  text-align: center;
  width: 100%;
}
/* Alias flip inner (admin entity lists) */
.ticket-flip-inner {
  position: relative;
  min-height: 148px;
  transform-style: preserve-3d;
  transition: transform 0.55s cubic-bezier(0.4, 0.2, 0.2, 1);
}
.ticket-flip-card.is-flipped .ticket-flip-inner {
  transform: rotateY(180deg);
}

/* Bottom nav: pill assoluta, allineata al tab attivo (solo transform animato) */
.mobile-bottom-bar.mobile-dock {
  isolation: isolate;
}
.mobile-dock-pill.active-pill,
.mobile-dock-pill {
  position: absolute;
  left: 0;
  top: 6px;
  bottom: 6px;
  width: var(--dock-pill-w, 48px);
  border-radius: 9999px;
  background: rgba(255, 255, 255, 0.2);
  border: 1px solid rgba(255, 255, 255, 0.22);
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.3),
    0 4px 18px rgba(15, 23, 42, 0.2);
  backdrop-filter: blur(16px) saturate(1.35);
  -webkit-backdrop-filter: blur(16px) saturate(1.35);
  transform: translate3d(var(--dock-pill-x, 0px), 0, 0);
  transition: transform 280ms cubic-bezier(0.22, 1, 0.36, 1);
  opacity: 0;
  pointer-events: none;
  z-index: 0;
  box-sizing: border-box;
}
.mobile-bottom-bar.mobile-dock a.mobile-bottom-link {
  position: relative;
  z-index: 2;
  background: transparent !important;
  box-shadow: none !important;
}
.mobile-bottom-bar.mobile-dock a.mobile-bottom-link--active {
  background: transparent !important;
  box-shadow: none !important;
}
.mobile-bottom-bar.mobile-dock .bottom-label {
  white-space: nowrap;
  overflow: visible;
  text-overflow: clip;
  max-width: none;
  padding: 0 2px;
  box-sizing: border-box;
}

/* Card retro: statistiche in colonna + azioni in basso a destra */
.entity-card-back-footer {
  display: flex;
  justify-content: flex-end;
  align-items: center;
  flex-shrink: 0;
  gap: 6px;
  margin-top: auto;
  padding-top: 8px;
  min-height: 36px;
}
.entity-card-back-footer .table-row-icon-actions,
.entity-card-back-footer .ticket-card-back-actions {
  margin: 0;
}
.entity-card-stat-list,
.entity-card-stat-col {
  display: flex;
  flex-direction: column;
  gap: 7px;
  margin: 0;
  padding: 0;
  list-style: none;
}
.entity-card-stat-columns {
  display: flex;
  align-items: stretch;
  gap: 10px;
  width: 100%;
}
.entity-card-stat-col {
  flex: 1;
  min-width: 0;
}
.entity-card-stat-divider {
  width: 1px;
  flex-shrink: 0;
  align-self: stretch;
  background: rgba(148, 163, 184, 0.35);
  margin: 2px 0;
}
.entity-card-stat-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(92px, 48%);
  gap: 6px 10px;
  align-items: baseline;
}
.entity-card-stat-label {
  font-weight: 400;
  color: #94a3b8;
  font-size: 12px;
  line-height: 1.35;
}
.entity-card-stat-value {
  font-weight: 400;
  color: #e2e8f0;
  font-size: 13px;
  text-align: right;
  display: block;
  font-variant-numeric: tabular-nums;
  line-height: 1.35;
  white-space: normal;
  overflow-wrap: anywhere;
  word-break: break-word;
  max-width: 100%;
}
/* Swipe azioni su flip-card (mobile): pannello dietro la card */
.flip-card-swipe-wrapper {
  position: relative;
  overflow: hidden;
  border-radius: 16px;
  --swipe-w: 96px;
}
.flip-card-swipe-actions {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  width: var(--swipe-w);
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: center;
  gap: 10px;
  padding: 0 10px;
  box-sizing: border-box;
  background: rgba(15, 23, 42, 0.98);
  border-left: 1px solid rgba(148, 163, 184, 0.22);
  z-index: 0;
}
.flip-card-swipe-wrapper > .ticket-flip-card {
  position: relative;
  z-index: 1;
  transition: transform 0.22s ease;
}
.flip-card-swipe-wrapper.is-swiped > .ticket-flip-card {
  transform: translateX(calc(-1 * var(--swipe-w)));
}
@media (min-width: 769px) {
  html:not(.cap-native) .flip-card-swipe-wrapper > .ticket-flip-card {
    transform: none !important;
  }
  html:not(.cap-native) .flip-card-swipe-actions {
    display: none;
  }
}

/* Card utenti (elenco admin) */
.user-card-front {
  display: flex;
  flex-direction: column;
  min-height: 148px;
  padding: 14px 14px 12px;
}
.user-card-front-top {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 8px;
  margin-bottom: 10px;
}
.user-card-role {
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: #7dd3fc;
  max-width: 48%;
  line-height: 1.3;
}
.user-card-phone {
  font-size: 12px;
  color: #cbd5e1;
  text-align: right;
  max-width: 48%;
  line-height: 1.3;
  font-variant-numeric: tabular-nums;
}
.user-card-name {
  flex: 1;
  display: flex;
  align-items: center;
  justify-content: center;
  text-align: center;
  font-size: 1.05rem;
  font-weight: 700;
  color: #f1f5f9;
  line-height: 1.25;
  padding: 4px 6px;
  overflow-wrap: anywhere;
  word-break: break-word;
}
.user-card-entity {
  margin-top: auto;
  text-align: center;
  font-size: 12px;
  line-height: 1.35;
  color: #94a3b8;
  padding-top: 8px;
  overflow: hidden;
  text-overflow: ellipsis;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
}
.swipe-hint-text {
  display: none;
}
@media (max-width: 768px) {
  html:not(.cap-native) .swipe-hint-text {
    display: inline;
  }
}
html.cap-native .swipe-hint-text {
  display: inline;
}

.entity-card-status-value {
  display: inline-block;
  max-width: 100%;
  white-space: normal;
  overflow-wrap: anywhere;
  word-break: break-word;
}
.entity-card-stat-em {
  font-style: normal;
  text-decoration: underline;
  text-underline-offset: 2px;
}
.fornitore-card-front-top {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 8px;
  width: 100%;
  margin-bottom: 6px;
  min-height: 1.2em;
}
.fornitore-card-front-email,
.fornitore-card-front-phone {
  font-size: 10px;
  line-height: 1.3;
  max-width: 48%;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  color: #94a3b8;
}
.fornitore-card-front-email {
  text-align: left;
}
.fornitore-card-front-phone {
  text-align: right;
}
.fornitore-card-front-email a,
.fornitore-card-front-phone a {
  color: #93c5fd;
  text-decoration: underline;
  text-underline-offset: 2px;
}
.entity-card-email-list {
  margin: 0;
  padding: 0;
  list-style: none;
  text-align: right;
}
.entity-card-email-list li + li {
  margin-top: 4px;
}
.scadenza-card-back-row {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 8px 10px;
  margin-top: 8px;
}
.scadenza-card-back-row-label {
  font-weight: 400;
  color: #94a3b8;
  font-size: 12px;
  flex: 0 0 auto;
}
.scadenza-card-back-row .scadenza-cal-link {
  margin-left: auto;
}
.scadenza-card-back-note {
  margin: 0 0 8px;
  font-size: 12px;
  line-height: 1.45;
  color: #cbd5e1;
  white-space: pre-wrap;
  word-break: break-word;
}
.scadenza-card-front-top {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 8px;
  width: 100%;
  margin-bottom: 6px;
}
.scadenza-card-front-condo {
  font-size: 11px;
  color: #94a3b8;
  text-align: left;
  line-height: 1.3;
  max-width: 48%;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.scadenza-card-front-status {
  font-size: 11px;
  text-align: right;
  max-width: 48%;
}
.scadenza-card-front-amount {
  font-size: 15px;
  font-weight: 700;
  color: #e2e8f0;
  text-align: center;
  margin-top: 4px;
}
.scadenza-card-front-title {
  text-align: center;
  margin: 6px 0 4px;
}
@media (max-width: 768px) {
  .scadenze-elenco-root.tickets-list-root--view-cards .scadenze-elenco-table-panel {
    display: block !important;
    margin: 0;
    padding: 0;
    border: none;
  }
  .scadenze-elenco-root.tickets-list-root--view-cards .scadenze-elenco-table-panel .table-scadenze {
    margin: 0;
    border: none;
  }
  .scadenze-elenco-root.tickets-list-root--view-cards .table-scadenze thead {
    display: none;
  }
  .scadenze-elenco-root.tickets-list-root--view-cards .scadenza-rata-row,
  .scadenze-elenco-root.tickets-list-root--view-cards .scadenza-custom-main,
  .scadenze-elenco-root.tickets-list-root--view-cards .scadenza-custom-detail-row,
  .scadenze-elenco-root.tickets-list-root--view-cards .entity-table-row {
    display: none;
  }
  .scadenze-elenco-root.tickets-list-root--view-cards .scadenze-elenco-table-panel .table-responsive {
    margin: 0;
    border: none;
  }
  .scadenze-elenco-root.tickets-list-root--view-cards .tickets-view-panel--cards {
    display: block;
    margin-bottom: 8px;
  }
}
.condo-anagrafica-hint {
  margin: 0 0 10px 0;
  font-size: 0.88rem;
  text-align: center;
}

/* Impostazioni: righe assegnazione compiti responsive */
.assignee-rows-wrap {
  display: flex;
  flex-direction: column;
  gap: 10px;
  min-width: 0;
}
.assignee-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) auto;
  gap: 8px;
  align-items: end;
  min-width: 0;
}
.assignee-row label,
.assignee-row select {
  min-width: 0;
  max-width: 100%;
}
.assignee-row select {
  width: 100%;
  box-sizing: border-box;
}
.assignee-form-actions {
  margin-top: 12px;
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
}
.settings-section-divider {
  margin: 20px 0;
  border: none;
  border-top: 1px solid rgba(148, 163, 184, 0.25);
}
@media (max-width: 640px) {
  .assignee-row {
    grid-template-columns: 1fr;
  }
  .assignee-row .button-secondary {
    width: 100%;
  }
}

/* Tabella fornitori: email lunghe, espandibili al click */
.cell-email-truncate {
  max-width: 220px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  cursor: pointer;
}
.cell-email-truncate--expanded {
  max-width: none;
  white-space: normal;
  word-break: break-word;
  overflow: visible;
  text-overflow: clip;
}

@media (max-width: 768px) {
  #admin-users-filter-form.grid2 > div,
  #admin-users-create-body form.grid2 > div {
    grid-column: span 2 !important;
  }
  .admin-users-filter-footer {
    grid-column: span 2 !important;
    flex-wrap: wrap;
    justify-content: flex-end;
  }
  .contract-keep-section > div,
  .supplier-contract-keep-section > div {
    grid-column: span 2 !important;
  }
  #condo-sinistri-body td.sinistro-detail-cell {
    font-size: 14px !important;
  }
  #condo-sinistri-body td.sinistro-detail-cell .sinistro-detail-dl {
    display: block;
    max-width: none;
  }
  #condo-sinistri-body td.sinistro-detail-cell .sinistro-detail-dl dt {
    display: block;
    font-size: 12px !important;
    font-weight: 600 !important;
    margin: 10px 0 2px 0;
  }
  #condo-sinistri-body td.sinistro-detail-cell .sinistro-detail-dl dt:first-child {
    margin-top: 0;
  }
  #condo-sinistri-body td.sinistro-detail-cell .sinistro-detail-dl dd {
    display: block;
    font-size: 14px !important;
    font-weight: 400 !important;
    line-height: 1.45 !important;
    margin: 0 0 8px 0;
    text-align: left !important;
  }
  #condo-sinistri-body td.sinistro-detail-cell .sinistro-detail-dl dd a {
    font-size: 14px !important;
    font-weight: 500 !important;
  }
  .scadenze-elenco-root.tickets-list-root--view-cards .ticket-flip-card.is-flipped .ticket-flip-card-inner {
    max-height: min(52vh, 240px);
  }
  .profile-field-stack {
    grid-column: span 2 !important;
  }
}
.contact-card-intro {
  text-align: justify;
  line-height: 1.5;
}
.bacheca-section-intro {
  text-align: justify;
}
.form-actions-right {
  display: flex;
  justify-content: flex-end;
  margin-top: 8px;
}

/* Anagrafica condominio: tronca + espandi al click, senza scroll orizzontale */
.condo-anagrafica-card {
  overflow-x: hidden;
  max-width: 100%;
}
.condo-anagrafica-card .table-responsive {
  overflow-x: hidden;
  max-width: 100%;
}
.condo-anagrafica-table {
  width: 100%;
  table-layout: fixed;
}

/* App Capacitor iOS/Android: topbar sticky + no overscroll (bounce disabilitato nativamente) */
html.cap-native,
html.cap-native body {
  overscroll-behavior-y: none;
  background: #0b1220;
}
html.cap-native {
  --cap-topbar-offset: calc(56px + env(safe-area-inset-top, 0px));
}
html.cap-native .topbar {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  z-index: 9100;
}
html.cap-native body {
  padding-top: var(--cap-topbar-offset);
}
html.cap-native.amm-preview-open,
html.cap-native.amm-preview-open body {
  overflow: hidden;
}