/*
 * Library Sources — blinded SQL Database (CAI-243) + Saved Queries grid styles.
 * Extracted from clinical-ai-wc.css for readability. The amber ramp is used EXCLUSIVELY for blinded
 * elements (clinical-trial confidential data).
 */

/* ── Blinded service account ─────────────────────────────────────────────── */

.cai-sql-connection-forms {
    --cai-blinded-bg: #faece7;
    --cai-blinded-border: #f0997b;
    --cai-blinded-accent: #993c1d;
    --cai-blinded-text: #712b13;
    display: flex;
    flex-direction: column;
    gap: 1.25rem;
}

.cai-blinded-card {
    background: var(--cai-blinded-bg);
    border: 0.0625rem solid var(--cai-blinded-border);
}

.cai-blinded-card .cai-editor-card-title {
    color: var(--cai-blinded-accent);
}

.cai-blinded-warning,
.cai-blinded-dup-warning {
    border: 0.0625rem solid var(--cai-blinded-border);
    border-radius: 0.375rem;
    background: rgba(255, 255, 255, 0.55);
    color: var(--cai-blinded-text);
    padding: 0.625rem 0.75rem;
    font-size: 0.8125rem;
    line-height: 1.4;
    margin: 0.5rem 0 1rem;
}

.cai-blinded-dup-warning {
    font-weight: 600;
}

.cai-blinded-actions {
    display: flex;
    gap: 0.75rem;
    margin-top: 1rem;
}

.cai-blinded-result {
    margin-top: 1rem;
    display: flex;
    flex-direction: column;
    gap: 0.375rem;
}

.cai-blinded-status {
    font-size: 0.8125rem;
    font-weight: 600;
}

.cai-blinded-status--ok {
    color: var(--teal, #0d9488);
}

.cai-blinded-status--err {
    color: var(--danger, #dc2626);
}

.cai-blinded-matrix-title {
    font-size: 0.6875rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.03em;
    color: var(--cai-blinded-accent);
    margin-top: 0.5rem;
}

.cai-blinded-matrix-row {
    display: grid;
    grid-template-columns: 1fr auto auto;
    gap: 0.75rem;
    align-items: center;
    padding: 0.375rem 0.5rem;
    border-radius: 0.375rem;
    background: rgba(255, 255, 255, 0.55);
    font-size: 0.8125rem;
}

.cai-blinded-matrix-schema {
    font-family: var(--cai-mono, monospace);
    color: var(--cai-blinded-text);
}

.cai-blinded-matrix-account {
    padding: 0.125rem 0.5rem;
    border-radius: 6.1875rem;
    font-size: 0.6875rem;
    font-weight: 600;
}

.cai-blinded-matrix-account--standard {
    background: var(--muted-soft, #f3f4f6);
    color: var(--cai-muted, #6b7280);
}

.cai-blinded-matrix-account--blinded {
    background: var(--cai-blinded-bg);
    color: var(--cai-blinded-accent);
}

.cai-blinded-matrix-verdict {
    font-weight: 600;
}

.cai-blinded-matrix-verdict--ok {
    color: var(--teal, #0d9488);
}

.cai-blinded-matrix-verdict--bad {
    color: var(--danger, #dc2626);
}

/* ── Blinded saved-query row + badge (Saved Queries grid) ─────────────────── */

.cai-sq-blinded-badge {
    display: inline-flex;
    align-items: center;
    gap: 0.25rem;
    padding: 0.0625rem 0.4375rem;
    border-radius: 6.1875rem;
    font-size: 0.625rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.03em;
    background: #faece7;
    color: #993c1d;
}

.cai-sq-sublabel--blinded {
    color: #993c1d;
}

.cai-sq-unblinded-banner {
    border: 0.0625rem solid var(--info, #2563eb);
    border-radius: 0.375rem;
    background: var(--info-soft, #eff6ff);
    color: var(--info, #1e40af);
    padding: 0.625rem 0.75rem;
    font-size: 0.8125rem;
    margin-bottom: 0.75rem;
}

.cai-sq-preview-toggle {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    font-size: 0.8125rem;
}

/* ── Blinded query-editor mode ────────────────────────────────────────────── */

.cai-query-blinded-banner {
    border: 0.0625rem solid #f0997b;
    border-radius: 0.375rem;
    background: #faece7;
    color: #712b13;
    padding: 0.5rem 0.75rem;
    font-size: 0.8125rem;
    margin: 0.5rem 0;
}

.cai-query-status-badge--blinded {
    background: #faece7;
    color: #993c1d;
}

.cai-schema-panel--blinded {
    border-left: 0.1875rem solid #f0997b;
}

.cai-schema-table-badge--blinded {
    padding: 0 0.375rem;
    border-radius: 6.1875rem;
    font-size: 0.5625rem;
    font-weight: 700;
    background: #faece7;
    color: #993c1d;
    text-transform: uppercase;
}

/* ── Pill toggle (reused by "Preview as standard user" and "Blinded query") ── */

.cai-toggle {
    border: 0.0625rem solid var(--cai-rule, #e5e7eb);
    border-radius: 6.1875rem;
    padding: 0.0625rem 0.625rem;
    font-size: 0.6875rem;
    font-weight: 600;
    cursor: pointer;
    background: var(--muted-soft, #f3f4f6);
    color: var(--cai-muted, #6b7280);
}

.cai-toggle--on {
    background: #993c1d;
    color: #fff;
    border-color: #993c1d;
}

/* ── Saved Queries grid + layout ──────────────────────────────────────────── */

.cai-sq-banner-slot {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

.cai-sq-name-line {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
}

.cai-sq-sublabel {
    font-size: 0.6875rem;
    color: var(--cai-muted, #6b7280);
    margin-top: 0.125rem;
}

.cai-sq-preview-toggle-label {
    font-size: 0.8125rem;
    color: var(--cai-muted, #6b7280);
}

.cai-query-blinded-toggle {
    display: inline-flex;
    align-items: center;
    gap: 0.375rem;
    margin-left: 0.75rem;
}

.cai-query-blinded-toggle-label {
    font-size: 0.75rem;
    color: #993c1d;
    font-weight: 600;
    white-space: nowrap;
}

/* EmbeddedGridPanel needs a concrete host height or AG Grid rows collapse to 0. */
.cai-sq-grid-shell {
    height: 32rem;
}

/* Taller rows (80px) so the two-line Query name cell (name + standard/blinded sub-label) isn't clipped. */
.cai-sq-grid {
    --ag-row-height: 5rem;
}

.cai-sq-grid .ag-cell {
    display: flex;
    align-items: center;
}

.cai-sq-name {
    justify-content: center;
}

.cai-sq-name-text {
    font-weight: 600;
}

.cai-sq-mono {
    font-family: var(--cai-mono, monospace);
    font-size: 0.8125rem;
}

.cai-sq-modified-cell {
    display: flex;
    flex-direction: column;
    line-height: 1.3;
}

.cai-sq-modified-by {
    font-size: 0.6875rem;
    color: var(--cai-muted, #6b7280);
}