/* ==========================================================================
   KRONOS CORE — ANÁLISE DE MÍDIA
   Pasta espelha analise/analise.js
   Etapa 9 da modularização CSS
   ========================================================================== */

/* Estilos compartilhados: css/base.css (.glass-card, .standard-form, .correcao-actions) */

/* ==========================================================================
   Resultado estruturado da Análise de Mídia (cartões + tabela de legendas)
   ========================================================================== */
.analise-wrapper {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.analise-cabecalho {
    position: sticky;
    top: -14px;
    z-index: 2;
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 8px 12px;
    border-radius: 6px;
    background: rgba(45, 212, 191, 0.12);
    border: 1px solid rgba(45, 212, 191, 0.28);
    backdrop-filter: blur(6px);
    color: var(--text-primary);
    font-size: 0.82rem;
    font-weight: 600;
}
.analise-cabecalho .material-symbols-outlined { font-size: 18px; color: var(--accent-cyan); }
.analise-cabecalho .analise-resumo { margin-left: auto; font-weight: 500; font-size: 0.72rem; color: var(--text-muted); }

.analise-card {
    border: 1px solid var(--border-color);
    border-radius: 8px;
    background: rgba(0, 0, 0, 0.22);
    overflow: hidden;
}
.ac-titulo {
    display: flex;
    align-items: center;
    gap: 6px;
    padding: 10px 12px;
    font-weight: 600;
    font-size: 0.82rem;
    color: var(--text-primary);
    background: rgba(255, 255, 255, 0.03);
    border-bottom: 1px solid var(--border-color);
    word-break: break-all;
}
.ac-titulo .material-symbols-outlined { font-size: 18px; color: var(--accent-purple); }

.ac-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
    gap: 10px;
    padding: 12px;
}
.ac-bloco h5 {
    margin: 0 0 6px;
    font-size: 0.7rem;
    text-transform: uppercase;
    letter-spacing: 0.4px;
    color: var(--accent-cyan);
}
.ac-bloco ul { list-style: none; margin: 0; padding: 0; }
.ac-bloco li {
    font-size: 0.76rem;
    color: var(--text-secondary);
    padding: 1px 0;
    word-break: break-word;
}
.ac-dim { color: var(--text-muted); }

.ac-legendas { padding: 0 12px 12px; }
.ac-legendas h5 {
    margin: 0 0 6px;
    font-size: 0.7rem;
    text-transform: uppercase;
    letter-spacing: 0.4px;
    color: var(--accent-yellow);
}
.ac-sem-legenda { margin: 0; font-size: 0.76rem; color: var(--text-muted); font-style: italic; }

.ac-tabela {
    width: 100%;
    border-collapse: collapse;
    font-size: 0.76rem;
}
.ac-tabela th, .ac-tabela td {
    text-align: left;
    padding: 5px 8px;
    border-bottom: 1px solid var(--border-color);
}
.ac-tabela th {
    color: var(--text-muted);
    font-weight: 600;
    text-transform: uppercase;
    font-size: 0.66rem;
    letter-spacing: 0.3px;
}
.ac-tabela td { color: var(--text-secondary); }

.badge-trad {
    display: inline-block;
    padding: 2px 8px;
    border-radius: 20px;
    font-size: 0.68rem;
    font-weight: 600;
}
.badge-trad.sim { background: rgba(16, 185, 129, 0.14); color: var(--accent-green); border: 1px solid rgba(16, 185, 129, 0.3); }
.badge-trad.ocr { background: rgba(245, 158, 11, 0.14); color: var(--accent-yellow); border: 1px solid rgba(245, 158, 11, 0.3); }
.badge-trad.nao { background: rgba(255, 255, 255, 0.05); color: var(--text-muted); border: 1px solid var(--border-color); }

.analise-falhas {
    border: 1px solid rgba(244, 63, 94, 0.3);
    border-radius: 8px;
    background: rgba(244, 63, 94, 0.08);
    padding: 10px 12px;
}
.analise-falhas h5 { margin: 0 0 6px; font-size: 0.72rem; color: var(--accent-red); text-transform: uppercase; }
.analise-falhas ul { list-style: none; margin: 0; padding: 0; }
.analise-falhas li { font-size: 0.76rem; color: var(--text-secondary); padding: 2px 0; word-break: break-word; }
.analise-falhas strong { color: var(--text-primary); }