/* Diagnostica di rete — adattamento mobile / tablet */

/* Tablet */
@media (max-width:1024px){
  .dash-grid{grid-template-columns:1fr}
  .content{padding:20px 16px}
}

/* Tablet stretto e telefono */
@media (max-width:820px){
  .topbar{padding:10px 14px;flex-wrap:wrap;gap:10px}
  .brand{gap:12px}
  .logo-fer{height:34px}
  .brand-text{padding-left:10px}
  .brand-main{font-size:17px}
  .brand-sub{font-size:10px}
  .login{flex-wrap:wrap;justify-content:flex-end}
  .login input{width:104px}

  /* menu orizzontale: scorrevole, non si spezza in modo caotico */
  .hnav{flex-wrap:nowrap;overflow-x:auto;-webkit-overflow-scrolling:touch;padding:0 8px}
  .hnav .nav-item{flex:0 0 auto;padding:12px 14px;font-size:13px}

  /* tabelle larghe: scroll orizzontale invece di sfondare la pagina */
  .content table{display:block;overflow-x:auto;-webkit-overflow-scrolling:touch;white-space:nowrap}
  .content table th,.content table td{padding:8px 10px;font-size:12px}

  .stats-row{gap:8px}
  .stat{flex:1 1 44%;min-width:0;padding:12px 14px}
  .stat .num{font-size:24px}
  .stat.wide{min-width:0}

  .form-grid{grid-template-columns:1fr;gap:0}
  .detail-grid{grid-template-columns:1fr;gap:12px}
  .toolbar{flex-direction:column;align-items:stretch}
  .search{width:100%;min-width:0}
  .upload-row{align-items:stretch}
  .upload-row input,.upload-row select{width:100%}
  .bar-row{grid-template-columns:96px 1fr 36px;gap:6px;font-size:12px}
  .cover{margin:0 -16px}
  .cover img{max-height:56vh}
  .toast{left:12px;right:12px;bottom:12px}
  .allegato{flex-wrap:wrap}
  .kv{gap:2px}

  /* aree tocco piu comode */
  .btn{padding:12px 16px}
  .btn.small{padding:9px 12px}
  .link{padding:6px 2px}
}

/* Telefono stretto */
@media (max-width:480px){
  .brand-sub{display:none}
  .brand-main{font-size:15px}
  .logo-fer{height:28px}
  .content{padding:14px 12px}
  .stat{flex:1 1 100%}
  h2{font-size:17px}
  .kv{flex-direction:column}
  .kv-v{text-align:left}
}