/**
 * PROJECT X — Refinamento visual do dashboard (só navegador).
 */

/* Impede vazamento de camadas decorativas (ex.: grade fixa antiga) */
html[data-theme="light"] .dash-content::before,
html[data-theme="dark"] .dash-content::before {
    display: none !important;
    content: none !important;
}

/* —— Topbar em “card” (bem visível) —— */
html[data-theme="light"] .dash-topbar,
html[data-theme="dark"] .dash-topbar {
    position: relative;
    z-index: 2;
    isolation: isolate;
    align-items: center;
    padding: 20px 22px;
    margin-bottom: 28px;
    border-radius: 16px;
    border: 1px solid var(--dash-border);
    box-shadow: var(--dash-card-shadow);
    overflow: hidden;
}

html[data-theme="light"] .dash-topbar-actions,
html[data-theme="dark"] .dash-topbar-actions {
    position: relative;
    z-index: 1;
    background: transparent;
}

html[data-theme="light"] .dash-topbar {
    background: #ffffff;
}

html[data-theme="dark"] .dash-topbar {
    background: rgba(8, 12, 8, 0.95);
    border-color: rgba(57, 255, 20, 0.2);
    box-shadow: 0 8px 32px rgba(0, 0, 0, 0.55), inset 0 1px 0 rgba(57, 255, 20, 0.08);
}

html[data-theme="light"] .dash-topbar-intro,
html[data-theme="dark"] .dash-topbar-intro {
    flex: 1;
    min-width: 0;
}

html[data-theme="light"] .dash-welcome-sub,
html[data-theme="dark"] .dash-welcome-sub {
    margin: 6px 0 0;
    font-size: 14px;
    font-weight: 400;
    line-height: 1.45;
}

html[data-theme="light"] .dash-welcome-sub {
    color: var(--dash-muted);
}

html[data-theme="dark"] .dash-welcome-sub {
    color: var(--dash-muted);
}

/* —— KPI: faixa verde à esquerda nos cards de destaque —— */
html[data-theme="light"] .stat-card--accent,
html[data-theme="dark"] .stat-card--accent,
html[data-theme="light"] .stat-card.receita,
html[data-theme="dark"] .stat-card.receita {
    border-left: 4px solid var(--px-green-bright, var(--px-green));
    padding-left: 16px;
}

html[data-theme="light"] .stat-card--plain {
    border-left: 4px solid transparent;
}

html[data-theme="dark"] .stat-card--plain {
    border-left: 4px solid rgba(255, 255, 255, 0.08);
}

html[data-theme="light"] .stats,
html[data-theme="dark"] .stats {
    gap: 20px;
    margin-bottom: 32px;
}

html[data-theme="light"] .stat-card:hover,
html[data-theme="dark"] .stat-card:hover {
    transform: translateY(-3px);
}

html[data-theme="light"] .stat-card--accent:hover,
html[data-theme="dark"] .stat-card--accent:hover {
    border-left-color: var(--px-green-bright, var(--px-green));
}

/* Ícones KPI um pouco maiores */
html[data-theme="light"] .stat-card__icon,
html[data-theme="dark"] .stat-card__icon {
    width: 44px;
    height: 44px;
}

/* Detalhe Pix visível */
html[data-theme="light"] .stat-card-pix .stat-pix-detail,
html[data-theme="dark"] .stat-card-pix .stat-pix-detail {
    display: block !important;
    margin-top: 10px;
    padding-top: 8px;
    border-top: 1px dashed var(--dash-border);
    font-size: 11px;
    line-height: 1.45;
    font-family: var(--dash-font-mono, ui-monospace, monospace);
}

html[data-theme="light"] .stat-card-pix .stat-pix-detail strong {
    color: #111827;
}

html[data-theme="dark"] .stat-card-pix .stat-pix-detail strong {
    color: #fff;
}

/* —— Gráficos: toolbar em faixa —— */
html[data-theme="light"] .dash-chart-toolbar.dash-glass-panel,
html[data-theme="dark"] .dash-chart-toolbar.dash-glass-panel {
    border-radius: 12px !important;
    padding: 14px 18px !important;
    margin-bottom: 16px !important;
}

html[data-theme="light"] .dash-chart-toolbar.dash-glass-panel {
    background: #fff !important;
    border: 1px solid var(--dash-border) !important;
}

html[data-theme="dark"] .dash-chart-toolbar.dash-glass-panel {
    background: rgba(8, 12, 8, 0.9) !important;
    border: 1px solid var(--dash-border) !important;
}

/* —— Painéis de tabela: cabeçalho com faixa verde —— */
html[data-theme="light"] .dash-panel-head,
html[data-theme="dark"] .dash-panel-head {
    background: linear-gradient(90deg, rgba(var(--accent-rgb), 0.08) 0%, transparent 48%);
}

html[data-theme="light"] .dash-panel-card,
html[data-theme="dark"] .dash-panel-card {
    overflow: hidden;
}

html[data-theme="light"] .dash-panel-card tbody tr:hover td,
html[data-theme="dark"] .dash-panel-card tbody tr:hover td {
    background: rgba(var(--accent-rgb), 0.06);
}

/* Focus */
html[data-theme="light"] .dash-theme-toggle:focus-visible,
html[data-theme="dark"] .dash-theme-toggle:focus-visible,
html[data-theme="light"] .dash-tab:focus-visible,
html[data-theme="dark"] .dash-tab:focus-visible {
    outline: none;
    box-shadow: var(--dash-focus-ring, 0 0 0 2px #000, 0 0 0 4px rgba(57, 255, 20, 0.45));
}

/* Busca — aba Produtos */
html[data-theme="light"] .produtos-busca {
    background: #fff;
    border-color: var(--dash-border);
    box-shadow: var(--dash-card-shadow);
}

html[data-theme="light"] .produtos-busca:focus-within {
    border-color: var(--px-green);
    box-shadow: 0 0 0 2px rgba(57, 255, 20, 0.12);
}

html[data-theme="light"] .produtos-busca__icon {
    color: #9ca3af;
}

html[data-theme="light"] .produtos-busca__input {
    color: #111827;
}

html[data-theme="light"] .produtos-busca__input::placeholder {
    color: #9ca3af;
}

html[data-theme="dark"] .produtos-busca {
    background: rgba(8, 12, 8, 0.9);
    border-color: var(--dash-border);
}

html[data-theme="dark"] .produtos-busca:focus-within {
    border-color: rgba(57, 255, 20, 0.45);
    box-shadow: 0 0 0 2px rgba(57, 255, 20, 0.12);
}

html[data-theme="dark"] .produtos-busca__icon {
    color: var(--dash-muted);
}

html[data-theme="dark"] .produtos-busca__input {
    color: #fff;
}

html[data-theme="dark"] .produtos-busca__input::placeholder {
    color: var(--dash-muted);
}

/* Busca — aba Catálogo (mesmo componente da aba Produtos) */
html[data-theme="light"] #catalogSection .produtos-busca {
    background: #fff;
    border-color: var(--dash-border);
    box-shadow: var(--dash-card-shadow);
}

html[data-theme="light"] #catalogSection .catalogo-item-nome {
    color: #111827;
}

html[data-theme="light"] #catalogSection .catalogo-item-valor {
    color: var(--px-green);
}

html[data-theme="dark"] #catalogSection .catalogo-item-nome {
    color: rgba(255, 255, 255, 0.92);
}

/* Botões de ação em pedidos — clique no ícone SVG */
html[data-theme="light"] .dash-icon-btn,
html[data-theme="dark"] .dash-icon-btn {
    pointer-events: auto;
}

html[data-theme="light"] .dash-icon-btn svg,
html[data-theme="dark"] .dash-icon-btn svg {
    pointer-events: none;
}