/* ============================================================
   CUCINA.CSS — sereni-cucina
   Stile derivato da sereni-kds (kds.css), tema "kitchen".
   Token e componenti (login keypad, card, top-bar, action-grid)
   riusati per continuità visiva con l'app cuoco esistente.
   ============================================================ */

:root {
  --primary: #E67E22;
  --primary-light: #F39C12;
  --primary-dark: #D35400;
  --secondary: #27AE60;
  --secondary-dark: #219a52;
  --blue: #4A90D9;
  --red: #E74C3C;
  --yellow: #F1C40F;
  --teal: #1ABC9C;
  --purple: #9B59B6;
  --bg: #F8F9FA;
  --bg-white: #FFFFFF;
  --text-dark: #2C3E50;
  --text-secondary: #7F8C8D;
  --text-muted: #95A5A6;
  --border: rgba(0, 0, 0, 0.08);
  /* Campi input: DEVONO staccare dalla card bianca. Con il solo --border (8% di nero)
     un input bianco su card bianca era praticamente invisibile: sfondo appena tinto +
     bordo definito + anello arancio al focus. */
  --field-bg: #F1F3F5;
  --field-border: rgba(0, 0, 0, 0.22);
  --field-ring: rgba(230, 126, 34, 0.20);
  --shadow-sm: 0 2px 8px rgba(0, 0, 0, 0.06);
  --shadow-md: 0 4px 16px rgba(0, 0, 0, 0.1);
  --radius: 16px;
  --radius-sm: 12px;
  --font-main: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif;
  --font-display: 'Space Grotesk', sans-serif;
  --transition: 0.2s ease-out;
}

*, *::before, *::after { margin: 0; padding: 0; box-sizing: border-box; }
html { height: 100%; -webkit-text-size-adjust: 100%; }
body {
  font-family: var(--font-main);
  font-size: 17px;
  line-height: 1.5;
  background: var(--bg);
  color: var(--text-dark);
  min-height: 100%;
  -webkit-font-smoothing: antialiased;
  -webkit-tap-highlight-color: transparent;
}
a { text-decoration: none; color: inherit; }
button { cursor: pointer; border: none; background: none; font-family: var(--font-main); }
input, textarea, select { font-family: var(--font-main); font-size: 1rem; }

/* ---- Campi input: aspetto unico per tutti i registri ----
   Le regole per-classe (.temp-input, .txt, .mag-field input, ...) restano e specificano
   dimensioni/tipografia; qui si stabilisce che un campo si VEDE. Il login resta scuro:
   le sue regole (.staff-code-input-wrap input) hanno specificità maggiore e vincono. */
input[type="text"], input[type="number"], input[type="date"], input[type="time"],
input[type="search"], input[type="tel"], input[type="email"], select, textarea {
  background: var(--field-bg);
  border: 1px solid var(--field-border);
  color: var(--text-dark);
}
input::placeholder, textarea::placeholder { color: var(--text-muted); opacity: 1; }
input:focus, select:focus, textarea:focus {
  /* Mai l'outline blu di default del browser: anello sul tema cucina. */
  outline: none;
  border-color: var(--primary);
  background: var(--bg-white);
  box-shadow: 0 0 0 3px var(--field-ring);
}
img { max-width: 100%; }

/* ---- Top bar ---- */
.top-bar {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 12px 20px;
  background: var(--bg-white);
  border-bottom: 1px solid var(--border);
  position: sticky;
  top: 0;
  z-index: 100;
  min-height: 60px;
}
.top-bar-logo { width: 36px; height: 36px; border-radius: 10px; object-fit: contain; flex: 0 0 auto; }
.top-bar-left { display: flex; flex-direction: column; gap: 1px; flex: 1; min-width: 0; }
.top-bar-greeting { font-family: var(--font-display); font-size: 1rem; font-weight: 700; color: var(--text-dark); }
.top-bar-sub { font-size: 0.8rem; color: var(--text-secondary); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.top-bar-right { display: flex; align-items: center; gap: 8px; }

.icon-btn {
  min-width: 44px; height: 44px; padding: 0 12px;
  border-radius: 12px;
  display: inline-flex; align-items: center; justify-content: center; gap: 6px;
  background: var(--bg); border: 1px solid var(--border);
  color: var(--text-dark); font-size: 0.9rem; font-weight: 600;
  transition: var(--transition);
}
.icon-btn:active { transform: scale(0.95); }

/* ---- Content ---- */
.wrap { max-width: 720px; margin: 0 auto; padding: 16px 16px 40px; }
.section-title {
  font-family: var(--font-display);
  font-size: 0.95rem; font-weight: 700; color: var(--text-dark);
  margin: 4px 4px 12px; display: flex; align-items: center; gap: 8px;
}

.card { background: var(--bg-white); border-radius: var(--radius); border: 1px solid var(--border); box-shadow: var(--shadow-sm); overflow: hidden; }
.card-body { padding: 16px; }

/* Struttura banner */
.struct-banner {
  background: linear-gradient(135deg, #FFF7ED 0%, #FFFFFF 60%);
  border: 1px solid var(--border);
  border-left: 4px solid var(--primary);
  border-radius: var(--radius);
  padding: 16px;
  margin-bottom: 20px;
  box-shadow: var(--shadow-sm);
}
.struct-banner .lbl { font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.05em; color: var(--text-muted); }
.struct-banner .name { font-family: var(--font-display); font-size: 1.25rem; font-weight: 700; color: var(--text-dark); }
.struct-banner .name .code { color: var(--text-secondary); font-weight: 500; font-size: 0.95rem; }
.struct-banner .op { font-size: 0.85rem; color: var(--text-secondary); margin-top: 6px; display: flex; align-items: center; gap: 6px; }

/* ---- Avvisi importanti in home (raccolti dai moduli via manifest) ---- */
.home-alerts { display: flex; flex-direction: column; gap: 10px; margin-bottom: 18px; }
.home-alert {
  display: flex; align-items: center; gap: 12px;
  background: var(--bg-white); border: 1px solid var(--border);
  border-left: 4px solid var(--text-muted);
  border-radius: 14px; padding: 12px 14px; min-height: 60px;
  box-shadow: var(--shadow-sm); transition: transform var(--transition);
}
.home-alert:active { transform: scale(0.995); }
.home-alert .ha-icon {
  flex: 0 0 auto; width: 38px; height: 38px; border-radius: 11px;
  display: flex; align-items: center; justify-content: center; font-size: 1rem;
}
.home-alert .ha-body { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 2px; }
.home-alert .ha-title { font-family: var(--font-display); font-weight: 700; font-size: 0.95rem; color: var(--text-dark); }
.home-alert .ha-detail { font-size: 0.8rem; color: var(--text-secondary); }
.home-alert .ha-arrow { flex: 0 0 auto; color: var(--text-muted); font-size: 0.8rem; }

/* Gravita': scaduto = non conformita', non promemoria. */
.home-alert.lv-critical { border-left-color: var(--red); background: rgba(231,76,60,0.045); }
.home-alert.lv-critical .ha-icon { background: rgba(231,76,60,0.14); color: #C0392B; }
.home-alert.lv-critical .ha-title { color: #C0392B; }
.home-alert.lv-warning { border-left-color: var(--yellow); }
.home-alert.lv-warning .ha-icon { background: rgba(241,196,15,0.18); color: #B7791F; }
.home-alert.lv-info { border-left-color: var(--blue); }
.home-alert.lv-info .ha-icon { background: rgba(74,144,217,0.14); color: #2C6FA8; }

/* ---- Action grid (moduli) ---- */
.action-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
@media (max-width: 380px) { .action-grid { grid-template-columns: 1fr; } }
.action-card {
  border-radius: 20px; min-height: 120px; padding: 20px 14px;
  display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 12px;
  position: relative; overflow: hidden; text-decoration: none;
  background: linear-gradient(135deg, var(--primary), var(--primary-dark));
  box-shadow: 0 4px 0 var(--primary-dark), 0 6px 14px rgba(0,0,0,0.12);
  transition: transform var(--transition), box-shadow var(--transition);
}
.action-card.c-teal   { background: linear-gradient(135deg, var(--teal), var(--teal-dark, #17A589));   box-shadow: 0 4px 0 #17A589, 0 6px 14px rgba(0,0,0,0.12); }
.action-card.c-blue   { background: linear-gradient(135deg, var(--blue), var(--blue-dark, #2980B9));   box-shadow: 0 4px 0 #2980B9, 0 6px 14px rgba(0,0,0,0.12); }
.action-card.c-green  { background: linear-gradient(135deg, var(--secondary), var(--secondary-dark));  box-shadow: 0 4px 0 var(--secondary-dark), 0 6px 14px rgba(0,0,0,0.12); }
.action-card.c-purple { background: linear-gradient(135deg, var(--purple), #7D3C98);                   box-shadow: 0 4px 0 #7D3C98, 0 6px 14px rgba(0,0,0,0.12); }
.action-card::before {
  content: ''; position: absolute; top: 0; left: 0; right: 0; height: 55%;
  background: linear-gradient(180deg, rgba(255,255,255,0.35) 0%, rgba(255,255,255,0.06) 100%);
  border-radius: 20px 20px 0 0; pointer-events: none;
}
.action-card:active { transform: translateY(3px); }
.action-card-icon { width: 52px; height: 52px; background: rgba(255,255,255,0.22); border-radius: 50%; display: flex; align-items: center; justify-content: center; font-size: 1.4rem; color: #fff; }
.action-card-label { font-family: var(--font-display); font-size: 0.95rem; font-weight: 700; color: #fff; text-align: center; text-shadow: 0 1px 2px rgba(0,0,0,0.2); }

/* Empty state */
.empty {
  background: var(--bg-white); border: 1px dashed rgba(0,0,0,0.12); border-radius: var(--radius);
  padding: 32px 20px; text-align: center; color: var(--text-secondary);
}
.empty .em-icon { font-size: 2rem; color: var(--primary); opacity: 0.6; margin-bottom: 10px; }
.empty .em-title { font-family: var(--font-display); font-weight: 700; color: var(--text-dark); margin-bottom: 4px; }
.empty .em-sub { font-size: 0.9rem; }

/* ============================================================
   LOGIN (tema kitchen dark, keypad) — da kds.css
   ============================================================ */
.login-page { min-height: 100vh; background: #0D1117; display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 16px; position: relative; }
.login-page::before { content: ''; position: absolute; width: 400px; height: 400px; border-radius: 50%; background: radial-gradient(circle, rgba(230,126,34,0.12) 0%, transparent 70%); top: 50%; left: 50%; transform: translate(-50%, -50%); pointer-events: none; }
.login-card { background: #161B22; border: 1px solid rgba(255,255,255,0.08); border-radius: 20px; width: 100%; max-width: 400px; box-shadow: 0 20px 60px rgba(0,0,0,0.3); position: relative; }
.login-header { padding: 24px 24px 16px; text-align: center; border-bottom: 1px solid rgba(255,255,255,0.08); }
.login-logo { display: flex; align-items: center; justify-content: center; gap: 10px; margin-bottom: 8px; }
.login-logo-icon { width: 44px; height: 44px; background: linear-gradient(135deg, var(--primary), #F39C12); border-radius: 12px; display: flex; align-items: center; justify-content: center; font-size: 1.3rem; color: #fff; overflow: hidden; }
.login-logo-text { font-family: var(--font-display); font-size: 1.2rem; font-weight: 700; color: #fff; }
.login-subtitle { color: #8B949E; font-size: 0.85rem; margin-top: 4px; }
.login-error { margin: 16px 24px 0; padding: 10px 14px; background: rgba(231,76,60,0.15); border: 1px solid rgba(231,76,60,0.3); border-radius: 10px; color: #ff6b6b; font-size: 0.85rem; display: flex; align-items: center; gap: 8px; }
.staff-code-field { padding: 16px 24px 4px; }
.staff-code-label { display: block; font-size: 0.75rem; color: #8B949E; margin-bottom: 6px; letter-spacing: 0.05em; text-transform: uppercase; }
.staff-code-input-wrap { position: relative; display: flex; align-items: center; }
.staff-code-input-wrap input { width: 100%; background: rgba(255,255,255,0.08); border: 1px solid rgba(255,255,255,0.15); border-radius: 12px; padding: 12px 40px 12px 14px; color: #fff; font-family: var(--font-display); font-size: 1.1rem; font-weight: 600; letter-spacing: 0.05em; outline: none; transition: border-color 0.2s; }
.staff-code-input-wrap input::placeholder { color: rgba(255,255,255,0.25); font-weight: 400; letter-spacing: 0; }
.staff-code-input-wrap input:focus { border-color: var(--primary); }
.staff-code-clear { position: absolute; right: 10px; width: 24px; height: 24px; border-radius: 50%; background: rgba(255,255,255,0.15); border: none; color: rgba(255,255,255,0.6); font-size: 0.75rem; display: flex; align-items: center; justify-content: center; }
.pin-label { padding: 12px 24px 0; font-size: 0.75rem; color: #8B949E; letter-spacing: 0.05em; text-transform: uppercase; }
.pin-display { display: flex; justify-content: center; gap: 10px; padding: 20px 0 8px; }
.pin-dot { width: 16px; height: 16px; border-radius: 50%; border: 2px solid rgba(255,255,255,0.2); background: transparent; transition: all 0.15s ease-out; }
.pin-dot.filled { background: var(--primary); border-color: var(--primary); transform: scale(1.2); }
.pin-dot.error { background: var(--red); border-color: var(--red); }
.pin-dot.success { background: var(--secondary); border-color: var(--secondary); }
.keypad-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px; padding: 16px 24px; }
.keypad-btn { height: 64px; border-radius: 16px; font-family: var(--font-display); font-size: 1.5rem; font-weight: 600; color: #fff; background: rgba(255,255,255,0.08); border: 1px solid rgba(255,255,255,0.1); box-shadow: 0 3px 0 rgba(0,0,0,0.4); transition: transform 0.1s, box-shadow 0.1s; display: flex; align-items: center; justify-content: center; }
.keypad-btn:active { transform: translateY(3px); box-shadow: 0 0 0 rgba(0,0,0,0.4); }
.keypad-btn.key-cancel { background: rgba(231,76,60,0.15); border-color: rgba(231,76,60,0.2); font-size: 0.75rem; }
.keypad-btn.key-backspace { background: rgba(230,126,34,0.15); border-color: rgba(230,126,34,0.2); font-size: 1.2rem; }
.btn-login { width: calc(100% - 48px); margin: 4px 24px 24px; padding: 16px; border-radius: 12px; background: linear-gradient(135deg, var(--primary), var(--primary-dark)); color: #fff; font-family: var(--font-display); font-weight: 700; font-size: 1rem; display: flex; align-items: center; justify-content: center; gap: 8px; box-shadow: 0 4px 0 var(--primary-dark), 0 6px 16px rgba(230,126,34,0.3); transition: transform 0.1s, box-shadow 0.1s; }
.btn-login:active { transform: translateY(4px); box-shadow: 0 0 0 var(--primary-dark); }
.btn-login:disabled { opacity: 0.5; cursor: not-allowed; transform: none; }
@keyframes shake { 0%{transform:translateX(0)} 15%{transform:translateX(-8px)} 35%{transform:translateX(8px)} 55%{transform:translateX(-4px)} 75%{transform:translateX(4px)} 100%{transform:translateX(0)} }
.login-card.shake { animation: shake 0.35s ease-out; }

/* ---- Error page ---- */
.error-page { min-height: 100vh; display: flex; align-items: center; justify-content: center; padding: 20px; background: var(--bg); }
.error-box { background: var(--bg-white); border: 1px solid var(--border); border-radius: var(--radius); box-shadow: var(--shadow-md); padding: 32px 24px; text-align: center; max-width: 460px; width: 100%; }
.error-code { font-family: var(--font-display); font-size: 2.6rem; font-weight: 700; color: var(--primary); }
.error-title { font-family: var(--font-display); font-size: 1.15rem; font-weight: 700; margin: 4px 0 8px; }
.error-msg { color: var(--text-secondary); font-size: 0.95rem; margin-bottom: 20px; }
.error-detail { text-align: left; margin-top: 18px; padding: 12px; background: #0b0b0b08; border-radius: 10px; overflow-x: auto; font-size: 0.72rem; color: var(--text-muted); }
.btn-primary { display: inline-flex; align-items: center; justify-content: center; gap: 8px; min-height: 44px; padding: 12px 22px; border-radius: 12px; background: linear-gradient(135deg, var(--primary), var(--primary-dark)); color: #fff; font-family: var(--font-display); font-weight: 700; box-shadow: 0 4px 0 var(--primary-dark); }
.btn-primary:active { transform: translateY(3px); box-shadow: 0 1px 0 var(--primary-dark); }

/* ---- Registro: lista asset / punti controllo ---- */
.asset-list { display: flex; flex-direction: column; gap: 12px; }
.asset-row { background: var(--bg-white); border: 1px solid var(--border); border-radius: var(--radius); box-shadow: var(--shadow-sm); padding: 14px 16px; }
.asset-head { display: flex; align-items: flex-start; gap: 12px; }
.asset-main { flex: 1; min-width: 0; }
.asset-name { font-family: var(--font-display); font-weight: 700; font-size: 1rem; }
.asset-meta { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 4px; font-size: 0.78rem; color: var(--text-secondary); }
.asset-meta i { opacity: 0.7; }
.asset-last { flex: 0 0 auto; }
.badge { display: inline-flex; align-items: center; gap: 5px; font-size: 0.8rem; font-weight: 700; padding: 5px 10px; border-radius: 999px; white-space: nowrap; }
.badge-ok { background: rgba(39,174,96,0.12); color: var(--secondary-dark); }
.badge-bad { background: rgba(231,76,60,0.12); color: #C0392B; }
.badge-todo { background: rgba(0,0,0,0.05); color: var(--text-muted); font-weight: 600; }
.btn-reg { margin-top: 12px; width: 100%; min-height: 44px; border-radius: 12px; border: 1px dashed rgba(230,126,34,0.5); background: rgba(230,126,34,0.06); color: var(--primary-dark); font-weight: 600; display: inline-flex; align-items: center; justify-content: center; gap: 8px; }
.btn-reg:active { transform: scale(0.99); }
.asset-form { margin-top: 12px; border-top: 1px solid var(--border); padding-top: 12px; }
.temp-input-row { display: flex; gap: 10px; }
.temp-input { flex: 1; min-height: 48px; border: 1px solid var(--field-border); border-radius: 12px; padding: 10px 14px; font-size: 1.2rem; font-family: var(--font-display); font-weight: 600; }
.temp-input:focus { outline: none; border-color: var(--primary); }
.btn-save { flex: 0 0 auto; min-height: 48px; padding: 0 18px; border-radius: 12px; background: linear-gradient(135deg, var(--primary), var(--primary-dark)); color: #fff; font-family: var(--font-display); font-weight: 700; display: inline-flex; align-items: center; gap: 8px; box-shadow: 0 3px 0 var(--primary-dark); }
.btn-save:active { transform: translateY(3px); box-shadow: 0 0 0 var(--primary-dark); }
.btn-save:disabled { opacity: 0.5; }
.corrective { margin-top: 10px; }
.corrective label { display: block; font-size: 0.8rem; color: var(--text-secondary); margin-bottom: 4px; }
.corrective-input { width: 100%; border: 1px solid var(--field-border); border-radius: 10px; padding: 8px 12px; font-size: 0.95rem; resize: vertical; }
.corrective-input:focus { outline: none; border-color: var(--primary); }
.form-err { margin-top: 8px; font-size: 0.82rem; color: #C0392B; background: rgba(231,76,60,0.08); border-radius: 8px; padding: 6px 10px; }
.toast-bad { background: #C0392B; }

/* ---- Registro: Sanificazione ---- */
.sanit-card { background: var(--bg-white); border: 1px solid var(--border); border-radius: var(--radius); box-shadow: var(--shadow-sm); padding: 14px 16px; margin-bottom: 12px; }
.sanit-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; margin-bottom: 10px; }
.sanit-area { font-family: var(--font-display); font-weight: 700; font-size: 1rem; }
.sanit-tmpl { font-size: 0.72rem; color: var(--text-muted); margin-top: 2px; }
.sanit-badge { font-weight: 700; }
.sanit-badge.status-pending { background: rgba(0,0,0,0.05); color: var(--text-muted); }
.sanit-badge.status-in_progress { background: rgba(230,126,34,0.14); color: var(--primary-dark); }
.sanit-badge.status-completed { background: rgba(39,174,96,0.14); color: var(--secondary-dark); }
.sanit-badge.status-missed { background: rgba(231,76,60,0.12); color: #C0392B; }
.sanit-tasks { display: flex; flex-direction: column; gap: 8px; }
.sanit-task { display: flex; align-items: center; gap: 12px; width: 100%; text-align: left; min-height: 48px; padding: 8px 12px; border-radius: 12px; border: 1px solid var(--border); background: var(--bg); transition: var(--transition); }
.sanit-task:active { transform: scale(0.995); }
.sanit-task .tick { font-size: 1.4rem; color: var(--text-muted); flex: 0 0 auto; line-height: 1; }
.sanit-task .tlabel { font-size: 0.92rem; color: var(--text-dark); }
.sanit-task .tlabel em { color: var(--text-muted); font-style: normal; font-size: 0.8rem; }
.sanit-task.done { background: rgba(39,174,96,0.08); border-color: rgba(39,174,96,0.25); }
.sanit-task.done .tick { color: var(--secondary); }
.sanit-task.done .tlabel { color: var(--text-secondary); text-decoration: line-through; }

/* ---- Registro: Checklist ---- */
.chk-confirmed-banner { background: rgba(39,174,96,0.12); color: var(--secondary-dark); border: 1px solid rgba(39,174,96,0.25); border-radius: 12px; padding: 12px 14px; margin-bottom: 16px; font-weight: 600; display: flex; align-items: center; gap: 8px; }
.chk-group { display: flex; flex-direction: column; gap: 10px; margin-bottom: 8px; }
.chk-item { background: var(--bg-white); border: 1px solid var(--border); border-left: 3px solid var(--border); border-radius: var(--radius); box-shadow: var(--shadow-sm); padding: 12px 14px; }
.chk-item.ok { border-left-color: var(--secondary); }
.chk-item.bad { border-left-color: var(--red); }
.chk-item-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 10px; }
.chk-label { font-weight: 600; font-size: 0.95rem; }
.chk-label .req { color: var(--red); }
.chk-comp { flex: 0 0 auto; font-size: 1rem; }
.chk-item.ok .chk-comp { color: var(--secondary); }
.chk-item.bad .chk-comp { color: var(--red); }
.chk-desc { font-size: 0.78rem; color: var(--text-secondary); margin: 4px 0 0; }
.chk-bool { display: flex; gap: 10px; margin-top: 10px; }
.chk-bool-btn { flex: 1; min-height: 46px; border-radius: 12px; border: 1px solid var(--border); background: var(--bg); font-weight: 700; display: inline-flex; align-items: center; justify-content: center; gap: 8px; color: var(--text-secondary); }
.chk-bool-btn.yes.sel { background: rgba(39,174,96,0.14); border-color: var(--secondary); color: var(--secondary-dark); }
.chk-bool-btn.no.sel { background: rgba(231,76,60,0.12); border-color: var(--red); color: #C0392B; }
.chk-num { display: flex; align-items: center; gap: 10px; margin-top: 10px; }
.chk-num-input { flex: 1; min-height: 46px; border: 1px solid var(--field-border); border-radius: 12px; padding: 8px 14px; font-size: 1.1rem; font-family: var(--font-display); font-weight: 600; }
.chk-num-input:focus { outline: none; border-color: var(--primary); }
.chk-unit { color: var(--text-secondary); font-weight: 600; }
.chk-range { font-size: 0.75rem; color: var(--text-muted); background: var(--bg); padding: 3px 8px; border-radius: 8px; }
.chk-text { width: 100%; margin-top: 10px; border: 1px solid var(--field-border); border-radius: 12px; padding: 8px 12px; font-size: 0.95rem; resize: vertical; }
.chk-text:focus { outline: none; border-color: var(--primary); }
.chk-footer { position: fixed; left: 0; right: 0; bottom: 0; padding: 12px 16px calc(12px + env(safe-area-inset-bottom)); background: rgba(248,249,250,0.96); backdrop-filter: blur(6px); border-top: 1px solid var(--border); z-index: 50; }
.chk-footer .btn-login:disabled { opacity: 0.5; }

/* ---- Form generici (cottura, oli) ---- */
.fld { margin-bottom: 12px; }
.fld label { display: block; font-size: 0.82rem; color: var(--text-secondary); margin-bottom: 4px; }
.txt { width: 100%; min-height: 46px; border: 1px solid var(--field-border); border-radius: 12px; padding: 10px 14px; font-size: 1rem; background: var(--field-bg); font-family: inherit; }
.txt:focus { outline: none; border-color: var(--primary); }
textarea.txt { min-height: auto; resize: vertical; }