/* compliance-banner.css — SPEC_MODEL_BASELINE_COMPLIANCE_PRESET §5.1
 * Banner persistente acima do statusbar, sempre visível em TODAS as views.
 * Owned by core/compliance/_bannerMarkupPure.ts (BANNER_*_CSS_CLASS canonical).
 */

#compliance-banner {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 6px 12px;
    background: var(--cb-bg, #0b1220);
    border-top: 1px solid var(--cb-border, #1f2937);
    color: var(--cb-fg, #e5e7eb);
    font-size: 12px;
    line-height: 1.4;
    user-select: none;
    z-index: 15;
}

#compliance-banner .cb-chips {
    display: flex;
    align-items: center;
    gap: 6px;
    flex: 1;
    min-width: 0;
    overflow: hidden;
}

#compliance-banner .cb-chip {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    padding: 2px 8px;
    background: rgba(20, 184, 166, 0.08);
    border: 1px solid var(--cb-border, #1f2937);
    border-radius: 4px;
    white-space: nowrap;
}

#compliance-banner .cb-flag {
    font-size: 14px;
    line-height: 1;
}

#compliance-banner .cb-label {
    font-weight: 600;
}

#compliance-banner .cb-trust {
    color: var(--cb-trust-ok, #10b981);
    font-weight: 700;
    font-size: 11px;
}

#compliance-banner .cb-chip-sep {
    color: var(--cb-sep, #6b7280);
    font-size: 10px;
    margin: 0 2px;
}

#compliance-banner .cb-flyout {
    background: var(--cb-flyout-bg, #1f2937);
    border: 1px solid var(--cb-border, #1f2937);
    color: var(--cb-fg, #e5e7eb);
    padding: 2px 8px;
    border-radius: 4px;
    cursor: pointer;
    font-size: 11px;
}
#compliance-banner .cb-flyout:hover { background: #374151; }

#compliance-banner .cb-separator {
    color: var(--cb-sep, #4b5563);
    margin: 0 4px;
}

#compliance-banner .cb-indicator-pair {
    display: flex;
    align-items: center;
    gap: 6px;
}

#compliance-banner .cb-indicator {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    padding: 2px 8px;
    border-radius: 4px;
    font-weight: 600;
}

#compliance-banner .cb-icon { font-size: 13px; }

#compliance-banner .cb-details {
    background: transparent;
    border: 1px solid var(--cb-border, #374151);
    color: var(--cb-fg, #93c5fd);
    padding: 4px 10px;
    border-radius: 4px;
    cursor: pointer;
    font-size: 11px;
    transition: background 0.15s;
}
#compliance-banner .cb-details:hover { background: rgba(147, 197, 253, 0.08); }

/* ── 5 estados visuais (B7 / RF8) ─────────────────────────────────────── */

#compliance-banner.cb-state-none { background: #111827; color: #9ca3af; }
#compliance-banner.cb-state-active { background: #0b1220; }
#compliance-banner.cb-state-mismatch {
    background: #451a03;
    border-top-color: #f59e0b;
    color: #fde68a;
}
#compliance-banner.cb-state-outdated {
    background: #422006;
    border-top-color: #d97706;
    color: #fed7aa;
}
#compliance-banner.cb-state-revoked {
    background: #4b1d1d;
    border-top-color: #ef4444;
    color: #fca5a5;
}

/* Indicator pair: preset chip + conformity chip (RF9 / B1 / ADR A6) */
#compliance-banner .cb-preset-active { background: rgba(20, 184, 166, 0.12); color: #5eead4; }
#compliance-banner .cb-conformity-ok { background: rgba(16, 185, 129, 0.15); color: #6ee7b7; }
#compliance-banner .cb-conformity-warnings { background: rgba(245, 158, 11, 0.15); color: #fde68a; }
#compliance-banner .cb-conformity-viola { background: rgba(239, 68, 68, 0.15); color: #fca5a5; }
#compliance-banner .cb-conformity-nao_calculado { background: rgba(107, 114, 128, 0.15); color: #9ca3af; }

/* Trust badge variantes */
#compliance-banner .cb-trust:not(:empty) { /* default cb-trust-ok cor */ }

/* ── 3 tiers responsive (B10 / RF17) ──────────────────────────────────── */

#compliance-banner.cb-tier-full { padding: 8px 14px; font-size: 12px; }
#compliance-banner.cb-tier-medium { padding: 6px 10px; font-size: 11px; }
#compliance-banner.cb-tier-medium .cb-label { max-width: var(--ecbt-input-md); overflow: hidden; text-overflow: ellipsis; }
#compliance-banner.cb-tier-mini { padding: 4px 8px; font-size: 10px; }
#compliance-banner.cb-tier-mini .cb-label { max-width: var(--ecbt-input-xs); overflow: hidden; text-overflow: ellipsis; }
#compliance-banner.cb-tier-mini .cb-indicator-label { display: none; } /* só ícone */
#compliance-banner.cb-tier-mini .cb-details { padding: 3px 6px; font-size: 10px; }

/* ── Empty state ─────────────────────────────────────────────────────── */
#compliance-banner .cb-none-msg {
    flex: 1;
    color: var(--cb-fg-muted, #9ca3af);
    font-style: italic;
}

/* ── Mobile @media (B10 final fallback) ──────────────────────────────── */
@media (max-width: 768px) {
    #compliance-banner { font-size: 11px; padding: 5px 10px; }
    #compliance-banner .cb-chip { padding: 2px 6px; }
}
@media (max-width: 480px) {
    #compliance-banner { font-size: 10px; padding: 4px 8px; gap: 6px; }
    #compliance-banner .cb-indicator-label { display: none; }
    #compliance-banner .cb-details { padding: 2px 6px; }
}

/* ── B3 fix: Modal Detalhes — sections + footer buttons ─────────────── */
.compliance-details-dialog {
    padding: 24px 28px 22px;
    color: var(--cb-fg, #e5e7eb);
}
.compliance-details-dialog .cb-details-header {
    margin: 0 0 18px;
    padding: 0 0 12px;
    border-bottom: 1px solid var(--cb-border, #1f2937);
}
.compliance-details-dialog .cb-details-title {
    margin: 0 0 4px;
    font-size: 18px;
    font-weight: 700;
}
.compliance-details-dialog .cb-details-subtitle {
    margin: 0;
    font-size: 12px;
    opacity: 0.7;
}
.compliance-details-dialog .cb-details-body {
    display: flex;
    flex-direction: column;
    gap: 18px;
    margin: 0 0 22px;
}
.compliance-details-dialog .cb-details-section {
    background: rgba(16, 185, 129, 0.04);
    border: 1px solid var(--cb-border, #1f2937);
    border-radius: 6px;
    padding: 12px 16px;
}
.compliance-details-dialog .cb-details-section-title {
    margin: 0 0 10px;
    font-size: 13px;
    font-weight: 600;
    color: var(--cb-trust-ok, #10b981);
    text-transform: uppercase;
    letter-spacing: 0.4px;
}
.compliance-details-dialog .cb-details-section-rows {
    margin: 0;
    display: grid;
    grid-template-columns: minmax(140px, max-content) 1fr;
    gap: 6px 14px;
    font-size: 12px;
}
.compliance-details-dialog .cb-details-section-rows dt {
    opacity: 0.65;
    font-weight: 500;
}
.compliance-details-dialog .cb-details-section-rows dd {
    margin: 0;
    word-break: break-word;
}
.compliance-details-dialog .cb-details-row-mono {
    font-family: 'SF Mono', Consolas, Menlo, monospace;
    font-size: 11.5px;
    color: var(--cb-fg, #e5e7eb);
}
.compliance-details-dialog .cb-details-footer {
    display: flex;
    justify-content: flex-end;
    gap: 8px;
    padding-top: 16px;
    border-top: 1px solid var(--cb-border, #1f2937);
}
.compliance-details-dialog .cb-details-btn {
    padding: 6px 14px;
    border-radius: 4px;
    font-size: 12px;
    font-weight: 500;
    cursor: pointer;
    font-family: inherit;
    transition: background 0.15s ease, border-color 0.15s ease, transform 0.05s ease;
}
.compliance-details-dialog .cb-details-btn:disabled {
    opacity: 0.4;
    cursor: not-allowed;
}
.compliance-details-dialog .cb-details-btn:active:not(:disabled) {
    transform: translateY(1px);
}
.compliance-details-dialog .cb-details-btn--primary {
    background: var(--cb-trust-ok, #10b981);
    color: #0b1220;
    border: 1px solid var(--cb-trust-ok, #10b981);
    font-weight: 600;
}
.compliance-details-dialog .cb-details-btn--primary:hover:not(:disabled) {
    background: #34d399;
    border-color: #34d399;
}
.compliance-details-dialog .cb-details-btn--secondary {
    background: transparent;
    color: var(--cb-fg, #e5e7eb);
    border: 1px solid #374151;
}
.compliance-details-dialog .cb-details-btn--secondary:hover:not(:disabled) {
    background: rgba(255, 255, 255, 0.06);
    border-color: #6b7280;
}
.compliance-details-dialog .cb-details-btn--danger {
    background: transparent;
    color: #f87171;
    border: 1px solid #b91c1c;
}
.compliance-details-dialog .cb-details-btn--danger:hover:not(:disabled) {
    background: rgba(248, 113, 113, 0.1);
    border-color: #ef4444;
}