/* ─────────────────────────────────────────────────────────────────────────────
   (#362) Impostazioni → Skill & Tool → Tool personalizzati — drawer di modifica.

   Il guscio (scrim, animazione, testata, corpo, piede, focus trap) sta in
   drawer.css ed è lo stesso delle skill. Qui solo ciò che è dei tool SQL.

   Struttura: light canonico, override dark ADDITIVI in coda. Prefisso .cst-.
   ───────────────────────────────────────────────────────────────────────────── */

/* Larghezza DEDICATA, non ereditata dalle skill: la modale che questo drawer
   sostituisce era di 900px, e il form ha una SQL multi-riga più un array JSON di
   parametri. Coi 760px delle skill (markdown a colonna singola) l'editing della
   query peggiorerebbe rispetto a prima — il contrario di quel che si voleva.
   Il minimo di 720px tiene la coppia Nome/Categoria su una riga sola. */
.cst-drawer { --cw-drawer-w: clamp(720px, 62vw, 1180px); }

/* Le due textarea di codice: stessa resa della SQL nell'editor, altezze diverse
   perché la query è il campo su cui si lavora e i parametri si rileggono. */
.cst-code {
    font-family: ui-monospace, Menlo, monospace;
    font-size: .8rem;
    line-height: 1.5;
    tab-size: 2;
}

/* La SQL prende l'altezza residua invece di `rows="10"`: su un drawer alto una
   textarea fissa lascia mezzo schermo vuoto e la query scorre lo stesso. */
.cst-sql-wrap { flex: 1 1 auto; display: flex; flex-direction: column; min-height: 200px; }
.cst-sql-wrap > textarea { flex: 1 1 auto; resize: none; }

/* Riga selezionata nell'elenco: col drawer aperto la lista resta visibile, e senza
   evidenza non si sa quale dei tool si sta modificando. */
.cw-provider-item.is-selected { box-shadow: inset 3px 0 0 #4c8dff; background: #eef4ff; }

@media (max-width: 900px) {
    .cst-toolbar-actions { margin-left: 0 !important; width: 100%; }
}

/* ── Dark mode: solo gli scostamenti ───────────────────────────────────────── */
body.dark-mode .cst-code { background: #0f1419; color: #e6edf3; border-color: #2a3645; }
body.dark-mode .cw-provider-item.is-selected { background: #223049; }

/* ── (#362) Schema KB: dettaglio tabella nello stesso drawer ──────────────────
   Larghezza sua: il dettaglio è a DUE colonne (descrizione + tabella colonne con
   5 campi), e sotto i 900px la griglia collassa a una colonna sola rendendo la
   lettura più lunga di quanto era nell'accordion. */
.schema-drawer { --cw-drawer-w: clamp(860px, 70vw, 1320px); }
.schema-drawer .cw-schema-detail-grid { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.15fr); gap: 1.2rem; }
.schema-drawer .cw-schema-cols { max-height: none; }   /* lo scroll è del drawer, non del riquadro */

.cw-schema-open { cursor: pointer; }
.cw-schema-open:hover { text-decoration: underline; }
.cw-schema-open:focus-visible { outline: 2px solid #4c8dff; outline-offset: 2px; border-radius: 3px; }
.cw-schema-item.is-selected { box-shadow: inset 3px 0 0 #4c8dff; background: #eef4ff; }

@media (max-width: 1100px) {
    .schema-drawer .cw-schema-detail-grid { grid-template-columns: minmax(0, 1fr); }
}

body.dark-mode .cw-schema-item.is-selected { background: #223049; }