/* FanTR Cooling — AG Grid (ag-theme-quartz) — Sub-fase 1.6a
   Header: fundo branco + texto #345a74 (brand-dark)
   Resolve conflito visual com card-header dark implementado na 1.5c.
   Zebra sutil, hover/selected harmonizados com paleta institucional.
   Checkboxes em azul institucional (continuação da 1.5a/1.5c).
   Referencia tokens de assets/css/tokens.css.
*/

/* ══════════════════════════════════════════════════════════════════
   1. VARIÁVEIS DO TEMA (ag-theme-quartz CSS custom properties)
   ══════════════════════════════════════════════════════════════════ */
.ag-theme-quartz {

    /* ── Header — branco com texto brand-dark ──────────────────── */
    --ag-header-background-color:       #ffffff;
    --ag-header-foreground-color:       #345a74;
    --ag-header-column-separator-color: #c8d9e3;
    --ag-header-column-separator-display: block;
    --ag-header-column-separator-height: 50%;

    /* ── Corpo — zebra sutil azul-claro ────────────────────────── */
    --ag-background-color:              #ffffff;
    --ag-odd-row-background-color:      rgba(224, 236, 242, 0.40);

    /* ── Interação de linha ─────────────────────────────────────── */
    --ag-row-hover-color:               rgba(6, 124, 177, 0.07);
    --ag-selected-row-background-color: rgba(148, 193, 31, 0.18);

    /* ── Bordas ─────────────────────────────────────────────────── */
    --ag-border-color:                  #c8d9e3;
    --ag-row-border-color:              #e8f0f5;
    --ag-cell-horizontal-border:        solid transparent;

    /* ── Acento e checkboxes (brand-blue) ───────────────────────── */
    --ag-accent-color:                  #067cb1;
    --ag-checkbox-checked-color:        #067cb1;
    --ag-checkbox-unchecked-color:      #c8d9e3;
    --ag-checkbox-indeterminate-color:  #067cb1;

    /* ── Tipografia ─────────────────────────────────────────────── */
    --ag-font-family:                   'Aller', 'Calibri', sans-serif;
    --ag-font-size:                     13px;

    /* ── Dimensões ──────────────────────────────────────────────── */
    --ag-row-height:                    36px;
    --ag-header-height:                 40px;

    /* ── Inputs internos (filtros, editors) ─────────────────────── */
    --ag-input-focus-border-color:      #067cb1;
    --ag-range-selection-border-color:  rgba(6, 124, 177, 0.50);
    --ag-control-panel-background-color: #f7fafc;

    /* ── Sem raio duplo (o card já arredonda) ───────────────────── */
    --ag-border-radius:                 0px;
}


/* ══════════════════════════════════════════════════════════════════
   2. OVERRIDES DE ELEMENTO (regras que CSS variables não cobrem)
   ══════════════════════════════════════════════════════════════════ */

/* Wrapper — sem borda extra (o card-modern já tem borda e raio) */
.ag-theme-quartz .ag-root-wrapper {
    border: none;
    border-radius: 0;
}

/* Header — separador inferior destacado */
.ag-theme-quartz .ag-header {
    border-bottom: 2px solid #c8d9e3;
}

/* Células de header — peso 600, tamanho 12px, brand-dark */
.ag-theme-quartz .ag-header-cell-text {
    font-weight: 600;
    font-size:   12px;
    color:       #345a74;
    letter-spacing: 0.01em;
}

/* Células de header — hover sutil */
.ag-theme-quartz .ag-header-cell:hover {
    background-color: rgba(224, 236, 242, 0.60) !important;
}

/* Ícone de ordenação — brand-dark */
.ag-theme-quartz .ag-sort-indicator-icon {
    color: #345a74;
    opacity: 0.70;
}

/* ── Corpo — células alinhadas verticalmente ────────────────────── */
.ag-theme-quartz .ag-cell {
    display:     flex;
    align-items: center;
    font-size:   13px;
    color:       #333333;
    line-height: 1.35;
}

/* Linha selecionada — texto preservado, não branca */
.ag-theme-quartz .ag-row-selected .ag-cell {
    color: #333333;
}

/* ── Paginação ──────────────────────────────────────────────────── */
.ag-theme-quartz .ag-paging-panel {
    font-size:  12px;
    color:      #6b7f8e;
    border-top: 1px solid #c8d9e3;
}

/* ── Sem borda nas colunas pinnadas (visual mais limpo) ─────────── */
.ag-theme-quartz .ag-pinned-left-header,
.ag-theme-quartz .ag-pinned-left-cols-container {
    border-right: 1px solid #c8d9e3;
}

/* ── Checkbox da coluna 👁 (ajuste-tabela-grid) ─────────────────── */
.ag-theme-quartz .ag-checkbox-input-wrapper input[type="checkbox"] {
    accent-color: #067cb1;
    width:  14px;
    height: 14px;
    cursor: pointer;
}


/* ══════════════════════════════════════════════════════════════════
   3. RESPONSIVIDADE
   ══════════════════════════════════════════════════════════════════ */
@media (max-width: 576px) {
    .ag-theme-quartz {
        --ag-font-size:    12px;
        --ag-row-height:   32px;
        --ag-header-height: 36px;
    }

    .ag-theme-quartz .ag-header-cell-text {
        font-size: 11px;
    }

    .ag-theme-quartz .ag-cell {
        font-size: 12px;
    }
}