body {
  font-family: Arial, sans-serif;
  margin: 1.2rem;
  font-size: .88rem;
  color: #222;
}
a { color:#0d6efd; text-decoration:none; }

/* Pagina di login */
body.login-body {
  background:#f2f2f2;
  display:flex;
  justify-content:center;
  align-items:center;
  height:100vh;
  margin:0;
}
.box { background:white; padding:2rem 3rem; border-radius:8px; box-shadow:0 2px 8px rgba(0,0,0,.1); width:280px; }
.box h1 { font-size:1.2rem; margin-bottom:1.5rem; }
.box input { display:block; width:100%; padding:.5rem; margin-bottom:1rem; box-sizing:border-box; }
.box button { width:100%; padding:.6rem; background:#0d6efd; color:white; border:none; border-radius:4px; cursor:pointer; }
.error { color:#c00; font-size:.9rem; }

/* Struttura comune */
.page-wide { max-width:1100px; }
.topbar { margin-bottom:.6rem; }
h1 { margin:.2rem 0 .1rem; font-size:1.3rem; }
ul { line-height:2; }

.badge { display:inline-block; padding:.05rem .4rem; border-radius:3px; font-size:.75rem; margin-right:.3rem; }
.badge-info { background:#e7f1ff; color:#0d6efd; }

section { margin-top:.9rem; }
section h2 { font-size:.95rem; border-bottom:1px solid #ddd; padding-bottom:.15rem; margin-bottom:.5rem; }

.grid { display:grid; grid-template-columns:repeat(4, 1fr); gap:.4rem .8rem; }
.grid label { display:block; font-size:.75rem; color:#666; margin-bottom:.1rem; }
.grid input, .grid select, .grid textarea { width:100%; padding:.3rem; box-sizing:border-box; font-size:.85rem; }
.span4 { grid-column: span 4; }
.span2 { grid-column: span 2; }

button.save { margin-top:.7rem; padding:.45rem 1rem; background:#0d6efd; color:white; border:none; border-radius:4px; cursor:pointer; }

.saved-msg { background:#e6f7e6; color:#256029; padding:.35rem .8rem; border-radius:4px; margin-bottom:.6rem; display:inline-block; font-size:.85rem; }

/* Tabelle */
.table-wrap { overflow-x:auto; }
table { border-collapse:collapse; width:100%; margin-top:.5rem; }
th, td { border-bottom:1px solid #ddd; padding:.3rem .5rem; text-align:left; font-size:.8rem; vertical-align:top; }
th { background:#f5f5f5; }

table.fixed { table-layout:fixed; }
table.fixed th, table.fixed td { word-wrap:break-word; }
.col-narrow { width:9%; white-space:nowrap; }
.col-date { width:7%; }
.col-app { width:11%; }
.col-cat { width:8%; }
.col-text { width:15%; }
.col-stato { width:8%; }
.col-prezzo { width:6%; text-align:right; }

/* Ricerca ed elenco */
.search { margin-bottom:.6rem; }
.search input[type=text] { padding:.35rem; width:250px; }
.search button { padding:.35rem .8rem; }
.pager { margin-top:.8rem; }
.pager a { margin-right:1rem; }

.warning-box { background:#fff8e1; border:1px solid #ffe082; padding:.6rem .9rem; border-radius:4px; margin-bottom:.8rem; font-size:.85rem; }
.warning-box ul { margin:.4rem 0 0; padding-left:1.2rem; }

.btn-row { display:flex; gap:.6rem; align-items:center; }
button.cancel-link { margin-top:.7rem; padding:.45rem 1rem; background:#eee; color:#333; border:1px solid #ccc; border-radius:4px; text-decoration:none; display:inline-block; }

.tbl-input { width:100%; padding:.15rem .25rem; font-size:.75rem; box-sizing:border-box; }
.tbl-select { width:100%; font-size:.75rem; }
.btn-mini { padding:.15rem .5rem; font-size:.7rem; background:#0d6efd; color:white; border:none; border-radius:3px; cursor:pointer; }
.col-cliente { width:12%; }
.col-note { width:22%; }
.col-giorni { width:5%; }
.col-difetto { width:16%; }

.col-check { width:4%; text-align:center; }
.tbl-textarea { width:100%; font-size:.75rem; padding:.15rem .25rem; box-sizing:border-box; resize:vertical; }

.row-pronto { background:#e6f7e6; }
.row-non-pronto { background:#fdeaea; }
.row-pronto.row-critico { background:#8fd98f !important; }
.row-non-pronto.row-critico { background:#f5a3a3 !important; }

.col-cat-app { width:19%; }

.col-difetto { width:30%; }

section label { display:block; font-size:.8rem; color:#555; margin-bottom:.15rem; }

.tabs { margin: 1rem 0; border-bottom: 2px solid #ddd; }
.tab-btn { background: none; border: none; padding: .5rem 1rem; cursor: pointer; font-size: .95rem; color: #555; border-bottom: 3px solid transparent; }
.tab-btn.active { color: #1a1a1a; font-weight: bold; border-bottom-color: #2c5aa0; }
.tab-panel { display: none; }
.tab-panel.active { display: block; }

.col-date { white-space: nowrap; }

.nav-menu { margin: 1rem 0; }
.nav-menu a {
  display: inline-block;
  padding: .5rem 1rem;
  margin: 0 .5rem .5rem 0;
  background: #2c5aa0;
  color: #fff;
  text-decoration: none;
  border-radius: 4px;
  font-size: .9rem;
}
.nav-menu a:hover { background: #1e3f75; }

@media (max-width: 600px) {
  .portale-table, .portale-table tbody, .portale-table tr, .portale-table td {
    display: block;
    width: 100%;
  }
  .portale-table .portale-thead {
    display: none;
  }
  .portale-table tr {
    margin-bottom: 1rem;
    border: 1px solid #ddd;
    border-radius: 6px;
    padding: .6rem .8rem;
  }
  .portale-table td {
    border: none;
    padding: .35rem 0;
    text-align: left;
    font-size: 1rem;
  }
  .portale-table td::before {
    content: attr(data-label);
    display: block;
    font-weight: bold;
    font-size: .78rem;
    color: #555;
    margin-bottom: .1rem;
  }
}