/* ═══ PASSO 2 · CUCINA — il configuratore di Retino (core/cucina-pro.css) dentro RetinoKitchen ═══
   Le regole sotto valgono solo con .kc-embed: Retino resta com'è. Stessa veste del resto
   dell'app: foglio bianco con bordo di 1 px, nessuna ombra, colore solo su selezione e dati. */
:root {
  /* token di Retino usati da cucina-pro.css, riportati sulla tavolozza di RetinoKitchen */
  --bianco: #ffffff; --carta: #f3f3f1; --linea: #e5e6e5; --linea-forte: #cdcecd; --nero: #131416;
  --navy: #131416; --blu: #1b6c80; --blu-ink: #14586a; --blu-pale: #e3eff2; --blu-soft: #cfe3e8;
  --g-400: #a3a5a6; --g-600: #5b5d5e; --g-700: #46484a; --g-850: #232527;
  --ok: #1e7b4f; --ok-line: #b9e5cb; --err: #c4242a; --err-pale: #fdf3f2; --err-line: #f3c3c0;
  --shadow: none; --mono: 'Inter', system-ui, sans-serif;
}
.cuc { position: absolute; inset: 0; }
/* i pulsanti di Retino partono «nudi» (reset globale di app.css): qui il reset vale solo nel configuratore */
:where(.kc) button { font-family: inherit; font-size: inherit; color: inherit; background: none; border: 0; padding: 0; cursor: pointer; white-space: nowrap; }
:where(.kc) select, :where(.kc) input { font-family: inherit; }

.kc.kc-embed {
  z-index: 2; font-family: var(--font); font-size: 13px; line-height: 1.4;
  grid-template-rows: 48px minmax(0, 1fr); grid-template-columns: 284px minmax(0, 1fr) 320px;
  background: var(--surface); border: 1px solid var(--border); border-radius: var(--radius-sheet); overflow: hidden;
}
/* il nome del progetto e il salvataggio li ha già la barra di RetinoKitchen; i colori hanno il loro passo */
.kc-embed .kc-title, .kc-embed .kc-actions, .kc-embed [data-rt="fin"] { display: none !important; }
.kc-embed .kc-head { justify-content: space-between; padding: 0 12px; background: var(--surface); border-bottom: 1px solid var(--rule); }
.kc-embed .kc-views { margin-left: 0; background: var(--raised); border-color: var(--border); }
.kc-embed .kc-views button { font-size: 13px; font-weight: 500; color: var(--muted); }
.kc-embed .kc-views button.on { color: var(--text); font-weight: 600; box-shadow: 0 0 0 1px var(--border); }
.kc-embed .kc-tg { height: 30px; padding: 0 10px; border-color: var(--control); color: var(--muted); font-size: 13px; font-weight: 500; }
.kc-embed .kc-tg.on { color: var(--text); background: var(--active); border-color: var(--active); }
.kc-embed .kc-icb { color: var(--muted); }
.kc-embed .kc-icb:hover { background: var(--active); color: var(--text); }

.kc-embed .kc-left, .kc-embed .kc-right { background: var(--surface); }
.kc-embed .kc-left { border-right-color: var(--rule); }
.kc-embed .kc-right { border-left-color: var(--rule); }
.kc-embed .kc-tabs { border-bottom-color: var(--rule); }
.kc-embed .kc-tabs button { font-size: 13px; font-weight: 500; color: var(--muted); padding: 12px 4px 11px; }
.kc-embed .kc-tabs button.on { color: var(--text); font-weight: 600; border-bottom-color: var(--text); }
.kc-embed .kc-scroll { padding: 4px 16px 20px; }
.kc-embed .kc-sec { border-bottom-color: var(--rule); padding: 14px 0; }
.kc-embed .kc-sec h4 { text-transform: none; letter-spacing: 0; font-size: 12px; font-weight: 500; color: var(--muted); margin-bottom: 10px; }
.kc-embed .kc-sec h4 em { display: none; }
.kc-embed .kc-p, .kc-embed .kc-note, .kc-embed .kc-empty { color: var(--muted); font-size: 13px; }
.kc-embed .kc-warn { color: var(--pill-warning-ink); background: var(--pill-warning-bg); border-color: #fde68a; font-size: 12px; }

.kc-embed .kc-btn { height: 32px; padding: 0 12px; border-color: var(--control); color: var(--text); font-size: 13px; font-weight: 600; }
.kc-embed .kc-btn:hover { background: var(--raised); border-color: var(--control); }
.kc-embed .kc-btn.primary { background: var(--primary); border-color: var(--primary); color: #fff; }
.kc-embed .kc-btn.primary:hover { background: #000; }
.kc-embed .kc-btn.danger { color: var(--negative); border-color: var(--control); }
.kc-embed .kc-add .kc-btn svg { color: var(--muted); }

.kc-embed .kc-preset { border: 1px solid var(--border); font-size: 12px; font-weight: 500; color: var(--text); }
.kc-embed .kc-preset:hover { border-color: var(--control); }
.kc-embed .kc-preset.on { border-color: var(--text); background: var(--raised); color: var(--text); font-weight: 600; }
.kc-embed .kc-seg button { border-color: var(--border); font-size: 12px; font-weight: 500; color: var(--muted); }
.kc-embed .kc-seg button.on { border-color: var(--text); background: var(--surface); color: var(--text); font-weight: 600; }
.kc-embed .kc-run { border-color: var(--border); }
.kc-embed .kc-run.on { border-color: var(--text); box-shadow: none; }
.kc-embed .kc-run-h span { font-size: 12px; color: var(--muted); }
.kc-embed .kc-cell { font-size: 11px; border-color: var(--g-400); background: var(--surface); color: var(--muted); }
.kc-embed .kc-cell.tall { background: var(--raised); }
.kc-embed .kc-cell.void { background: var(--surface); }
.kc-embed .kc-cell:hover { background: var(--accent-tint); }
.kc-embed .kc-cell.on { background: var(--accent); border-color: var(--accent); color: #fff; }
.kc-embed .kc-tile { border-color: var(--border); }
.kc-embed .kc-tile b { font-size: 12px; font-weight: 600; color: var(--text); }
.kc-embed .kc-tile span { font-size: 12px; color: var(--muted); }
.kc-embed .kc-tile:hover { border-color: var(--control); background: var(--raised); }

.kc-embed .kc-stage { background: var(--well); }
.kc-embed .kc-hint {
  left: 16px; right: 16px; bottom: 14px; transform: none; background: none; color: var(--muted);
  padding: 0; border-radius: 0; font-size: 13px; line-height: 17px; text-align: left;
  white-space: normal; text-overflow: clip;   /* vista stretta: a capo fra le parole, mai troncato */
}
.kc-embed .kc-sum { left: 16px; top: 14px; }
.kc-embed .kc-sum span, .kc-embed .kc-sum button {
  box-shadow: none; border-radius: 4px; height: 24px; padding: 0 8px; display: inline-flex; align-items: center;
  font-size: 12px; font-weight: 500; background: var(--surface); border-color: var(--border); color: var(--text);
}
.kc-embed .kc-sum .ok { color: var(--pill-positive-ink); background: var(--pill-positive-bg); border-color: var(--pill-positive-bg); }
.kc-embed .kc-sum .warn { color: var(--pill-warning-ink); background: var(--pill-warning-bg); border-color: #fde68a; }
.kc-embed .kc-sum .err { color: #831c1e; background: #ffedea; border-color: #ffedea; }

.kc-embed .kc-modhead svg { color: var(--text); }
.kc-embed .kc-modhead span { font-size: 12px; color: var(--muted); }
.kc-embed .kc-f > span:first-child { color: var(--text); font-size: 13px; }
.kc-embed .kc-f select { height: 32px; border-color: var(--control); font-size: 13px; }
.kc-embed .kc-num { height: 32px; border-color: var(--control); }
.kc-embed .kc-num input { font-size: 13px; font-variant-numeric: tabular-nums; }
.kc-embed .kc-num em { font-size: 12px; color: var(--muted); }
.kc-embed .kc-num:focus-within { border-color: var(--accent); box-shadow: none; }
.kc-embed .kc-chips button { border-color: var(--border); font-size: 12px; font-weight: 500; color: var(--text); font-variant-numeric: tabular-nums; }
.kc-embed .kc-chips button.on { background: var(--active); border-color: var(--text); color: var(--text); font-weight: 600; }
.kc-embed .kc-chips button:hover:not(.on) { border-color: var(--control); }
.kc-embed .kc-kv { font-size: 13px; }
.kc-embed .kc-kv span { color: var(--muted); }
.kc-embed .kc-kv b { font-variant-numeric: tabular-nums; }
.kc-embed .kc-nudge span { color: var(--muted); }
.kc-embed .kc-nudge button { border-color: var(--border); font-size: 12px; font-weight: 500; }
.kc-embed .kc-nudge button:hover { border-color: var(--control); color: var(--text); }
.kc-embed .kc-sw button { border-color: var(--border); font-size: 12px; }
.kc-embed .kc-sw button.on { border-color: var(--text); box-shadow: none; }
.kc-embed .kc-sw button i { border-color: rgba(19, 20, 22, .16); }
/* controlli: un punto di stato al posto del cerchio con il simbolo */
.kc-embed .kc-chk { border-bottom: 1px solid var(--rule); font-size: 13px; }
.kc-embed .kc-chk em { width: 8px; height: 8px; margin-top: 6px; font-size: 0; }
.kc-embed .kc-chk.err em { background: var(--negative); }
.kc-embed .kc-chk.warn em { background: #b45309; }
.kc-embed .kc-chk.info em { background: var(--muted); }
.kc-embed .kc-chk.ok em { background: var(--positive); }
.kc-embed .kc-bom { font-size: 13px; }
.kc-embed .kc-bom th { text-transform: none; letter-spacing: 0; font-size: 12px; font-weight: 500; color: var(--muted); border-bottom-color: var(--border); }
.kc-embed .kc-bom td { border-bottom-color: var(--rule); }
.kc-embed .kc-bom td:nth-child(2), .kc-embed .kc-bom td:nth-child(3) { font-variant-numeric: tabular-nums; }

@media (max-width: 1200px) { .kc.kc-embed { grid-template-columns: 250px minmax(0, 1fr) 286px; } }
@media (max-width: 900px) { .kc.kc-embed { grid-template-columns: 210px minmax(0, 1fr) 240px; } .kc-embed .kc-tabs button { font-size: 12px; } .kc-embed .kc-tg { padding: 0 8px; } }