/* ── API Guide ───────────────────────────────────────────────────────────────── */

/* .form-alert--warning → definita in crud.css */

/* Note generali */
.api-notes p {
    font-size: 14px;
    line-height: 1.7;
    color: var(--testo);
    margin: 0 0 10px;
}

.api-notes p:last-child { margin-bottom: 0; }

.text-danger { color: var(--rosso); }

/* ── Accordion metodi ────────────────────────────────────────────────────────── */

.api-accordion {
    border-top: 1px solid var(--bordo);
}

.api-item {
    border-bottom: 1px solid var(--bordo);
}

.api-item-head {
    width: 100%;
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 12px 20px;
    background: var(--bianco);
    border: none;
    cursor: pointer;
    text-align: left;
    transition: background var(--trans);
    font-family: var(--font);
    font-size: 13px;
}

.api-item-head:hover {
    background: var(--sfondo);
}

.api-item-head[aria-expanded="true"] {
    background: var(--blu-chiaro);
}

.api-item-url {
    color: var(--testo-sec);
    font-size: 12px;
}

.api-item-title {
    flex: 1;
    color: var(--testo);
    font-weight: 500;
}

.api-chevron {
    color: var(--testo-sec);
    font-size: 14px;
    transition: transform var(--trans);
    margin-left: auto;
    flex-shrink: 0;
}

.api-item-head[aria-expanded="true"] .api-chevron {
    transform: rotate(180deg);
}

.api-item-body {
    padding: 20px;
    background: var(--sfondo);
    border-top: 1px solid var(--bordo);
    display: flex;
    flex-direction: column;
    gap: 16px;
}

/* Badge metodo HTTP */
.api-badge {
    display: inline-block;
    padding: 2px 8px;
    border-radius: 3px;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: .04em;
    flex-shrink: 0;
    font-family: monospace;
}

.api-badge--post   { background: #2563eb22; color: #2563eb; border: 1px solid #2563eb55; }
.api-badge--get    { background: #16a34a22; color: #16a34a; border: 1px solid #16a34a55; }
.api-badge--put    { background: #d9770622; color: #d97706; border: 1px solid #d9770655; }
.api-badge--delete { background: #dc262622; color: #dc2626; border: 1px solid #dc262655; }

/* Meta row */
.api-meta-row {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 8px;
    font-size: 13px;
    padding: 10px 14px;
    background: var(--bianco);
    border: 1px solid var(--bordo);
    border-radius: var(--radius);
}

.api-meta-label {
    color: var(--testo-sec);
    font-size: 11px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: .05em;
}

.api-meta-url {
    color: var(--blu);
    font-size: 12px;
}

/* Sezione label */
.api-section-label {
    font-size: 12px;
    font-weight: 700;
    color: var(--blu-scuro);
    text-transform: uppercase;
    letter-spacing: .05em;
    padding-bottom: 6px;
    border-bottom: 1px dashed var(--bordo);
    display: flex;
    align-items: center;
    gap: 6px;
}

.api-section-label--success { color: var(--verde, #16a34a); }
.api-section-label--error   { color: var(--rosso); }

/* Descrizione */
.api-description {
    font-size: 13px;
    line-height: 1.65;
    color: var(--testo);
}

.api-description p { margin: 0 0 8px; }
.api-description p:last-child { margin-bottom: 0; }

/* Parametri grid */
.api-params-grid {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    gap: 12px;
}

@media (max-width: 900px) {
    .api-params-grid { grid-template-columns: 1fr; }
}

.api-params-head {
    font-size: 11px;
    font-weight: 700;
    color: var(--testo-sec);
    margin-bottom: 4px;
    text-transform: uppercase;
    letter-spacing: .04em;
}

/* Pre code */
.api-pre {
    background: #1e1e2e;
    color: #cdd6f4;
    border-radius: var(--radius);
    padding: 12px 14px;
    font-size: 12px;
    font-family: 'Fira Code', 'Consolas', monospace;
    line-height: 1.6;
    overflow-x: auto;
    margin: 0;
    white-space: pre-wrap;
    word-break: break-word;
}

.api-pre strong { color: #89b4fa; }
.api-pre small  { color: #a6e3a1; font-style: italic; }

.api-copy-bar {
    padding: 0.5rem 1rem;
    text-align: right;
    border-bottom: 1px solid #e5e7eb;
}

.api-pre--params  { background: #1e1e2e; }
.api-pre--success { background: #0d1f0d; color: #a6e3a1; }
.api-pre--error   { background: #1f0d0d; color: #f38ba8; }
.api-pre--console { background: #1e1e2e; min-height: 80px; }
.api-pre--response {
    background: #1e1e2e;
    min-height: 300px;
    height: 100%;
}

/* Code badge risposta */
.api-code-badge {
    display: inline-block;
    padding: 2px 8px;
    border-radius: 3px;
    font-size: 12px;
    font-weight: 700;
    font-family: monospace;
}

.api-code-badge--ok  { background: #16a34a22; color: #16a34a; border: 1px solid #16a34a55; }
.api-code-badge--err { background: #dc262622; color: #dc2626; border: 1px solid #dc262655; }

/* Risultati grid */
.api-results-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 16px;
}

@media (max-width: 700px) {
    .api-results-grid { grid-template-columns: 1fr; }
}

/* ── Console test ─────────────────────────────────────────────────────────────── */

.api-console-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 20px;
    align-items: start;
}

@media (max-width: 900px) {
    .api-console-grid { grid-template-columns: 1fr; }
}

.api-console-request .form-card,
.api-console-response .form-card {
    margin-bottom: 0;
}

.api-console-select,
.api-console-input {
    width: 100%;
    padding: 7px 10px;
    border: 1px solid var(--bordo);
    border-radius: var(--radius);
    font-size: 13px;
    font-family: var(--font);
    background: var(--bianco);
    color: var(--testo);
    box-sizing: border-box;
}

.api-console-select:disabled,
.api-console-input:disabled {
    opacity: 0.5;
    cursor: not-allowed;
}

/* Campi extra dinamici (indagineKey, annoKey, ecc.) */
#api-console-extra-fields {
    display: flex;
    flex-direction: column;
    gap: 10px;
    margin-top: 4px;
}

.api-console-field {
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.api-console-field label {
    font-size: 12px;
    font-weight: 600;
    color: var(--testo-leggero, #666);
    text-transform: none;
}

.api-console-json-wrap {
    margin-top: 12px;
}

.api-console-footer {
    position: static;
    box-shadow: none;
    padding: 12px 0 0;
}
