/* ═══════════════════════════════════════════════════════════════
   Telas de listagem (todas as páginas "index" dos módulos)
   Carregado depois de aggrid-theme.css — afina o visual sem mexer em cada tela.
   Identidade ERPAvel: azul #0a68f8 (claro) / #2b7bff (escuro).
   ═══════════════════════════════════════════════════════════════ */

.models-page {
    --primary-color: #0a68f8;
    --ls-accent: #0a68f8;
}
.dark-mode .models-page {
    --primary-color: #2b7bff;
    --ls-accent: #5da2ff;
}

/* ── Cabeçalho da página: faixa de título em pagina.css (.pg-banner) ───────── */
.models-page .btn-novo-registro {
    display: inline-flex; align-items: center; gap: .5rem;
    padding: .55rem 1.1rem; font-size: .85rem; font-weight: 600; border-radius: 10px;
    color: #fff; background: var(--primary-color); border: 1px solid var(--primary-color);
    box-shadow: 0 2px 8px color-mix(in srgb, var(--primary-color) 35%, transparent);
    transition: background .15s, transform .15s, box-shadow .15s;
}
.models-page .btn-novo-registro:hover {
    color: #fff; transform: translateY(-1px);
    background: color-mix(in srgb, var(--primary-color) 88%, #000);
    box-shadow: 0 4px 14px color-mix(in srgb, var(--primary-color) 45%, transparent);
}

/* ── Cartões e botões do conteúdo ─────────────────────────────── */
.models-page .card {
    background: var(--card-bg, var(--bg-surface));
    border: 1px solid var(--border-color) !important;
    border-radius: 14px;
    box-shadow: var(--shadow-sm) !important;
    overflow: hidden;
}
.models-page .btn-primary {
    background: var(--primary-color); border-color: var(--primary-color); color: #fff;
}
.models-page .btn-primary:hover { background: color-mix(in srgb, var(--primary-color) 88%, #000); border-color: transparent; }
.models-page .btn-outline-secondary { border-color: var(--border-color); color: var(--text-secondary); }
.models-page .btn-outline-secondary:hover { background: var(--bg-surface-hover); color: var(--text-primary); border-color: var(--border-color); }

/* ── Barra de ferramentas da grade ────────────────────────────── */
.ls-toolbar {
    display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: .6rem;
    padding: .7rem 1rem;
    border-bottom: 1px solid var(--border-color);
}
.ls-count { display: flex; align-items: center; gap: .5rem; font-size: .82rem; color: var(--text-secondary); }
.ls-count i { color: var(--text-tertiary); }
.ls-count b { color: var(--text-primary); font-weight: 700; font-variant-numeric: tabular-nums; }
.ls-count .ls-filtered {
    display: none; padding: .1rem .5rem; border-radius: 999px; font-size: .68rem; font-weight: 700;
    color: var(--ls-accent); background: color-mix(in srgb, var(--ls-accent) 13%, transparent);
}
.ls-count.is-filtered .ls-filtered { display: inline-block; }
.ls-tools { display: flex; align-items: center; gap: .4rem; }
.ls-tool {
    display: inline-flex; align-items: center; gap: .4rem; height: 32px; padding: 0 .7rem;
    font-size: .78rem; font-weight: 600; color: var(--text-secondary); cursor: pointer;
    background: transparent; border: 1px solid var(--border-color); border-radius: 8px;
    transition: color .15s, border-color .15s, background .15s;
}
.ls-tool:hover { color: var(--text-primary); border-color: var(--text-tertiary); background: var(--bg-surface-hover); }
.ls-tool.is-on {
    color: var(--ls-accent); border-color: color-mix(in srgb, var(--ls-accent) 45%, transparent);
    background: color-mix(in srgb, var(--ls-accent) 11%, transparent);
}
.ls-tool:disabled { opacity: .6; cursor: progress; }
.ls-tools .dropdown-menu {
    min-width: 190px; padding: .35rem; font-size: .82rem;
    background: var(--bg-surface); border: 1px solid var(--border-color); border-radius: 10px; box-shadow: var(--shadow-lg);
}
.ls-tools .dropdown-item { display: flex; align-items: center; gap: .55rem; padding: .5rem .65rem; border-radius: 7px; color: var(--text-primary); }
.ls-tools .dropdown-item i { color: var(--text-tertiary); }
.ls-tools .dropdown-item:hover { background: var(--bg-surface-hover); color: var(--text-primary); }

/* ── Grade ────────────────────────────────────────────────────── */
/* "div." eleva a especificidade: o AG Grid injeta um <style> próprio depois das folhas do site */
div.ag-theme-alpine, div.ag-theme-alpine-dark {
    --ls-head-bg:   color-mix(in srgb, var(--card-bg, #fff), var(--text-primary) 5%);
    --ls-row-line:  color-mix(in srgb, var(--card-bg, #fff), var(--text-primary) 9%);
    --ls-row-hover: color-mix(in srgb, var(--card-bg, #fff), var(--primary-color, #0a68f8) 9%);
    --ag-background-color: var(--card-bg, #fff);
    --ag-odd-row-background-color: var(--card-bg, #fff);
    --ag-header-background-color: var(--ls-head-bg);
    --ag-row-hover-color: var(--ls-row-hover);
    --ag-row-border-color: var(--ls-row-line);
    --ag-border-color: var(--border-color);
    --ag-header-foreground-color: var(--text-tertiary);
    --ag-foreground-color: var(--text-primary);
    --ag-secondary-foreground-color: var(--text-secondary);
    --ag-selected-row-background-color: color-mix(in srgb, var(--primary-color, #0a68f8) 14%, transparent);
    --ag-pagination-button-color: var(--primary-color, #0a68f8);
    --ag-range-selection-border-color: var(--primary-color, #0a68f8);
    --ag-input-focus-border-color: var(--primary-color, #0a68f8);
    --ag-alpine-active-color: var(--primary-color, #0a68f8);
    --ag-checkbox-checked-color: var(--primary-color, #0a68f8);
    --ag-selected-color: var(--primary-color, #0a68f8);
}
.ag-theme-alpine-dark { background-color: var(--card-bg, #1e293b); }
.ag-theme-alpine-dark .ag-body-viewport,
.ag-theme-alpine-dark .ag-center-cols-viewport { background-color: var(--card-bg, #1e293b); }

/* Sem zebra: separação por linha fina, hover discreto */
.ag-theme-alpine .ag-row-odd, .ag-theme-alpine .ag-row-even,
.ag-theme-alpine-dark .ag-row-odd, .ag-theme-alpine-dark .ag-row-even { background-color: transparent; }
.ag-theme-alpine .ag-row, .ag-theme-alpine-dark .ag-row { border-bottom: 1px solid var(--ls-row-line); }
.ag-theme-alpine .ag-row:hover, .ag-theme-alpine-dark .ag-row:hover { background-color: var(--ls-row-hover) !important; }

/* Cabeçalho: pequeno, discreto, em caixa-alta */
.ag-theme-alpine .ag-header,
.ag-theme-alpine-dark .ag-header, .ag-theme-alpine-dark .ag-header-row, .ag-theme-alpine-dark .ag-header-viewport,
.ag-theme-alpine-dark .ag-header-container, .ag-theme-alpine-dark .ag-pinned-left-header, .ag-theme-alpine-dark .ag-pinned-right-header {
    background-color: var(--ls-head-bg) !important;
    border-bottom: 1px solid var(--border-color);
    box-shadow: none;
}
.ag-theme-alpine .ag-header-cell, .ag-theme-alpine-dark .ag-header-cell {
    font-size: var(--fs-grid-head, .75rem); font-weight: 600; letter-spacing: .02em; color: var(--text-secondary);
}
/* Números e valores alinhados em colunas */
.ag-theme-alpine .ag-cell, .ag-theme-alpine-dark .ag-cell { font-variant-numeric: tabular-nums; }
.ag-theme-alpine .ag-header-cell-label, .ag-theme-alpine-dark .ag-header-cell-label { gap: 4px; }
.ag-theme-alpine .ag-header-cell[aria-sort] .ag-header-cell-text,
.ag-theme-alpine-dark .ag-header-cell[aria-sort] .ag-header-cell-text { color: var(--text-primary); }
.ag-theme-alpine-dark .ag-header-cell[aria-sort] .ag-sort-indicator-icon,
.ag-theme-alpine .ag-header-cell[aria-sort] .ag-sort-indicator-icon { color: var(--ls-accent, #0a68f8); }
.ag-theme-alpine .ag-header-cell::after, .ag-theme-alpine-dark .ag-header-cell::after { opacity: .5; }

/* Linha de filtros por coluna: mais calma */
.ag-theme-alpine .ag-header-row-floating-filter .ag-header-cell,
.ag-theme-alpine-dark .ag-header-row-floating-filter .ag-header-cell { padding-top: 3px; padding-bottom: 3px; }
.ag-theme-alpine .ag-floating-filter-body input,
.ag-header-row-floating-filter input, .ag-header-row-floating-filter select {
    background: var(--input-bg, transparent) !important; color: var(--text-primary) !important;
    border: 1px solid var(--border-color) !important; border-radius: 7px !important;
}
.ag-header-row-floating-filter input:focus, .ag-header-row-floating-filter select:focus {
    outline: none; border-color: var(--primary-color) !important;
    box-shadow: 0 0 0 3px color-mix(in srgb, var(--primary-color) 18%, transparent);
}

/* Células */
.ag-theme-alpine .ag-cell, .ag-theme-alpine-dark .ag-cell { font-variant-numeric: tabular-nums; }
.ag-theme-alpine .ag-cell[col-id^="cd"], .ag-theme-alpine-dark .ag-cell[col-id^="cd"] { color: var(--text-tertiary); font-weight: 500; }
.ag-theme-alpine .ag-cell-value .ls-money, .ag-theme-alpine-dark .ag-cell-value .ls-money { font-weight: 600; color: var(--text-primary); }
.ls-money.is-neg { color: #ef4444 !important; }
.ls-empty { color: var(--text-tertiary); }

/* Ações: ícones discretos que ganham cor no hover */
.ag-theme-alpine .ag-cell[col-id="_acoes"] .btn,
.ag-theme-alpine-dark .ag-cell[col-id="_acoes"] .btn {
    width: 30px; height: 30px; padding: 0 !important; display: inline-flex; align-items: center; justify-content: center;
    font-size: .9rem !important; border: 0 !important; border-radius: 8px;
    background: transparent; color: var(--text-tertiary); box-shadow: none;
    transition: background .15s, color .15s;
}
.ag-theme-alpine .ag-cell[col-id="_acoes"] .btn:hover,
.ag-theme-alpine-dark .ag-cell[col-id="_acoes"] .btn:hover { transform: none; box-shadow: none; }
.ag-cell[col-id="_acoes"] .btn-outline-primary:hover,
.ag-cell[col-id="_acoes"] .btn-outline-info:hover { color: var(--ls-accent, #0a68f8); background: color-mix(in srgb, var(--ls-accent, #0a68f8) 13%, transparent); }
.ag-cell[col-id="_acoes"] .btn-outline-danger:hover { color: #ef4444; background: rgba(239, 68, 68, .13); }
.ag-cell[col-id="_acoes"] .btn-outline-success:hover { color: #10b981; background: rgba(16, 185, 129, .13); }
.ag-cell[col-id="_acoes"] .btn-outline-warning:hover,
.ag-cell[col-id="_acoes"] .btn-outline-secondary:hover { color: var(--text-primary); background: var(--bg-surface-hover); }

/* Rodapé de paginação */
.ag-theme-alpine .ag-paging-panel, .ag-theme-alpine-dark .ag-paging-panel {
    background-color: var(--ls-head-bg); border-top: 1px solid var(--border-color);
    color: var(--text-secondary); font-size: .78rem; padding: 6px 14px;
}
.ag-theme-alpine-dark .ag-paging-page-size .ag-select .ag-picker-field-wrapper,
.ag-theme-alpine .ag-paging-page-size .ag-select .ag-picker-field-wrapper {
    background-color: var(--input-bg, transparent); border: 1px solid var(--border-color); color: var(--text-primary);
}

/* Estado vazio */
.ls-nodata { display: flex; flex-direction: column; align-items: center; gap: .35rem; padding: 3rem 1rem; text-align: center; }
.ls-nodata i { font-size: 2.4rem; color: var(--text-tertiary); opacity: .45; }
.ls-nodata b { font-size: .92rem; color: var(--text-primary); }
.ls-nodata span { font-size: .78rem; color: var(--text-tertiary); }

/* ── Filtros avançados (partials/filters-simple.html) ─────────── */
.filtros-wrapper .filtros-box { border-radius: 12px; background: var(--card-bg, var(--bg-surface)); border-color: var(--border-color); box-shadow: var(--shadow-sm); }
.filtros-wrapper .filtros-box-header { padding: 9px 14px; }
.filtros-wrapper .filtros-box-label { font-size: .8rem; }

@media (max-width: 575px) {
    .models-page .btn-novo-registro { width: 100%; justify-content: center; }
    .ls-toolbar { padding: .6rem .75rem; }
}

/* O ícone de funil ao lado de cada caixa de filtro é decorativo (o filtro já é a própria caixa) */
.ag-header-row-floating-filter .ag-floating-filter-button { display: none; }