/* HACCP Suite - app.css v7 (contrasto alto, topbar scura) */

*{box-sizing:border-box}

body.wrap{
  margin:0;
  background:#eef2ff; /* sfondo chiaro violaceo per vedere SUBITO il cambio */
  color:#0f172a;
  font:16px/1.4 system-ui,-apple-system,"Segoe UI",Roboto,Ubuntu,sans-serif;
}

a{color:#0a1f44;text-decoration:none}

/* Topbar molto visibile */
.topbar{
  display:flex;align-items:center;gap:12px;
  padding:10px 16px;
  border-bottom:1px solid #0a1f44;
  background:#0a1f44;
  position:sticky;top:0;z-index:5;
}
.topbar h1,.topbar a{color:#ffffff}
.logo{width:28px;height:28px;filter:brightness(0) invert(1)}
.topnav{margin-left:auto;display:flex;gap:8px;align-items:center}

/* Griglia */
.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:12px;padding:16px}

/* Card molto contrastate */
.card{
  background:#ffffff;
  border:2px solid #1e293b;        /* bordo scuro */
  border-radius:12px;
  padding:16px;
  box-shadow:0 6px 18px rgba(0,0,0,.12);
}
.card.action{display:block;transition:transform .06s ease,box-shadow .06s ease,border-color .06s ease}
.card.action:hover{transform:translateY(-2px);box-shadow:0 10px 24px rgba(0,0,0,.18);border-color:#0a1f44}
.card h3{margin:0 0 8px;color:#0a1f44;font-weight:700}
.card p{margin:0;color:#334155}

.content{padding:16px}
.role,.foot,.hint{color:#334155;font-size:14px}

label{display:block;margin:10px 0}

input,select,textarea{
  width:100%;padding:10px;border:2px solid #1e293b;border-radius:10px;background:#fff;color:#0f172a
}
input:focus,select:focus,textarea:focus{outline:3px solid #2563eb;outline-offset:2px}

/* Bottoni */
.btn{
  display:inline-block;padding:10px 14px;border-radius:10px;
  background:#0a1f44;color:#fff;border:2px solid #0a1f44;font-weight:700
}
.btn:hover{filter:brightness(.92)}
.btn:focus{outline:3px solid #2563eb;outline-offset:2px}
.btn.ghost{background:#fff;color:#0a1f44;border:2px solid #0a1f44}
.btn.ghost:hover{background:#e2e8f0}

/* Tabelle */
.table{
  width:100%;border-collapse:collapse;background:#fff;border:2px solid #1e293b;border-radius:10px;overflow:hidden
}
.table th{background:#e2e8f0;color:#0f172a;font-weight:700}
.table th,.table td{border-bottom:1px solid #94a3b8;padding:10px;text-align:left}

/* Messaggi stato */
.error{background:#fee2e2;border:2px solid #b91c1c;color:#7f1d1d;padding:10px;border-radius:10px}
.ok{background:#dcfce7;border:2px solid #15803d;color:#14532d;padding:10px;border-radius:10px}

/* Footer */
.foot{padding:12px 16px}

/* Mobile */
@media (max-width:640px){.grid{grid-template-columns:1fr}}