/**
 * Raio-X Vendas B2B — Design System M3 Dual-Theme
 * Módulo: Dashboard Executivo (view_dashboard) & Shell Corporativo (Header/Abas/Menu)
 * Filosofia: 100% Borderless, Zero Drop-Shadow, State Layers Tonais M3, Tipografia Tabular, Dualidade Estrita
 */

/* ==========================================================================
   1. TOKENS & CORES SEMÂNTICAS DUAL-THEME (DARK & LIGHT)
   ========================================================================== */
:root,
[data-theme="dark"],
.dark {
    /* Alavancas / Condições Comerciais - DARK (Vibrantes e Legíveis) */
    --cond-mes-compra: #4ade80;
    --cond-novos: #a855f7;
    --cond-inativos: #fbbf24;
    --cond-perdidos: #f472b6;
    --cond-atrasados: #fb923c;
    /* Tangerina / Laranja alerta */
    --cond-nunca: #94a3b8;
    /* Slate / Cinza */
    --cond-inadimplente: #f87171;
    /* Vermelho crítico financeiro */
    --cond-dispensados: #64748b;
    /* Chumbo neutro descartado */

    --cond-antecipar: #eab308;
    --cond-recuperar: #38bdf8;
    --cond-sondagem: #f97316;

    /* Trilhas de progresso no ESCURO */
    --track-bg: rgba(255, 255, 255, 0.12);

    /* Botão dos cards de estratégia no ESCURO */
    --btn-card-bg: #27394f;
    --btn-card-color: #f8fafc;
    --btn-card-hover-bg: #344c68;
    --btn-card-hover-color: #ffffff;

    --strategy-val-color: #ffffff;
    --gauge-val-gold: #fbbf24;
    --hero-meta-val-color: #ffffff;
    --ia-val-color: #22d3ee;

    /* State Layer Hover Dark */
    --pj-hover-card: #202b3a;
    --pj-hover-container: #111925;

    /* Stat Boxes Atendimento (Dark) */
    --stat-comp-bg: rgba(16, 185, 129, 0.12);
    --stat-comp-text: #10b981;

    --stat-naocomp-bg: rgba(239, 68, 68, 0.14);
    --stat-naocomp-text: #ef4444;

    --stat-contatar-bg: rgba(148, 163, 184, 0.10);
    --stat-contatar-text: #f8fafc;
    --stat-contatar-label: #94a3b8;
}

[data-theme="light"],
.light {
    /* Alavancas / Condições Comerciais - LIGHT (Profundos, Saturados e WCAG AA) */
    --cond-mes-compra: #047857;
    /* Verde esmeralda escuro */
    --cond-novos: #7e22ce;
    /* Índigo profundo */
    --cond-inativos: #b45309;
    /* Âmbar bronze escuro */
    --cond-perdidos: #be185d;
    /* Rosa magenta escuro */
    --cond-atrasados: #c2410c;
    /* Terracota escuro */
    --cond-nunca: #334155;
    /* Slate escuro */
    --cond-inadimplente: #b91c1c;
    /* Vermelho escuro financeiro */
    --cond-dispensados: #475569;
    /* Grafite neutro */

    --cond-antecipar: #a16207;
    --cond-recuperar: #0369a1;
    --cond-sondagem: #c2410c;

    /* Trilhas de progresso no CLARO (nítidas e visíveis) */
    --track-bg: #cbd5e1;

    /* Botão dos cards de estratégia no CLARO */
    --btn-card-bg: #ffffff;
    --btn-card-color: #0f172a;
    --btn-card-hover-bg: #0f172a;
    --btn-card-hover-color: #ffffff;

    --strategy-val-color: #0f172a;
    --gauge-val-gold: #b45309;
    --hero-meta-val-color: #0f172a;
    --ia-val-color: #0891b2;

    /* State Layer Hover Light */
    --pj-hover-card: #e4e8ee;
    --pj-hover-container: #f8fafc;

    /* Stat Boxes Atendimento (Light - Alto Contraste WCAG AAA) */
    --stat-comp-bg: #dcfce7;
    --stat-comp-text: #15803d;

    --stat-naocomp-bg: #fee2e2;
    --stat-naocomp-text: #b91c1c;

    --stat-contatar-bg: #f1f5f9;
    --stat-contatar-text: #0f172a;
    --stat-contatar-label: #475569;
}

/* ==========================================================================
   2. ZERO DROP-SHADOW & ZERO BORDAS INEGOCIÁVEL (FLAT MATERIAL 3)
   ========================================================================== */
:root {
    --pj-shadow-card: none !important;
}

/* Reset absoluto de Drop Shadow e Bordas */
.pj-header,
.pj-nav-tabs,
.pj-tab-btn,
.pj-theme-toggle-btn,
.pj-sync-pill,
.pj-btn-hamburger,
.pj-mobile-drawer,
.pj-drawer-nav-item,
.pj-drawer-close-btn,
#userSelectorContainer,
#userSelector,
.pj-user-selector,
.pj-filter-select,
#btnHeaderMinhaConta,
#btnHeaderLogout,
.pj-btn-logout,
.pj-btn-secondary,
#view_dashboard .pj-desafio-card,
#view_dashboard #cardDesafioHoje,
#view_dashboard .pj-hero-card,
#view_dashboard .pj-strategy-panel,
#view_dashboard .pj-performance-card,
#view_dashboard .pj-categories-panel,
#view_dashboard .pj-gauge-card,
#view_dashboard .pj-kpi-card,
#view_dashboard .pj-category-card,
#view_dashboard .pj-strategy-card,
#view_dashboard .pj-strategy-card-badge,
#view_dashboard .pj-info-circle-btn,
#view_dashboard .pj-info-tooltip-content,
#view_dashboard .pj-perf-item,
#view_dashboard .pj-clickable-card,
.pj-clickable-card,
.pj-clickable-card:hover,
#view_dashboard .pj-hero-meta-box,
#view_dashboard .pj-period-toggle,
#view_dashboard .pj-period-btn,
#view_dashboard .pj-strategy-card-action-btn,
#view_dashboard .btn-desempenho-conversao,
#view_dashboard .btn-shortcut-antecipar,
#view_dashboard .btn-shortcut-recuperar,
#view_dashboard .pj-strategy-gap-pill,
#view_dashboard .pj-mini-pill,
#view_dashboard .gauge-pill,
#view_dashboard .pj-faturado-discreto-box,
#view_dashboard .pj-desafio-progress-bar,
#view_dashboard .pj-perf-bar-stacked,
#view_clientes .pj-filters-card,
#view_clientes .pj-filter-section-panel,
#view_clientes .pj-table-container,
#view_clientes .pj-filter-chip,
#view_clientes .btn-limpar-filtros-red,
#view_clientes .pj-search-input,
#view_clientes .pj-filter-select,
#view_clientes .pj-pagination-bar,
#view_clientes .pj-footer-page-pill,
#view_clientes .pj-footer-btn,
#view_clientes .pj-footer-select-container,
#view_clientes .pj-footer-select,
#view_clientes .pj-footer-page-input,
#view_clientes .pj-semestral-pill,
#view_clientes .pj-btn-acoes-trigger,
#view_clientes .pj-note-icon-badge,
#view_clientes .pj-badge,
#view_clientes .pj-tag-perfil,
#view_clientes .pj-disc-tag {
    box-shadow: none !important;
    filter: none !important;
    text-shadow: none !important;
    border: none !important;
    outline: none !important;
    border-color: transparent !important;
}

/* Prevenção de quebra de valores monetários e números */
.nowrap,
#view_dashboard .pj-desafio-metric-val,
#view_dashboard .pj-hero-meta-val,
#view_dashboard .pj-gauge-value,
#view_dashboard .pj-gauge-pct,
#view_dashboard .pj-strategy-card-val,
#view_dashboard .pj-category-val,
#view_dashboard .pj-kpi-value,
#view_dashboard .pj-perf-item-val {
    white-space: nowrap !important;
    font-variant-numeric: tabular-nums;
    font-feature-settings: "tnum" on, "cv05" on, "cv11" on;
}

/* Forçar select e option no tema Dark para evitar fundo branco nativo do Chromium */
[data-theme="dark"] select,
[data-theme="dark"] option,
.dark select,
.dark option {
    background-color: var(--pj-bg-inset, #19222e) !important;
    color: var(--pj-text-title, #f8fafc) !important;
}

/* ==========================================================================
   3. CABEÇALHO GLOBAL (HEADER) & COMPONENTES DO TOPO
   ========================================================================== */
.pj-header {
    background-color: var(--pj-bg-header, #0e1620) !important;
    border: none !important;
    border-bottom: none !important;
    box-shadow: none !important;
    transition: background-color 0.25s ease;
}

.light .pj-header,
[data-theme="light"] .pj-header {
    background-color: #ffffff !important;
    border-bottom: none !important;
    box-shadow: none !important;
}

/* Botão Alternador de Tema */
.pj-theme-toggle-btn {
    background: var(--pj-bg-inset, #19222e) !important;
    border: none !important;
    color: var(--pj-text-title, #f8fafc) !important;
    border-radius: var(--pj-radius-btn, 24px) !important;
    padding: 6px 14px !important;
    font-size: 11.5px !important;
    font-weight: 600 !important;
    box-shadow: none !important;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    gap: 6px;
    transform: none !important;
    transition: background-color 0.2s cubic-bezier(0.2, 0, 0, 1), color 0.2s cubic-bezier(0.2, 0, 0, 1) !important;
}

.pj-theme-toggle-btn:hover {
    background-color: rgba(255, 255, 255, 0.08) !important;
    transform: none !important;
    box-shadow: none !important;
}

.light .pj-theme-toggle-btn:hover,
[data-theme="light"] .pj-theme-toggle-btn:hover {
    background-color: rgba(0, 0, 0, 0.06) !important;
    transform: none !important;
    box-shadow: none !important;
}

/* Pill de Status do Sync ERP */
.pj-sync-pill {
    background: var(--pj-bg-inset, #19222e) !important;
    border: none !important;
    color: var(--pj-text-title, #f8fafc) !important;
    border-radius: var(--pj-radius-btn, 24px) !important;
    padding: 6px 12px !important;
    box-shadow: none !important;
    font-size: 11.5px !important;
    display: inline-flex;
    align-items: center;
    gap: 6px;
}

.pj-sync-time {
    color: var(--pj-text-title, #f8fafc) !important;
    font-family: var(--pj-font-numbers, 'DM Sans', sans-serif) !important;
    font-size: 11.5px !important;
}

.pj-btn-sync-icon {
    background: transparent !important;
    border: none !important;
    color: var(--pj-text-muted, #64748b) !important;
    cursor: pointer;
    box-shadow: none !important;
    transform: none !important;
}

.pj-btn-sync-icon:hover {
    color: var(--pj-text-title, #f8fafc) !important;
    transform: none !important;
}

/* Seletor de Carteira e Botões Auxiliares do Header (Zero Contornos M3) */
.pj-user-selector,
#userSelectorContainer,
.pj-filter-select,
#userSelector {
    background: var(--pj-bg-inset, #19222e) !important;
    border: none !important;
    outline: none !important;
    box-shadow: none !important;
    color: var(--pj-text-title, #f8fafc) !important;
    border-radius: var(--pj-radius-btn, 24px) !important;
    padding: 10px 15px !important;
    font-size: 11.5px !important;
    font-weight: 600 !important;
    cursor: pointer;
}

.light .pj-user-selector,
[data-theme="light"] .pj-user-selector,
.light #userSelectorContainer,
[data-theme="light"] #userSelectorContainer,
.light .pj-filter-select,
[data-theme="light"] .pj-filter-select,
.light #userSelector,
[data-theme="light"] #userSelector {
    background-color: #ffffff !important;
    color: #0f172a !important;
    border: none !important;
    outline: none !important;
    box-shadow: none !important;
}

.light .pj-filter-select:focus,
[data-theme="light"] .pj-filter-select:focus,
.light #userSelector:focus,
[data-theme="light"] #userSelector:focus {
    border: none !important;
    outline: none !important;
    box-shadow: none !important;
}

.pj-btn-secondary,
.pj-btn-logout,
#btnHeaderMinhaConta,
#btnHeaderLogout {
    background: var(--pj-bg-inset, #19222e) !important;
    border: none !important;
    outline: none !important;
    box-shadow: none !important;
    color: var(--pj-text-title, #f8fafc) !important;
    border-radius: var(--pj-radius-btn, 24px) !important;
    padding: 10px 15px !important;
    font-size: 11.5px !important;
    font-weight: 600 !important;
    cursor: pointer;
    transform: none !important;
    transition: background-color 0.2s cubic-bezier(0.2, 0, 0, 1), color 0.2s cubic-bezier(0.2, 0, 0, 1) !important;
}

.pj-btn-secondary:hover,
#btnHeaderMinhaConta:hover {
    background: rgba(255, 255, 255, 0.08) !important;
    transform: none !important;
    box-shadow: none !important;
    border: none !important;
}

.pj-btn-logout:hover,
#btnHeaderLogout:hover {
    background: rgba(239, 68, 68, 0.15) !important;
    color: #f87171 !important;
    transform: none !important;
    box-shadow: none !important;
    border: none !important;
}

.light .pj-btn-secondary,
[data-theme="light"] .pj-btn-secondary,
.light #btnHeaderMinhaConta,
[data-theme="light"] #btnHeaderMinhaConta {
    background: #f2f4f7 !important;
    color: #0f172a !important;
    border: none !important;
    outline: none !important;
    box-shadow: none !important;
}

.light .pj-btn-secondary:hover,
[data-theme="light"] .pj-btn-secondary:hover,
.light #btnHeaderMinhaConta:hover,
[data-theme="light"] #btnHeaderMinhaConta:hover {
    background: #e2e8f0 !important;
    color: #0f172a !important;
    transform: none !important;
    box-shadow: none !important;
    border: none !important;
}

.light .pj-btn-logout,
[data-theme="light"] .pj-btn-logout,
.light #btnHeaderLogout,
[data-theme="light"] #btnHeaderLogout {
    background: #fee2e2 !important;
    color: #dc2626 !important;
    border: none !important;
    outline: none !important;
    box-shadow: none !important;
}

.light .pj-btn-logout:hover,
[data-theme="light"] .pj-btn-logout:hover,
.light #btnHeaderLogout:hover,
[data-theme="light"] #btnHeaderLogout:hover {
    background: #fecaca !important;
    color: #b91c1c !important;
    transform: none !important;
    box-shadow: none !important;
    border: none !important;
}

/* ============================================================== */
/* 4. BOTÃO DO MENU HAMBÚRGUER (MOBILE & DRAWER)                  */
/* ============================================================== */
.pj-btn-hamburger {
    width: 36px !important;
    height: 36px !important;
    min-width: 36px !important;
    min-height: 36px !important;
    border-radius: var(--pj-radius-pill, 40px) !important;
    padding: 0 !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 4px !important;
    border: none !important;
    outline: none !important;
    box-shadow: none !important;
    transform: none !important;
    cursor: pointer !important;
    background-color: var(--pj-bg-inset, #19222e) !important;
    transition: background-color 0.2s cubic-bezier(0.2, 0, 0, 1) !important;
}

.light .pj-btn-hamburger,
[data-theme="light"] .pj-btn-hamburger {
    background-color: var(--pj-bg-inset, #f2f4f7) !important;
}

/* As 3 Barras do Hambúrguer: nítidas em ambos os temas */
.pj-btn-hamburger .hamburger-bar {
    width: 16px !important;
    height: 2px !important;
    border-radius: 2px !important;
    background-color: #ffffff !important;
    transition: background-color 0.2s ease !important;
}

.light .pj-btn-hamburger .hamburger-bar,
[data-theme="light"] .pj-btn-hamburger .hamburger-bar {
    background-color: #0f172a !important;
    /* Grafite escuro no Light — NUNCA branco */
}

/* Hover no Botão Hambúrguer */
.pj-btn-hamburger:hover {
    background-color: rgba(255, 255, 255, 0.12) !important;
    transform: none !important;
    box-shadow: none !important;
}

.light .pj-btn-hamburger:hover,
[data-theme="light"] .pj-btn-hamburger:hover {
    background-color: rgba(0, 0, 0, 0.08) !important;
    transform: none !important;
    box-shadow: none !important;
}

/* Drawer / Menu Lateral Mobile */
.pj-mobile-drawer {
    background-color: var(--pj-bg-card, #090e15) !important;
    box-shadow: none !important;
    border: none !important;
}

.light .pj-mobile-drawer,
[data-theme="light"] .pj-mobile-drawer {
    background-color: #ffffff !important;
}

.pj-drawer-close-btn {
    background: var(--pj-bg-inset, #19222e) !important;
    color: var(--pj-text-title, #f8fafc) !important;
    border: none !important;
    box-shadow: none !important;
    cursor: pointer !important;
}

.light .pj-drawer-close-btn,
[data-theme="light"] .pj-drawer-close-btn {
    background: var(--pj-bg-inset, #f2f4f7) !important;
    color: #0f172a !important;
}

.pj-drawer-nav-item {
    border: none !important;
    box-shadow: none !important;
    transform: none !important;
    color: var(--pj-text-muted, #64748b) !important;
    border-radius: var(--pj-radius-pill, 40px) !important;
    transition: background-color 0.2s cubic-bezier(0.2, 0, 0, 1), color 0.2s cubic-bezier(0.2, 0, 0, 1) !important;
}

.pj-drawer-nav-item:hover {
    background-color: rgba(255, 255, 255, 0.08) !important;
    color: var(--pj-text-title, #f8fafc) !important;
    transform: none !important;
    box-shadow: none !important;
}

.light .pj-drawer-nav-item:hover,
[data-theme="light"] .pj-drawer-nav-item:hover {
    background-color: rgba(0, 0, 0, 0.06) !important;
    color: #0f172a !important;
    transform: none !important;
    box-shadow: none !important;
}

.pj-drawer-nav-item.active,
.light .pj-drawer-nav-item.active {
    background-color: var(--pj-brand-primary, #ab2f4c) !important;
    color: #ffffff !important;
}

/* ============================================================== */
/* 5. BARRA DE NAVEGAÇÃO DE ABAS (CANÔNICA & ELEGANTE)           */
/* ============================================================== */
.pj-nav-tabs {
    background-color: var(--pj-bg-header, #0e1620) !important;
    padding: 0 24px !important;
    display: flex !important;
    align-items: center !important;
    gap: 8px !important;
    border: none !important;
    border-bottom: none !important;
    border-top: none !important;
    box-shadow: none !important;
    overflow-x: auto !important;
    white-space: nowrap !important;
    height: 48px !important;
}

.light .pj-nav-tabs,
[data-theme="light"] .pj-nav-tabs {
    background-color: #ffffff !important;
    border-top: none !important;
    border-bottom: none !important;
}

/* Botões de Aba (Geometria M3 Pílula Perfeita) */
.pj-tab-btn:not([hidden]):not([style*="display: none"]):not([style*="display:none"]) {
    height: 34px !important;
    padding: 0 16px !important;
    border-radius: var(--pj-radius-pill, 40px) !important;
    font-size: 12px !important;
    font-weight: 600 !important;
    color: var(--pj-text-muted, #64748b) !important;
    text-decoration: none !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 6px !important;
    border: none !important;
    background-color: transparent !important;
    box-shadow: none !important;
    transform: none !important;
    cursor: pointer !important;
    transition: background-color 0.2s cubic-bezier(0.2, 0, 0, 1), color 0.2s cubic-bezier(0.2, 0, 0, 1) !important;
}

.pj-tab-btn[hidden],
.pj-tab-btn[style*="display: none"],
.pj-tab-btn[style*="display:none"],
.pj-drawer-nav-item[hidden],
.pj-drawer-nav-item[style*="display: none"],
.pj-drawer-nav-item[style*="display:none"] {
    display: none !important;
}

.pj-tab-btn .pj-nav-icon {
    stroke: currentColor !important;
    transition: stroke 0.2s ease !important;
}

/* Hover em Abas Inativas (State Layer M3 Tonal) */
.pj-tab-btn:not(.active):hover {
    background-color: rgba(255, 255, 255, 0.08) !important;
    color: var(--pj-text-title, #f8fafc) !important;
    transform: none !important;
    box-shadow: none !important;
}

.light .pj-tab-btn:not(.active):hover,
[data-theme="light"] .pj-tab-btn:not(.active):hover {
    background-color: rgba(0, 0, 0, 0.06) !important;
    color: #0f172a !important;
    transform: none !important;
    box-shadow: none !important;
}

/* Aba Ativa (Preserva sempre o tom vinho institucional M3) */
.pj-tab-btn.active,
.light .pj-tab-btn.active,
[data-theme="light"] .pj-tab-btn.active {
    color: #ffffff !important;
    background-color: var(--pj-brand-primary, #ab2f4c) !important;
    border-radius: var(--pj-radius-pill, 40px) !important;
    box-shadow: none !important;
    transform: none !important;
}

.pj-tab-btn.active .pj-nav-icon,
.light .pj-tab-btn.active .pj-nav-icon {
    stroke: #ffffff !important;
}

/* Hover na Aba Ativa: mantém a cor e aplica state layer de brilho suave — NUNCA BRANCO */
.pj-tab-btn.active:hover,
.light .pj-tab-btn.active:hover,
[data-theme="light"] .pj-tab-btn.active:hover {
    background-color: #ba3453 !important;
    color: #ffffff !important;
    transform: none !important;
    box-shadow: none !important;
}

.pj-tab-btn.active:hover .pj-nav-icon,
.light .pj-tab-btn.active:hover .pj-nav-icon {
    stroke: #ffffff !important;
}

/* ============================================================== */
/* 6. CARD DESAFIO DO DIA (META DIÁRIA DINÂMICA ESCALONADA)       */
/* ============================================================== */
#view_dashboard .pj-desafio-card,
#view_dashboard #cardDesafioHoje,
.pj-desafio-card {
    background: var(--pj-bg-card, #090e15) !important;
    background-color: var(--pj-bg-card, #090e15) !important;
    background-image: none !important;
    border-radius: var(--pj-radius-card, 15px) !important;
    box-shadow: none !important;
    padding: 20px 24px !important;
    margin-bottom: 20px !important;
    border: none !important;
    outline: none !important;
}

.light #view_dashboard .pj-desafio-card,
.light #view_dashboard #cardDesafioHoje,
.light .pj-desafio-card,
[data-theme="light"] #view_dashboard .pj-desafio-card,
[data-theme="light"] #view_dashboard #cardDesafioHoje,
[data-theme="light"] .pj-desafio-card {
    background: #ffffff !important;
    background-color: #ffffff !important;
    background-image: none !important;
    box-shadow: none !important;
    border: none !important;
}

.pj-desafio-card::before,
#view_dashboard .pj-desafio-card::before {
    display: none !important;
    content: none !important;
}

.pj-desafio-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 16px;
    flex-wrap: wrap;
    gap: 12px;
}

.pj-desafio-title-group {
    display: flex;
    align-items: center;
    gap: 10px;
}

.pj-desafio-title {
    font-size: 15px !important;
    font-weight: 700 !important;
    color: var(--pj-text-title, #f8fafc) !important;
}

.light .pj-desafio-title,
[data-theme="light"] .pj-desafio-title {
    color: #0f172a !important;
}

.pj-desafio-sub {
    font-size: 11.5px !important;
    color: var(--pj-text-muted, #64748b) !important;
    margin-top: 2px;
}

#view_dashboard .pj-ritmo-badge,
.pj-ritmo-badge {
    display: inline-flex !important;
    align-items: center !important;
    gap: 6px !important;
    padding: 5px 14px !important;
    border-radius: var(--pj-radius-pill, 40px) !important;
    font-size: 11px !important;
    font-weight: 700 !important;
    letter-spacing: 0.3px !important;
    white-space: nowrap !important;
    box-shadow: none !important;
    border: none !important;
    outline: none !important;
}

.pj-ritmo-alivio {
    background: rgba(16, 185, 129, 0.15) !important;
    color: #34d399 !important;
    border: none !important;
}

.light .pj-ritmo-alivio,
[data-theme="light"] .pj-ritmo-alivio {
    background: #d1fae5 !important;
    color: #065f46 !important;
    border: none !important;
}

.pj-ritmo-normal {
    background: rgba(59, 130, 246, 0.15) !important;
    color: #60a5fa !important;
    border: none !important;
}

.light .pj-ritmo-normal,
[data-theme="light"] .pj-ritmo-normal {
    background: #dbeafe !important;
    color: #1e40af !important;
    border: none !important;
}

.pj-ritmo-atencao,
.pj-ritmo-aceleracao {
    background: rgba(245, 158, 11, 0.15) !important;
    color: #fbbf24 !important;
    border: none !important;
}

.light .pj-ritmo-atencao,
.light .pj-ritmo-aceleracao,
[data-theme="light"] .pj-ritmo-atencao,
[data-theme="light"] .pj-ritmo-aceleracao {
    background: #fef3c7 !important;
    color: #b45309 !important;
    border: none !important;
}

.pj-ritmo-batida {
    background: rgba(16, 185, 129, 0.25) !important;
    color: #4ade80 !important;
    border: none !important;
    box-shadow: none !important;
}

.light .pj-ritmo-batida,
[data-theme="light"] .pj-ritmo-batida {
    background: #dcfce7 !important;
    color: #15803d !important;
    border: none !important;
}

.pj-desafio-metrics-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 14px;
    margin-bottom: 16px;
}

@media (max-width: 1024px) {
    .pj-desafio-metrics-grid {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 640px) {
    .pj-desafio-metrics-grid {
        grid-template-columns: 1fr;
    }
}

#view_dashboard .pj-desafio-metric-item,
.pj-desafio-metric-item {
    background: #111a26 !important;
    background-color: #111a26 !important;
    background-image: none !important;
    border-radius: 12px !important;
    padding: 14px 18px !important;
    display: flex !important;
    flex-direction: column !important;
    justify-content: space-between !important;
    min-height: 102px !important;
    border: none !important;
    border-top: 2.5px solid transparent !important;
    outline: none !important;
    /* box-shadow: 0 4px 12px rgba(0, 0, 0, 0.3) !important; */
    transform: none !important;
    transition: all 0.2s cubic-bezier(0.2, 0, 0, 1) !important;
}

#view_dashboard .pj-desafio-metric-item:nth-child(1),
.pj-desafio-metric-item:nth-child(1) {
    border-top: 2.5px solid #38bdf8 !important;
    /* Azul Meta */
}

#view_dashboard .pj-desafio-metric-item:nth-child(2),
.pj-desafio-metric-item:nth-child(2) {
    border-top: 2.5px solid #10b981 !important;
    /* Verde Vendido */
}

#view_dashboard .pj-desafio-metric-item:nth-child(3),
.pj-desafio-metric-item:nth-child(3) {
    border-top: 2.5px solid #f43f5e !important;
    /* Rosa/Vermelho Restante */
}

#view_dashboard .pj-desafio-metric-item:nth-child(4),
.pj-desafio-metric-item:nth-child(4) {
    border-top: 2.5px solid #f59e0b !important;
    /* Âmbar Deveria Estar */
}

#view_dashboard .pj-desafio-metric-item:hover,
.pj-desafio-metric-item:hover {
    background: var(--pj-surface-hover, #1f2b3a) !important;
    background-color: var(--pj-surface-hover, #1f2b3a) !important;
    transform: translateY(-1px) !important;
    box-shadow: none !important;
}

.light #view_dashboard .pj-desafio-metric-item,
.light .pj-desafio-metric-item,
[data-theme="light"] #view_dashboard .pj-desafio-metric-item,
[data-theme="light"] .pj-desafio-metric-item {
    background: #f1f5f9 !important;
    background-color: #f1f5f9 !important;
    background-image: none !important;
    /* border: 1px solid rgba(0, 0, 0, 0.08) !important; */
    outline: none !important;
    /* box-shadow: 0 2px 8px rgba(0, 0, 0, 0.05) !important; */
}

.light #view_dashboard .pj-desafio-metric-item:nth-child(1),
.light .pj-desafio-metric-item:nth-child(1),
[data-theme="light"] .pj-desafio-metric-item:nth-child(1) {
    border-top: 2.5px solid var(--pj-info, #0369a1) !important;
}

.light #view_dashboard .pj-desafio-metric-item:nth-child(2),
.light .pj-desafio-metric-item:nth-child(2),
[data-theme="light"] .pj-desafio-metric-item:nth-child(2) {
    border-top: 2.5px solid var(--pj-ok, #047857) !important;
}

.light #view_dashboard .pj-desafio-metric-item:nth-child(3),
.light .pj-desafio-metric-item:nth-child(3),
[data-theme="light"] .pj-desafio-metric-item:nth-child(3) {
    border-top: 2.5px solid var(--pj-bad, #b91c1c) !important;
}

.light #view_dashboard .pj-desafio-metric-item:nth-child(4),
.light .pj-desafio-metric-item:nth-child(4),
[data-theme="light"] .pj-desafio-metric-item:nth-child(4) {
    border-top: 2.5px solid var(--pj-warn, #b45309) !important;
}

.light #view_dashboard .pj-desafio-metric-item:hover,
.light .pj-desafio-metric-item:hover,
[data-theme="light"] #view_dashboard .pj-desafio-metric-item:hover,
[data-theme="light"] .pj-desafio-metric-item:hover {
    background: var(--pj-surface-hover, #f8fafc) !important;
    background-color: var(--pj-surface-hover, #f8fafc) !important;
    transform: translateY(-1px) !important;
    box-shadow: none !important;
}

.pj-desafio-metric-lbl {
    font-size: 10px !important;
    font-weight: 700 !important;
    text-transform: uppercase !important;
    letter-spacing: 0.5px !important;
    color: var(--pj-text-muted, #64748b) !important;
    margin-bottom: 4px;
    white-space: nowrap;
}

.pj-desafio-metric-val {
    font-family: var(--pj-font-numbers, 'DM Sans', sans-serif) !important;
    font-size: 22px !important;
    font-weight: var(--pj-font-weight-num, 700) !important;
    line-height: 1.2 !important;
    color: var(--pj-text-title, #f8fafc) !important;
}

.light .pj-desafio-metric-val,
[data-theme="light"] .pj-desafio-metric-val {
    color: #0f172a !important;
}

.pj-delta-chip-red,
.pj-meta-evolucao-badge.pj-evolucao-alerta,
.pj-meta-evolucao-badge.pj-evolucao-vermelho {
    background: rgba(239, 68, 68, 0.18) !important;
    color: #f87171 !important;
    font-size: 10px !important;
    font-weight: 700 !important;
    padding: 2px 7px !important;
    border-radius: var(--pj-radius-pill, 40px) !important;
    display: inline-flex;
    align-items: center;
    gap: 3px;
    white-space: nowrap;
    border: none !important;
    box-shadow: none !important;
}

.light .pj-delta-chip-red,
.light .pj-meta-evolucao-badge.pj-evolucao-alerta,
.light .pj-meta-evolucao-badge.pj-evolucao-vermelho {
    background: #fee2e2 !important;
    color: #b91c1c !important;
}

.pj-meta-evolucao-badge.pj-evolucao-verde {
    background: rgba(16, 185, 129, 0.18) !important;
    color: #4ade80 !important;
    font-size: 10px !important;
    font-weight: 700 !important;
    padding: 2px 7px !important;
    border-radius: var(--pj-radius-pill, 40px) !important;
    display: inline-flex;
    align-items: center;
    gap: 3px;
    white-space: nowrap;
    border: none !important;
    box-shadow: none !important;
}

.light .pj-meta-evolucao-badge.pj-evolucao-verde {
    background: #d1fae5 !important;
    color: #047857 !important;
}

.pj-desafio-metric-sub {
    font-size: 10.5px !important;
    color: var(--pj-text-muted, #64748b) !important;
    margin-top: 3px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

#view_dashboard .pj-desafio-progress-container,
.pj-desafio-progress-container {
    background: var(--pj-bg-inset, #19222e) !important;
    background-color: var(--pj-bg-inset, #19222e) !important;
    border-radius: var(--pj-radius-pill, 40px) !important;
    height: 8px !important;
    overflow: hidden !important;
    width: 100% !important;
    border: none !important;
    box-shadow: none !important;
}

.light #view_dashboard .pj-desafio-progress-container,
.light .pj-desafio-progress-container,
[data-theme="light"] #view_dashboard .pj-desafio-progress-container,
[data-theme="light"] .pj-desafio-progress-container {
    background: #e2e8f0 !important;
    background-color: #e2e8f0 !important;
    border: none !important;
    box-shadow: none !important;
}

#view_dashboard .pj-desafio-progress-bar,
.pj-desafio-progress-bar {
    height: 100% !important;
    border-radius: var(--pj-radius-pill, 40px) !important;
    background: linear-gradient(90deg, #38bdf8 0%, #818cf8 50%, #4ade80 100%) !important;
    box-shadow: none !important;
    border: none !important;
}

/* ============================================================== */
/* 7. HERO CARD COM 3 GAUGES VERTICAIS BALANCEADOS               */
/* ============================================================== */
.pj-hero-card {
    background-color: var(--pj-bg-card, #090e15) !important;
    border-radius: var(--pj-radius-card, 16px) !important;
    box-shadow: none !important;
    padding: 22px 24px !important;
    margin-bottom: 20px !important;
    border: none !important;
}

.light .pj-hero-card,
[data-theme="light"] .pj-hero-card {
    background-color: #ffffff !important;
    box-shadow: none !important;
}

.pj-hero-header {
    display: flex !important;
    justify-content: space-between !important;
    align-items: center !important;
    margin-bottom: 20px !important;
    flex-wrap: wrap !important;
    gap: 16px !important;
    border-bottom: none !important;
    padding-bottom: 0 !important;
}

.pj-hero-title-group h2 {
    font-size: 20px !important;
    font-weight: 700 !important;
    color: var(--pj-text-title, #f8fafc) !important;
}

.light .pj-hero-title-group h2 {
    color: #0f172a !important;
}

.pj-hero-title-group p {
    font-size: 12px !important;
    color: var(--pj-text-muted, #64748b) !important;
    margin-top: 2px;
}

.pj-hero-controls {
    display: flex;
    align-items: center;
    gap: 20px;
    flex-wrap: wrap;
}

.pj-period-toggle {
    display: flex !important;
    background: var(--pj-bg-inset, #19222e) !important;
    padding: 3px !important;
    border-radius: var(--pj-radius-btn, 24px) !important;
    gap: 2px !important;
    border: none !important;
    box-shadow: none !important;
}

.light .pj-period-toggle,
[data-theme="light"] .pj-period-toggle {
    background: #f2f4f7 !important;
}

.pj-period-btn {
    padding: 6px 14px !important;
    border-radius: var(--pj-radius-btn, 24px) !important;
    background: transparent !important;
    border: none !important;
    box-shadow: none !important;
    transform: none !important;
    cursor: pointer !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    color: var(--pj-text-muted, #64748b) !important;
    transition: background-color 0.2s cubic-bezier(0.2, 0, 0, 1), color 0.2s cubic-bezier(0.2, 0, 0, 1) !important;
}

.pj-period-btn span {
    font-size: 11.5px !important;
    font-weight: 600 !important;
    white-space: nowrap !important;
}

.pj-period-sub {
    font-size: 9px !important;
    opacity: 0.75 !important;
    font-weight: 500 !important;
    white-space: nowrap !important;
}

.pj-period-btn:not(.active):hover {
    color: var(--pj-text-title, #f8fafc) !important;
    background-color: rgba(255, 255, 255, 0.06) !important;
    transform: none !important;
    box-shadow: none !important;
}

.light .pj-period-btn:not(.active):hover,
[data-theme="light"] .pj-period-btn:not(.active):hover {
    color: #0f172a !important;
    background-color: rgba(0, 0, 0, 0.05) !important;
    transform: none !important;
    box-shadow: none !important;
}

.pj-period-btn.active {
    background: #2563eb !important;
    color: #ffffff !important;
    box-shadow: none !important;
    transform: none !important;
}

.pj-hero-meta-box {
    display: flex;
    align-items: center;
    gap: 24px;
}

.pj-hero-meta-item {
    text-align: right;
}

.pj-hero-meta-lbl {
    font-size: 9.5px !important;
    text-transform: uppercase !important;
    font-weight: 700 !important;
    letter-spacing: 0.5px !important;
    color: var(--pj-text-muted, #64748b) !important;
    white-space: nowrap !important;
}

.pj-hero-meta-val {
    font-family: var(--pj-font-numbers, 'DM Sans', sans-serif) !important;
    font-size: 22px !important;
    font-weight: var(--pj-font-weight-num, 700) !important;
    line-height: 1.2 !important;
    margin-top: 1px !important;
    color: var(--hero-meta-val-color, #ffffff) !important;
}

/* 3 GAUGES GRID (DIAGRAMAÇÃO VERTICAL BALANCEADA) */
.pj-gauges-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 16px;
}

@media (max-width: 1024px) {
    .pj-gauges-grid {
        grid-template-columns: 1fr;
    }
}

.pj-gauge-card {
    background-color: var(--pj-bg-inset, #19222e) !important;
    border-radius: var(--pj-radius-inset, 10px) !important;
    padding: 22px 20px !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    text-align: center !important;
    justify-content: flex-start !important;
    gap: 4px !important;
    border: none !important;
    box-shadow: none !important;
    transform: none !important;
    transition: background-color 0.2s cubic-bezier(0.2, 0, 0, 1) !important;
}

.pj-gauge-card:hover {
    background-color: var(--pj-hover-card, #202b3a) !important;
    transform: none !important;
    box-shadow: none !important;
    border: none !important;
}

.light .pj-gauge-card,
[data-theme="light"] .pj-gauge-card {
    background-color: #f1f5f9 !important;
}

.light .pj-gauge-card:hover,
[data-theme="light"] .pj-gauge-card:hover {
    background-color: var(--pj-hover-card, #e4e8ee) !important;
    transform: none !important;
    box-shadow: none !important;
    border: none !important;
}

.pj-gauge-wrapper {
    width: 108px;
    height: 108px;
    position: relative;
    margin-bottom: 10px;
    flex-shrink: 0;
}

.pj-gauge-svg {
    transform: rotate(-90deg);
    width: 100%;
    height: 100%;
}

.pj-gauge-bg {
    fill: none;
    stroke: var(--pj-ring-track, rgba(255, 255, 255, 0.08));
    stroke-width: 8;
}

.pj-gauge-ring {
    fill: none;
    stroke-width: 8;
    stroke-linecap: round;
    transition: stroke-dashoffset 0.8s ease;
}

.pj-gauge-center {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
}

.pj-gauge-pct {
    font-family: var(--pj-font-numbers, 'DM Sans', sans-serif) !important;
    font-size: 22px !important;
    font-weight: var(--pj-font-weight-num, 700) !important;
    color: var(--pj-text-title, #f8fafc) !important;
    white-space: nowrap !important;
}

.light .pj-gauge-pct,
[data-theme="light"] .pj-gauge-pct {
    color: #0f172a !important;
}

.pj-gauge-label {
    font-size: 10px !important;
    font-weight: 700 !important;
    text-transform: uppercase !important;
    letter-spacing: 0.5px !important;
    color: var(--pj-text-muted, #64748b) !important;
    white-space: nowrap !important;
}

.pj-gauge-value {
    font-family: var(--pj-font-numbers, 'DM Sans', sans-serif) !important;
    font-size: 24px !important;
    font-weight: var(--pj-font-weight-num, 700) !important;
    line-height: 1.1 !important;
    margin: 4px 0 6px 0 !important;
    color: var(--pj-text-title, #f8fafc) !important;
}

.light .pj-gauge-value,
[data-theme="light"] .pj-gauge-value {
    color: #0f172a !important;
}

#kpiConversaoVal {
    color: var(--gauge-val-gold, #fbbf24) !important;
}

.pj-gauge-sub {
    font-size: 11px !important;
    color: var(--pj-text-muted, #64748b) !important;
    white-space: nowrap !important;
}

.pj-faturado-discreto-box {
    background: var(--pj-bg-card, #090e15) !important;
    border-radius: var(--pj-radius-inset, 10px) !important;
    padding: 6px 12px !important;
    margin-top: 6px !important;
    display: flex !important;
    flex-direction: column !important;
    gap: 3px !important;
    width: 100% !important;
    max-width: 300px !important;
    border: none !important;
    box-shadow: none !important;
}

.light .pj-faturado-discreto-box,
[data-theme="light"] .pj-faturado-discreto-box {
    background: #ffffff !important;
}

.pj-faturado-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    font-size: 11px;
    white-space: nowrap;
    gap: 8px;
}

.pj-gauge-mini-pills {
    display: flex;
    gap: 6px;
    justify-content: center;
    flex-wrap: nowrap;
    margin-top: 6px;
    overflow-x: auto;
    max-width: 100%;
}

.gauge-pill,
.pj-mini-pill {
    font-size: 9.5px !important;
    font-weight: 600 !important;
    padding: 2px 8px !important;
    border-radius: var(--pj-radius-pill, 40px) !important;
    background: var(--pj-bg-card, #090e15) !important;
    color: var(--pj-text-muted, #64748b) !important;
    white-space: nowrap !important;
    border: none !important;
    box-shadow: none !important;
    display: inline-flex;
    align-items: center;
    gap: 4px;
}

.light .gauge-pill,
.light .pj-mini-pill,
[data-theme="light"] .gauge-pill,
[data-theme="light"] .pj-mini-pill {
    background: #ffffff !important;
}

/* ============================================================== */
/* 8. PAINEL DE ESTRATÉGIA DE FECHAMENTO (SIMULADOR 3X2)         */
/* ============================================================== */
.pj-strategy-panel {
    background-color: var(--pj-bg-card, #090e15) !important;
    border-radius: var(--pj-radius-card, 16px) !important;
    box-shadow: none !important;
    padding: 22px 24px !important;
    margin-bottom: 20px !important;
    border: none !important;
}

.light .pj-strategy-panel,
[data-theme="light"] .pj-strategy-panel {
    background-color: #ffffff !important;
    box-shadow: none !important;
}

.pj-strategy-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 18px;
    flex-wrap: wrap;
    gap: 12px;
}

.pj-strategy-title {
    font-size: 15px !important;
    font-weight: 700 !important;
    color: var(--pj-text-title, #f8fafc) !important;
}

.light .pj-strategy-title {
    color: #0f172a !important;
}

.pj-strategy-subtitle {
    font-size: 11.5px !important;
    color: var(--pj-text-muted, #64748b) !important;
    margin-top: 2px;
}

.btn-desempenho-conversao {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 6px 14px;
    font-size: 11.5px;
    font-weight: 700;
    border-radius: var(--pj-radius-pill, 40px);
    background: rgba(56, 189, 248, 0.12) !important;
    color: #38bdf8 !important;
    border: none !important;
    box-shadow: none !important;
    transform: none !important;
    cursor: pointer;
    transition: background-color 0.2s cubic-bezier(0.2, 0, 0, 1) !important;
    white-space: nowrap;
}

.btn-desempenho-conversao:hover {
    background: rgba(56, 189, 248, 0.22) !important;
    transform: none !important;
    box-shadow: none !important;
}

.light .btn-desempenho-conversao {
    background: #e0f2fe !important;
    color: #0369a1 !important;
}

.light .btn-desempenho-conversao:hover {
    background: #bae6fd !important;
    transform: none !important;
    box-shadow: none !important;
}

.pj-strategy-gap-pill {
    background: var(--pj-bg-inset, #19222e) !important;
    padding: 6px 14px !important;
    border-radius: var(--pj-radius-pill, 40px) !important;
    font-size: 11.5px !important;
    display: flex !important;
    align-items: center !important;
    gap: 6px !important;
    white-space: nowrap !important;
    border: none !important;
    box-shadow: none !important;
}

.light .pj-strategy-gap-pill,
[data-theme="light"] .pj-strategy-gap-pill {
    background: #f2f4f7 !important;
}

.pj-strategy-gap-label {
    color: var(--pj-text-muted, #64748b) !important;
    font-weight: 500 !important;
}

.pj-strategy-gap-val {
    font-family: var(--pj-font-numbers, 'DM Sans', sans-serif) !important;
    font-weight: var(--pj-font-weight-num, 700) !important;
    color: var(--pj-text-title, #f8fafc) !important;
}

.light .pj-strategy-gap-val {
    color: #0f172a !important;
}

/* GRID DOS CARDS DE ESTRATÉGIA */
.pj-strategy-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 16px;
    margin-bottom: 16px;
}

@media (max-width: 1100px) {
    .pj-strategy-grid {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 700px) {
    .pj-strategy-grid {
        grid-template-columns: 1fr;
    }
}

.pj-strategy-card {
    background-color: var(--pj-bg-inset, #19222e) !important;
    border-radius: var(--pj-radius-inset, 10px) !important;
    padding: 18px 20px !important;
    display: flex !important;
    flex-direction: column !important;
    justify-content: space-between !important;
    gap: 14px !important;
    border: none !important;
    outline: none !important;
    box-shadow: none !important;
    transform: none !important;
    transition: background-color 0.2s cubic-bezier(0.2, 0, 0, 1) !important;
}

.pj-strategy-card:hover {
    background-color: var(--pj-hover-card, #202b3a) !important;
    transform: none !important;
    box-shadow: none !important;
    border: none !important;
    outline: none !important;
}

.light .pj-strategy-card,
[data-theme="light"] .pj-strategy-card {
    background-color: #f1f5f9 !important;
}

.light .pj-strategy-card:hover,
[data-theme="light"] .pj-strategy-card:hover {
    background-color: #e2e8f0 !important;
    transform: none !important;
    box-shadow: none !important;
    border: none !important;
    outline: none !important;
}

.pj-strategy-card-top {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.pj-strategy-card-badge {
    font-size: 10px !important;
    font-weight: 800 !important;
    text-transform: uppercase !important;
    letter-spacing: 0.5px !important;
    padding: 4px 10px !important;
    border-radius: var(--pj-radius-pill, 40px) !important;
    white-space: nowrap !important;
    border: none !important;
    outline: none !important;
    box-shadow: none !important;
}

.badge-green {
    background: rgba(16, 185, 129, 0.18) !important;
    color: var(--cond-mes-compra) !important;
    border: none !important;
    border-radius: var(--pj-radius-pill, 40px) !important;
}

.badge-purple {
    background: rgba(168, 85, 247, 0.18) !important;
    color: var(--cond-novos) !important;
    border: none !important;
    border-radius: var(--pj-radius-pill, 40px) !important;
}

.badge-yellow {
    background: rgba(245, 158, 11, 0.18) !important;
    color: var(--cond-inativos) !important;
    border: none !important;
    border-radius: var(--pj-radius-pill, 40px) !important;
}

.badge-pink {
    background: rgba(236, 72, 153, 0.18) !important;
    color: var(--cond-perdidos) !important;
    border: none !important;
    border-radius: var(--pj-radius-pill, 40px) !important;
}

.badge-red {
    background: rgba(249, 115, 22, 0.18) !important;
    color: var(--cond-atrasados) !important;
    border: none !important;
    border-radius: var(--pj-radius-pill, 40px) !important;
}

.badge-slate {
    background: rgba(100, 116, 139, 0.2) !important;
    color: var(--cond-nunca) !important;
    border: none !important;
    border-radius: var(--pj-radius-pill, 40px) !important;
}

.badge-cyan {
    background: rgba(6, 182, 212, 0.18) !important;
    color: #22d3ee !important;
    border: none !important;
    border-radius: var(--pj-radius-pill, 40px) !important;
}

.light .badge-green {
    background: #d1fae5 !important;
    border: none !important;
}

.light .badge-purple {
    background: #f3e8ff !important;
    border: none !important;
}

.light .badge-yellow {
    background: #fef3c7 !important;
    border: none !important;
}

.light .badge-pink {
    background: #fce7f3 !important;
    border: none !important;
}

.light .badge-red {
    background: #ffedd5 !important;
    border: none !important;
}

.light .badge-slate {
    background: #e2e8f0 !important;
    border: none !important;
}

.light .badge-cyan {
    background: #cffafe !important;
    color: #0891b2 !important;
    border: none !important;
}

.pj-info-circle-btn,
#view_dashboard .pj-info-circle-btn {
    width: 18px !important;
    height: 18px !important;
    border-radius: 50% !important;
    border: none !important;
    outline: none !important;
    box-shadow: none !important;
    transform: none !important;
    background: var(--pj-bg-card, #090e15) !important;
    color: var(--pj-text-muted, #64748b) !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    font-size: 11px !important;
    font-weight: 700 !important;
    cursor: pointer !important;
    transition: background-color 0.2s cubic-bezier(0.2, 0, 0, 1), color 0.2s cubic-bezier(0.2, 0, 0, 1) !important;
}

.pj-info-circle-btn:hover,
#view_dashboard .pj-info-circle-btn:hover {
    background: rgba(255, 255, 255, 0.16) !important;
    color: var(--pj-text-title, #f8fafc) !important;
    border: none !important;
    outline: none !important;
    box-shadow: none !important;
    transform: none !important;
}

.light .pj-info-circle-btn,
.light #view_dashboard .pj-info-circle-btn,
[data-theme="light"] .pj-info-circle-btn,
[data-theme="light"] #view_dashboard .pj-info-circle-btn {
    background: #e2e8f0 !important;
    color: #475569 !important;
    border: none !important;
    outline: none !important;
    box-shadow: none !important;
}

.light .pj-info-circle-btn:hover,
.light #view_dashboard .pj-info-circle-btn:hover,
[data-theme="light"] .pj-info-circle-btn:hover,
[data-theme="light"] #view_dashboard .pj-info-circle-btn:hover {
    background: #cbd5e1 !important;
    color: #0f172a !important;
    border: none !important;
    outline: none !important;
    box-shadow: none !important;
    transform: none !important;
}

/* Tooltip Pop-up do Botão de Informação */
.pj-info-tooltip-content,
#view_dashboard .pj-info-tooltip-content {
    background: #19222e !important;
    color: #f8fafc !important;
    border: none !important;
    outline: none !important;
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.45) !important;
    border-radius: 8px !important;
    font-size: 12px !important;
    line-height: 1.4 !important;
}

.light .pj-info-tooltip-content,
.light #view_dashboard .pj-info-tooltip-content,
[data-theme="light"] .pj-info-tooltip-content,
[data-theme="light"] #view_dashboard .pj-info-tooltip-content {
    background: #ffffff !important;
    color: #0f172a !important;
    border: none !important;
    outline: none !important;
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.12) !important;
}

.light .pj-info-tooltip-content strong,
.light #view_dashboard .pj-info-tooltip-content strong,
[data-theme="light"] .pj-info-tooltip-content strong,
[data-theme="light"] #view_dashboard .pj-info-tooltip-content strong {
    color: #0f172a !important;
}

.light .pj-info-tooltip-content p,
.light #view_dashboard .pj-info-tooltip-content p,
[data-theme="light"] .pj-info-tooltip-content p,
[data-theme="light"] #view_dashboard .pj-info-tooltip-content p {
    color: #475569 !important;
}

/* NÚMEROS PRINCIPAIS EM BRANCO NO ESCURO (E ESCURO TÍTULO NO CLARO) */
.pj-strategy-card-val {
    font-family: var(--pj-font-numbers, 'DM Sans', sans-serif) !important;
    font-size: 26px !important;
    font-weight: 800 !important;
    line-height: 1.1 !important;
    letter-spacing: -0.4px !important;
    margin-bottom: 2px !important;
    color: var(--strategy-val-color, #ffffff) !important;
}

.light .pj-strategy-card-val,
[data-theme="light"] .pj-strategy-card-val {
    color: var(--strategy-val-color, #0f172a) !important;
}

.pj-strategy-card-meta {
    font-size: 11px !important;
    font-weight: 600 !important;
    color: var(--pj-text-muted, #64748b) !important;
}

.pj-strategy-meta-tag {
    color: var(--pj-text-muted, #64748b) !important;
    font-size: 10px !important;
    text-transform: uppercase !important;
    margin-right: 4px;
}

.pj-strategy-meta-val {
    color: var(--pj-text-title, #f8fafc) !important;
    font-weight: 700 !important;
}

.light .pj-strategy-meta-val {
    color: #0f172a !important;
}

/* BARRAS DE PROGRESSO */
.pj-mini-bars-wrap {
    display: flex;
    flex-direction: column;
    gap: 8px;
    margin: 4px 0;
}

.pj-mini-bar-group {
    display: flex;
    flex-direction: column;
    gap: 3px;
}

.pj-mini-bar-header {
    display: flex;
    justify-content: space-between;
    font-size: 10px;
    color: var(--pj-text-muted, #64748b);
    font-weight: 600;
    white-space: nowrap;
}

/* ==========================================================================
   LINHAS DE PROGRESSO E RÉGUAS DOS CARDS (ALTO CONTRASTE & PRESERVAÇÃO NO HOVER)
   ========================================================================== */
.pj-mini-bar-track {
    width: 100% !important;
    height: 6px !important;
    background-color: rgba(255, 255, 255, 0.16) !important;
    border-radius: 999px !important;
    overflow: hidden !important;
    border: none !important;
    box-shadow: none !important;
    transition: background-color 0.2s ease !important;
}

.pj-mini-bar-fill {
    height: 100% !important;
    border-radius: 999px !important;
    transition: width 0.4s ease !important;
}

/* Régua Segmentada de Atendimento */
.pj-mini-segmented-track {
    display: flex !important;
    height: 6px !important;
    background-color: rgba(255, 255, 255, 0.16) !important;
    border-radius: 999px !important;
    overflow: hidden !important;
    width: 100% !important;
    border: none !important;
    box-shadow: none !important;
    transition: background-color 0.2s ease !important;
}

.pj-seg-comp {
    background-color: #10B981 !important;
    height: 100% !important;
    transition: width 0.3s ease !important;
}

.pj-seg-nao {
    background-color: #EF4444 !important;
    height: 100% !important;
    transition: width 0.3s ease !important;
}

.pj-seg-pend {
    background-color: rgba(255, 255, 255, 0.20) !important;
    height: 100% !important;
    transition: background-color 0.2s ease, width 0.3s ease !important;
}

/* HOVER NO CARD: Acelera contraste para que as linhas NUNCA desapareçam */
.pj-strategy-card:hover .pj-mini-bar-track,
.pj-strategy-card:hover .pj-mini-segmented-track {
    background-color: rgba(255, 255, 255, 0.25) !important;
}

.pj-strategy-card:hover .pj-seg-pend {
    background-color: rgba(255, 255, 255, 0.32) !important;
}

/* MODO CLARO (LIGHT): Linhas sempre nítidas e contrastadas em repouso e hover */
.light .pj-mini-bar-track,
[data-theme="light"] .pj-mini-bar-track,
.light .pj-mini-segmented-track,
[data-theme="light"] .pj-mini-segmented-track,
.light .pj-card-regua-track,
[data-theme="light"] .pj-card-regua-track {
    background-color: #CBD5E1 !important;
}

.light .pj-seg-pend,
[data-theme="light"] .pj-seg-pend,
.light .pj-card-regua-seg-pend,
[data-theme="light"] .pj-card-regua-seg-pend {
    background-color: #CBD5E1 !important;
}

.light .pj-strategy-card:hover .pj-mini-bar-track,
[data-theme="light"] .pj-strategy-card:hover .pj-mini-bar-track,
.light .pj-strategy-card:hover .pj-mini-segmented-track,
[data-theme="light"] .pj-strategy-card:hover .pj-mini-segmented-track,
.light .pj-strategy-card:hover .pj-card-regua-track,
[data-theme="light"] .pj-strategy-card:hover .pj-card-regua-track {
    background-color: #94A3B8 !important;
}

.light .pj-strategy-card:hover .pj-seg-pend,
[data-theme="light"] .pj-strategy-card:hover .pj-seg-pend,
.light .pj-strategy-card:hover .pj-card-regua-seg-pend,
[data-theme="light"] .pj-strategy-card:hover .pj-card-regua-seg-pend {
    background-color: #94A3B8 !important;
}

/* RÉGUA DE PROGRESSO M3 */
.pj-card-regua-track {
    display: flex !important;
    width: 100% !important;
    height: 6px !important;
    background-color: rgba(255, 255, 255, 0.16) !important;
    border-radius: 999px !important;
    overflow: hidden !important;
    margin: 8px 0 10px 0 !important;
    border: none !important;
    box-shadow: none !important;
}

.pj-card-regua-seg-comp {
    background-color: #10B981 !important;
    height: 100% !important;
    transition: width 0.3s ease !important;
}

.pj-card-regua-seg-nao {
    background-color: #EF4444 !important;
    height: 100% !important;
    transition: width 0.3s ease !important;
}

.pj-card-regua-seg-pend {
    background-color: rgba(255, 255, 255, 0.20) !important;
    height: 100% !important;
    transition: background-color 0.2s ease, width 0.3s ease !important;
}

/* BOTÃO DE AÇÃO DOS CARDS (SEM BORDA / TONAL M3 STATE LAYER) */
.pj-strategy-card-action-btn {
    width: 100% !important;
    padding: 9px 12px !important;
    border-radius: 100px !important;
    font-size: 11.5px !important;
    font-weight: 700 !important;
    cursor: pointer !important;
    border: none !important;
    outline: none !important;
    box-shadow: none !important;
    transform: none !important;
    background-color: var(--btn-card-bg, #27394f) !important;
    color: var(--btn-card-color, #f8fafc) !important;
    transition: background-color 0.2s cubic-bezier(0.2, 0, 0, 1), color 0.2s cubic-bezier(0.2, 0, 0, 1) !important;
    text-align: center !important;
}

.pj-strategy-card-action-btn:hover {
    background-color: var(--btn-card-hover-bg, #344c68) !important;
    color: var(--btn-card-hover-color, #ffffff) !important;
    transform: none !important;
    box-shadow: none !important;
}

.light .pj-strategy-card-action-btn,
[data-theme="light"] .pj-strategy-card-action-btn {
    background: #94a3b8 !important;
    background-color: #94a3b8 !important;
    color: #ffffff !important;
    box-shadow: none !important;
}

.light .pj-strategy-card-action-btn:hover,
[data-theme="light"] .pj-strategy-card-action-btn:hover {
    background: #0369a1 !important;
    background-color: #0369a1 !important;
    color: #ffffff !important;
    transform: none !important;
    box-shadow: none !important;
}

/* ==========================================================================
   NOVO CONCEITO DE CARD EXECUTIVO DE ESTRATÉGIA (MATERIAL 3)
   ========================================================================== */
.pj-strategy-card-month {
    font-size: 11px !important;
    font-weight: 700 !important;
    text-transform: uppercase !important;
    letter-spacing: 0.6px !important;
    color: var(--pj-text-muted, #94a3b8) !important;
}

.pj-card-op-label {
    font-size: 11px !important;
    font-weight: 700 !important;
    text-transform: uppercase !important;
    letter-spacing: 0.6px !important;
    color: var(--pj-text-muted, #94a3b8) !important;
    margin-bottom: 3px !important;
}

.pj-card-big-val {
    font-family: var(--pj-font-numbers, 'DM Sans', sans-serif) !important;
    font-size: 26px !important;
    font-weight: 800 !important;
    line-height: 1.15 !important;
    letter-spacing: -0.5px !important;
    color: var(--pj-text-title, #f8fafc) !important;
    font-variant-numeric: tabular-nums !important;
}

.light .pj-card-big-val,
[data-theme="light"] .pj-card-big-val {
    color: #0f172a !important;
}

.pj-card-explanation {
    font-size: 12px !important;
    line-height: 1.4 !important;
    color: var(--pj-text-muted, #94a3b8) !important;
    margin-top: 4px !important;
    margin-bottom: 0 !important;
}

.pj-card-divider {
    height: 1px !important;
    width: 100% !important;
    background: rgba(255, 255, 255, 0.08) !important;
    margin: 2px 0 !important;
    border: none !important;
}

.light .pj-card-divider,
[data-theme="light"] .pj-card-divider {
    background: rgba(0, 0, 0, 0.08) !important;
}

.pj-card-columns {
    display: grid !important;
    grid-template-columns: 1fr 1fr !important;
    gap: 16px !important;
}

.pj-card-col {
    display: flex !important;
    flex-direction: column !important;
    gap: 2px !important;
}

.pj-col-label {
    font-size: 10.5px !important;
    font-weight: 700 !important;
    text-transform: uppercase !important;
    letter-spacing: 0.5px !important;
    color: var(--pj-text-muted, #94a3b8) !important;
}

.pj-col-num {
    font-family: var(--pj-font-numbers, 'DM Sans', sans-serif) !important;
    font-size: 22px !important;
    font-weight: 800 !important;
    line-height: 1.1 !important;
    color: var(--pj-text-title, #f8fafc) !important;
    font-variant-numeric: tabular-nums !important;
    margin: 2px 0 !important;
}

.light .pj-col-num,
[data-theme="light"] .pj-col-num {
    color: #0f172a !important;
}

.pj-col-sub {
    font-size: 11.5px !important;
    color: var(--pj-text-muted, #94a3b8) !important;
}

.pj-col-val {
    font-family: var(--pj-font-numbers, 'DM Sans', sans-serif) !important;
    font-size: 12.5px !important;
    font-weight: 600 !important;
    color: var(--pj-text-secondary, #cbd5e1) !important;
    font-variant-numeric: tabular-nums !important;
    margin-top: 1px !important;
}

.light .pj-col-val,
[data-theme="light"] .pj-col-val {
    color: #475569 !important;
}

.pj-card-resolution {
    display: flex !important;
    flex-direction: column !important;
    gap: 6px !important;
}

.pj-res-header {
    display: flex !important;
    justify-content: space-between !important;
    align-items: baseline !important;
}

.pj-res-title {
    font-size: 13.5px !important;
    font-weight: 700 !important;
    color: var(--pj-text-title, #f8fafc) !important;
}

.light .pj-res-title,
[data-theme="light"] .pj-res-title {
    color: #0f172a !important;
}

.pj-res-stats {
    font-family: var(--pj-font-numbers, 'DM Sans', sans-serif) !important;
    font-size: 12px !important;
    font-weight: 600 !important;
    color: var(--pj-text-muted, #94a3b8) !important;
    font-variant-numeric: tabular-nums !important;
}

.pj-res-bar-track {
    width: 100% !important;
    height: 8px !important;
    background-color: rgba(255, 255, 255, 0.12) !important;
    border-radius: 999px !important;
    overflow: hidden !important;
    margin-bottom: 2px !important;
}

.light .pj-res-bar-track,
[data-theme="light"] .pj-res-bar-track {
    background-color: #cbd5e1 !important;
}

.pj-res-bar-fill {
    height: 100% !important;
    border-radius: 999px !important;
    transition: width 0.4s ease !important;
}

.pj-res-legend {
    display: flex !important;
    justify-content: space-between !important;
    font-size: 11px !important;
    color: var(--pj-text-muted, #94a3b8) !important;
}

.pj-legend-item {
    display: flex !important;
    align-items: center !important;
    gap: 5px !important;
}

.pj-legend-dot {
    width: 7px !important;
    height: 7px !important;
    border-radius: 50% !important;
    display: inline-block !important;
}

.pj-dot-muted {
    background-color: #64748b !important;
}

.pj-card-footer-metrics {
    display: flex !important;
    justify-content: space-between !important;
    align-items: flex-end !important;
    padding-top: 4px !important;
}

.pj-footer-metric {
    display: flex !important;
    flex-direction: column !important;
    gap: 2px !important;
}

.pj-footer-metric.text-right {
    text-align: right !important;
    align-items: flex-end !important;
}

.pj-footer-lbl {
    font-size: 10px !important;
    font-weight: 700 !important;
    text-transform: uppercase !important;
    letter-spacing: 0.5px !important;
    color: var(--pj-text-muted, #94a3b8) !important;
}

.pj-footer-val {
    font-family: var(--pj-font-numbers, 'DM Sans', sans-serif) !important;
    font-size: 17px !important;
    font-weight: 800 !important;
    color: var(--pj-text-title, #f8fafc) !important;
    font-variant-numeric: tabular-nums !important;
}

.light .pj-footer-val,
[data-theme="light"] .pj-footer-val {
    color: #0f172a !important;
}

.pj-strategy-footer {
    border: none !important;
    padding-top: 14px;
    margin-top: 4px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-wrap: wrap;
    gap: 10px;
    font-size: 11px;
    color: var(--pj-text-muted, #64748b);
}

.light .pj-strategy-footer {
    border: none !important;
}

.pj-strategy-shortcuts {
    display: flex;
    gap: 8px;
}

.btn-shortcut-antecipar {
    background: rgba(245, 158, 11, 0.15) !important;
    color: var(--cond-inativos, #fbbf24) !important;
    padding: 5px 12px !important;
    border-radius: var(--pj-radius-btn, 24px) !important;
    font-size: 11px !important;
    font-weight: 700 !important;
    cursor: pointer !important;
    white-space: nowrap !important;
    border: none !important;
    box-shadow: none !important;
    transform: none !important;
    transition: background-color 0.2s ease !important;
}

.btn-shortcut-antecipar:hover {
    background: rgba(245, 158, 11, 0.25) !important;
    transform: none !important;
    box-shadow: none !important;
}

.light .btn-shortcut-antecipar {
    background: #fef3c7 !important;
    color: #b45309 !important;
}

.light .btn-shortcut-antecipar:hover {
    background: #fde68a !important;
}

.btn-shortcut-recuperar {
    background: rgba(56, 189, 248, 0.15) !important;
    color: #38bdf8 !important;
    padding: 5px 12px !important;
    border-radius: var(--pj-radius-btn, 24px) !important;
    font-size: 11px !important;
    font-weight: 700 !important;
    cursor: pointer !important;
    white-space: nowrap !important;
    border: none !important;
    box-shadow: none !important;
    transform: none !important;
    transition: background-color 0.2s ease !important;
}

.btn-shortcut-recuperar:hover {
    background: rgba(56, 189, 248, 0.25) !important;
    transform: none !important;
    box-shadow: none !important;
}

.light .btn-shortcut-recuperar {
    background: #e0f2fe !important;
    color: #0369a1 !important;
}

.light .btn-shortcut-recuperar:hover {
    background: #bae6fd !important;
}

/* ============================================================== */
/* 9. QUALIDADE DO FATURAMENTO (BARRA FINA SLIM 6PX)              */
/* ============================================================== */
.pj-performance-card {
    background-color: var(--pj-bg-card, #090e15) !important;
    border-radius: var(--pj-radius-card, 16px) !important;
    box-shadow: none !important;
    padding: 20px 24px !important;
    margin-bottom: 20px !important;
    border: none !important;
}

.light .pj-performance-card,
[data-theme="light"] .pj-performance-card {
    background-color: #ffffff !important;
    box-shadow: none !important;
}

.pj-perf-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 14px;
    flex-wrap: wrap;
    gap: 8px;
}

.pj-perf-bar-stacked {
    height: 6px !important;
    border-radius: 9999px !important;
    overflow: hidden !important;
    display: flex !important;
    background: var(--track-bg, rgba(255, 255, 255, 0.12)) !important;
    margin-bottom: 16px !important;
    border: none !important;
    box-shadow: none !important;
}

.pj-perf-bar-seg-up {
    background: #10b981 !important;
    height: 100% !important;
    transition: width 0.4s ease;
}

.pj-perf-bar-seg-eq {
    background: #f59e0b !important;
    height: 100% !important;
    transition: width 0.4s ease;
}

.pj-perf-bar-seg-down {
    background: #ef4444 !important;
    height: 100% !important;
    transition: width 0.4s ease;
}

.pj-perf-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 14px;
}

@media (max-width: 768px) {
    .pj-perf-grid {
        grid-template-columns: 1fr;
    }
}

.pj-perf-item {
    background-color: var(--pj-bg-inset, #19222e) !important;
    border-radius: var(--pj-radius-inset, 10px) !important;
    padding: 14px 16px !important;
    cursor: pointer !important;
    border: none !important;
    box-shadow: none !important;
    transform: none !important;
    transition: background-color 0.2s cubic-bezier(0.2, 0, 0, 1) !important;
}

.pj-perf-item:hover {
    background-color: var(--pj-hover-card, #202b3a) !important;
    transform: none !important;
    box-shadow: none !important;
    border: none !important;
    outline: none !important;
}

.light .pj-perf-item,
[data-theme="light"] .pj-perf-item {
    background-color: #f2f4f7 !important;
    border: none !important;
    outline: none !important;
}

.light .pj-perf-item:hover,
[data-theme="light"] .pj-perf-item:hover {
    background-color: var(--pj-hover-card, #e4e8ee) !important;
    transform: none !important;
    box-shadow: none !important;
    border: none !important;
    outline: none !important;
}

.pj-perf-item-title {
    font-size: 11px;
    font-weight: 600;
    display: flex;
    align-items: center;
    gap: 5px;
    margin-bottom: 4px;
    white-space: nowrap;
}

.pj-perf-item-val {
    font-family: var(--pj-font-numbers, 'DM Sans', sans-serif) !important;
    font-size: 19px !important;
    font-weight: var(--pj-font-weight-num, 700) !important;
    line-height: 1.2 !important;
    color: var(--pj-text-title, #f8fafc) !important;
}

.light .pj-perf-item-val {
    color: #0f172a !important;
}

.pj-perf-item-sub {
    font-size: 10.5px !important;
    color: var(--pj-text-muted, #64748b) !important;
}

/* ============================================================== */
/* 10. POTENCIAL DA CARTEIRA POR STATUS DE COMPRA (9 CARDS 3X3)   */
/* ============================================================== */
.pj-categories-panel {
    background-color: var(--pj-bg-card, #090e15) !important;
    border-radius: var(--pj-radius-card, 16px) !important;
    box-shadow: none !important;
    padding: 20px 24px !important;
    margin-bottom: 20px !important;
    border: none !important;
}

.light .pj-categories-panel,
[data-theme="light"] .pj-categories-panel {
    background-color: #ffffff !important;
    box-shadow: none !important;
}

.pj-categories-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 14px;
    margin-top: 14px;
}

@media (max-width: 1024px) {
    .pj-categories-grid {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 640px) {
    .pj-categories-grid {
        grid-template-columns: 1fr;
    }
}

.pj-category-card {
    background-color: var(--pj-bg-inset, #19222e) !important;
    border-radius: var(--pj-radius-inset, 10px) !important;
    padding: 14px 16px !important;
    cursor: pointer !important;
    display: flex !important;
    flex-direction: column !important;
    justify-content: space-between !important;
    min-height: 94px !important;
    border: none !important;
    box-shadow: none !important;
    transform: none !important;
    transition: background-color 0.2s cubic-bezier(0.2, 0, 0, 1) !important;
}

.pj-category-card:hover {
    background-color: var(--pj-hover-card, #202b3a) !important;
    transform: none !important;
    box-shadow: none !important;
    border: none !important;
}

.light .pj-category-card,
[data-theme="light"] .pj-category-card {
    background-color: #f2f4f7 !important;
}

.light .pj-category-card:hover,
[data-theme="light"] .pj-category-card:hover {
    background-color: var(--pj-hover-card, #e4e8ee) !important;
    transform: none !important;
    box-shadow: none !important;
    border: none !important;
}

.pj-category-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 6px;
}

.pj-category-name {
    font-size: 10.5px !important;
    font-weight: 700 !important;
    letter-spacing: 0.3px !important;
    white-space: nowrap !important;
}

.pj-category-pct-badge {
    font-size: 9.5px !important;
    font-weight: 700 !important;
    padding: 2px 6px !important;
    border-radius: 4px !important;
    background: rgba(56, 189, 248, 0.15) !important;
    color: #38bdf8 !important;
    white-space: nowrap !important;
    border: none !important;
    box-shadow: none !important;
}

.light .pj-category-pct-badge {
    background: #e0f2fe !important;
    color: #0369a1 !important;
}

.pj-category-val {
    font-family: var(--pj-font-numbers, 'DM Sans', sans-serif) !important;
    font-size: 19px !important;
    font-weight: var(--pj-font-weight-num, 700) !important;
    color: var(--pj-text-title, #f8fafc) !important;
    line-height: 1.2 !important;
}

.light .pj-category-val {
    color: #0f172a !important;
}

.pj-category-sub,
.pj-category-subline {
    font-size: 10.5px !important;
    color: var(--pj-text-muted, #64748b) !important;
    margin-top: 2px !important;
    white-space: nowrap !important;
}

/* ============================================================== */
/* 11. KPIS COMPLEMENTARES CLICÁVEIS (SEM EMOJIS POLUÍDOS)        */
/* ============================================================== */
.pj-kpi-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 14px;
}

@media (max-width: 1024px) {
    .pj-kpi-grid {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 640px) {
    .pj-kpi-grid {
        grid-template-columns: 1fr;
    }
}

.pj-kpi-card {
    background-color: var(--pj-bg-card, #090e15) !important;
    border-radius: var(--pj-radius-card, 16px) !important;
    box-shadow: none !important;
    padding: 18px 20px !important;
    cursor: pointer !important;
    border: none !important;
    transform: none !important;
    transition: background-color 0.2s cubic-bezier(0.2, 0, 0, 1) !important;
}

.pj-kpi-card:hover {
    background-color: var(--pj-hover-container, #111925) !important;
    transform: none !important;
    box-shadow: none !important;
    border: none !important;
}

.light .pj-kpi-card,
[data-theme="light"] .pj-kpi-card {
    background-color: #ffffff !important;
    box-shadow: none !important;
}

.light .pj-kpi-card:hover,
[data-theme="light"] .pj-kpi-card:hover {
    background-color: var(--pj-hover-container, #f8fafc) !important;
    transform: none !important;
    box-shadow: none !important;
    border: none !important;
}

.pj-kpi-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    font-size: 11px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.4px;
    color: var(--pj-text-muted, #64748b);
    margin-bottom: 8px;
    white-space: nowrap;
}

.pj-kpi-value {
    font-family: var(--pj-font-numbers, 'DM Sans', sans-serif) !important;
    font-size: 22px !important;
    font-weight: var(--pj-font-weight-num, 700) !important;
    color: var(--pj-text-title, #f8fafc) !important;
    line-height: 1.1 !important;
    margin-bottom: 4px !important;
}

.light .pj-kpi-value {
    color: #0f172a !important;
}

.pj-kpi-sub {
    font-size: 10.5px !important;
    color: var(--pj-text-muted, #64748b) !important;
    white-space: nowrap !important;
}


/* ==========================================================================
   ABA CARTEIRA DE CLIENTES (#view_clientes) - MATERIAL 3 FLAT MODERNIZATION
   Baseado 100% no Protótipo Oficial: static/sandbox_vela/clientes.html
   ========================================================================== */

/* 1. Reset Absoluto de Bordas e Sombras da Aba Clientes (Zero Drop Shadow Flat) */
#view_clientes .pj-filters-card,
#view_clientes .pj-filter-section-panel,
#view_clientes .pj-table-container,
#view_clientes .pj-filter-chip,
#view_clientes .btn-limpar-filtros-red,
#view_clientes .pj-search-input,
#view_clientes .pj-filter-select,
#view_clientes .pj-pagination-bar,
#view_clientes .pj-footer-page-pill,
#view_clientes .pj-footer-btn,
#view_clientes .pj-footer-select-container,
#view_clientes .pj-footer-select,
#view_clientes .pj-footer-page-input,
#view_clientes .pj-semestral-pill,
#view_clientes .pj-btn-acoes-trigger,
#view_clientes .pj-note-icon-badge,
#view_clientes .pj-badge,
#view_clientes .pj-tag-perfil,
#view_clientes .pj-disc-tag {
    box-shadow: none !important;
    outline: none !important;
}

/* 2. Container dos Filtros (#view_clientes .pj-filters-card) */
#view_clientes .pj-filters-card {
    background-color: #0e1620 !important;
    border-radius: 14px !important;
    border: none !important;
    padding: 14px 16px !important;
    display: flex !important;
    flex-direction: column !important;
    gap: 10px !important;
    margin-bottom: 16px !important;
}

.light #view_clientes .pj-filters-card,
[data-theme="light"] #view_clientes .pj-filters-card {
    background-color: #ffffff !important;
    border: none !important;
}

/* Subpainéis de Filtro (Recorrência, Status de Ação, Busca) */
#view_clientes .pj-filter-section-panel {
    background-color: #0a0f17 !important;
    border-radius: 10px !important;
    border: none !important;
    padding: 20px 14px !important;
    display: flex !important;
    flex-direction: column !important;
    gap: 8px !important;
    transition: background-color 0.2s ease !important;
}

.light #view_clientes .pj-filter-section-panel,
[data-theme="light"] #view_clientes .pj-filter-section-panel {
    background-color: #f1f5f9 !important;
    border: none !important;
}

/* Header dos Subpainéis de Filtro */
#view_clientes .pj-filter-row-header {
    display: flex !important;
    justify-content: space-between !important;
    align-items: center !important;
    font-size: 10.5px !important;
    font-weight: 800 !important;
    text-transform: uppercase !important;
    letter-spacing: 0.5px !important;
    color: #94a3b8 !important;
}

.light #view_clientes .pj-filter-row-header,
[data-theme="light"] #view_clientes .pj-filter-row-header {
    color: #475569 !important;
}

#view_clientes .pj-panel-badge-tag {
    font-size: 9px !important;
    font-weight: 700 !important;
    text-transform: uppercase !important;
    letter-spacing: 0.5px !important;
    padding: 1px 6px !important;
    border-radius: 4px !important;
    border: none !important;
    background: rgba(148, 163, 184, 0.15) !important;
    color: #94a3b8 !important;
}

.light #view_clientes .pj-panel-badge-tag,
[data-theme="light"] #view_clientes .pj-panel-badge-tag {
    background: rgba(0, 0, 0, 0.06) !important;
    color: #64748b !important;
}

#view_clientes .pj-panel-badge-tag.pj-tag-multi {
    background: rgba(59, 130, 246, 0.14) !important;
    color: #3b82f6 !important;
}

.light #view_clientes .pj-panel-badge-tag.pj-tag-multi,
[data-theme="light"] #view_clientes .pj-panel-badge-tag.pj-tag-multi {
    background: #E0F2FE !important;
    color: #0284C7 !important;
}

/* 3. Chips de Filtro (Recorrência & Status da Compra) */
#view_clientes .pj-filter-chip {
    font-size: 11px !important;
    font-weight: 600 !important;
    padding: 10px 15px !important;
    border-radius: 9999px !important;
    border: none !important;
    cursor: pointer !important;
    display: inline-flex !important;
    align-items: center !important;
    gap: 5px !important;
    user-select: none !important;
    transform: none !important;
    box-shadow: none !important;
    background-color: #141c27 !important;
    color: #cbd5e1 !important;
    transition: background-color 0.15s ease, color 0.15s ease !important;
}

#view_clientes .pj-filter-chip:hover {
    background-color: #2a4877 !important;
    color: #f8fafc !important;
    transform: none !important;
    box-shadow: none !important;
}

.light #view_clientes .pj-filter-chip,
[data-theme="light"] #view_clientes .pj-filter-chip {
    background-color: #ffffff !important;
    color: #1e293b !important;
}

.light #view_clientes .pj-filter-chip:hover,
[data-theme="light"] #view_clientes .pj-filter-chip:hover {
    background-color: #e2e8f0 !important;
    color: #0f172a !important;
    transform: none !important;
    box-shadow: none !important;
}

/* ============================================================== */
/* CHIPS ATIVOS - TEMA ESCURO (DARK MODE)                         */
/* ============================================================== */
/* Botões Reset em Vermelho Carmesim P&J */
#view_clientes .pj-filter-chip[data-recorrencia=""].active,
#view_clientes .pj-filter-chip[data-status=""].active {
    /* background-color: #94a3b8 !important; */
    color: #ffffff !important;
    font-weight: 700 !important;
    box-shadow: none !important;
}

/* Status de Ação - Escuro */
#view_clientes .pj-filter-chip[data-status="MÊS DE COMPRA"].active {
    background-color: rgba(45, 212, 191, 0.22) !important;
    color: #2dd4bf !important;
    box-shadow: none !important;
}

#view_clientes .pj-filter-chip[data-status="JÁ COMPROU"].active {
    background-color: rgba(74, 222, 128, 0.22) !important;
    color: #4ade80 !important;
    box-shadow: none !important;
}

#view_clientes .pj-filter-chip[data-status="NOVO CLIENTE"].active {
    background-color: rgba(129, 140, 248, 0.22) !important;
    color: #818cf8 !important;
    box-shadow: none !important;
}

#view_clientes .pj-filter-chip[data-status="ATRASADO"].active {
    background-color: rgba(251, 146, 60, 0.22) !important;
    color: #fb923c !important;
    box-shadow: none !important;
}

#view_clientes .pj-filter-chip[data-status="ANTECIPAR"].active {
    background-color: rgba(234, 179, 8, 0.22) !important;
    color: #eab308 !important;
    box-shadow: none !important;
}

#view_clientes .pj-filter-chip[data-status="RECUPERAR"].active {
    background-color: rgba(56, 189, 248, 0.22) !important;
    color: #38bdf8 !important;
    box-shadow: none !important;
}

#view_clientes .pj-filter-chip[data-status="SONDAGEM"].active {
    background-color: rgba(249, 115, 22, 0.22) !important;
    color: #f97316 !important;
    box-shadow: none !important;
}

#view_clientes .pj-filter-chip[data-status="NUNCA COMPROU"].active {
    background-color: rgba(148, 163, 184, 0.22) !important;
    color: #cbd5e1 !important;
    box-shadow: none !important;
}

#view_clientes .pj-filter-chip[data-status="NÃO VAI COMPRAR"].active {
    background-color: rgba(100, 116, 139, 0.22) !important;
    color: #94a3b8 !important;
    box-shadow: none !important;
}

#view_clientes .pj-filter-chip[data-status="INADIMPLENTE"].active {
    background-color: rgba(248, 113, 113, 0.22) !important;
    color: #f87171 !important;
    box-shadow: none !important;
}

/* Recorrência - Escuro */
#view_clientes .pj-filter-chip[data-recorrencia="novo_mes"].active,
#view_clientes .pj-filter-chip[data-recorrencia="novo"].active {
    background-color: rgba(129, 140, 248, 0.22) !important;
    color: #818cf8 !important;
    box-shadow: none !important;
}

#view_clientes .pj-filter-chip[data-recorrencia="ativo"].active {
    background-color: rgba(74, 222, 128, 0.22) !important;
    color: #4ade80 !important;
    box-shadow: none !important;
}

#view_clientes .pj-filter-chip[data-recorrencia="inativo"].active {
    background-color: rgba(251, 191, 36, 0.22) !important;
    color: #fbbf24 !important;
    box-shadow: none !important;
}

#view_clientes .pj-filter-chip[data-recorrencia="perdido"].active {
    background-color: rgba(244, 114, 182, 0.22) !important;
    color: #f472b6 !important;
    box-shadow: none !important;
}

#view_clientes .pj-filter-chip[data-recorrencia="nunca_comprou"].active {
    background-color: rgba(148, 163, 184, 0.22) !important;
    color: #cbd5e1 !important;
    box-shadow: none !important;
}

/* ============================================================== */
/* CHIPS ATIVOS - TEMA CLARO (LIGHT MODE)                         */
/* ============================================================== */
/* Reset em Vermelho Carmesim P&J no Claro */
.light #view_clientes .pj-filter-chip[data-recorrencia=""].active,
.light #view_clientes .pj-filter-chip[data-status=""].active,
[data-theme="light"] #view_clientes .pj-filter-chip[data-recorrencia=""].active,
[data-theme="light"] #view_clientes .pj-filter-chip[data-status=""].active {
    background-color: #647491 !important;
    color: #ffffff !important;
    font-weight: 700 !important;
    box-shadow: none !important;
}

/* Status de Ação - Claro */
.light #view_clientes .pj-filter-chip[data-status="MÊS DE COMPRA"].active,
[data-theme="light"] #view_clientes .pj-filter-chip[data-status="MÊS DE COMPRA"].active {
    background-color: #ccfbf1 !important;
    color: #0f766e !important;
    box-shadow: none !important;
}

.light #view_clientes .pj-filter-chip[data-status="JÁ COMPROU"].active,
[data-theme="light"] #view_clientes .pj-filter-chip[data-status="JÁ COMPROU"].active {
    background-color: #d1fae5 !important;
    color: #047857 !important;
    box-shadow: none !important;
}

.light #view_clientes .pj-filter-chip[data-status="NOVO CLIENTE"].active,
[data-theme="light"] #view_clientes .pj-filter-chip[data-status="NOVO CLIENTE"].active {
    background-color: #e0e7ff !important;
    color: #4338ca !important;
    box-shadow: none !important;
}

.light #view_clientes .pj-filter-chip[data-status="ATRASADO"].active,
[data-theme="light"] #view_clientes .pj-filter-chip[data-status="ATRASADO"].active {
    background-color: #ffedd5 !important;
    color: #c2410c !important;
    box-shadow: none !important;
}

.light #view_clientes .pj-filter-chip[data-status="ANTECIPAR"].active,
[data-theme="light"] #view_clientes .pj-filter-chip[data-status="ANTECIPAR"].active {
    background-color: #fef9c3 !important;
    color: #a16207 !important;
    box-shadow: none !important;
}

.light #view_clientes .pj-filter-chip[data-status="RECUPERAR"].active,
[data-theme="light"] #view_clientes .pj-filter-chip[data-status="RECUPERAR"].active {
    background-color: #e0f2fe !important;
    color: #0369a1 !important;
    box-shadow: none !important;
}

.light #view_clientes .pj-filter-chip[data-status="SONDAGEM"].active,
[data-theme="light"] #view_clientes .pj-filter-chip[data-status="SONDAGEM"].active {
    background-color: #ffedd5 !important;
    color: #c2410c !important;
    box-shadow: none !important;
}

.light #view_clientes .pj-filter-chip[data-status="NUNCA COMPROU"].active,
[data-theme="light"] #view_clientes .pj-filter-chip[data-status="NUNCA COMPROU"].active {
    background-color: #e2e8f0 !important;
    color: #334155 !important;
    box-shadow: none !important;
}

.light #view_clientes .pj-filter-chip[data-status="NÃO VAI COMPRAR"].active,
[data-theme="light"] #view_clientes .pj-filter-chip[data-status="NÃO VAI COMPRAR"].active {
    background-color: #e2e8f0 !important;
    color: #475569 !important;
    box-shadow: none !important;
}

.light #view_clientes .pj-filter-chip[data-status="INADIMPLENTE"].active,
[data-theme="light"] #view_clientes .pj-filter-chip[data-status="INADIMPLENTE"].active {
    background-color: #fee2e2 !important;
    color: #b91c1c !important;
    box-shadow: none !important;
}

/* Recorrência - Claro */
.light #view_clientes .pj-filter-chip[data-recorrencia="novo_mes"].active,
.light #view_clientes .pj-filter-chip[data-recorrencia="novo"].active,
[data-theme="light"] #view_clientes .pj-filter-chip[data-recorrencia="novo_mes"].active,
[data-theme="light"] #view_clientes .pj-filter-chip[data-recorrencia="novo"].active {
    background-color: #e0e7ff !important;
    color: #4338ca !important;
    box-shadow: none !important;
}

.light #view_clientes .pj-filter-chip[data-recorrencia="ativo"].active,
[data-theme="light"] #view_clientes .pj-filter-chip[data-recorrencia="ativo"].active {
    background-color: #d1fae5 !important;
    color: #047857 !important;
    box-shadow: none !important;
}

.light #view_clientes .pj-filter-chip[data-recorrencia="inativo"].active,
[data-theme="light"] #view_clientes .pj-filter-chip[data-recorrencia="inativo"].active {
    background-color: #fef3c7 !important;
    color: #b45309 !important;
    box-shadow: none !important;
}

.light #view_clientes .pj-filter-chip[data-recorrencia="perdido"].active,
[data-theme="light"] #view_clientes .pj-filter-chip[data-recorrencia="perdido"].active {
    background-color: #fce7f3 !important;
    color: #be185d !important;
    box-shadow: none !important;
}

.light #view_clientes .pj-filter-chip[data-recorrencia="nunca_comprou"].active,
[data-theme="light"] #view_clientes .pj-filter-chip[data-recorrencia="nunca_comprou"].active {
    background-color: #e2e8f0 !important;
    color: #334155 !important;
    box-shadow: none !important;
}

/* 4. Campo de Busca, Selects Secundários & Botão Limpar Filtros */
#view_clientes .pj-search-input {
    background-color: #141c27 !important;
    color: #f8fafc !important;
    border: none !important;
    border-radius: 100px !important;
    padding: 10px 15px;
    font-size: 11.5px !important;
    /* box-shadow: 0 1px 2px rgba(0,0,0,0.04) !important; */
    transition: background-color 0.2s ease !important;
}

#view_clientes .pj-search-input::placeholder {
    color: #94a3b8 !important;
}

.light #view_clientes .pj-search-input,
[data-theme="light"] #view_clientes .pj-search-input {
    background-color: #ffffff !important;
    color: #0f172a !important;
    border: none !important;
}

.light #view_clientes .pj-search-input::placeholder,
[data-theme="light"] #view_clientes .pj-search-input::placeholder {
    color: #64748b !important;
}

#view_clientes .pj-filter-select {
    background-color: #141c27 !important;
    color: #f8fafc !important;
    border: none !important;
    border-radius: 100px !important;
    padding: 10px 15px !important;
    font-size: 11.5px !important;
    font-weight: 500 !important;
    cursor: pointer !important;
    /* box-shadow: 0 1px 2px rgba(0,0,0,0.04) !important; */
    transition: background-color 0.2s ease !important;
}

.light #view_clientes .pj-filter-select,
[data-theme="light"] #view_clientes .pj-filter-select {
    background-color: #ffffff !important;
    color: #0f172a !important;
    border: none !important;
}

#view_clientes .btn-limpar-filtros-red {
    background-color: #89213a !important;
    color: #ffffff !important;
    border: none !important;
    border-radius: 9999px !important;
    padding: 10px 15px !important;
    font-size: 11px !important;
    font-weight: 700 !important;
    cursor: pointer !important;
    display: inline-flex !important;
    align-items: center !important;
    gap: 4px !important;
    transform: none !important;
    /* box-shadow: 0 2px 6px rgba(171, 47, 76, 0.4) !important; */
    transition: background-color 0.2s ease !important;
}

#view_clientes .btn-limpar-filtros-red:hover {
    background-color: #cd284e !important;
    transform: none !important;
}

/* 5. Card Separado da Tabela de Clientes (#tabelaClientes) */
#view_clientes .pj-table-container {
    background-color: #0e1620 !important;
    border-radius: 14px !important;
    border: none !important;
    box-shadow: none !important;
    overflow: hidden !important;
}

.light #view_clientes .pj-table-container,
[data-theme="light"] #view_clientes .pj-table-container {
    background-color: #ffffff !important;
    border: none !important;
}

#view_clientes .pj-table {
    width: 100% !important;
    border-collapse: collapse !important;
    text-align: left !important;
    font-size: 11.5px !important;
    background-color: transparent !important;
    border: none !important;
}

/* Header da Tabela */
#view_clientes .pj-table thead th {
    background-color: #2a3649 !important;
    color: #94a3b8 !important;
    font-size: 10.5px !important;
    font-weight: 800 !important;
    text-transform: uppercase !important;
    letter-spacing: 0.5px !important;
    padding: 12px 14px !important;
    border: none !important;
    white-space: nowrap !important;
    user-select: none !important;
}

.light #view_clientes .pj-table thead th,
[data-theme="light"] #view_clientes .pj-table thead th {
    background-color: #e2e8f0 !important;
    color: #64748b !important;
    border: none !important;
}

/* ============================================================== */
/* ZEBRA STRIPING OFICIAL P&J DA TABELA DE CLIENTES               */
/* ============================================================== */
/* Escuro: Linhas Pares (#090e15) e Ímpares (#0f141b) */
#view_clientes .pj-table tbody tr:nth-child(even) td {
    background-color: #090e15 !important;
    color: #f1f5f9 !important;
    border-top: none !important;
    border-left: none !important;
    border-right: none !important;
    border-bottom: none !important;
    padding: 11px 14px !important;
    vertical-align: middle !important;
}

#view_clientes .pj-table tbody tr:nth-child(odd) td {
    background-color: #0f141b !important;
    color: #f1f5f9 !important;
    border-top: none !important;
    border-left: none !important;
    border-right: none !important;
    border-bottom: none !important;
    padding: 11px 14px !important;
    vertical-align: middle !important;
}

#view_clientes .pj-table tbody tr:hover td {
    background-color: #16202c !important;
}

/* Claro: Linhas Pares (#ffffff) e Ímpares (#f9f9f9) */
.light #view_clientes .pj-table tbody tr:nth-child(even) td,
[data-theme="light"] #view_clientes .pj-table tbody tr:nth-child(even) td {
    background-color: #ffffff !important;
    color: #1e293b !important;
    border-top: none !important;
    border-left: none !important;
    border-right: none !important;
    border-bottom: none !important;
    padding: 11px 14px !important;
    vertical-align: middle !important;
}

.light #view_clientes .pj-table tbody tr:nth-child(odd) td,
[data-theme="light"] #view_clientes .pj-table tbody tr:nth-child(odd) td {
    background-color: #f9f9f9 !important;
    color: #1e293b !important;
    border-top: none !important;
    border-left: none !important;
    border-right: none !important;
    border-bottom: none !important;
    padding: 11px 14px !important;
    vertical-align: middle !important;
}

.light #view_clientes .pj-table tbody tr:hover td,
[data-theme="light"] #view_clientes .pj-table tbody tr:hover td {
    background-color: #f1f5f9 !important;
}

/* ============================================================== */
/* CÉLULA CLIENTE COM PERFIL ACIMA DO NOME (EXATO AO PROTÓTIPO)   */
/* ============================================================== */
#view_clientes .pj-client-cell {
    display: flex !important;
    flex-direction: column !important;
    align-items: flex-start !important;
    justify-content: center !important;
    text-align: left !important;
    gap: 2px !important;
    width: 100% !important;
}

/* Tag DISC 100% Discreta (Padrão Oficial do Protótipo em Tons Slate/Cinza) */
#view_clientes .pj-disc-tag {
    align-self: flex-start !important;
    font-size: 9.5px !important;
    font-weight: 700 !important;
    color: #94a3b8 !important;
    background: rgba(148, 163, 184, 0.16) !important;
    padding: 1px 7px !important;
    border-radius: 4px !important;
    margin-bottom: 2px !important;
    border: none !important;
    box-shadow: none !important;
    display: inline-block !important;
    line-height: normal !important;
    text-align: left !important;
}

.light #view_clientes .pj-disc-tag,
[data-theme="light"] #view_clientes .pj-disc-tag {
    background: #e2e8f0 !important;
    color: #475569 !important;
}

/* Linha com Bolinha de Recorrência e Nome do Cliente */
#view_clientes .pj-client-name-line {
    display: flex !important;
    align-items: flex-start !important;
    /* Ponto de ancoragem na 1ª linha */
    gap: 6px !important;
    text-align: left !important;
    width: 100% !important;
}

#view_clientes .pj-client-dot {
    width: 7px !important;
    height: 7px !important;
    border-radius: 50% !important;
    flex-shrink: 0 !important;
    margin-top: 4px !important;
    /* Alinhamento perfeito com o topo do texto do nome */
}

#view_clientes .dot-ativo {
    background-color: #10b981 !important;
}

#view_clientes .dot-novo {
    background-color: #818cf8 !important;
}

#view_clientes .dot-inativo {
    background-color: #f59e0b !important;
}

#view_clientes .dot-perdido {
    background-color: #ef4444 !important;
}

#view_clientes .dot-nunca-comprou {
    background-color: #64748b !important;
}

#view_clientes .pj-client-name {
    font-size: 12.5px !important;
    font-weight: 700 !important;
    color: #f8fafc !important;
    cursor: pointer !important;
    text-align: left !important;
    line-height: 1.25 !important;
    display: inline !important;
}

.light #view_clientes .pj-client-name,
[data-theme="light"] #view_clientes .pj-client-name {
    color: #0f172a !important;
}

#view_clientes .pj-client-sub {
    font-size: 10.5px !important;
    color: #94a3b8 !important;
    padding-left: 13px !important;
    /* 7px do dot + 6px de gap = 13px exatos */
    text-align: left !important;
    line-height: 1.2 !important;
    display: block !important;
}

.light #view_clientes .pj-client-sub,
[data-theme="light"] #view_clientes .pj-client-sub {
    color: #64748b !important;
}

/* ============================================================== */
/* BADGES DE STATUS REDONDAS COM CORES DO PROTÓTIPO               */
/* ============================================================== */
#view_clientes .pj-badge {
    font-size: 10px !important;
    font-weight: 800 !important;
    text-transform: uppercase !important;
    letter-spacing: 0.5px !important;
    padding: 4px 10px !important;
    border-radius: 9999px !important;
    white-space: nowrap !important;
    display: inline-flex !important;
    align-items: center !important;
    gap: 4px !important;
    border: none !important;
    box-shadow: none !important;
}

/* Badges - Escuro */
#view_clientes .badge-mes-compra {
    background: rgba(45, 212, 191, 0.16) !important;
    color: #2dd4bf !important;
}

#view_clientes .badge-comprou {
    background: rgba(74, 222, 128, 0.16) !important;
    color: #4ade80 !important;
}

#view_clientes .badge-novo-cliente {
    background: rgba(129, 140, 248, 0.16) !important;
    color: #818cf8 !important;
}

#view_clientes .badge-atrasado {
    background: rgba(251, 146, 60, 0.16) !important;
    color: #fb923c !important;
}

#view_clientes .badge-antecipar {
    background: rgba(234, 179, 8, 0.16) !important;
    color: #eab308 !important;
}

#view_clientes .badge-recuperar {
    background: rgba(56, 189, 248, 0.16) !important;
    color: #38bdf8 !important;
}

#view_clientes .badge-sondagem {
    background: rgba(249, 115, 22, 0.16) !important;
    color: #f97316 !important;
}

#view_clientes .badge-nunca-comprou {
    background: rgba(148, 163, 184, 0.16) !important;
    color: #cbd5e1 !important;
}

#view_clientes .badge-nao-compra {
    background: rgba(100, 116, 139, 0.16) !important;
    color: #94a3b8 !important;
}

#view_clientes .badge-inadimplente {
    background: rgba(248, 113, 113, 0.16) !important;
    color: #f87171 !important;
}

/* Badges - Claro */
.light #view_clientes .badge-mes-compra,
[data-theme="light"] #view_clientes .badge-mes-compra {
    background: #ccfbf1 !important;
    color: #0f766e !important;
}

.light #view_clientes .badge-comprou,
[data-theme="light"] #view_clientes .badge-comprou {
    background: #d1fae5 !important;
    color: #047857 !important;
}

.light #view_clientes .badge-novo-cliente,
[data-theme="light"] #view_clientes .badge-novo-cliente {
    background: #e0e7ff !important;
    color: #4338ca !important;
}

.light #view_clientes .badge-atrasado,
[data-theme="light"] #view_clientes .badge-atrasado {
    background: #ffedd5 !important;
    color: #c2410c !important;
}

.light #view_clientes .badge-antecipar,
[data-theme="light"] #view_clientes .badge-antecipar {
    background: #fef9c3 !important;
    color: #a16207 !important;
}

.light #view_clientes .badge-recuperar,
[data-theme="light"] #view_clientes .badge-recuperar {
    background: #e0f2fe !important;
    color: #0369a1 !important;
}

.light #view_clientes .badge-sondagem,
[data-theme="light"] #view_clientes .badge-sondagem {
    background: #ffedd5 !important;
    color: #c2410c !important;
}

.light #view_clientes .badge-nunca-comprou,
[data-theme="light"] #view_clientes .badge-nunca-comprou {
    background: #f1f5f9 !important;
    color: #334155 !important;
}

.light #view_clientes .badge-nao-compra,
[data-theme="light"] #view_clientes .badge-nao-compra {
    background: #f1f5f9 !important;
    color: #475569 !important;
}

.light #view_clientes .badge-inadimplente,
[data-theme="light"] #view_clientes .badge-inadimplente {
    background: #fee2e2 !important;
    color: #b91c1c !important;
}

/* Pílulas Semestrais */
#view_clientes .pj-semestral-pill {
    font-size: 10.5px !important;
    font-weight: 700 !important;
    padding: 3px 8px !important;
    border-radius: 9999px !important;
    white-space: nowrap !important;
    border: none !important;
    box-shadow: none !important;
    cursor: pointer !important;
}

#view_clientes .pj-semestral-pill.pill-up {
    background: rgba(74, 222, 128, 0.16) !important;
    color: #4ade80 !important;
}

.light #view_clientes .pj-semestral-pill.pill-up,
[data-theme="light"] #view_clientes .pj-semestral-pill.pill-up {
    background: #d1fae5 !important;
    color: #047857 !important;
}

#view_clientes .pj-semestral-pill.pill-down {
    background: rgba(248, 113, 113, 0.16) !important;
    color: #f87171 !important;
}

.light #view_clientes .pj-semestral-pill.pill-down,
[data-theme="light"] #view_clientes .pj-semestral-pill.pill-down {
    background: #fee2e2 !important;
    color: #b91c1c !important;
}

#view_clientes .pj-semestral-pill.pill-neutral {
    background: transparent !important;
    color: #94a3b8 !important;
}

.light #view_clientes .pj-semestral-pill.pill-neutral,
[data-theme="light"] #view_clientes .pj-semestral-pill.pill-neutral {
    color: #64748b !important;
}

/* Botão + Ações */
#view_clientes .pj-btn-acoes-trigger {
    background: #19232e !important;
    color: #f8fafc !important;
    padding: 5px 12px !important;
    border-radius: 9999px !important;
    font-size: 11px !important;
    font-weight: 600 !important;
    cursor: pointer !important;
    display: inline-flex !important;
    align-items: center !important;
    gap: 4px !important;
    border: none !important;
    box-shadow: none !important;
    transition: all 0.15s ease !important;
}

#view_clientes .pj-btn-acoes-trigger:hover {
    background: #1e2838 !important;
    transform: none !important;
}

.light #view_clientes .pj-btn-acoes-trigger,
[data-theme="light"] #view_clientes .pj-btn-acoes-trigger {
    background: #e2e8f0 !important;
    color: #0f172a !important;
    /* box-shadow: 0 1px 2px rgba(0,0,0,0.05) !important; */
}

.light #view_clientes .pj-btn-acoes-trigger:hover,
[data-theme="light"] #view_clientes .pj-btn-acoes-trigger:hover {
    background: #647491 !important;
    transform: none !important;
    color: #FFFFFF !important;
}

/* Ícone de Anotação */
#view_clientes .pj-note-icon-badge {
    font-size: 11.5px !important;
    cursor: pointer !important;
    /* background: none !important; */
    border: none !important;
    padding: 2px 4px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    opacity: 0.85 !important;
    transition: opacity 0.15s ease, transform 0.15s ease !important;
    /* background: red; */
}

#view_clientes .pj-note-icon-badge:hover {
    opacity: 1 !important;
    transform: scale(1.1) !important;
}

/* 6. Barra de Paginação Oficial do Protótipo */
#view_clientes .pj-pagination-bar {
    padding: 12px 18px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    border: none !important;
    border-top: 1px solid rgba(255, 255, 255, 0.03) !important;
    font-size: 11px !important;
    color: #94a3b8 !important;
    background-color: transparent !important;
}

.light #view_clientes .pj-pagination-bar,
[data-theme="light"] #view_clientes .pj-pagination-bar {
    border-top: none !important;
    color: #64748b !important;
}

#view_clientes .pj-footer-select-container {
    background-color: #141c27 !important;
    border-radius: 9999px !important;
    border: none !important;
    box-shadow: none !important;
}

.light #view_clientes .pj-footer-select-container,
[data-theme="light"] #view_clientes .pj-footer-select-container {
    background-color: #f1f5f9 !important;
    border: none !important;
}

#view_clientes .pj-footer-select {
    background-color: transparent !important;
    border: none !important;
    box-shadow: none !important;
    color: #f8fafc !important;
    font-size: 11px !important;
    padding: 4px 10px !important;
}

.light #view_clientes .pj-footer-select,
[data-theme="light"] #view_clientes .pj-footer-select {
    color: #0f172a !important;
}

#view_clientes .pj-footer-btn {
    background: #141c27 !important;
    color: #f8fafc !important;
    padding: 4px 10px !important;
    border-radius: 100px !important;
    font-size: 11px !important;
    font-weight: 600 !important;
    cursor: pointer !important;
    border: none !important;
    box-shadow: none !important;
    transition: background-color 0.15s ease !important;
}

#view_clientes .pj-footer-btn:hover:not(:disabled) {
    background-color: #1e2838 !important;
    transform: none !important;
}

.light #view_clientes .pj-footer-btn,
[data-theme="light"] #view_clientes .pj-footer-btn {
    background-color: #ffffff !important;
    color: #0f172a !important;
    /* box-shadow: 0 1px 2px rgba(0,0,0,0.05) !important; */
}

.light #view_clientes .pj-footer-btn:hover:not(:disabled),
[data-theme="light"] #view_clientes .pj-footer-btn:hover:not(:disabled) {
    background-color: #e2e8f0 !important;
    transform: none !important;
}

#view_clientes .pj-footer-page-pill {
    background-color: #141c27 !important;
    border-radius: 9999px !important;
    border: none !important;
    box-shadow: none !important;
    padding: 4px 12px !important;
}

.light #view_clientes .pj-footer-page-pill,
[data-theme="light"] #view_clientes .pj-footer-page-pill {
    background-color: #f1f5f9 !important;
    border: none !important;
}

#view_clientes .pj-footer-page-input {
    background-color: transparent !important;
    border: none !important;
    box-shadow: none !important;
    color: #f8fafc !important;
}

.light #view_clientes .pj-footer-page-input,
[data-theme="light"] #view_clientes .pj-footer-page-input {
    color: #0f172a !important;
}

/* ============================================================== */
/* DESTAQUE DE VALORES DE ORÇAMENTO (ALTO CONTRASTE DARK / LIGHT) */
/* ============================================================== */
.pj-orcamento-valor,
#view_clientes .pj-orcamento-valor {
    color: #fbbf24 !important;
    /* Âmbar Dourado no Dark */
    font-weight: 700 !important;
}

.light .pj-orcamento-valor,
[data-theme="light"] .pj-orcamento-valor,
.light #view_clientes .pj-orcamento-valor,
[data-theme="light"] #view_clientes .pj-orcamento-valor,
.light #kpiOrcamentosVal,
[data-theme="light"] #kpiOrcamentosVal,
.light #modalOrcamentosTotalBadge,
[data-theme="light"] #modalOrcamentosTotalBadge {
    color: #b45309 !important;
    /* Âmbar Escuro / Bronze de Alto Contraste (5.8:1) para Fundo Claro */
    font-weight: 700 !important;
}

/* ==========================================================================
   PADRONIZAÇÃO MATERIAL 3 FLAT (100% BORDERLESS): MODAIS DA PLATAFORMA & CLIENTES
   (AÇÕES DO CLIENTE, HISTÓRICO/TIMELINE, COMPARATIVO SEMESTRAL/RAIO-X, ORÇAMENTOS E DESCARTES)
   Diretrizes Inegociáveis: Zero Drop-Shadow, Zero Bordas (Separação Tonal Pura M3)
   Hierarquia Dark: Modal (#0e1620) -> Card (#090e15) -> Input/Inset (#19222e)
   Hierarquia Light: Modal (#ffffff) -> Card (#f1f5f9) -> Input/Inset (#ffffff / #e2e8f0)
   ========================================================================== */

/* 1. FUNDAÇÃO GLOBAL DE MODAIS (OVERLAY & BOX SEM BORDA) */
.pj-modal-overlay {
    background: rgba(4, 7, 12, 0.82) !important;
    -webkit-backdrop-filter: blur(8px) !important;
    backdrop-filter: blur(8px) !important;
    z-index: 2000 !important;
}

.light .pj-modal-overlay,
[data-theme="light"] .pj-modal-overlay {
    background: rgba(15, 23, 42, 0.45) !important;
    -webkit-backdrop-filter: blur(8px) !important;
    backdrop-filter: blur(8px) !important;
}

.pj-modal-box,
.pj-client-raiox-box,
.modal-acoes-cliente-box,
.modal-copiloto-box,
.modal-estrategia-box,
.modal-raiox-card-box,
.pj-raiox-modal-box,
#modalHistoricoAnotacoes .pj-modal-box,
#modalAcoesCliente .pj-modal-box,
#modalOrcamento .pj-modal-box,
#modalExcluirOrcamento .pj-modal-box,
#modalNaoComprar .pj-modal-box,
#modalDetalhesDescarte .pj-modal-box,
#modalMotivoDescarte .pj-modal-box,
#modalObservacaoCliente .pj-modal-box,
#modalChecklistClientes .pj-modal-box {
    background: #0e1620 !important;
    background-color: #0e1620 !important;
    border: none !important;
    border-radius: 16px !important;
    box-shadow: none !important;
    -webkit-box-shadow: none !important;
    color: #f8fafc !important;
}

.light .pj-modal-box,
.light .pj-client-raiox-box,
.light .modal-acoes-cliente-box,
.light .modal-copiloto-box,
.light .modal-estrategia-box,
.light .modal-raiox-card-box,
.light .pj-raiox-modal-box,
[data-theme="light"] .pj-modal-box,
[data-theme="light"] .pj-client-raiox-box,
[data-theme="light"] .modal-acoes-cliente-box,
[data-theme="light"] .modal-copiloto-box,
[data-theme="light"] .modal-estrategia-box,
[data-theme="light"] .modal-raiox-card-box,
[data-theme="light"] .pj-raiox-modal-box,
.light #modalHistoricoAnotacoes .pj-modal-box,
.light #modalAcoesCliente .pj-modal-box,
.light #modalOrcamento .pj-modal-box,
[data-theme="light"] #modalOrcamento .pj-modal-box,
.light #modalExcluirOrcamento .pj-modal-box,
.light #modalNaoComprar .pj-modal-box,
.light #modalDetalhesDescarte .pj-modal-box,
.light #modalMotivoDescarte .pj-modal-box,
.light #modalObservacaoCliente .pj-modal-box,
.light #modalChecklistClientes .pj-modal-box {
    background: #ffffff !important;
    background-color: #ffffff !important;
    border: none !important;
    box-shadow: none !important;
    -webkit-box-shadow: none !important;
    color: #0f172a !important;
}

/* Remoção global de bordas internas em cards, badges e blocos dentro de modais */
.pj-modal-box div[style*="border: 1px"],
.pj-modal-box span[style*="border: 1px"],
.pj-modal-box button[style*="border: 1px"],
.pj-modal-box .pj-badge,
.pj-modal-box .pj-client-cod-badge,
.pj-modal-box .copiloto-ai-badge {
    border: none !important;
}

/* 2. CABEÇALHOS, RODAPÉS E BOTÕES DE FECHAR */
.pj-modal-header,
.copiloto-header,
.pj-client-ficha-header,
.pj-raiox-modal-header {
    border-bottom: none !important;
    background: transparent !important;
}

.light .pj-modal-header,
.light .copiloto-header,
.light .pj-client-ficha-header,
.light .pj-raiox-modal-header,
[data-theme="light"] .pj-modal-header,
[data-theme="light"] .copiloto-header,
[data-theme="light"] .pj-client-ficha-header,
[data-theme="light"] .pj-raiox-modal-header {
    border-bottom: none !important;
    background: transparent !important;
}

.pj-modal-footer,
.pj-raiox-modal-footer,
.pj-modal-box div[style*="border-top: 1px solid"] {
    border-top: none !important;
    background: transparent !important;
}

.pj-modal-close-btn,
.copiloto-close-btn,
.pj-modal-close,
.pj-client-ficha-header button[onclick*="fechar"],
#modalHistoricoAnotacoes button[onclick*="fechar"] {
    background: transparent !important;
    border: none !important;
    color: #94a3b8 !important;
    border-radius: 50% !important;
    width: 32px !important;
    height: 32px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    cursor: pointer !important;
    transition: background-color 0.15s ease, color 0.15s ease !important;
    box-shadow: none !important;
}

.pj-modal-close-btn:hover,
.copiloto-close-btn:hover,
.pj-modal-close:hover,
.pj-client-ficha-header button[onclick*="fechar"]:hover,
#modalHistoricoAnotacoes button[onclick*="fechar"]:hover {
    background: rgba(255, 255, 255, 0.08) !important;
    color: #ffffff !important;
}

.light .pj-modal-close-btn,
.light .copiloto-close-btn,
.light .pj-modal-close,
.light .pj-client-ficha-header button[onclick*="fechar"],
.light #modalHistoricoAnotacoes button[onclick*="fechar"],
[data-theme="light"] .pj-modal-close-btn,
[data-theme="light"] .copiloto-close-btn,
[data-theme="light"] .pj-modal-close,
[data-theme="light"] .pj-client-ficha-header button[onclick*="fechar"],
[data-theme="light"] #modalHistoricoAnotacoes button[onclick*="fechar"] {
    color: #64748b !important;
}

.light .pj-modal-close-btn:hover,
.light .copiloto-close-btn:hover,
.light .pj-modal-close:hover,
.light .pj-client-ficha-header button[onclick*="fechar"]:hover,
.light #modalHistoricoAnotacoes button[onclick*="fechar"]:hover,
[data-theme="light"] .pj-modal-close-btn:hover,
[data-theme="light"] .copiloto-close-btn:hover,
[data-theme="light"] .pj-modal-close:hover,
[data-theme="light"] .pj-client-ficha-header button[onclick*="fechar"]:hover,
[data-theme="light"] #modalHistoricoAnotacoes button[onclick*="fechar"]:hover {
    background: #f1f5f9 !important;
    color: #0f172a !important;
}

/* Botões secundários (ex: Fechar / Cancelar) dentro de modais - Zero Borda */
.pj-modal-box .pj-btn-secondary {
    background: #19222e !important;
    color: #f8fafc !important;
    border: none !important;
    border-radius: 9999px !important;
    padding: 7px 18px !important;
    font-weight: 600 !important;
    box-shadow: none !important;
}

.pj-modal-box .pj-btn-secondary:hover {
    background: #243040 !important;
}

.light .pj-modal-box .pj-btn-secondary,
[data-theme="light"] .pj-modal-box .pj-btn-secondary {
    background: #f1f5f9 !important;
    color: #0f172a !important;
    border: none !important;
}

.light .pj-modal-box .pj-btn-secondary:hover,
[data-theme="light"] .pj-modal-box .pj-btn-secondary:hover {
    background: #e2e8f0 !important;
}

/* 3. INPUTS, SELECTS, TEXTAREAS & FORMULÁRIOS DE MODAIS (100% BORDERLESS) */
.pj-form-input,
.pj-form-select,
.pj-form-textarea {
    background-color: #19222e !important;
    border: none !important;
    color: #f8fafc !important;
    border-radius: 8px !important;
    box-shadow: none !important;
    padding: 9px 12px !important;
    outline: none !important;
    font-family: inherit !important;
}

.pj-form-input:focus,
.pj-form-select:focus,
.pj-form-textarea:focus {
    background-color: #1f2b3a !important;
    border: none !important;
    outline: none !important;
    box-shadow: none !important;
}

.light .pj-form-input,
.light .pj-form-select,
.light .pj-form-textarea,
[data-theme="light"] .pj-form-input,
[data-theme="light"] .pj-form-select,
[data-theme="light"] .pj-form-textarea {
    background-color: #f1f5f9 !important;
    border: none !important;
    color: #0f172a !important;
}

.light .pj-form-input:focus,
.light .pj-form-select:focus,
.light .pj-form-textarea:focus,
[data-theme="light"] .pj-form-input:focus,
[data-theme="light"] .pj-form-select:focus,
[data-theme="light"] .pj-form-textarea:focus {
    background-color: #e2e8f0 !important;
    border: none !important;
}

.pj-form-label {
    color: #94a3b8 !important;
    font-size: 11.5px !important;
    font-weight: 600 !important;
    margin-bottom: 5px !important;
}

.light .pj-form-label,
[data-theme="light"] .pj-form-label {
    color: #475569 !important;
}

/* 4. MODAL DE AÇÕES DO CLIENTE (modalAcoesCliente — 100% BORDERLESS) */
.modal-acoes-cliente-box {
    max-width: 500px !important;
    padding: 22px 24px !important;
}

#modalAcoesCod {
    font-size: 11px !important;
    font-weight: 700 !important;
    font-family: monospace !important;
    padding: 3px 10px !important;
    border-radius: 9999px !important;
    background: rgba(56, 189, 248, 0.12) !important;
    color: #38bdf8 !important;
    border: none !important;
}

.light #modalAcoesCod,
[data-theme="light"] #modalAcoesCod {
    background: #e0f2fe !important;
    color: #0284c7 !important;
    border: none !important;
}

#modalAcoesRazao {
    color: #f8fafc !important;
}

.light #modalAcoesRazao,
[data-theme="light"] #modalAcoesRazao {
    color: #0f172a !important;
}

#modalAcoesRep {
    color: #94a3b8 !important;
}

.light #modalAcoesRep,
[data-theme="light"] #modalAcoesRep {
    color: #64748b !important;
}

.pj-acoes-list {
    display: flex !important;
    flex-direction: column !important;
    gap: 8px !important;
}

.pj-acao-item {
    display: flex !important;
    align-items: center !important;
    gap: 14px !important;
    padding: 13px 15px !important;
    border-radius: 12px !important;
    background: #090e15 !important;
    border: none !important;
    color: #f8fafc !important;
    cursor: pointer !important;
    text-align: left !important;
    box-shadow: none !important;
    transform: none !important;
    transition: background-color 0.15s ease !important;
    width: 100% !important;
}

.pj-acao-item:hover {
    background: #141c27 !important;
    border: none !important;
    transform: none !important;
}

.light .pj-acao-item,
[data-theme="light"] .pj-acao-item {
    background: #f1f5f9 !important;
    border: none !important;
    color: #0f172a !important;
}

.light .pj-acao-item:hover,
[data-theme="light"] .pj-acao-item:hover {
    background: #e2e8f0 !important;
    border: none !important;
    transform: none !important;
}

.pj-acao-icon {
    width: 38px !important;
    height: 38px !important;
    border-radius: 10px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    font-size: 18px !important;
    flex-shrink: 0 !important;
    border: none !important;
}

.pj-acao-info {
    display: flex !important;
    flex-direction: column !important;
    gap: 2px !important;
    flex: 1 !important;
}

.pj-acao-info strong {
    font-size: 13.5px !important;
    color: #f8fafc !important;
    font-weight: 600 !important;
}

.light .pj-acao-info strong,
[data-theme="light"] .pj-acao-info strong {
    color: #0f172a !important;
}

.pj-acao-info span {
    font-size: 11px !important;
    color: #94a3b8 !important;
    line-height: 1.35 !important;
}

.light .pj-acao-info span,
[data-theme="light"] .pj-acao-info span {
    color: #64748b !important;
}

.pj-acao-arrow {
    font-size: 14px !important;
    color: #64748b !important;
    transition: color 0.15s ease !important;
}

.pj-acao-item:hover .pj-acao-arrow {
    color: #38bdf8 !important;
    transform: none !important;
}

.light .pj-acao-arrow,
[data-theme="light"] .pj-acao-arrow {
    color: #94a3b8 !important;
}

.light .pj-acao-item:hover .pj-acao-arrow,
[data-theme="light"] .pj-acao-item:hover .pj-acao-arrow {
    color: #0284c7 !important;
}

/* Bloco de Descarte no Modal de Ações (Sem Borda) */
#modalAcoesBlocoDescarte .pj-acao-item {
    background: rgba(239, 68, 68, 0.1) !important;
    border: none !important;
}

#modalAcoesBlocoDescarte .pj-acao-item:hover {
    background: rgba(239, 68, 68, 0.16) !important;
    border: none !important;
}

#modalAcoesBlocoDescarte .pj-acao-info strong,
#modalAcoesBlocoDescarte .pj-acao-arrow {
    color: #f87171 !important;
}

#modalAcoesBlocoDescarte .pj-acao-info span {
    color: #fca5a5 !important;
}

.light #modalAcoesBlocoDescarte .pj-acao-item,
[data-theme="light"] #modalAcoesBlocoDescarte .pj-acao-item {
    background: #fff1f2 !important;
    border: none !important;
}

.light #modalAcoesBlocoDescarte .pj-acao-item:hover,
[data-theme="light"] #modalAcoesBlocoDescarte .pj-acao-item:hover {
    background: #ffe4e6 !important;
    border: none !important;
}

.light #modalAcoesBlocoDescarte .pj-acao-info strong,
.light #modalAcoesBlocoDescarte .pj-acao-arrow,
[data-theme="light"] #modalAcoesBlocoDescarte .pj-acao-info strong,
[data-theme="light"] #modalAcoesBlocoDescarte .pj-acao-arrow {
    color: #be123c !important;
}

.light #modalAcoesBlocoDescarte .pj-acao-info span,
[data-theme="light"] #modalAcoesBlocoDescarte .pj-acao-info span {
    color: #881337 !important;
}

/* 5. MODAL DE HISTÓRICO & TIMELINE COMERCIAL (modalHistoricoAnotacoes — IGUAL AO PRINT DO INSPETOR) */
#modalHistoricoAnotacoes .pj-modal-box {
    max-width: 680px !important;
    width: 95% !important;
    max-height: 90vh !important;
    display: flex !important;
    flex-direction: column !important;
    padding: 24px !important;
    border: none !important;
}

#histAnotacoesTotalBadge {
    background: #19222e !important;
    color: #94a3b8 !important;
    font-size: 10.5px !important;
    font-weight: 600 !important;
    padding: 2px 10px !important;
    border-radius: 9999px !important;
    border: none !important;
}

.light #histAnotacoesTotalBadge,
[data-theme="light"] #histAnotacoesTotalBadge {
    background: #e2e8f0 !important;
    color: #475569 !important;
    border: none !important;
}

/* Card de formulário escuro (#090e15) sem borda sobre o modal (#0e1620) */
.pj-timeline-form-card {
    background: #090e15 !important;
    border: none !important;
    border-radius: 12px !important;
    padding: 16px !important;
    margin-bottom: 18px !important;
    box-shadow: none !important;
}

.light .pj-timeline-form-card,
[data-theme="light"] .pj-timeline-form-card {
    background: #f1f5f9 !important;
    border: none !important;
}

#histNovoTipo {
    background: #19222e !important;
    border: none !important;
    color: #f8fafc !important;
    border-radius: 6px !important;
    padding: 5px 10px !important;
    outline: none !important;
    box-shadow: none !important;
}

.light #histNovoTipo,
[data-theme="light"] #histNovoTipo {
    background: #ffffff !important;
    border: none !important;
    color: #0f172a !important;
}

/* Textarea mais clara (#19222e) sem borda dentro do card (#090e15), idêntico ao print */
#histNovoTexto,
#obsTextoCliente {
    width: 100% !important;
    min-height: 78px !important;
    padding: 12px 14px !important;
    border-radius: 8px !important;
    background: #19222e !important;
    border: none !important;
    color: #f8fafc !important;
    font-size: 13px !important;
    line-height: 1.5 !important;
    resize: vertical !important;
    box-sizing: border-box !important;
    outline: none !important;
    box-shadow: none !important;
    font-family: inherit !important;
}

#histNovoTexto:focus,
#obsTextoCliente:focus {
    background: #1f2b3a !important;
    border: none !important;
}

.light #histNovoTexto,
.light #obsTextoCliente,
[data-theme="light"] #histNovoTexto,
[data-theme="light"] #obsTextoCliente {
    background: #ffffff !important;
    border: none !important;
    color: #0f172a !important;
}

#btnSalvarNovaAnotacaoHist {
    background: #0284c7 !important;
    color: #ffffff !important;
    border: none !important;
    border-radius: 8px !important;
    font-size: 12px !important;
    font-weight: 700 !important;
    padding: 8px 16px !important;
    box-shadow: none !important;
    cursor: pointer !important;
    transition: background-color 0.15s ease !important;
}

#btnSalvarNovaAnotacaoHist:hover {
    background: #0369a1 !important;
}

.pj-timeline-container {
    display: flex !important;
    flex-direction: column !important;
    gap: 14px !important;
}

.pj-timeline-group {
    display: flex !important;
    flex-direction: column !important;
    gap: 8px !important;
}

.pj-timeline-date-header {
    font-size: 11px !important;
    font-weight: 700 !important;
    text-transform: uppercase !important;
    letter-spacing: 0.5px !important;
    color: #38bdf8 !important;
    padding-bottom: 4px !important;
    border-bottom: none !important;
}

.light .pj-timeline-date-header,
[data-theme="light"] .pj-timeline-date-header {
    color: #0284c7 !important;
    border-bottom: none !important;
}

/* Item da timeline M3 100% Borderless: indicador visual via pseudo-elemento tonal independente */
.pj-timeline-item {
    background: #090e15 !important;
    border: none !important;
    position: relative !important;
    border-radius: 10px !important;
    padding: 12px 14px 12px 20px !important;
    box-shadow: none !important;
}

.pj-timeline-item::before {
    content: '' !important;
    position: absolute !important;
    left: 8px !important;
    top: 12px !important;
    bottom: 12px !important;
    width: 3.5px !important;
    border-radius: 999px !important;
    background-color: #38bdf8 !important;
}

.pj-timeline-item.gestor {
    background: #151324 !important;
    border: none !important;
}
.pj-timeline-item.gestor::before {
    background-color: #a855f7 !important;
}

.pj-timeline-item.tentativa {
    background: #191612 !important;
    border: none !important;
}
.pj-timeline-item.tentativa::before {
    background-color: #f59e0b !important;
}

.light .pj-timeline-item,
[data-theme="light"] .pj-timeline-item {
    background: #f1f5f9 !important;
    border: none !important;
}
.light .pj-timeline-item::before,
[data-theme="light"] .pj-timeline-item::before {
    background-color: #0284c7 !important;
}

.light .pj-timeline-item.gestor,
[data-theme="light"] .pj-timeline-item.gestor {
    background: #f3e8ff !important;
    border: none !important;
}
.light .pj-timeline-item.gestor::before,
[data-theme="light"] .pj-timeline-item.gestor::before {
    background-color: #9333ea !important;
}

.light .pj-timeline-item.tentativa,
[data-theme="light"] .pj-timeline-item.tentativa {
    background: #fef3c7 !important;
    border: none !important;
}
.light .pj-timeline-item.tentativa::before,
[data-theme="light"] .pj-timeline-item.tentativa::before {
    background-color: #d97706 !important;
}

.pj-timeline-role-badge {
    font-size: 9.5px !important;
    font-weight: 700 !important;
    text-transform: uppercase !important;
    padding: 2px 7px !important;
    border-radius: 6px !important;
    background: rgba(255, 255, 255, 0.08) !important;
    color: #94a3b8 !important;
    border: none !important;
}

.light .pj-timeline-role-badge,
[data-theme="light"] .pj-timeline-role-badge {
    background: rgba(15, 23, 42, 0.06) !important;
    color: #475569 !important;
    border: none !important;
}

.pj-timeline-item-content {
    font-size: 13px !important;
    color: #f8fafc !important;
    line-height: 1.5 !important;
    word-break: break-word !important;
}

.light .pj-timeline-item-content,
[data-theme="light"] .pj-timeline-item-content {
    color: #1e293b !important;
}

/* ==========================================================================
   PADRONIZAÇÃO M3 OFICIAL P&J: MODAL RAIO-X DO CLIENTE (#modalComparativoSemestral)
   Inversão no Tema Escuro: Fundo do Modal em tom claro (#19232e) e Cards em tom escuro (#090e15)
   ========================================================================== */
#modalComparativoSemestral .pj-modal-box,
#modalComparativoSemestral .pj-client-raiox-box,
.pj-client-raiox-box {
    max-width: 1050px !important;
    width: 95% !important;
    height: 90vh !important;
    max-height: 90vh !important;
    display: flex !important;
    flex-direction: column !important;
    overflow: hidden !important;
    padding: 20px 24px !important;
    background: #19232e !important;
    background-color: #19232e !important;
    border: none !important;
    border-radius: 16px !important;
    box-shadow: none !important;
    color: #f8fafc !important;
}

.light #modalComparativoSemestral .pj-modal-box,
.light #modalComparativoSemestral .pj-client-raiox-box,
[data-theme="light"] #modalComparativoSemestral .pj-modal-box,
[data-theme="light"] #modalComparativoSemestral .pj-client-raiox-box,
.light .pj-client-raiox-box,
[data-theme="light"] .pj-client-raiox-box {
    background: #ffffff !important;
    background-color: #ffffff !important;
    border: none !important;
    box-shadow: none !important;
    color: #0f172a !important;
}

/* Badges do Header da Ficha (Representante e Código ERP — Zero Borda) */
#modalClienteRepBadge,
#modalComparativoSemestral #modalClienteRepBadge {
    background: rgba(30, 58, 138, 0.35) !important;
    color: #93c5fd !important;
    border: none !important;
    outline: none !important;
    box-shadow: none !important;
    border-radius: 8px !important;
    font-size: 11px !important;
    font-weight: 700 !important;
    padding: 6px 12px !important;
}

.light #modalClienteRepBadge,
.light #modalComparativoSemestral #modalClienteRepBadge,
[data-theme="light"] #modalClienteRepBadge,
[data-theme="light"] #modalComparativoSemestral #modalClienteRepBadge {
    background: #eff6ff !important;
    color: #1d4ed8 !important;
    border: none !important;
    outline: none !important;
    box-shadow: none !important;
}

#modalClienteCodBadge,
.pj-client-cod-badge {
    background: rgba(16, 185, 129, 0.15) !important;
    color: #10b981 !important;
    border: none !important;
    box-shadow: none !important;
    border-radius: 6px !important;
}

.light #modalClienteCodBadge,
.light .pj-client-cod-badge,
[data-theme="light"] #modalClienteCodBadge,
[data-theme="light"] .pj-client-cod-badge {
    background: #d1fae5 !important;
    color: #059669 !important;
    border: none !important;
    box-shadow: none !important;
}

/* Seções de Card e Painéis internos do Modal do Cliente (Tom Escuro na frente: #090e15) */
#modalComparativoSemestral .pj-perfil-bar-semestral,
#modalComparativoSemestral .pj-raiox-card-section,
#modalComparativoSemestral .pj-raiox-kpi-card,
#modalComparativoSemestral #secaoPlacasExpositoras,
#modalComparativoSemestral .pj-raiox-body>div[style*="var(--pj-surface-card"],
#modalComparativoSemestral div[style*="var(--pj-surface-card"],
.pj-perfil-bar-semestral,
.pj-raiox-card-section,
.pj-raiox-kpi-card,
#secaoPlacasExpositoras {
    background: #090e15 !important;
    background-color: #090e15 !important;
    border: none !important;
    border-radius: 12px !important;
    box-shadow: none !important;
}

.light #modalComparativoSemestral .pj-perfil-bar-semestral,
.light #modalComparativoSemestral .pj-raiox-card-section,
.light #modalComparativoSemestral .pj-raiox-kpi-card,
.light #modalComparativoSemestral #secaoPlacasExpositoras,
.light #modalComparativoSemestral .pj-raiox-body>div[style*="var(--pj-surface-card"],
.light #modalComparativoSemestral div[style*="var(--pj-surface-card"],
.light .pj-perfil-bar-semestral,
.light .pj-raiox-card-section,
.light .pj-raiox-kpi-card,
.light #secaoPlacasExpositoras,
[data-theme="light"] #modalComparativoSemestral .pj-perfil-bar-semestral,
[data-theme="light"] #modalComparativoSemestral .pj-raiox-card-section,
[data-theme="light"] #modalComparativoSemestral .pj-raiox-kpi-card,
[data-theme="light"] #modalComparativoSemestral #secaoPlacasExpositoras,
[data-theme="light"] #modalComparativoSemestral .pj-raiox-body>div[style*="var(--pj-surface-card"],
[data-theme="light"] #modalComparativoSemestral div[style*="var(--pj-surface-card"],
[data-theme="light"] .pj-perfil-bar-semestral,
[data-theme="light"] .pj-raiox-card-section,
[data-theme="light"] .pj-raiox-kpi-card,
[data-theme="light"] #secaoPlacasExpositoras {
    background: #f8fafc !important;
    background-color: #f8fafc !important;
    border: none !important;
    box-shadow: none !important;
}

/* Chips e Badges do Perfil Comportamental DISC (Zero Borda) */
#modalSemestralPerfilBadge,
.pj-badge-perfil,
.pj-perfil-chip,
.pj-perfil-chip:hover,
.pj-perfil-chip.active,
.pj-perfil-chip-clear,
.pj-perfil-chip-clear:hover {
    border: none !important;
    outline: none !important;
}

.light .pj-perfil-chip:not(.active),
[data-theme="light"] .pj-perfil-chip:not(.active) {
    background: transparent !important;
    color: #64748b !important;
    border: none !important;
    box-shadow: none !important;
}

.light .pj-perfil-chip:not(.active):hover,
[data-theme="light"] .pj-perfil-chip:not(.active):hover {
    background: rgba(15, 23, 42, 0.05) !important;
    color: #0f172a !important;
}

/* Grid de Dados de Cadastro ERP (2º Nível: #090e15 no Dark / Transparente no Light) */
.pj-client-cad-grid {
    display: grid !important;
    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)) !important;
    gap: 12px 18px !important;
    background: transparent !important;
    border: none !important;
    border-radius: 12px !important;
    padding: 6px 0 !important;
}

.light .pj-client-cad-grid,
[data-theme="light"] .pj-client-cad-grid {
    background: transparent !important;
    border: none !important;
    padding: 4px 0 !important;
}

.pj-cad-item-lbl {
    font-size: 10px !important;
    font-weight: 700 !important;
    letter-spacing: 0.5px !important;
    text-transform: uppercase !important;
    color: #94a3b8 !important;
    margin-bottom: 2px !important;
}

.light .pj-cad-item-lbl,
[data-theme="light"] .pj-cad-item-lbl {
    color: #64748b !important;
}

.pj-cad-item-val {
    font-size: 13px !important;
    font-weight: 700 !important;
    color: #f8fafc !important;
}

.pj-cad-item-address {
    grid-column: 1 / -1 !important;
    padding-top: 10px !important;
    margin-top: 4px !important;
    border-top: none !important;
}

.light .pj-cad-item-address,
[data-theme="light"] .pj-cad-item-address {
    border-top: none !important;
}

.light .pj-cad-item-val,
[data-theme="light"] .pj-cad-item-val {
    color: #0f172a !important;
}

/* Linha de Risco em Progressão Mensal (Zero Borda) */
#modalClienteLinhaRisco>div {
    border: none !important;
    box-shadow: none !important;
}

/* Sub-boxes do Comparativo Semestral (ANO 2025 e ANO 2026: #090e15 no Dark / #ffffff no Light) */
.pj-semestral-box {
    background: #090e15 !important;
    background-color: #090e15 !important;
    border: none !important;
    border-radius: 10px !important;
    padding: 12px 14px !important;
    box-shadow: none !important;
}

.light .pj-semestral-box,
[data-theme="light"] .pj-semestral-box {
    background: #ffffff !important;
    background-color: #ffffff !important;
    border: none !important;
    box-shadow: none !important;
}

/* Placas Expositoras — Mini Cards (Zero Borda, #1c2533 no Dark / #eaeff5 no Light) */
#modalPlacasBadgeProgresso {
    border: none !important;
    border-radius: 9999px !important;
}

.pj-placas-mini-item,
.pj-placas-mini-item:hover {
    border: none !important;
    border-radius: 8px !important;
    box-shadow: none !important;
}

.pj-placas-mini-item.falta {
    background: #1c2533 !important;
    border: none !important;
}

.pj-placas-mini-item.falta:hover {
    background: #243042 !important;
    border: none !important;
}

.pj-placas-mini-item.possui {
    background: rgba(16, 185, 129, 0.12) !important;
    border: none !important;
}

.pj-placas-mini-item.possui:hover {
    background: rgba(16, 185, 129, 0.18) !important;
    border: none !important;
}

.light .pj-placas-mini-item.falta,
[data-theme="light"] .pj-placas-mini-item.falta {
    background: #eaeff5 !important;
    border: none !important;
}

.light .pj-placas-mini-item.falta:hover,
[data-theme="light"] .pj-placas-mini-item.falta:hover {
    background: #e2e8f0 !important;
    border: none !important;
}

.light .pj-placas-mini-item.possui,
[data-theme="light"] .pj-placas-mini-item.possui {
    background: #dcfce7 !important;
    border: none !important;
}

.light .pj-placas-mini-item.possui:hover,
[data-theme="light"] .pj-placas-mini-item.possui:hover {
    background: #bbf7d0 !important;
    border: none !important;
}

/* Tabelas Internas (Ranking Top Itens e Itens de Pedido ERP - Sem Bordas) */
.pj-raiox-table-container {
    width: 100% !important;
    border-radius: 10px !important;
    background-color: transparent !important;
    border: none !important;
    box-shadow: none !important;
}

.light .pj-raiox-table-container,
[data-theme="light"] .pj-raiox-table-container {
    border: none !important;
    background-color: transparent !important;
}

.pj-raiox-table {
    border-collapse: collapse !important;
    border: none !important;
    background: transparent !important;
}

.pj-raiox-table thead,
.pj-raiox-table th {
    background: #141c27 !important;
    color: #94a3b8 !important;
    font-weight: 700 !important;
    border: none !important;
}

.light .pj-raiox-table thead,
.light .pj-raiox-table th,
[data-theme="light"] .pj-raiox-table thead,
[data-theme="light"] .pj-raiox-table th {
    background: #f1f5f9 !important;
    color: #64748b !important;
    border: none !important;
}

.pj-raiox-table td {
    padding: 9px 12px !important;
    background-color: #090e15 !important;
    border: none !important;
    color: #f8fafc !important;
}

.pj-raiox-table tbody tr:nth-child(odd) td {
    background-color: #090e15 !important;
}

.pj-raiox-table tbody tr:nth-child(even) td {
    background-color: #0f141b !important;
}

.pj-raiox-table tbody tr:hover td {
    background-color: #19222e !important;
}

.light .pj-raiox-table td,
[data-theme="light"] .pj-raiox-table td {
    background-color: #ffffff !important;
    border: none !important;
    color: #0f172a !important;
}

.light .pj-raiox-table tbody tr:nth-child(odd) td,
[data-theme="light"] .pj-raiox-table tbody tr:nth-child(odd) td {
    background-color: #ffffff !important;
}

.light .pj-raiox-table tbody tr:nth-child(even) td,
[data-theme="light"] .pj-raiox-table tbody tr:nth-child(even) td {
    background-color: #f8fafc !important;
}

.light .pj-raiox-table tbody tr:hover td,
[data-theme="light"] .pj-raiox-table tbody tr:hover td {
    background-color: #e2e8f0 !important;
}

/* Accordion de Pedidos ERP (Evita squishing/encolhimento do flexbox) */
.pj-orders-accordion-container {
    display: flex !important;
    flex-direction: column !important;
    gap: 8px !important;
    width: 100% !important;
}

.pj-order-accordion-item,
.pj-order-accordion-item.expanded {
    flex-shrink: 0 !important;
    min-height: 42px !important;
    background: #090e15 !important;
    border: 1px solid rgba(255, 255, 255, 0.05) !important;
    border-radius: 8px !important;
    box-shadow: none !important;
    overflow: hidden !important;
    margin-bottom: 4px !important;
}

.light .pj-order-accordion-item,
.light .pj-order-accordion-item.expanded,
[data-theme="light"] .pj-order-accordion-item,
[data-theme="light"] .pj-order-accordion-item.expanded {
    background: #ffffff !important;
    border: 1px solid #e2e8f0 !important;
    box-shadow: none !important;
}

.pj-order-accordion-header {
    min-height: 42px !important;
    padding: 10px 14px !important;
    background: #1c2533 !important;
    color: #f8fafc !important;
    border: none !important;
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    cursor: pointer !important;
    transition: background-color 0.15s ease !important;
}

.pj-order-accordion-header:hover {
    background: #243042 !important;
}

.light .pj-order-accordion-header,
[data-theme="light"] .pj-order-accordion-header {
    background: #f8fafc !important;
    color: #0f172a !important;
    border: none !important;
    border-bottom: 1px solid #e2e8f0 !important;
}

.light .pj-order-accordion-header:hover,
[data-theme="light"] .pj-order-accordion-header:hover {
    background: #f1f5f9 !important;
}

.pj-order-header-title {
    font-size: 11.5px !important;
    font-weight: 700 !important;
    color: #f8fafc !important;
}
.light .pj-order-header-title,
[data-theme="light"] .pj-order-header-title {
    color: #0f172a !important;
}

.pj-order-header-date {
    font-size: 11px !important;
    color: #94a3b8 !important;
}
.light .pj-order-header-date,
[data-theme="light"] .pj-order-header-date {
    color: #64748b !important;
}

.pj-order-header-total {
    font-size: 12px !important;
    font-weight: 800 !important;
    color: #34d399 !important;
}
.light .pj-order-header-total,
[data-theme="light"] .pj-order-header-total {
    color: #059669 !important;
}

.pj-order-badge-n {
    background: rgba(56, 189, 248, 0.15) !important;
    color: #38bdf8 !important;
    font-weight: 800 !important;
    font-size: 10.5px !important;
    padding: 2px 7px !important;
    border-radius: 4px !important;
}
.light .pj-order-badge-n,
[data-theme="light"] .pj-order-badge-n {
    background: #e0f2fe !important;
    color: #0284c7 !important;
}

.pj-order-tabela-tag {
    background: rgba(148, 163, 184, 0.15) !important;
    color: #cbd5e1 !important;
    font-size: 10px !important;
    padding: 2px 6px !important;
    border-radius: 4px !important;
}
.light .pj-order-tabela-tag,
[data-theme="light"] .pj-order-tabela-tag {
    background: #f1f5f9 !important;
    color: #475569 !important;
    border: 1px solid #cbd5e1 !important;
}

.pj-order-header-right {
    display: flex !important;
    align-items: center !important;
    gap: 8px !important;
    font-size: 11px !important;
    color: var(--pj-text-muted, #94a3b8) !important;
}
.light .pj-order-header-right,
[data-theme="light"] .pj-order-header-right {
    color: #64748b !important;
}

.pj-order-accordion-body {
    background: #090e15 !important;
    border: none !important;
    border-top: none !important;
    padding: 10px 14px !important;
}
.light .pj-order-accordion-body,
[data-theme="light"] .pj-order-accordion-body {
    background: #ffffff !important;
    border-top: none !important;
}

.light .pj-order-accordion-body,
[data-theme="light"] .pj-order-accordion-body {
    background: #ffffff !important;
    border: none !important;
    border-top: none !important;
}

.pj-order-badge-n,
.pj-order-tabela-tag {
    background: rgba(56, 189, 248, 0.15) !important;
    color: #38bdf8 !important;
    font-weight: 800 !important;
    font-size: 11px !important;
    padding: 3px 8px !important;
    border-radius: 6px !important;
    border: none !important;
}

.light .pj-order-badge-n,
.light .pj-order-tabela-tag,
[data-theme="light"] .pj-order-badge-n,
[data-theme="light"] .pj-order-tabela-tag {
    background: #e0f2fe !important;
    color: #0284c7 !important;
    border: none !important;
}

/* Subcards de Inteligência de Canais e Timeline de Atendimento (Seção 7) */
.pj-raiox-tactical-subcard,
.pj-raiox-timeline-atend-card {
    background: #090e15 !important;
    border: none !important;
    box-shadow: none !important;
}

.light .pj-raiox-tactical-subcard,
.light .pj-raiox-timeline-atend-card,
[data-theme="light"] .pj-raiox-tactical-subcard,
[data-theme="light"] .pj-raiox-timeline-atend-card {
    background: #ffffff !important;
    border: none !important;
    box-shadow: none !important;
}

/* Botões do Rodapé da Ficha do Cliente (Pílulas M3 Sem Borda) */
#modalComparativoSemestral .pj-raiox-modal-footer .pj-btn-primary {
    border-radius: 9999px !important;
    border: none !important;
    padding: 8px 18px !important;
}

#modalComparativoSemestral .pj-raiox-modal-footer .pj-btn-secondary {
    background: #141c27 !important;
    color: #f8fafc !important;
    border: none !important;
    border-radius: 9999px !important;
    padding: 8px 18px !important;
    box-shadow: none !important;
}

#modalComparativoSemestral .pj-raiox-modal-footer .pj-btn-secondary:hover {
    background: #1c2533 !important;
}

.light #modalComparativoSemestral .pj-raiox-modal-footer .pj-btn-secondary,
[data-theme="light"] #modalComparativoSemestral .pj-raiox-modal-footer .pj-btn-secondary {
    background: #f1f5f9 !important;
    color: #0f172a !important;
    border: none !important;
}

.light #modalComparativoSemestral .pj-raiox-modal-footer .pj-btn-secondary:hover,
[data-theme="light"] #modalComparativoSemestral .pj-raiox-modal-footer .pj-btn-secondary:hover {
    background: #e2e8f0 !important;
}

/* 7. MODAL COPILOTO DE VENDAS COM IA (100% BORDERLESS M3) */
#modalCopilotoIA .pj-modal-box,
.modal-copiloto-box {
    max-width: 920px !important;
    width: 95% !important;
    max-height: 90vh !important;
    padding: 22px 24px !important;
    background: #090e15 !important;
    background-color: #090e15 !important;
    border-radius: 16px !important;
    border: none !important;
    box-shadow: none !important;
}

.light #modalCopilotoIA .pj-modal-box,
.light .modal-copiloto-box,
[data-theme="light"] #modalCopilotoIA .pj-modal-box,
[data-theme="light"] .modal-copiloto-box {
    background: #ffffff !important;
    background-color: #ffffff !important;
    border: none !important;
    box-shadow: none !important;
}

.copiloto-header {
    border-bottom: none !important;
    margin-bottom: 14px !important;
    padding-bottom: 4px !important;
}

.copiloto-ai-badge {
    background: rgba(124, 58, 237, 0.18) !important;
    color: #c4b5fd !important;
    border: none !important;
    box-shadow: none !important;
}

.light .copiloto-ai-badge,
[data-theme="light"] .copiloto-ai-badge {
    background: #f3e8ff !important;
    color: #7c3aed !important;
    border: none !important;
    box-shadow: none !important;
}

/* Seções de 1º nível do Copiloto (#141c27 no Dark / #f1f5f9 no Light, zero bordas) */
.copiloto-perfil-bar,
.copiloto-context-section,
.copiloto-card,
.card-diagnostico,
.card-quebragelo,
.card-mix,
.card-objecao {
    background: #141c27 !important;
    background-color: #141c27 !important;
    border: none !important;
    border-radius: 12px !important;
    box-shadow: none !important;
}

.light .copiloto-perfil-bar,
.light .copiloto-context-section,
.light .copiloto-card,
.light .card-diagnostico,
.light .card-quebragelo,
.light .card-mix,
.light .card-objecao,
[data-theme="light"] .copiloto-perfil-bar,
[data-theme="light"] .copiloto-context-section,
[data-theme="light"] .copiloto-card,
[data-theme="light"] .card-diagnostico,
[data-theme="light"] .card-quebragelo,
[data-theme="light"] .card-mix,
[data-theme="light"] .card-objecao {
    background: #f1f5f9 !important;
    background-color: #f1f5f9 !important;
    border: none !important;
    box-shadow: none !important;
}

.card-diagnostico .copiloto-card-title {
    color: #38bdf8 !important;
}

.card-quebragelo .copiloto-card-title {
    color: #34d399 !important;
}

.card-mix .copiloto-card-title {
    color: #fbbf24 !important;
}

.card-objecao .copiloto-card-title {
    color: #f472b6 !important;
}

.light .card-diagnostico .copiloto-card-title,
[data-theme="light"] .card-diagnostico .copiloto-card-title {
    color: #0284c7 !important;
}

.light .card-quebragelo .copiloto-card-title,
[data-theme="light"] .card-quebragelo .copiloto-card-title {
    color: #059669 !important;
}

.light .card-mix .copiloto-card-title,
[data-theme="light"] .card-mix .copiloto-card-title {
    color: #d97706 !important;
}

.light .card-objecao .copiloto-card-title,
[data-theme="light"] .card-objecao .copiloto-card-title {
    color: #db2777 !important;
}

/* Sub-boxes de 2º nível dentro do Copiloto (#090e15 no Dark / #ffffff no Light) */
.copiloto-mensagem-box,
#copilotoMensagemTexto,
#copilotoAvisoSemPromo {
    background: #090e15 !important;
    background-color: #090e15 !important;
    border: none !important;
    border-radius: 10px !important;
    color: #f8fafc !important;
    box-shadow: none !important;
}

.light .copiloto-mensagem-box,
.light #copilotoMensagemTexto,
.light #copilotoAvisoSemPromo,
[data-theme="light"] .copiloto-mensagem-box,
[data-theme="light"] #copilotoMensagemTexto,
[data-theme="light"] #copilotoAvisoSemPromo {
    background: #ffffff !important;
    background-color: #ffffff !important;
    border: none !important;
    color: #0f172a !important;
    box-shadow: none !important;
}

/* Tabela de Match Promocional no Copiloto (Zebra Tonal 100% Borderless) */
.copiloto-table-responsive {
    background: transparent !important;
    border: none !important;
    border-radius: 10px !important;
    box-shadow: none !important;
}

.pj-table-match {
    border-collapse: collapse !important;
    border: none !important;
    background: transparent !important;
}

.pj-table-match thead th {
    background: #141c27 !important;
    color: #94a3b8 !important;
    border: none !important;
}

.light .pj-table-match thead th,
[data-theme="light"] .pj-table-match thead th {
    background: #f1f5f9 !important;
    color: #64748b !important;
    border: none !important;
}

.pj-table-match tbody td {
    background-color: #090e15 !important;
    color: #f8fafc !important;
    border: none !important;
}

.pj-table-match tbody tr:nth-child(odd) td {
    background-color: #090e15 !important;
}

.pj-table-match tbody tr:nth-child(even) td {
    background-color: #0f141b !important;
}

.pj-table-match tbody tr:hover td {
    background-color: #19222e !important;
}

.light .pj-table-match tbody td,
[data-theme="light"] .pj-table-match tbody td {
    background-color: #ffffff !important;
    color: #0f172a !important;
    border: none !important;
}

.light .pj-table-match tbody tr:nth-child(odd) td,
[data-theme="light"] .pj-table-match tbody tr:nth-child(odd) td {
    background-color: #ffffff !important;
}

.light .pj-table-match tbody tr:nth-child(even) td,
[data-theme="light"] .pj-table-match tbody tr:nth-child(even) td {
    background-color: #f8fafc !important;
}

.light .pj-table-match tbody tr:hover td,
[data-theme="light"] .pj-table-match tbody tr:hover td {
    background-color: #e2e8f0 !important;
}

/* Badges e Botões do Copiloto (Zero Borda) */
.pj-match-badge,
.pj-match-badge.badge-exact,
.pj-match-badge.badge-var,
.pj-badge-off,
.copiloto-promo-pill,
#copilotoBadgeCountPromo {
    border: none !important;
    box-shadow: none !important;
}

.pj-btn-action-copy {
    background: #19222e !important;
    color: #f8fafc !important;
    border: none !important;
    border-radius: 9999px !important;
    padding: 6px 14px !important;
    box-shadow: none !important;
}

.pj-btn-action-copy:hover {
    background: #243042 !important;
}

.light .pj-btn-action-copy,
[data-theme="light"] .pj-btn-action-copy {
    background: #ffffff !important;
    color: #0f172a !important;
    border: none !important;
}

.light .pj-btn-action-copy:hover,
[data-theme="light"] .pj-btn-action-copy:hover {
    background: #e2e8f0 !important;
}

.pj-btn-action-wa {
    background: #059669 !important;
    color: #ffffff !important;
    border: none !important;
    border-radius: 9999px !important;
    padding: 6px 14px !important;
    box-shadow: none !important;
}

.pj-btn-action-wa:hover {
    background: #047857 !important;
    box-shadow: none !important;
}

.copiloto-footer {
    border-top: none !important;
}

/* 8. MODAIS DE ORÇAMENTO, DESCARTE & ANOTAÇÃO RÁPIDA (100% BORDERLESS M3) */
#modalOrcamentosExistentes {
    background: #090e15 !important;
    border: none !important;
    border-radius: 10px !important;
}

.light #modalOrcamentosExistentes,
[data-theme="light"] #modalOrcamentosExistentes {
    background: #fff7ed !important;
    border: none !important;
}

.pj-orcamento-existente-item {
    background: #141c27 !important;
    border: none !important;
    border-radius: 8px !important;
}

.pj-orcamento-existente-item.is-editing {
    background: rgba(59, 130, 246, 0.18) !important;
    border: none !important;
}

.light .pj-orcamento-existente-item,
[data-theme="light"] .pj-orcamento-existente-item {
    background: #ffffff !important;
    border: none !important;
}

.light .pj-orcamento-existente-item.is-editing,
[data-theme="light"] .pj-orcamento-existente-item.is-editing {
    background: #dbeafe !important;
    border: none !important;
}

#btnNovoOrcamentoForm {
    background: #19222e !important;
    color: #f8fafc !important;
    border: none !important;
    border-radius: 9999px !important;
    padding: 6px 14px !important;
}

.light #btnNovoOrcamentoForm,
[data-theme="light"] #btnNovoOrcamentoForm {
    background: #f1f5f9 !important;
    color: #0f172a !important;
    border: none !important;
}

#modalExcluirOrcResumoBox,
#detalheDescMotivoBox {
    background: rgba(239, 68, 68, 0.12) !important;
    border: none !important;
    border-radius: 10px !important;
}

.light #modalExcluirOrcResumoBox,
.light #detalheDescMotivoBox,
[data-theme="light"] #modalExcluirOrcResumoBox,
[data-theme="light"] #detalheDescMotivoBox {
    background: #fef2f2 !important;
    border: none !important;
}

.light #modalExcluirOrcValor,
.light #detalheDescMotivoNome,
[data-theme="light"] #modalExcluirOrcValor,
[data-theme="light"] #detalheDescMotivoNome {
    color: #dc2626 !important;
}

.pj-descarte-info-box,
#detalheDescObs,
.pj-descarte-meta-box,
#boxBotoesEdicaoMotivo {
    background: #090e15 !important;
    border: none !important;
    border-radius: 10px !important;
}

.light .pj-descarte-info-box,
.light #detalheDescObs,
.light .pj-descarte-meta-box,
.light #boxBotoesEdicaoMotivo,
[data-theme="light"] .pj-descarte-info-box,
[data-theme="light"] #detalheDescObs,
[data-theme="light"] .pj-descarte-meta-box,
[data-theme="light"] #boxBotoesEdicaoMotivo {
    background: #f1f5f9 !important;
    border: none !important;
    color: #0f172a !important;
}

#btnToggleEditarMotivo {
    background: rgba(56, 189, 248, 0.15) !important;
    color: #38bdf8 !important;
    border: none !important;
    border-radius: 9999px !important;
    padding: 5px 12px !important;
}

.light #btnToggleEditarMotivo,
[data-theme="light"] #btnToggleEditarMotivo {
    background: #e0f2fe !important;
    color: #0284c7 !important;
    border: none !important;
}

.light #modalObservacaoCliente #obsTextoCliente,
[data-theme="light"] #modalObservacaoCliente #obsTextoCliente {
    background: #f1f5f9 !important;
    border: none !important;
    color: #0f172a !important;
}

/* 9. BOTÕES DE AÇÃO DOS MODAIS (FLAT M3, PÍLULA, SEM GRADIENTES, SEM BORDAS) */
#btnSalvarOrcamento,
#btnSalvarNovoMotivo {
    background: #ab2f4c !important;
    color: #ffffff !important;
    border: none !important;
    border-radius: 9999px !important;
    padding: 8px 18px !important;
    font-weight: 700 !important;
    box-shadow: none !important;
}

#btnSalvarOrcamento:hover,
#btnSalvarNovoMotivo:hover {
    background: #8f233c !important;
}

#btnConfirmarExclusaoOrcamento,
#btnConfirmarNaoCompra {
    background: #dc2626 !important;
    color: #ffffff !important;
    border: none !important;
    border-radius: 9999px !important;
    padding: 8px 18px !important;
    font-weight: 700 !important;
    box-shadow: none !important;
}

#btnConfirmarExclusaoOrcamento:hover,
#btnConfirmarNaoCompra:hover {
    background: #b91c1c !important;
}

#btnReativarDoModal,
#btnSalvarObs {
    background: #059669 !important;
    color: #ffffff !important;
    border: none !important;
    border-radius: 9999px !important;
    padding: 8px 18px !important;
    font-weight: 700 !important;
    box-shadow: none !important;
}

#btnReativarDoModal:hover,
#btnSalvarObs:hover {
    background: #047857 !important;
}


/* ==========================================================================
   PADRONIZAÇÃO MATERIAL 3 GLOBAL: TODAS AS TABELAS, FILTROS E TOOLBARS
   Aplica a paleta M3 para #view_orcamentos, #view_descartes, #view_representantes, etc.
   ========================================================================== */

.pj-filters-card {
    background-color: #0e1620 !important;
    border-radius: 14px !important;
    border: none !important;
    padding: 14px 16px !important;
    display: flex !important;
    flex-direction: column !important;
    gap: 10px !important;
    margin-bottom: 16px !important;
    box-shadow: none !important;
}

.light .pj-filters-card,
[data-theme="light"] .pj-filters-card {
    background-color: #ffffff !important;
    border: none !important;
}

.pj-filter-section-panel {
    background-color: #0a0f17 !important;
    border-radius: 10px !important;
    border: none !important;
    padding: 10px 14px !important;
    display: flex !important;
    flex-direction: column !important;
    gap: 8px !important;
    box-shadow: none !important;
}

.light .pj-filter-section-panel,
[data-theme="light"] .pj-filter-section-panel {
    background-color: #f1f5f9 !important;
    border: none !important;
}

.pj-table-container {
    background-color: #0e1620 !important;
    border-radius: 14px !important;
    border: none !important;
    box-shadow: none !important;
    overflow: hidden !important;
}

.light .pj-table-container,
[data-theme="light"] .pj-table-container {
    background-color: #ffffff !important;
    border: none !important;
}

.pj-table {
    width: 100% !important;
    border-collapse: collapse !important;
    text-align: left !important;
    font-size: 11.5px !important;
    background-color: transparent !important;
    border: none !important;
}

.pj-table thead th {
    background-color: #2a3649 !important;
    color: #94a3b8 !important;
    font-size: 10.5px !important;
    font-weight: 800 !important;
    text-transform: uppercase !important;
    letter-spacing: 0.5px !important;
    padding: 12px 14px !important;
    border: none !important;
    white-space: nowrap !important;
    user-select: none !important;
}

.light .pj-table thead th,
[data-theme="light"] .pj-table thead th {
    background-color: #e2e8f0 !important;
    color: #64748b !important;
    border: none !important;
}

/* Zebra Striping Global M3 */
.pj-table tbody tr:nth-child(even) td {
    background-color: #090e15 !important;
    color: #f1f5f9 !important;
    border-top: none !important;
    border-left: none !important;
    border-right: none !important;
    border-bottom: none !important;
    padding: 11px 14px !important;
    vertical-align: middle !important;
}

.pj-table tbody tr:nth-child(odd) td {
    background-color: #0f141b !important;
    color: #f1f5f9 !important;
    border-top: none !important;
    border-left: none !important;
    border-right: none !important;
    border-bottom: none !important;
    padding: 11px 14px !important;
    vertical-align: middle !important;
}

.pj-table tbody tr:hover td {
    background-color: #16202c !important;
}

.light .pj-table tbody tr:nth-child(even) td,
[data-theme="light"] .pj-table tbody tr:nth-child(even) td {
    background-color: #ffffff !important;
    color: #1e293b !important;
    border-top: none !important;
    border-left: none !important;
    border-right: none !important;
    border-bottom: none !important;
    padding: 11px 14px !important;
    vertical-align: middle !important;
}

.light .pj-table tbody tr:nth-child(odd) td,
[data-theme="light"] .pj-table tbody tr:nth-child(odd) td {
    background-color: #f9f9f9 !important;
    color: #1e293b !important;
    border-top: none !important;
    border-left: none !important;
    border-right: none !important;
    border-bottom: none !important;
    padding: 11px 14px !important;
    vertical-align: middle !important;
}

.light .pj-table tbody tr:hover td,
[data-theme="light"] .pj-table tbody tr:hover td {
    background-color: #f1f5f9 !important;
}

/* Cartões de Configuração & Descartes - Modo Escuro Estrito */
:root:not(.light) .pj-config-card,
:root:not(.light) .pj-table-card,
:root:not(.light) #view_descartes .pj-config-card,
:root:not(.light) #view_descartes .pj-table-card,
[data-theme="dark"] .pj-config-card,
[data-theme="dark"] .pj-table-card,
[data-theme="dark"] #view_descartes .pj-config-card,
[data-theme="dark"] #view_descartes .pj-table-card,
.pj-config-card,
.pj-table-card {
    background-color: #090e15 !important;
    border: none !important;
    border-radius: 14px !important;
    box-shadow: none !important;
}

/* Cartões de Configuração & Descartes - Modo Claro (100% Branco / Zero Preto) */
.light .pj-config-card,
[data-theme="light"] .pj-config-card,
.light .pj-table-card,
[data-theme="light"] .pj-table-card,
.light #view_descartes .pj-config-card,
[data-theme="light"] #view_descartes .pj-config-card,
.light #view_descartes .pj-table-card,
[data-theme="light"] #view_descartes .pj-table-card {
    background-color: #ffffff !important;
    background: #ffffff !important;
    border: none !important;
    box-shadow: none !important;
    color: #0f172a !important;
}

.light #view_descartes .pj-config-card strong,
[data-theme="light"] #view_descartes .pj-config-card strong,
.light #view_descartes .pj-config-card-title span,
[data-theme="light"] #view_descartes .pj-config-card-title span {
    color: #0f172a !important;
}

.light #view_descartes .pj-kpi-ring-bg,
[data-theme="light"] #view_descartes .pj-kpi-ring-bg {
    stroke: rgba(0, 0, 0, 0.08) !important;
}

/* Toolbar Legada Reset */
.pj-table-toolbar {
    background-color: #0e1620 !important;
    border: none !important;
    box-shadow: none !important;
}

.light .pj-table-toolbar,
[data-theme="light"] .pj-table-toolbar {
    background-color: #ffffff !important;
    border: none !important;
}

/* ==========================================================================
   BADGES DE ORÇAMENTOS & TABELAS — ALTO CONTRASTE (WCAG AA DUAL-THEME)
   ========================================================================== */
.badge-orc-versotech {
    background: rgba(168, 85, 247, 0.18) !important;
    color: #c084fc !important;
    border: none !important;
    font-weight: 700 !important;
}

.light .badge-orc-versotech,
[data-theme="light"] .badge-orc-versotech {
    background: #f3e8ff !important;
    color: #7e22ce !important;
    border: none !important;
    font-weight: 700 !important;
}

.badge-orc-manual,
.badge-orc-negociacao,
.badge-orc-aberto {
    background: rgba(245, 158, 11, 0.18) !important;
    color: #fbbf24 !important;
    border: none !important;
    font-weight: 700 !important;
}

.light .badge-orc-manual,
[data-theme="light"] .badge-orc-manual,
.light .badge-orc-negociacao,
[data-theme="light"] .badge-orc-negociacao,
.light .badge-orc-aberto,
[data-theme="light"] .badge-orc-aberto {
    background: #fef3c7 !important;
    color: #b45309 !important;
    border: none !important;
    font-weight: 700 !important;
}

.badge-orc-faturado {
    background: rgba(16, 185, 129, 0.18) !important;
    color: #34d399 !important;
    border: none !important;
    font-weight: 700 !important;
}

.light .badge-orc-faturado,
[data-theme="light"] .badge-orc-faturado {
    background: #d1fae5 !important;
    color: #047857 !important;
    border: none !important;
    font-weight: 700 !important;
}

.badge-orc-pedido {
    background: rgba(59, 130, 246, 0.18) !important;
    color: #60a5fa !important;
    border: none !important;
    font-weight: 700 !important;
}

.light .badge-orc-pedido,
[data-theme="light"] .badge-orc-pedido {
    background: #dbeafe !important;
    color: #1d4ed8 !important;
    border: none !important;
    font-weight: 700 !important;
}

.badge-orc-perdido {
    background: rgba(239, 68, 68, 0.18) !important;
    color: #f87171 !important;
    border: none !important;
    font-weight: 700 !important;
}

.light .badge-orc-perdido,
[data-theme="light"] .badge-orc-perdido {
    background: #fee2e2 !important;
    color: #b91c1c !important;
    border: none !important;
    font-weight: 700 !important;
}

.btn-orc-editar {
    background: rgba(59, 130, 246, 0.15) !important;
    border: none !important;
    color: #60a5fa !important;
    cursor: pointer !important;
    padding: 4px 8px !important;
    border-radius: 6px !important;
    font-size: 11px !important;
    font-weight: 600 !important;
    margin-right: 6px !important;
    transition: background-color 0.15s ease !important;
}

.light .btn-orc-editar,
[data-theme="light"] .btn-orc-editar {
    background: #e0f2fe !important;
    color: #0284c7 !important;
}

.btn-orc-excluir {
    background: rgba(239, 68, 68, 0.15) !important;
    border: none !important;
    color: #ef4444 !important;
    cursor: pointer !important;
    padding: 4px 8px !important;
    border-radius: 6px !important;
    font-size: 11px !important;
    font-weight: 600 !important;
    transition: background-color 0.15s ease !important;
}

.light .btn-orc-excluir,
[data-theme="light"] .btn-orc-excluir {
    background: #fee2e2 !important;
    color: #dc2626 !important;
}

/* ==========================================================================
   INPUTS & TEXTAREAS DE FORMULÁRIOS E MODAIS (ALTO NÍVEL DE ESPECIFICIDADE)
   Garante fundo M3 tonal #19222e no Dark e #f1f5f9 no Light sem conflito com dark.css
   ========================================================================== */
.pj-form-input:not(textarea),
.pj-form-select,
[data-theme="dark"] .pj-form-input:not(textarea),
[data-theme="dark"] .pj-form-select,
.dark .pj-form-input:not(textarea),
.dark .pj-form-select,
#modalOrcamento .pj-form-input:not(textarea),
#modalOrcamento .pj-form-select,
#modalExcluirOrcamento .pj-form-input:not(textarea),
#modalExcluirOrcamento .pj-form-select {
    background-color: #19222e !important;
    border: none !important;
    color: #f8fafc !important;
    border-radius: 100px !important;
    box-shadow: none !important;
    padding: 9px 12px !important;
    outline: none !important;
}

.pj-form-input[readonly],
[data-theme="dark"] .pj-form-input[readonly],
.dark .pj-form-input[readonly],
#modalOrcamento .pj-form-input[readonly] {
    background-color: #141c27 !important;
    color: #94a3b8 !important;
    opacity: 1 !important;
    cursor: default !important;
    border: none !important;
}

.pj-form-input:focus,
.pj-form-select:focus,
.pj-form-textarea:focus,
[data-theme="dark"] .pj-form-input:focus,
[data-theme="dark"] .pj-form-select:focus,
[data-theme="dark"] .pj-form-textarea:focus,
.dark .pj-form-input:focus,
.dark .pj-form-select:focus,
.dark .pj-form-textarea:focus {
    background-color: #1f2b3a !important;
    border: none !important;
    outline: none !important;
    box-shadow: none !important;
}

.light .pj-form-input,
.light .pj-form-select,
.light .pj-form-textarea,
[data-theme="light"] .pj-form-input,
[data-theme="light"] .pj-form-select,
[data-theme="light"] .pj-form-textarea,
.light #modalOrcamento .pj-form-input,
.light #modalOrcamento .pj-form-select,
.light #modalOrcamento .pj-form-textarea,
.light #modalExcluirOrcamento .pj-form-input,
.light #modalExcluirOrcamento .pj-form-select,
.light #modalExcluirOrcamento .pj-form-textarea {
    background-color: #e2e8f0 !important;
    border: none !important;
    color: #0f172a !important;
    box-shadow: none !important;
}

.light .pj-form-input[readonly],
[data-theme="light"] .pj-form-input[readonly] {
    background-color: #e2e8f0 !important;
    color: #475569 !important;
    opacity: 1 !important;
}

/* Botões Globais P&J Flat M3 */
.pj-btn {
    background: #89213a !important;
    color: #ffffff !important;
    border: none !important;
    border-radius: 9999px !important;
    box-shadow: none !important;
    -webkit-box-shadow: none !important;
    font-weight: 700 !important;
    transition: background-color 0.15s ease !important;
}

.pj-btn:hover {
    background: #bd1b47 !important;
    box-shadow: none !important;
    -webkit-box-shadow: none !important;
    transform: none !important;
}

.pj-btn-secondary {
    background-color: #1e2838 !important;
    color: #cbd5e1 !important;
    border: none !important;
    border-radius: 9999px !important;
    box-shadow: none !important;
    -webkit-box-shadow: none !important;
}

.pj-btn-secondary:hover {
    background-color: #263445 !important;
    color: #f8fafc !important;
    box-shadow: none !important;
    -webkit-box-shadow: none !important;
    transform: none !important;
}

.light .pj-btn-secondary,
[data-theme="light"] .pj-btn-secondary {
    background-color: #f1f5f9 !important;
    color: #334155 !important;
}

.light .pj-btn-secondary:hover,
[data-theme="light"] .pj-btn-secondary:hover {
    background-color: #e2e8f0 !important;
    color: #0f172a !important;
}


/* ==========================================================================
   PADRONIZAÇÃO MATERIAL 3: ABA NÃO COMPRAM / DESCARTES & GESTÃO DE OBJEÇÕES
   ========================================================================== */

/* Barra de Motivos / Objeções (Flat M3) */
.pj-motivo-bar-item {
    background-color: #19222e !important;
    border: none !important;
    border-radius: 10px !important;
    padding: 12px 16px !important;
    cursor: pointer !important;
    box-shadow: none !important;
    transform: none !important;
    transition: background-color 0.15s ease !important;
}

.pj-motivo-bar-item:hover {
    background-color: #263445 !important;
    border: none !important;
    transform: none !important;
    box-shadow: none !important;
}

.pj-motivo-bar-item.selected {
    background-color: rgba(56, 189, 248, 0.16) !important;
    border: none !important;
    box-shadow: none !important;
}

.light .pj-motivo-bar-item,
[data-theme="light"] .pj-motivo-bar-item {
    background-color: #f1f5f9 !important;
    border: none !important;
}

.light .pj-motivo-bar-item:hover,
[data-theme="light"] .pj-motivo-bar-item:hover {
    background-color: #e2e8f0 !important;
    border: none !important;
    transform: none !important;
}

.light .pj-motivo-bar-item.selected,
[data-theme="light"] .pj-motivo-bar-item.selected {
    background-color: #e0f2fe !important;
    border: none !important;
}

.pj-motivo-progress-track {
    background-color: rgba(255, 255, 255, 0.06) !important;
}

.light .pj-motivo-progress-track,
[data-theme="light"] .pj-motivo-progress-track {
    background-color: #e2e8f0 !important;
}

.pj-motivo-potencial {
    color: #fbbf24 !important;
}

.light .pj-motivo-potencial,
[data-theme="light"] .pj-motivo-potencial {
    color: #b45309 !important;
}

.badge-desc-motivo {
    background: rgba(239, 68, 68, 0.15) !important;
    color: #f87171 !important;
    border: none !important;
    font-weight: 600 !important;
    font-size: 11px !important;
}

.light .badge-desc-motivo,
[data-theme="light"] .badge-desc-motivo {
    background: #fee2e2 !important;
    color: #b91c1c !important;
}

.btn-desc-alterar {
    background: rgba(56, 189, 248, 0.15) !important;
    color: #38bdf8 !important;
    border: none !important;
    cursor: pointer !important;
    padding: 4px 8px !important;
    border-radius: 6px !important;
    font-size: 11px !important;
    font-weight: 600 !important;
    transition: background-color 0.15s ease !important;
}

.btn-desc-alterar:hover {
    background: rgba(56, 189, 248, 0.25) !important;
}

.light .btn-desc-alterar,
[data-theme="light"] .btn-desc-alterar {
    background: #e0f2fe !important;
    color: #0284c7 !important;
}

.light .btn-desc-alterar:hover,
[data-theme="light"] .btn-desc-alterar:hover {
    background: #bae6fd !important;
}

.btn-nao-compra-info {
    background: rgba(239, 68, 68, 0.15) !important;
    color: #f87171 !important;
    border: none !important;
    cursor: pointer !important;
    padding: 4px 8px !important;
    border-radius: 6px !important;
    font-size: 11px !important;
    font-weight: 600 !important;
    transition: background-color 0.15s ease !important;
}

.btn-nao-compra-info:hover {
    background: rgba(239, 68, 68, 0.25) !important;
    color: #ffffff !important;
}

.light .btn-nao-compra-info,
[data-theme="light"] .btn-nao-compra-info {
    background: #fee2e2 !important;
    color: #dc2626 !important;
}

.light .btn-nao-compra-info:hover,
[data-theme="light"] .btn-nao-compra-info:hover {
    background: #fecaca !important;
    color: #b91c1c !important;
}

/* Sub-blocos nos Modais de Descartes (Zero Borda e Contraste Tonal) */
.pj-descarte-info-box,
.pj-descarte-meta-box {
    background-color: #141c27 !important;
    border: none !important;
}

.light .pj-descarte-info-box,
[data-theme="light"] .pj-descarte-info-box,
.light .pj-descarte-meta-box,
[data-theme="light"] .pj-descarte-meta-box {
    background-color: #f1f5f9 !important;
    border: none !important;
}

#detalheDescObs {
    background-color: #141c27 !important;
    color: #f8fafc !important;
    border: none !important;
}

.light #detalheDescObs,
[data-theme="light"] #detalheDescObs {
    background-color: #f1f5f9 !important;
    color: #0f172a !important;
}

#detalheDescMotivoBox {
    background-color: rgba(239, 68, 68, 0.12) !important;
    border: none !important;
}

.light #detalheDescMotivoBox,
[data-theme="light"] #detalheDescMotivoBox {
    background-color: #fee2e2 !important;
}

#detalheDescMotivoNome {
    color: #f87171 !important;
}

.light #detalheDescMotivoNome,
[data-theme="light"] #detalheDescMotivoNome {
    color: #b91c1c !important;
}

#detalheDescUsuario {
    color: #38bdf8 !important;
}

.light #detalheDescUsuario,
[data-theme="light"] #detalheDescUsuario {
    color: #0284c7 !important;
}

/* Botões Pequenos Globais M3 */
.pj-btn-sm {
    border: none !important;
    border-radius: 6px !important;
    box-shadow: none !important;
    font-weight: 600 !important;
}

.pj-btn-sm.btn-success {
    background-color: rgba(16, 185, 129, 0.15) !important;
    color: #34d399 !important;
    border: none !important;
}

.pj-btn-sm.btn-success:hover {
    background-color: rgba(16, 185, 129, 0.25) !important;
    color: #ffffff !important;
}

.light .pj-btn-sm.btn-success,
[data-theme="light"] .pj-btn-sm.btn-success {
    background-color: #d1fae5 !important;
    color: #047857 !important;
}

.light .pj-btn-sm.btn-success:hover,
[data-theme="light"] .pj-btn-sm.btn-success:hover {
    background-color: #a7f3d0 !important;
}

/* Light Mode - Selects e Filtros com Fundo Branco #FFFFFF */
.light .pj-filter-select,
[data-theme="light"] .pj-filter-select,
.light #filtroDescMotivo,
[data-theme="light"] #filtroDescMotivo,
.light #filtroPeriodoOrcamentos,
[data-theme="light"] #filtroPeriodoOrcamentos,
.light #filtroStatusOrcamentos,
[data-theme="light"] #filtroStatusOrcamentos,
.light #filtroOrigemOrcamentos,
[data-theme="light"] #filtroOrigemOrcamentos {
    background-color: #FFFFFF !important;
    background: #FFFFFF !important;
    color: #0f172a !important;
    border: none !important;
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.04) !important;
}

/* ==========================================================================
   PÁGINA DE ORÇAMENTOS (#view_orcamentos) - BOTÕES E FILTROS COM FUNDO BRANCO
   ========================================================================== */
.light #view_orcamentos .pj-filter-select,
[data-theme="light"] #view_orcamentos .pj-filter-select,
.light #filtroPeriodoOrcamentos,
[data-theme="light"] #filtroPeriodoOrcamentos,
.light #filtroStatusOrcamentos,
[data-theme="light"] #filtroStatusOrcamentos,
.light #filtroOrigemOrcamentos,
[data-theme="light"] #filtroOrigemOrcamentos,
.light #view_orcamentos #btnSyncVersotechOrcamentos,
[data-theme="light"] #view_orcamentos #btnSyncVersotechOrcamentos,
.light #view_orcamentos .pj-btn-secondary,
[data-theme="light"] #view_orcamentos .pj-btn-secondary,
.light #view_orcamentos .pj-btn,
[data-theme="light"] #view_orcamentos .pj-btn,
.light #view_orcamentos .pj-btn-circle-action,
[data-theme="light"] #view_orcamentos .pj-btn-circle-action,
.light #modalOrcamento .pj-btn-secondary,
[data-theme="light"] #modalOrcamento .pj-btn-secondary,
.light #modalExcluirOrcamento .pj-btn-secondary,
[data-theme="light"] #modalExcluirOrcamento .pj-btn-secondary {
    background-color: #FFFFFF !important;
    background: #FFFFFF !important;
    color: #0F172A !important;
    border: none !important;
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05) !important;
}

.light #view_orcamentos .pj-filter-select:hover,
[data-theme="light"] #view_orcamentos .pj-filter-select:hover,
.light #filtroPeriodoOrcamentos:hover,
[data-theme="light"] #filtroPeriodoOrcamentos:hover,
.light #filtroStatusOrcamentos:hover,
[data-theme="light"] #filtroStatusOrcamentos:hover,
.light #filtroOrigemOrcamentos:hover,
[data-theme="light"] #filtroOrigemOrcamentos:hover,
.light #view_orcamentos #btnSyncVersotechOrcamentos:hover,
[data-theme="light"] #view_orcamentos #btnSyncVersotechOrcamentos:hover,
.light #view_orcamentos .pj-btn-secondary:hover,
[data-theme="light"] #view_orcamentos .pj-btn-secondary:hover,
.light #view_orcamentos .pj-btn:hover,
[data-theme="light"] #view_orcamentos .pj-btn:hover,
.light #view_orcamentos .pj-btn-circle-action:hover,
[data-theme="light"] #view_orcamentos .pj-btn-circle-action:hover,
.light #modalOrcamento .pj-btn-secondary:hover,
[data-theme="light"] #modalOrcamento .pj-btn-secondary:hover,
.light #modalExcluirOrcamento .pj-btn-secondary:hover,
[data-theme="light"] #modalExcluirOrcamento .pj-btn-secondary:hover {
    background-color: #F8FAFC !important;
    background: #F8FAFC !important;
    border-color: #94A3B8 !important;
    color: #0F172A !important;
}

/* ==========================================================================
   PADRONIZAÇÃO MATERIAL 3 FLAT: TELA DE REPRESENTANTES (#view_representantes)
   ========================================================================== */
#view_representantes .pj-hero-card {
    background-color: var(--pj-bg-card, #090e15) !important;
    border-radius: var(--pj-radius-card, 16px) !important;
    box-shadow: none !important;
    border: none !important;
    outline: none !important;
}

.light #view_representantes .pj-hero-card,
[data-theme="light"] #view_representantes .pj-hero-card {
    background-color: #ffffff !important;
    box-shadow: none !important;
    border: none !important;
}

/* Seletor de Modo de Exibição (Cards vs Tabela) */
.pj-view-mode-selector {
    display: inline-flex !important;
    align-items: center !important;
    background-color: var(--pj-bg-inset, #19222e) !important;
    border-radius: var(--pj-radius-pill, 40px) !important;
    padding: 3px !important;
    gap: 2px !important;
    border: none !important;
    box-shadow: none !important;
}

.light .pj-view-mode-selector,
[data-theme="light"] .pj-view-mode-selector {
    background-color: #f1f5f9 !important;
    border: none !important;
}

.pj-view-mode-btn {
    display: inline-flex !important;
    align-items: center !important;
    gap: 6px !important;
    padding: 10px 15px !important;
    font-size: 11.5px !important;
    font-weight: 600 !important;
    border-radius: var(--pj-radius-pill, 40px) !important;
    border: none !important;
    background: transparent !important;
    color: var(--pj-text-muted, #64748b) !important;
    cursor: pointer !important;
    box-shadow: none !important;
    transform: none !important;
    transition: background-color 0.2s cubic-bezier(0.2, 0, 0, 1), color 0.2s cubic-bezier(0.2, 0, 0, 1) !important;
}

.pj-view-mode-btn:hover {
    background-color: rgba(255, 255, 255, 0.08) !important;
    color: var(--pj-text-title, #f8fafc) !important;
}

.pj-view-mode-btn.active {
    background-color: #ab2f4c !important;
    color: #ffffff !important;
}

.light .pj-view-mode-btn:hover,
[data-theme="light"] .pj-view-mode-btn:hover {
    background-color: #e2e8f0 !important;
    color: #0f172a !important;
}

.light .pj-view-mode-btn.active,
[data-theme="light"] .pj-view-mode-btn.active {
    background-color: #ab2f4c !important;
    color: #ffffff !important;
}

/* Container e Tabela de Representantes (#repsTableContainer) */
#repsTableContainer.pj-table-container {
    background-color: var(--pj-bg-card, #090e15) !important;
    border-radius: 14px !important;
    border: none !important;
    box-shadow: none !important;
    overflow: hidden !important;
    padding: 0 !important;
    margin-top: 14px !important;
}

.light #repsTableContainer.pj-table-container,
[data-theme="light"] #repsTableContainer.pj-table-container {
    background-color: #ffffff !important;
    border: none !important;
    box-shadow: none !important;
}

/* Cards Inset de Estatísticas do Checklist e Visões Similares */
.pj-stat-inset {
    background-color: var(--pj-bg-inset, #19222e) !important;
    border-radius: 12px !important;
    border: none !important;
    box-shadow: none !important;
    outline: none !important;
}

.light .pj-stat-inset,
[data-theme="light"] .pj-stat-inset {
    background-color: #f1f5f9 !important;
    border: none !important;
    box-shadow: none !important;
}

/* ==========================================================================
   PADRONIZAÇÃO M3 OFICIAL P&J: CARDS DE REPRESENTANTES (SEM AZUL / FLAT TONAL)
   ========================================================================== */
.pj-rep-card,
.pj-rep-card.pj-rep-card-clickable,
.pj-rep-card.meta-batida,
#repsCardsContainer .pj-rep-card {
    background: var(--pj-bg-card, #090e15) !important;
    background-color: var(--pj-bg-card, #090e15) !important;
    background-image: none !important;
    border-radius: var(--pj-radius-card, 16px) !important;
    border: none !important;
    outline: none !important;
    box-shadow: none !important;
    transform: none !important;
    transition: background-color 0.2s cubic-bezier(0.2, 0, 0, 1) !important;
}

.pj-rep-card:hover,
.pj-rep-card.pj-rep-card-clickable:hover,
.pj-rep-card.meta-batida:hover,
#repsCardsContainer .pj-rep-card:hover {
    background: var(--pj-hover-card, #141c27) !important;
    background-color: var(--pj-hover-card, #141c27) !important;
    background-image: none !important;
    border: none !important;
    box-shadow: none !important;
    transform: none !important;
}

/* Erradicar linhas e glows antigos de meta batida */
.pj-rep-card::before,
.pj-rep-card.meta-batida::before,
.pj-rep-card::after,
.pj-rep-card.meta-batida::after {
    display: none !important;
    content: none !important;
}

/* ==========================================================================
   PADRONIZAÇÃO M3 OFICIAL P&J: TABELA DE REPRESENTANTES (#tabelaRepresentantes)
   ========================================================================== */
#tabelaRepresentantes {
    width: 100% !important;
    border-collapse: collapse !important;
    border: none !important;
    font-size: 12px !important;
    background-color: transparent !important;
}

#tabelaRepresentantes thead th {
    background-color: #141c27 !important;
    color: #94a3b8 !important;
    font-size: 10.5px !important;
    font-weight: 800 !important;
    text-transform: uppercase !important;
    letter-spacing: 0.5px !important;
    padding: 12px 14px !important;
    border: none !important;
    border-bottom: none !important;
    text-align: left !important;
    white-space: nowrap !important;
    user-select: none !important;
}

/* Zebra Striping Modo Escuro */
#tabelaRepresentantes tbody td {
    padding: 12px 14px !important;
    border: none !important;
    color: #f1f5f9 !important;
    vertical-align: middle !important;
}

#tabelaRepresentantes tbody tr:nth-child(even) td {
    background-color: #090e15 !important;
    color: #f1f5f9 !important;
    border-bottom: none !important;
}

#tabelaRepresentantes tbody tr:nth-child(odd) td {
    background-color: #0f141b !important;
    color: #f1f5f9 !important;
    border-bottom: none !important;
}

#tabelaRepresentantes tbody tr:hover td {
    background-color: #16202c !important;
}

#tabelaRepresentantes tbody td strong {
    color: #f8fafc !important;
}

/* Zebra Striping Modo Claro - Alto Contraste Sem Texto Branco */
.light #tabelaRepresentantes thead th,
[data-theme="light"] #tabelaRepresentantes thead th {
    background-color: #e2e8f0 !important;
    color: #64748b !important;
    border-bottom: none !important;
    font-weight: 800 !important;
}

.light #tabelaRepresentantes tbody td,
[data-theme="light"] #tabelaRepresentantes tbody td,
.light #tabelaRepresentantes tbody tr td,
[data-theme="light"] #tabelaRepresentantes tbody tr td,
.light #tabelaRepresentantes tbody tr:nth-child(even) td,
[data-theme="light"] #tabelaRepresentantes tbody tr:nth-child(even) td,
.light #tabelaRepresentantes tbody tr:nth-child(odd) td,
[data-theme="light"] #tabelaRepresentantes tbody tr:nth-child(odd) td {
    color: #1e293b !important;
    border-bottom: none !important;
}

.light #tabelaRepresentantes tbody tr:nth-child(even) td,
[data-theme="light"] #tabelaRepresentantes tbody tr:nth-child(even) td {
    background-color: #ffffff !important;
}

.light #tabelaRepresentantes tbody tr:nth-child(odd) td,
[data-theme="light"] #tabelaRepresentantes tbody tr:nth-child(odd) td {
    background-color: #f8fafc !important;
}

.light #tabelaRepresentantes tbody tr:hover td,
[data-theme="light"] #tabelaRepresentantes tbody tr:hover td {
    background-color: #f1f5f9 !important;
}

.light #tabelaRepresentantes tbody td strong,
[data-theme="light"] #tabelaRepresentantes tbody td strong {
    color: #0f172a !important;
}

.light #tabelaRepresentantes tbody td span,
[data-theme="light"] #tabelaRepresentantes tbody td span {
    color: #1e293b !important;
}

.light #tabelaRepresentantes tbody td div[style*="#94A3B8"],
[data-theme="light"] #tabelaRepresentantes tbody td div[style*="#94A3B8"],
.light #tabelaRepresentantes tbody td small,
[data-theme="light"] #tabelaRepresentantes tbody td small {
    color: #64748b !important;
}

.light #tabelaRepresentantes td div[style*="#4ADE80"],
[data-theme="light"] #tabelaRepresentantes td div[style*="#4ADE80"] {
    color: #15803d !important;
}

.light #tabelaRepresentantes td[style*="#F87171"],
[data-theme="light"] #tabelaRepresentantes td[style*="#F87171"] {
    color: #b91c1c !important;
}

.light #tabelaRepresentantes div[style*="rgba(255,255,255,0.08)"],
[data-theme="light"] #tabelaRepresentantes div[style*="rgba(255,255,255,0.08)"] {
    background-color: #e2e8f0 !important;
}

.light #repsTableContainer,
[data-theme="light"] #repsTableContainer {
    background-color: #ffffff !important;
    border: none !important;
}

/* ==========================================================================
   BOTÕES DE AÇÃO CIRCULARES MONOCROMÁTICOS OFICIAIS M3 P&J
   ========================================================================== */
.pj-btn-circle-action,
.btn-nao-compra-info,
.btn-desc-alterar,
.btn-desc-reativar,
.btn-orc-editar,
.btn-orc-excluir {
    width: 32px !important;
    height: 32px !important;
    min-width: 32px !important;
    max-width: 32px !important;
    padding: 0 !important;
    border-radius: 50% !important;
    border: none !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    cursor: pointer !important;
    outline: none !important;
    box-shadow: none !important;
    flex-shrink: 0 !important;
    vertical-align: middle !important;
    margin: 0 2px !important;
    transition: transform 0.15s ease, background-color 0.15s ease, color 0.15s ease !important;
}

.pj-btn-circle-action:hover,
.btn-nao-compra-info:hover,
.btn-desc-alterar:hover,
.btn-desc-reativar:hover,
.btn-orc-editar:hover,
.btn-orc-excluir:hover {
    transform: scale(1.08) !important;
}

.pj-btn-circle-action:active,
.btn-nao-compra-info:active,
.btn-desc-alterar:active,
.btn-desc-reativar:active,
.btn-orc-editar:active,
.btn-orc-excluir:active {
    transform: scale(0.95) !important;
}

.pj-btn-circle-action svg,
.btn-nao-compra-info svg,
.btn-desc-alterar svg,
.btn-desc-reativar svg,
.btn-orc-editar svg,
.btn-orc-excluir svg {
    width: 15px !important;
    height: 15px !important;
    stroke: currentColor !important;
    fill: none !important;
    display: block !important;
    pointer-events: none !important;
}

/* 1. Variante VER / DETALHES */
.pj-btn-circle-action.btn-action-ver,
.btn-nao-compra-info {
    background-color: rgba(239, 68, 68, 0.15) !important;
    color: #f87171 !important;
}

.pj-btn-circle-action.btn-action-ver:hover,
.btn-nao-compra-info:hover {
    background-color: rgba(239, 68, 68, 0.28) !important;
    color: #ffffff !important;
}

.light .pj-btn-circle-action.btn-action-ver,
[data-theme="light"] .pj-btn-circle-action.btn-action-ver,
.light .btn-nao-compra-info,
[data-theme="light"] .btn-nao-compra-info {
    background-color: #fee2e2 !important;
    color: #dc2626 !important;
}

.light .pj-btn-circle-action.btn-action-ver:hover,
[data-theme="light"] .pj-btn-circle-action.btn-action-ver:hover,
.light .btn-nao-compra-info:hover,
[data-theme="light"] .btn-nao-compra-info:hover {
    background-color: #fecaca !important;
    color: #b91c1c !important;
}

/* 2. Variante ALTERAR / EDITAR */
.pj-btn-circle-action.btn-action-alterar,
.pj-btn-circle-action.btn-action-editar,
.btn-desc-alterar,
.btn-orc-editar {
    background-color: rgba(56, 189, 248, 0.15) !important;
    color: #38bdf8 !important;
}

.pj-btn-circle-action.btn-action-alterar:hover,
.pj-btn-circle-action.btn-action-editar:hover,
.btn-desc-alterar:hover,
.btn-orc-editar:hover {
    background-color: rgba(56, 189, 248, 0.28) !important;
    color: #ffffff !important;
}

.light .pj-btn-circle-action.btn-action-alterar,
[data-theme="light"] .pj-btn-circle-action.btn-action-alterar,
.light .pj-btn-circle-action.btn-action-editar,
[data-theme="light"] .pj-btn-circle-action.btn-action-editar,
.light .btn-desc-alterar,
[data-theme="light"] .btn-desc-alterar,
.light .btn-orc-editar,
[data-theme="light"] .btn-orc-editar {
    background-color: #e0f2fe !important;
    color: #0284c7 !important;
}

.light .pj-btn-circle-action.btn-action-alterar:hover,
[data-theme="light"] .pj-btn-circle-action.btn-action-alterar:hover,
.light .pj-btn-circle-action.btn-action-editar:hover,
[data-theme="light"] .pj-btn-circle-action.btn-action-editar:hover,
.light .btn-desc-alterar:hover,
[data-theme="light"] .btn-desc-alterar:hover,
.light .btn-orc-editar:hover,
[data-theme="light"] .btn-orc-editar:hover {
    background-color: #bae6fd !important;
    color: #0369a1 !important;
}

/* 3. Variante REATIVAR */
.pj-btn-circle-action.btn-action-reativar,
.btn-desc-reativar {
    background-color: rgba(16, 185, 129, 0.15) !important;
    color: #10b981 !important;
}

.pj-btn-circle-action.btn-action-reativar:hover,
.btn-desc-reativar:hover {
    background-color: rgba(16, 185, 129, 0.28) !important;
    color: #ffffff !important;
}

.light .pj-btn-circle-action.btn-action-reativar,
[data-theme="light"] .pj-btn-circle-action.btn-action-reativar,
.light .btn-desc-reativar,
[data-theme="light"] .btn-desc-reativar {
    background-color: #d1fae5 !important;
    color: #059669 !important;
}

.light .pj-btn-circle-action.btn-action-reativar:hover,
[data-theme="light"] .pj-btn-circle-action.btn-action-reativar:hover,
.light .btn-desc-reativar:hover,
[data-theme="light"] .btn-desc-reativar:hover {
    background-color: #a7f3d0 !important;
    color: #047857 !important;
}

/* 4. Variante EXCLUIR */
.pj-btn-circle-action.btn-action-excluir,
.btn-orc-excluir {
    background-color: rgba(239, 68, 68, 0.15) !important;
    color: #ef4444 !important;
}

.pj-btn-circle-action.btn-action-excluir:hover,
.btn-orc-excluir:hover {
    background-color: rgba(239, 68, 68, 0.28) !important;
    color: #ffffff !important;
}

.light .pj-btn-circle-action.btn-action-excluir,
[data-theme="light"] .pj-btn-circle-action.btn-action-excluir,
.light .btn-orc-excluir,
[data-theme="light"] .btn-orc-excluir {
    background-color: #fee2e2 !important;
    color: #dc2626 !important;
}

.light .pj-btn-circle-action.btn-action-excluir:hover,
[data-theme="light"] .pj-btn-circle-action.btn-action-excluir:hover,
.light .btn-orc-excluir:hover,
[data-theme="light"] .btn-orc-excluir:hover {
    background-color: #fecaca !important;
    color: #b91c1c !important;
}

/* ==========================================================================
   PADRONIZAÇÃO M3 OFICIAL P&J: MODAL DO REPRESENTANTE (#modalRaioXRepresentante)
   Inversão no Tema Escuro: Fundo do Modal em tom claro (#19232e) e Cards em tom escuro (#090e15)
   ========================================================================== */
#modalRaioXRepresentante .pj-modal-box,
#modalRaioXRepresentante.pj-raiox-modal-box {
    background-color: #19232e !important;
    border: none !important;
    border-radius: 16px !important;
    box-shadow: none !important;
    color: #f8fafc !important;
    max-width: 1100px !important;
    width: 95% !important;
}

.light #modalRaioXRepresentante .pj-modal-box,
[data-theme="light"] #modalRaioXRepresentante .pj-modal-box {
    background-color: #ffffff !important;
    border: none !important;
    box-shadow: none !important;
    color: #0f172a !important;
}

#modalRaioXRepresentante .pj-raiox-modal-header {
    border-bottom: none !important;
    background: transparent !important;
    padding-bottom: 16px !important;
}

.light #modalRaioXRepresentante .pj-raiox-modal-header,
[data-theme="light"] #modalRaioXRepresentante .pj-raiox-modal-header {
    border-bottom: none !important;
}

/* Seções de Card internas do Modal de Representante (Tom Escuro) */
#modalRaioXRepresentante .pj-raiox-card-section {
    background-color: #090e15 !important;
    border-radius: 14px !important;
    border: none !important;
    box-shadow: none !important;
    padding: 18px 20px !important;
    margin-bottom: 20px !important;
}

.light #modalRaioXRepresentante .pj-raiox-card-section,
[data-theme="light"] #modalRaioXRepresentante .pj-raiox-card-section {
    background-color: #f8fafc !important;
    border: none !important;
}

/* KPIs radiais dentro do Modal (Tom Escuro) */
#modalRaioXRepresentante .pj-raiox-kpi-card {
    background-color: #090e15 !important;
    border-radius: 12px !important;
    border: none !important;
    box-shadow: none !important;
    padding: 14px 18px !important;
}

.light #modalRaioXRepresentante .pj-raiox-kpi-card,
[data-theme="light"] #modalRaioXRepresentante .pj-raiox-kpi-card {
    background-color: #f1f5f9 !important;
    border: none !important;
}

/* Painéis de Distribuição (Famílias & Fornecedores) (Tom Escuro) */
#modalRaioXRepresentante .pj-raiox-panel {
    background-color: #090e15 !important;
    border-radius: 14px !important;
    border: none !important;
    box-shadow: none !important;
    padding: 16px !important;
}

.light #modalRaioXRepresentante .pj-raiox-panel,
[data-theme="light"] #modalRaioXRepresentante .pj-raiox-panel {
    background-color: #f8fafc !important;
    border: none !important;
}

/* Tabelas dentro do Modal (#tabelaModalRaioXAbc e #tabelaModalRaioXTop100) */
#modalRaioXRepresentante .pj-raiox-table-container {
    background-color: #090e15 !important;
    border-radius: 12px !important;
    border: none !important;
    box-shadow: none !important;
    overflow: hidden !important;
    margin-top: 10px !important;
}

.light #modalRaioXRepresentante .pj-raiox-table-container,
[data-theme="light"] #modalRaioXRepresentante .pj-raiox-table-container {
    background-color: #ffffff !important;
    border: none !important;
}

#modalRaioXRepresentante .pj-raiox-table thead th {
    background-color: #141c27 !important;
    color: #94a3b8 !important;
    font-size: 10.5px !important;
    font-weight: 800 !important;
    text-transform: uppercase !important;
    letter-spacing: 0.5px !important;
    padding: 10px 12px !important;
    border: none !important;
    border-bottom: none !important;
}

.light #modalRaioXRepresentante .pj-raiox-table thead th,
[data-theme="light"] #modalRaioXRepresentante .pj-raiox-table thead th {
    background-color: #f1f5f9 !important;
    color: #64748b !important;
    border-bottom: none !important;
}

#modalRaioXRepresentante .pj-raiox-table tbody tr:nth-child(even) td {
    background-color: #090e15 !important;
    color: #f1f5f9 !important;
    border: none !important;
}

#modalRaioXRepresentante .pj-raiox-table tbody tr:nth-child(odd) td {
    background-color: #0f141b !important;
    color: #f1f5f9 !important;
    border: none !important;
}

#modalRaioXRepresentante .pj-raiox-table tbody tr:hover td {
    background-color: #16202c !important;
}

.light #modalRaioXRepresentante .pj-raiox-table tbody tr:nth-child(even) td,
[data-theme="light"] #modalRaioXRepresentante .pj-raiox-table tbody tr:nth-child(even) td {
    background-color: #f8fafc !important;
    color: #0f172a !important;
    border-bottom: none !important;
}

.light #modalRaioXRepresentante .pj-raiox-table tbody tr:nth-child(odd) td,
[data-theme="light"] #modalRaioXRepresentante .pj-raiox-table tbody tr:nth-child(odd) td {
    background-color: #ffffff !important;
    color: #0f172a !important;
    border-bottom: none !important;
}

/* Botões do Rodapé do Modal */
#modalRaioXRepresentante .pj-raiox-modal-footer {
    border-top: none !important;
    padding-top: 14px !important;
    margin-top: 16px !important;
    background: transparent !important;
}

.light #modalRaioXRepresentante .pj-raiox-modal-footer,
[data-theme="light"] #modalRaioXRepresentante .pj-raiox-modal-footer {
    border-top: none !important;
}

#modalRaioXRepresentante .pj-raiox-modal-footer .pj-btn-secondary {
    background: #141c27 !important;
    color: #f8fafc !important;
    border: none !important;
    border-radius: 9999px !important;
    padding: 8px 18px !important;
    box-shadow: none !important;
}

#modalRaioXRepresentante .pj-raiox-modal-footer .pj-btn-secondary:hover {
    background: #1c2533 !important;
}

.light #modalRaioXRepresentante .pj-raiox-modal-footer .pj-btn-secondary,
[data-theme="light"] #modalRaioXRepresentante .pj-raiox-modal-footer .pj-btn-secondary {
    background: #f1f5f9 !important;
    color: #0f172a !important;
}

.light #modalRaioXRepresentante .pj-raiox-modal-footer .pj-btn-secondary:hover,
[data-theme="light"] #modalRaioXRepresentante .pj-raiox-modal-footer .pj-btn-secondary:hover {
    background: #e2e8f0 !important;
}


/* ==========================================================================
   BOTÕES CIRCULARES DO HEADER & VIEWS (1 COR / FORMATO CÍRCULO / SEM ESCRITO)
   ========================================================================== */
.pj-theme-toggle-btn,
#btnThemeToggle,
#btnHeaderMinhaConta,
#btnHeaderLogout {
    width: 32px !important;
    height: 32px !important;
    min-width: 32px !important;
    max-width: 32px !important;
    padding: 0 !important;
    border-radius: 50% !important;
    border: none !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    cursor: pointer !important;
    box-shadow: none !important;
    outline: none !important;
    margin: 0 2px !important;
    background-color: var(--pj-bg-inset, #19222e) !important;
    color: #94a3b8 !important;
    transition: transform 0.15s ease, background-color 0.15s ease, color 0.15s ease !important;
}

#btnThemeToggle {
    color: #f59e0b !important;
}

#btnThemeToggle:hover {
    background-color: rgba(245, 158, 11, 0.15) !important;
    color: #fbbf24 !important;
    transform: scale(1.08) !important;
}

#btnHeaderMinhaConta:hover {
    background-color: rgba(255, 255, 255, 0.08) !important;
    color: #ffffff !important;
    transform: scale(1.08) !important;
}

#btnHeaderLogout {
    color: #f87171 !important;
}

#btnHeaderLogout:hover {
    background-color: rgba(239, 68, 68, 0.2) !important;
    color: #ffffff !important;
    transform: scale(1.08) !important;
}

#themeToggleText {
    display: none !important;
}

/* Light Mode para os botões do header */
.light .pj-theme-toggle-btn,
[data-theme="light"] .pj-theme-toggle-btn,
.light #btnThemeToggle,
[data-theme="light"] #btnThemeToggle,
.light #btnHeaderMinhaConta,
[data-theme="light"] #btnHeaderMinhaConta {
    background-color: #f2f4f7 !important;
    color: #475569 !important;
    border: none !important;
}

.light #btnThemeToggle,
[data-theme="light"] #btnThemeToggle {
    color: #d97706 !important;
}

.light #btnThemeToggle:hover,
[data-theme="light"] #btnThemeToggle:hover {
    background-color: #fef3c7 !important;
    color: #b45309 !important;
}

.light #btnHeaderMinhaConta:hover,
[data-theme="light"] #btnHeaderMinhaConta:hover {
    background-color: #e2e8f0 !important;
    color: #0f172a !important;
}

.light #btnHeaderLogout,
[data-theme="light"] #btnHeaderLogout {
    background-color: #fee2e2 !important;
    color: #dc2626 !important;
}

.light #btnHeaderLogout:hover,
[data-theme="light"] #btnHeaderLogout:hover {
    background-color: #fecaca !important;
    color: #b91c1c !important;
}


/* Padrão canônico de espessura 8 para radial rings (Estratégias IA) */
.radial-ring-bg {
    stroke-width: 8 !important;
}

.radial-ring-fill {
    stroke-width: 8 !important;
}

.light .radial-ring-bg {
    stroke: rgba(0, 0, 0, 0.08) !important;
}


/* Padrão canônico de ícone de 1 cor e fundo redondo (Tela Calendário) */
.pj-gestao-kpi-icon {
    width: 42px !important;
    height: 42px !important;
    border-radius: 50% !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    flex-shrink: 0 !important;
}

.pj-gestao-kpi-icon svg {
    display: block !important;
}

.pj-agenda-kpi-icon {
    width: 28px !important;
    height: 28px !important;
    border-radius: 50% !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    flex-shrink: 0 !important;
}

.pj-agenda-kpi-icon svg {
    display: block !important;
}

.light .pj-gestao-kpi-icon,
[data-theme='light'] .pj-gestao-kpi-icon {
    /* border: 1px solid rgba(0, 0, 0, 0.06) !important; */
}


/* Padrão dos cards superiores do Comparativo Mensal conforme print */
.comp-scorecard-triad {
    display: grid !important;
    grid-template-columns: 1fr 1.25fr 1fr !important;
    gap: 16px !important;
    margin-bottom: 22px !important;
    background: var(--pj-bg-card, #090e15) !important;
    /* border: 1px solid var(--pj-border-default, rgba(255, 255, 255, 0.08)) !important; */
    border-radius: 16px !important;
    padding: 16px !important;
}

@media (max-width: 1080px) {
    .comp-scorecard-triad {
        grid-template-columns: 1fr !important;
    }
}

.comp-zone-card {
    background: var(--bg-card-alt, #0e1d2e) !important;
    border: none !important;
    border-radius: 12px !important;
    padding: 16px 18px !important;
    box-shadow: none !important;
}

.light .comp-scorecard-triad {
    background: #ffffff !important;
    /* border-color: #e2e8f0 !important; */
}

.light .comp-zone-card {
    background: #f1f5f9 !important;
    /* border-color: #79bdf8 !important; */
}


/* Padrão canônico Material 3: Tela Estratégias IA — Rota da Meta (100% Borderless, Zero Contorno, Tonal Elevation) */
.checklist-cards-grid {
    background: transparent !important;
    border: none !important;
    box-shadow: none !important;
    padding: 0 !important;
}

.pj-checklist-card {
    background: var(--pj-bg-card, #090e15) !important;
    border: none !important;
    outline: none !important;
    border-radius: var(--pj-radius-card, 16px) !important;
    padding: 20px 22px !important;
    box-shadow: none !important;
    display: flex !important;
    flex-direction: column !important;
    justify-content: space-between !important;
    min-height: 220px !important;
    transition: background-color 0.2s cubic-bezier(0.2, 0, 0, 1) !important;
}

.card-meta-batida {
    background: rgba(16, 185, 129, 0.12) !important;
    border: none !important;
    outline: none !important;
    box-shadow: none !important;
    animation: none !important;
}

.badge-meta-batida {
    background: rgba(16, 185, 129, 0.2) !important;
    color: #34d399 !important;
    border: none !important;
    outline: none !important;
    font-size: 10px !important;
    font-weight: 800 !important;
    padding: 3px 8px !important;
    border-radius: var(--pj-radius-pill, 40px) !important;
    text-transform: uppercase !important;
    letter-spacing: 0.5px !important;
    box-shadow: none !important;
    display: inline-flex !important;
    align-items: center !important;
    gap: 4px !important;
    animation: none !important;
}

.pj-checklist-center-ring {
    border: none !important;
    padding: 12px 0 14px 0 !important;
    margin-bottom: 6px !important;
}

.pj-checklist-detail-btn {
    width: 100% !important;
    background: var(--pj-surface-inner, #141c27) !important;
    border: none !important;
    outline: none !important;
    border-radius: var(--pj-radius-pill, 40px) !important;
    color: #c084fc !important;
    font-size: 11px !important;
    font-weight: 700 !important;
    padding: 8px 14px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 6px !important;
    cursor: pointer !important;
    transition: background-color 0.2s cubic-bezier(0.2, 0, 0, 1) !important;
    box-shadow: none !important;
}

.pj-checklist-detail-btn:hover {
    background: var(--pj-surface-hover, #1e293b) !important;
    color: #e9d5ff !important;
    border: none !important;
    box-shadow: none !important;
}

/* Tema Claro: Estratégias IA — Rota da Meta (Fundo Branco nos Cards, Fundo Tonal no Batida, Zero Contorno) */
.light .checklist-cards-grid,
[data-theme="light"] .checklist-cards-grid {
    background: transparent !important;
    border: none !important;
    box-shadow: none !important;
    padding: 0 !important;
}

.light .pj-checklist-card,
[data-theme="light"] .pj-checklist-card {
    background: #ffffff !important;
    border: none !important;
    outline: none !important;
    border-radius: var(--pj-radius-card, 16px) !important;
    box-shadow: none !important;
    color: #0f172a !important;
}

.light .pj-checklist-card:hover,
[data-theme="light"] .pj-checklist-card:hover {
    background: #ffffff !important;
    border: none !important;
    box-shadow: none !important;
}

.light .card-meta-batida,
[data-theme="light"] .card-meta-batida {
    background: #f0fdf4 !important;
    border: none !important;
    outline: none !important;
    box-shadow: none !important;
    animation: none !important;
}

.light .card-meta-batida:hover,
[data-theme="light"] .card-meta-batida:hover {
    background: #ecfdf5 !important;
    border: none !important;
    box-shadow: none !important;
}

.light .badge-meta-batida,
[data-theme="light"] .badge-meta-batida {
    background: #d1fae5 !important;
    color: #047857 !important;
    border: none !important;
    outline: none !important;
    box-shadow: none !important;
}

.light .pj-checklist-detail-btn,
[data-theme="light"] .pj-checklist-detail-btn {
    background: #f1f5f9 !important;
    color: #0f172a !important;
    border: none !important;
    box-shadow: none !important;
}

.light .pj-checklist-detail-btn:hover,
[data-theme="light"] .pj-checklist-detail-btn:hover {
    background: #e2e8f0 !important;
    color: #0f172a !important;
    border: none !important;
    box-shadow: none !important;
}

.light .radial-ring-bg,
[data-theme="light"] .radial-ring-bg {
    stroke: #e2e8f0 !important;
}

.light .radial-ring-pct,
[data-theme="light"] .radial-ring-pct {
    color: #0f172a !important;
}

.light .pj-checklist-metric-label,
[data-theme="light"] .pj-checklist-metric-label {
    color: #64748b !important;
    font-weight: 600 !important;
}

.light .pj-checklist-metric-val,
[data-theme="light"] .pj-checklist-metric-val {
    color: #0f172a !important;
}

.light .val-meta-sugerida,
[data-theme="light"] .val-meta-sugerida {
    color: var(--pj-info, #0369a1) !important;
}

.light .val-faturado-erp,
[data-theme="light"] .val-faturado-erp {
    color: var(--pj-ok, #047857) !important;
}

.light .pj-checklist-saldo-row,
[data-theme="light"] .pj-checklist-saldo-row {
    border: none !important;
}

/* ==============================================================================
   PADRONIZAÇÃO MATERIAL 3 DO MODAL DE LOGIN & RECUPERAÇÃO DE ACESSO
   ============================================================================== */
#modalLogin.pj-modal-overlay {
  background: rgba(15, 23, 42, 0.65) !important;
  -webkit-backdrop-filter: blur(8px) !important;
  backdrop-filter: blur(8px) !important;
  display: none;
  align-items: center;
  justify-content: center;
  z-index: 99999 !important;
}

#modalLogin.pj-modal-overlay.active {
  display: flex !important;
}

#modalLogin .pj-login-card-m3,
#modalLogin .pj-modal-box {
  background: #FFFFFF !important;
  background-color: #FFFFFF !important;
  color: #0F172A !important;
  border-radius: 28px !important;
  border: none !important;
  box-shadow: none !important;
}

#modalLogin h2 {
  color: #0F172A !important;
}

#modalLogin .pj-auth-tab-pill-box {
  background: #FFFFFF !important;
  background-color: #FFFFFF !important;
  border: none !important;
  border-radius: 9999px !important;
  padding: 4px !important;
}

#modalLogin .pj-auth-tab-pill-box button {
  border: none !important;
}

#modalLogin .pj-auth-tab-pill-box button:hover {
  background: #647491 !important;
  background-color: #647491 !important;
  color: #FFFFFF !important;
  border: none !important;
}

#modalLogin .pj-form-label {
  color: #334155 !important;
  font-size: 12px !important;
  font-weight: 700 !important;
}

#modalLogin .m3-input,
#modalLogin .pj-form-input {
  background-color: #F1F5F9 !important;
  background: #F1F5F9 !important;
  color: #0F172A !important;
  border: none !important;
  border-radius: 12px !important;
  font-size: 13.5px !important;
  box-shadow: none !important;
  transition: all 0.2s ease !important;
}

#modalLogin .m3-input:focus,
#modalLogin .pj-form-input:focus {
  border: none !important;
  outline: 2px solid rgba(2, 132, 199, 0.25) !important;
  box-shadow: none !important;
}

#modalLogin .m3-input::placeholder,
#modalLogin .pj-form-input::placeholder {
  color: #94A3B8 !important;
}

/* Botões com Material 3 High Contrast */
#modalLogin #btnLoginSubmit,
#modalLogin #btnRegSubmit,
#modalLogin #btnRecuperarSubmit {
  background: #ab2f4c !important;
  background-color: #ab2f4c !important;
  color: #FFFFFF !important;
  font-weight: 700 !important;
  font-size: 14px !important;
  border: none !important;
  border-radius: 9999px !important;
  box-shadow: 0 4px 14px rgba(171, 47, 76, 0.35) !important;
  cursor: pointer !important;
}

#modalLogin #btnLoginSubmit:hover,
#modalLogin #btnRegSubmit:hover,
#modalLogin #btnRecuperarSubmit:hover {
  background: #647491 !important;
  background-color: #647491 !important;
  color: #FFFFFF !important;
  box-shadow: 0 6px 18px rgba(100, 116, 145, 0.45) !important;
  transform: translateY(-1px) !important;
}


/* ==========================================================================
   PAINEL DE DESEMPENHO E CONVERSÃO - BLOCO ÚNICO UNIFICADO (LIGHT / DARK)
   ========================================================================== */
.pj-desempenho-unified-container {
    background-color: var(--pj-bg-card, #090e15) !important;
    border-radius: var(--pj-radius-card, 16px) !important;
    box-shadow: none !important;
    border: none !important;
}

.light .pj-desempenho-unified-container,
[data-theme="light"] .pj-desempenho-unified-container {
    background-color: #FFFFFF !important;
    border: none !important;
    box-shadow: none !important;
}

.light .pj-desempenho-unified-container .pj-desempenho-header,
[data-theme="light"] .pj-desempenho-unified-container .pj-desempenho-header {
    border-bottom: 1px solid #E2E8F0 !important;
}

/* Os cards dentro do painel unificado possuem contraste sutil (#f8fafc no light) */
.light .pj-desempenho-unified-container .pj-strategy-card,
[data-theme="light"] .pj-desempenho-unified-container .pj-strategy-card {
    background-color: #F8FAFC !important;
    border: none !important;
}

.light .pj-desempenho-unified-container .pj-strategy-card:hover,
[data-theme="light"] .pj-desempenho-unified-container .pj-strategy-card:hover {
    background-color: #F1F5F9 !important;
    border-color: #CBD5E1 !important;
}

/* Card do pódio integrado no light */
.light .pj-desempenho-unified-container .pj-desempenho-podium-card,
[data-theme="light"] .pj-desempenho-unified-container .pj-desempenho-podium-card {
    background-color: #F8FAFC !important;
    border: none !important;
}


/* ==========================================================================
   RANKING / PÓDIO: CLASSE CANÔNICA DOS CÍRCULOS NUMÉRICOS (.pj-rank-circle)
   ========================================================================== */
.pj-rank-circle {
    width: 22px !important;
    height: 22px !important;
    border-radius: 50% !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    font-size: 11px !important;
    font-weight: 800 !important;
    flex-shrink: 0 !important;
    line-height: 1 !important;
}

/* 1º Lugar - Ouro / Âmbar */
.pj-rank-circle.rank-1 {
    background: rgba(245, 158, 11, 0.2) !important;
    color: #F59E0B !important;
}
.light .pj-rank-circle.rank-1,
[data-theme="light"] .pj-rank-circle.rank-1 {
    background: rgba(245, 158, 11, 0.16) !important;
    color: #D97706 !important;
}

/* 2º Lugar - Prata / Slate */
.pj-rank-circle.rank-2 {
    background: rgba(148, 163, 184, 0.2) !important;
    color: #CBD5E1 !important;
}
.light .pj-rank-circle.rank-2,
[data-theme="light"] .pj-rank-circle.rank-2 {
    background: rgba(100, 116, 139, 0.16) !important;
    color: #475569 !important;
}

/* 3º Lugar - Bronze / Laranja */
.pj-rank-circle.rank-3 {
    background: rgba(249, 115, 22, 0.2) !important;
    color: #F97316 !important;
}
.light .pj-rank-circle.rank-3,
[data-theme="light"] .pj-rank-circle.rank-3 {
    background: rgba(249, 115, 22, 0.16) !important;
    color: #EA580C !important;
}

/* Demais posições */
.pj-rank-circle.rank-out {
    font-size: 10px !important;
    font-weight: 700 !important;
    background: rgba(255, 255, 255, 0.06) !important;
    color: var(--pj-text-muted, #94A3B8) !important;
}
.light .pj-rank-circle.rank-out,
[data-theme="light"] .pj-rank-circle.rank-out {
    background: rgba(0, 0, 0, 0.05) !important;
    color: #64748B !important;
}


/* ==========================================================================
   REGRA UNIVERSAL: TEXTAREA COM BORDER-RADIUS PADRÃO (8PX)
   Textareas possuem múltiplas linhas e nunca devem usar border-radius: 100px
   ========================================================================== */
textarea,
textarea.pj-form-input,
textarea.pj-form-textarea,
.pj-form-textarea,
[data-theme="dark"] textarea,
[data-theme="dark"] .pj-form-textarea,
[data-theme="light"] textarea,
[data-theme="light"] .pj-form-textarea,
.dark textarea,
.dark .pj-form-textarea,
.light textarea,
.light .pj-form-textarea {
    border-radius: 8px !important;
    padding: 10px 14px !important;
}

/* ==========================================================================
   BOTÕES CIRCULARES CANÔNICOS M3: AÇÕES DE COLABORADORES (TABELA & MODAL)
   Padrão: 1 cor temática, redondo (border-radius: 50%), sem texto, ícone SVG
   ========================================================================== */

/* Variante TIME (Gestor de Representantes - Roxo / Violeta) */
.pj-btn-circle-action.btn-action-time {
    background-color: rgba(139, 92, 246, 0.16) !important;
    color: #A78BFA !important;
}
.pj-btn-circle-action.btn-action-time:hover {
    background-color: rgba(139, 92, 246, 0.3) !important;
    color: #FFFFFF !important;
}
.light .pj-btn-circle-action.btn-action-time,
[data-theme="light"] .pj-btn-circle-action.btn-action-time {
    background-color: #ede9fe !important;
    color: #7c3aed !important;
}
.light .pj-btn-circle-action.btn-action-time:hover,
[data-theme="light"] .pj-btn-circle-action.btn-action-time:hover {
    background-color: #ddd6fe !important;
    color: #6d28d9 !important;
}

/* Variante SENHA (Segurança / Chave - Âmbar / Laranja) */
.pj-btn-circle-action.btn-action-senha {
    background-color: rgba(245, 158, 11, 0.16) !important;
    color: #FBBF24 !important;
}
.pj-btn-circle-action.btn-action-senha:hover {
    background-color: rgba(245, 158, 11, 0.3) !important;
    color: #FFFFFF !important;
}
.light .pj-btn-circle-action.btn-action-senha,
[data-theme="light"] .pj-btn-circle-action.btn-action-senha {
    background-color: #fef3c7 !important;
    color: #d97706 !important;
}
.light .pj-btn-circle-action.btn-action-senha:hover,
[data-theme="light"] .pj-btn-circle-action.btn-action-senha:hover {
    background-color: #fde68a !important;
    color: #b45309 !important;
}



/* ==========================================================================
   PADRONIZAÇÃO M3 OFICIAL P&J: RAIO-X EM TELA CHEIA (#repFullPageView)
   Idêntico ao Modal de Gestão/Diretoria: Fundo #19232e e Cards Internos #090e15
   ========================================================================== */

#repFullPageView,
#repFullPageView.pj-raiox-fullpage,
.pj-raiox-page-box {
    background-color: #19232e !important;
    border: none !important;
    border-radius: 16px !important;
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.35) !important;
    color: #f8fafc !important;
    padding: 24px !important;
    margin-bottom: 24px !important;
}

.light #repFullPageView,
[data-theme="light"] #repFullPageView,
.light .pj-raiox-page-box,
[data-theme="light"] .pj-raiox-page-box {
    background-color: #ffffff !important;
    border: none !important;
    box-shadow: 0 4px 16px rgba(0, 0, 0, 0.06) !important;
    color: #0f172a !important;
}

#repFullPageView .pj-raiox-page-header {
    border-bottom: none !important;
    background: transparent !important;
    padding-bottom: 16px !important;
}

.light #repFullPageView .pj-raiox-page-header,
[data-theme="light"] #repFullPageView .pj-raiox-page-header {
    border-bottom: none !important;
}

/* Seções de Card internas do Raio-X da Página (Tom Escuro #090e15) */
#repFullPageView .pj-raiox-card-section {
    background-color: #090e15 !important;
    border-radius: 14px !important;
    border: none !important;
    box-shadow: none !important;
    padding: 18px 20px !important;
    margin-bottom: 20px !important;
}

.light #repFullPageView .pj-raiox-card-section,
[data-theme="light"] #repFullPageView .pj-raiox-card-section {
    background-color: #f8fafc !important;
    border: none !important;
}

/* KPIs dentro do Raio-X da Página (Tom Escuro #090e15) */
#repFullPageView .pj-raiox-kpi-card {
    background-color: #090e15 !important;
    border-radius: 12px !important;
    border: none !important;
    box-shadow: none !important;
    padding: 14px 18px !important;
}

.light #repFullPageView .pj-raiox-kpi-card,
[data-theme="light"] #repFullPageView .pj-raiox-kpi-card {
    background-color: #f8fafc !important;
    border: none !important;
}

/* Painéis de Famílias e Fornecedores da Página (Tom Escuro #090e15) */
#repFullPageView .pj-raiox-panel {
    background-color: #090e15 !important;
    border-radius: 14px !important;
    border: none !important;
    box-shadow: none !important;
}

.light #repFullPageView .pj-raiox-panel,
[data-theme="light"] #repFullPageView .pj-raiox-panel {
    background-color: #f8fafc !important;
    border: none !important;
}

/* Containers de Tabela da Página (Tom Escuro #090e15) */
#repFullPageView .pj-raiox-table-container {
    background-color: #090e15 !important;
    border-radius: 12px !important;
    border: none !important;
    box-shadow: none !important;
    overflow: hidden !important;
}

.light #repFullPageView .pj-raiox-table-container,
[data-theme="light"] #repFullPageView .pj-raiox-table-container {
    background-color: #f8fafc !important;
    border: none !important;
}

#repFullPageView .pj-raiox-table thead th {
    background-color: #0d141f !important;
    border-bottom: none !important;
}

.light #repFullPageView .pj-raiox-table thead th,
[data-theme="light"] #repFullPageView .pj-raiox-table thead th {
    background-color: #f1f5f9 !important;
    border-bottom: none !important;
}

#repFullPageView .pj-raiox-table tbody tr:nth-child(even) td {
    background-color: #090e15 !important;
}

#repFullPageView .pj-raiox-table tbody tr:nth-child(odd) td {
    background-color: #0c121b !important;
}

#repFullPageView .pj-raiox-table tbody tr:hover td {
    background-color: #141f2e !important;
}

.light #repFullPageView .pj-raiox-table tbody tr:nth-child(even) td,
[data-theme="light"] #repFullPageView .pj-raiox-table tbody tr:nth-child(even) td {
    background-color: #f8fafc !important;
}

.light #repFullPageView .pj-raiox-table tbody tr:nth-child(odd) td,
[data-theme="light"] #repFullPageView .pj-raiox-table tbody tr:nth-child(odd) td {
    background-color: #ffffff !important;
}

.light #repFullPageView .pj-raiox-table tbody tr:hover td,
[data-theme="light"] #repFullPageView .pj-raiox-table tbody tr:hover td {
    background-color: #f1f5f9 !important;
}


/* Sub-elementos internos do Raio-X do Cliente (#modalComparativoSemestral) */
#modalComparativoSemestral .pj-client-ficha-header {
    border-bottom: none !important;
    background: transparent !important;
    padding-bottom: 14px !important;
}

.light #modalComparativoSemestral .pj-client-ficha-header,
[data-theme="light"] #modalComparativoSemestral .pj-client-ficha-header {
    border-bottom: none !important;
}

#modalComparativoSemestral .pj-raiox-tactical-subcard,
#modalComparativoSemestral .pj-semestral-box,
#modalComparativoSemestral .pj-placa-mini-card {
    background-color: #141c27 !important;
    border: none !important;
}

.light #modalComparativoSemestral .pj-raiox-tactical-subcard,
.light #modalComparativoSemestral .pj-semestral-box,
.light #modalComparativoSemestral .pj-placa-mini-card,
[data-theme="light"] #modalComparativoSemestral .pj-raiox-tactical-subcard,
[data-theme="light"] #modalComparativoSemestral .pj-semestral-box,
[data-theme="light"] #modalComparativoSemestral .pj-placa-mini-card {
    background-color: #ffffff !important;
    border: none !important;
}

#modalComparativoSemestral .pj-raiox-table-container {
    background-color: #090e15 !important;
    border-radius: 12px !important;
    border: none !important;
    overflow: hidden !important;
}

.light #modalComparativoSemestral .pj-raiox-table-container,
[data-theme="light"] #modalComparativoSemestral .pj-raiox-table-container {
    background-color: #ffffff !important;
    border: none !important;
}

#modalComparativoSemestral .pj-raiox-table thead th {
    background-color: #141c27 !important;
    color: #94a3b8 !important;
    border-bottom: none !important;
}

.light #modalComparativoSemestral .pj-raiox-table thead th,
[data-theme="light"] #modalComparativoSemestral .pj-raiox-table thead th {
    background-color: #f1f5f9 !important;
    color: #64748b !important;
    border-bottom: none !important;
}

#modalComparativoSemestral .pj-raiox-table tbody tr:nth-child(even) td {
    background-color: #090e15 !important;
    color: #f1f5f9 !important;
    border: none !important;
}

#modalComparativoSemestral .pj-raiox-table tbody tr:nth-child(odd) td {
    background-color: #0f141b !important;
    color: #f1f5f9 !important;
    border: none !important;
}

#modalComparativoSemestral .pj-raiox-table tbody tr:hover td {
    background-color: #16202c !important;
}

.light #modalComparativoSemestral .pj-raiox-table tbody tr:nth-child(even) td,
[data-theme="light"] #modalComparativoSemestral .pj-raiox-table tbody tr:nth-child(even) td {
    background-color: #f8fafc !important;
    color: #0f172a !important;
    border-bottom: none !important;
}

.light #modalComparativoSemestral .pj-raiox-table tbody tr:nth-child(odd) td,
[data-theme="light"] #modalComparativoSemestral .pj-raiox-table tbody tr:nth-child(odd) td {
    background-color: #ffffff !important;
    color: #0f172a !important;
    border-bottom: none !important;
}

#modalComparativoSemestral .pj-timeline-item {
    background: #141c27 !important;
}

.light #modalComparativoSemestral .pj-timeline-item,
[data-theme="light"] #modalComparativoSemestral .pj-timeline-item {
    background: #f1f5f9 !important;
}

/* Tipografia e acentuação do Raio-X do Cliente no Tema Claro (WCAG AA) */
.light #modalComparativoSemestral .pj-client-ficha-header h3,
[data-theme="light"] #modalComparativoSemestral .pj-client-ficha-header h3,
.light #modalComparativoSemestral .pj-client-modal-title,
[data-theme="light"] #modalComparativoSemestral .pj-client-modal-title {
    color: #0f172a !important;
}

.light #modalComparativoSemestral #modalSemestralClienteNome,
[data-theme="light"] #modalComparativoSemestral #modalSemestralClienteNome {
    color: #0369a1 !important;
}

.light #modalComparativoSemestral .pj-raiox-kpi-card,
[data-theme="light"] #modalComparativoSemestral .pj-raiox-kpi-card {
    background-color: #f8fafc !important;
    border: none !important;
    box-shadow: none !important;
}

.light #modalComparativoSemestral .pj-raiox-kpi-title,
[data-theme="light"] #modalComparativoSemestral .pj-raiox-kpi-title {
    color: #475569 !important;
}

.light #modalComparativoSemestral .pj-raiox-kpi-val,
[data-theme="light"] #modalComparativoSemestral .pj-raiox-kpi-val {
    color: #0f172a !important;
}

.light #modalComparativoSemestral .pj-raiox-kpi-sub,
[data-theme="light"] #modalComparativoSemestral .pj-raiox-kpi-sub {
    color: #64748b !important;
}

.light #modalComparativoSemestral #modalKpiTicketMedio,
[data-theme="light"] #modalComparativoSemestral #modalKpiTicketMedio {
    color: #047857 !important;
}

.light #modalComparativoSemestral #modalKpiCadenciaVal,
[data-theme="light"] #modalComparativoSemestral #modalKpiCadenciaVal {
    color: #0369a1 !important;
}

.light #modalComparativoSemestral #modalKpiMixSkus,
[data-theme="light"] #modalComparativoSemestral #modalKpiMixSkus {
    color: #b45309 !important;
}

.light #modalComparativoSemestral #modalKpiPlacasVal,
[data-theme="light"] #modalComparativoSemestral #modalKpiPlacasVal {
    color: #0369a1 !important;
}

.light #modalComparativoSemestral #modalKpiCategoriaLider,
[data-theme="light"] #modalComparativoSemestral #modalKpiCategoriaLider {
    color: #7c3aed !important;
}

.light #modalComparativoSemestral #modalKpiFornecedorLider,
[data-theme="light"] #modalComparativoSemestral #modalKpiFornecedorLider {
    color: #0369a1 !important;
}

.light #modalComparativoSemestral #modalHistTopObjecao,
[data-theme="light"] #modalComparativoSemestral #modalHistTopObjecao {
    color: #b91c1c !important;
}

.light #modalComparativoSemestral #modalHistRecomendacaoTatica,
[data-theme="light"] #modalComparativoSemestral #modalHistRecomendacaoTatica {
    color: #b45309 !important;
}

.light #modalComparativoSemestral .pj-raiox-modal-footer,
[data-theme="light"] #modalComparativoSemestral .pj-raiox-modal-footer {
    border-top: none !important;
    background: transparent !important;
}

.light #modalComparativoSemestral #modalFichaOrigemIndicadores,
[data-theme="light"] #modalComparativoSemestral #modalFichaOrigemIndicadores {
    color: #64748b !important;
}


/* ==========================================================================
   PADRONIZAÇÃO M3 CANÔNICA: COMPARATIVO MENSAL (view_comparativo.html)
   ========================================================================== */

/* Tríade de Scorecards Executivos */
.comp-scorecard-triad {
    display: grid !important;
    grid-template-columns: 1fr 1.25fr 1fr !important;
    gap: 16px !important;
    margin-bottom: 22px !important;
}

@media (max-width: 1080px) {
    .comp-scorecard-triad {
        grid-template-columns: 1fr !important;
    }
}

.comp-zone-card {
    background: #0e1d2e !important;
    border: none !important;
    border-radius: 16px !important;
    padding: 18px 20px !important;
    box-shadow: none !important;
    display: flex !important;
    flex-direction: column !important;
    position: relative !important;
}

.light .comp-zone-card,
[data-theme="light"] .comp-zone-card {
    background: #f1f5f9 !important;
    background-color: #f1f5f9 !important;
    border: none !important;
    box-shadow: none !important;
}

.comp-zone-header {
    display: flex !important;
    justify-content: space-between !important;
    align-items: flex-start !important;
    margin-bottom: 6px !important;
}

.comp-zone-title {
    font-size: 12px !important;
    font-weight: 800 !important;
    text-transform: uppercase !important;
    letter-spacing: 0.5px !important;
}

.comp-zone-title.title-feito { color: #38bdf8 !important; }
.comp-zone-title.title-potencial { color: #c084fc !important; }
.comp-zone-title.title-mesa { color: #ef4444 !important; }

.light .comp-zone-title.title-feito, [data-theme="light"] .comp-zone-title.title-feito { color: #0284c7 !important; }
.light .comp-zone-title.title-potencial, [data-theme="light"] .comp-zone-title.title-potencial { color: #7c3aed !important; }
.light .comp-zone-title.title-mesa, [data-theme="light"] .comp-zone-title.title-mesa { color: #dc2626 !important; }

.comp-zone-val {
    font-size: 28px !important;
    font-weight: 900 !important;
    letter-spacing: -0.5px !important;
    margin: 4px 0 2px 0 !important;
}

.comp-zone-val.val-feito { color: #38bdf8 !important; }
.comp-zone-val.val-potencial { color: #c084fc !important; }
.comp-zone-val.val-mesa { color: #f87171 !important; }

.light .comp-zone-val.val-feito, [data-theme="light"] .comp-zone-val.val-feito { color: #0284c7 !important; }
.light .comp-zone-val.val-potencial, [data-theme="light"] .comp-zone-val.val-potencial { color: #7c3aed !important; }
.light .comp-zone-val.val-mesa, [data-theme="light"] .comp-zone-val.val-mesa { color: #dc2626 !important; }

.comp-zone-sub {
    font-size: 11.5px !important;
    color: var(--pj-text-muted) !important;
    margin-bottom: 12px !important;
}

/* Sub-card grid no rodapé das zonas */
.comp-subcard-grid {
    display: grid !important;
    grid-template-columns: repeat(3, 1fr) !important;
    gap: 8px !important;
    margin-top: auto !important;
    padding-top: 12px !important;
    border-top: none !important;
}

.light .comp-subcard-grid,
[data-theme="light"] .comp-subcard-grid {
    border-top: none !important;
}

.comp-subcard-item {
    background: #090e15 !important;
    border: none !important;
    padding: 8px 10px !important;
    border-radius: 8px !important;
    text-align: center !important;
}

.light .comp-subcard-item,
[data-theme="light"] .comp-subcard-item {
    background: #ffffff !important;
    background-color: #ffffff !important;
    border: none !important;
    box-shadow: none !important;
}

.comp-subcard-lbl {
    font-size: 10px !important;
    font-weight: 700 !important;
    color: #94a3b8 !important;
    text-transform: uppercase !important;
    letter-spacing: 0.3px !important;
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    margin-bottom: 2px !important;
}

.light .comp-subcard-lbl,
[data-theme="light"] .comp-subcard-lbl {
    color: #64748b !important;
}

.comp-subcard-val {
    font-size: 14px !important;
    font-weight: 800 !important;
}

/* Termômetro e Balanço na Zona 2 */
.comp-meta-thermometer.alert {
    background: rgba(239, 68, 68, 0.12) !important;
    border: 1px solid rgba(239, 68, 68, 0.3) !important;
    color: #fca5a5 !important;
    border-radius: 8px !important;
    padding: 8px 12px !important;
    font-size: 11.5px !important;
    font-weight: 600 !important;
    margin-top: 10px !important;
}

.light .comp-meta-thermometer.alert,
[data-theme="light"] .comp-meta-thermometer.alert {
    background: #fef2f2 !important;
    border: 1px solid #fecaca !important;
    color: #b91c1c !important;
}

/* Badges da Tríade no Tema Claro */
.light #compPlacarAprovBadge,
[data-theme="light"] #compPlacarAprovBadge {
    background: #ede9fe !important;
    color: #6d28d9 !important;
    font-weight: 700 !important;
}

.light #compPlacarMesaBadge,
[data-theme="light"] #compPlacarMesaBadge {
    background: #fee2e2 !important;
    color: #b91c1c !important;
    font-weight: 700 !important;
}

/* Sub-cards de Movimentação da Base, Ticket e Insights */
.comp-mini-card {
    background: var(--bg-card-alt, #0e1d2e) !important;
    border: none !important;
    border-radius: 12px !important;
    padding: 14px !important;
    display: flex !important;
    flex-direction: column !important;
    justify-content: space-between !important;
}

.light .comp-mini-card,
[data-theme="light"] .comp-mini-card {
    background: #f8fafc !important;
    border: none !important;
}

.comp-insight-card {
    background: var(--bg-card-alt, #0e1d2e) !important;
    border: none !important;
    border-radius: 14px !important;
    padding: 18px !important;
}

.light .comp-insight-card,
[data-theme="light"] .comp-insight-card {
    background: #f8fafc !important;
    border: none !important;
}

/* Cabeçalhos de seção padronizados */
.comp-section-header {
    display: flex !important;
    justify-content: space-between !important;
    align-items: center !important;
    margin-bottom: 16px !important;
}

.comp-section-header-title {
    display: flex !important;
    align-items: center !important;
    gap: 10px !important;
}

.comp-section-icon {
    font-size: 20px !important;
    line-height: 1 !important;
}


/* ==========================================================================
   PADRONIZAÇÃO M3 TOTAL: ZERO CONTORNO (BORDER: NONE) & ZERO DROP-SHADOW
   Contraste refinado para Tema Claro (Fundo Branco) em todas as páginas
   ========================================================================== */

/* Zero-Borda & Zero-Shadow Universal Estrito para Comparativo Mensal */
#view_comparativo div,
#view_comparativo .pj-card,
#view_comparativo .comp-zone-card,
#view_comparativo .pj-desempenho-unified-container,
#compBaseClientesContainer > div,
#compTicketPerformanceContainer > div,
#compInsightsIaGrid > div,
#compRecorrenciaContainer > div,
#compStatusAcaoContainer > div,
#compTimelineContainer > div,
#compMotivosContainer > div,
#compAnotacoesContainer > div,
#compEstrategiaIaContainer > div {
    border: none !important;
    border-left: none !important;
    border-right: none !important;
    border-bottom: none !important;
    box-shadow: none !important;
    -webkit-box-shadow: none !important;
    outline: none !important;
}

/* Light Theme: Contraste Tonal Perfeito no Comparativo (Fundo Cinza Suave #F8FAFC nos Subcards sobre Fundo Branco #FFFFFF do Card Principal) */
.light #compBaseClientesContainer > div,
.light #compTicketPerformanceContainer > div,
.light #compInsightsIaGrid > div,
.light #compRecorrenciaContainer > div,
.light #compStatusAcaoContainer > div,
.light #compTimelineContainer > div,
.light #compMotivosContainer > div,
.light #compAnotacoesContainer > div,
.light #compEstrategiaIaContainer > div,
[data-theme="light"] #compBaseClientesContainer > div,
[data-theme="light"] #compTicketPerformanceContainer > div,
[data-theme="light"] #compInsightsIaGrid > div,
[data-theme="light"] #compRecorrenciaContainer > div,
[data-theme="light"] #compStatusAcaoContainer > div,
[data-theme="light"] #compTimelineContainer > div,
[data-theme="light"] #compMotivosContainer > div,
[data-theme="light"] #compAnotacoesContainer > div,
[data-theme="light"] #compEstrategiaIaContainer > div {
    background-color: #F8FAFC !important;
    border: none !important;
    box-shadow: none !important;
}

/* 1. Desempenho e Conversão (Painel Geral e Cards) */
.pj-desempenho-unified-container,
#painelDesempenhoConversaoSection,
.pj-strategy-panel,
.pj-desempenho-podium-card,
.pj-strategy-card,
.pj-desempenho-card,
.comp-zone-card,
.comp-scorecard-triad,
.comp-subcard-item,
.comp-mini-card,
.comp-insight-card,
.pj-card {
    border: none !important;
    box-shadow: none !important;
    -webkit-box-shadow: none !important;
    outline: none !important;
    filter: none !important;
}

.light .pj-desempenho-unified-container,
[data-theme="light"] .pj-desempenho-unified-container {
    background-color: #FFFFFF !important;
    border: none !important;
    box-shadow: none !important;
}

.light .pj-desempenho-unified-container .pj-desempenho-header,
[data-theme="light"] .pj-desempenho-unified-container .pj-desempenho-header {
    border-bottom: 1px solid #F1F5F9 !important;
}

/* Cards de Estratégia / Desempenho no Tema Claro */
.light .pj-desempenho-unified-container .pj-strategy-card,
.light .pj-strategy-card,
.light .pj-desempenho-card,
[data-theme="light"] .pj-desempenho-unified-container .pj-strategy-card,
[data-theme="light"] .pj-strategy-card,
[data-theme="light"] .pj-desempenho-card {
    background-color: #F8FAFC !important;
    border: none !important;
    box-shadow: none !important;
}

.light .pj-desempenho-unified-container .pj-strategy-card:hover,
.light .pj-strategy-card:hover,
[data-theme="light"] .pj-desempenho-unified-container .pj-strategy-card:hover,
[data-theme="light"] .pj-strategy-card:hover {
    background-color: #F1F5F9 !important;
    border: none !important;
    box-shadow: none !important;
}

/* Card do pódio integrado no light */
.light .pj-desempenho-unified-container .pj-desempenho-podium-card,
.light .pj-desempenho-podium-card,
[data-theme="light"] .pj-desempenho-unified-container .pj-desempenho-podium-card,
[data-theme="light"] .pj-desempenho-podium-card {
    background-color: #F8FAFC !important;
    border: none !important;
    box-shadow: none !important;
}

/* 2. CONTRASTE ELEVADO NO FUNDO BRANCO PARA O PAINEL DE DESEMPENHO */
.light .pj-strategy-card-val,
[data-theme="light"] .pj-strategy-card-val {
    color: #0F172A !important;
    font-weight: 900 !important;
}

.light .pj-strategy-meta-tag,
[data-theme="light"] .pj-strategy-meta-tag {
    color: #64748B !important;
    font-weight: 700 !important;
}

.light .pj-strategy-meta-val,
[data-theme="light"] .pj-strategy-meta-val {
    color: #1E293B !important;
    font-weight: 800 !important;
}

.light .pj-mini-bar-header,
[data-theme="light"] .pj-mini-bar-header {
    color: #475569 !important;
    font-weight: 700 !important;
}

.light .pj-mini-bar-header .pj-bar-pct,
[data-theme="light"] .pj-mini-bar-header .pj-bar-pct {
    color: #64748B !important;
}

.light .pj-mini-bar-track,
.light .pj-mini-segmented-track,
.light .pj-card-regua-track,
[data-theme="light"] .pj-mini-bar-track,
[data-theme="light"] .pj-mini-segmented-track,
[data-theme="light"] .pj-card-regua-track {
    background-color: #CBD5E1 !important;
    border: none !important;
}

/* Botão Raio-X de Clientes no card */
.pj-strategy-card-action-btn {
    border: none !important;
    box-shadow: none !important;
    outline: none !important;
}

.light .pj-strategy-card-action-btn,
[data-theme="light"] .pj-strategy-card-action-btn {
    background: #94a3b8 !important;
    background-color: #94a3b8 !important;
    color: #FFFFFF !important;
    font-weight: 700 !important;
    border: none !important;
}

.light .pj-strategy-card-action-btn:hover,
[data-theme="light"] .pj-strategy-card-action-btn:hover {
    background: #0369a1 !important;
    background-color: #0369a1 !important;
    color: #FFFFFF !important;
}

/* Badges de Categoria dos Cards (Contraste Máximo no Tema Claro) */
.light .pj-strategy-card-badge.badge-green,
[data-theme="light"] .pj-strategy-card-badge.badge-green {
    background: #DCFCE7 !important;
    color: #15803D !important;
    font-weight: 800 !important;
    border: none !important;
}

.light .pj-strategy-card-badge.badge-purple,
[data-theme="light"] .pj-strategy-card-badge.badge-purple {
    background: #F3E8FF !important;
    color: #7E22CE !important;
    font-weight: 800 !important;
    border: none !important;
}

.light .pj-strategy-card-badge.badge-yellow,
[data-theme="light"] .pj-strategy-card-badge.badge-yellow {
    background: #FEF3C7 !important;
    color: #B45309 !important;
    font-weight: 800 !important;
    border: none !important;
}

.light .pj-strategy-card-badge.badge-pink,
[data-theme="light"] .pj-strategy-card-badge.badge-pink {
    background: #FCE7F3 !important;
    color: #BE185D !important;
    font-weight: 800 !important;
    border: none !important;
}

.light .pj-strategy-card-badge.badge-red,
[data-theme="light"] .pj-strategy-card-badge.badge-red {
    background: #FEE2E2 !important;
    color: #B91C1C !important;
    font-weight: 800 !important;
    border: none !important;
}

.light .pj-strategy-card-badge.badge-slate,
[data-theme="light"] .pj-strategy-card-badge.badge-slate {
    background: #F1F5F9 !important;
    color: #334155 !important;
    font-weight: 800 !important;
    border: none !important;
}

.light .pj-strategy-card-badge.badge-cyan,
[data-theme="light"] .pj-strategy-card-badge.badge-cyan {
    background: #E0F2FE !important;
    color: #0369A1 !important;
    font-weight: 800 !important;
    border: none !important;
}

/* Chips / Pills Globais de Resumo do Topo */
.comp-global-pills-wrap {
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 8px !important;
    align-items: center !important;
}

.comp-global-pill {
    padding: 6px 14px !important;
    border-radius: 9999px !important;
    font-size: 11.5px !important;
    display: inline-flex !important;
    align-items: center !important;
    border: none !important;
    box-shadow: none !important;
}

.comp-global-pill.pill-projetado {
    background: rgba(255, 255, 255, 0.06) !important;
    color: #94A3B8 !important;
}
.comp-global-pill.pill-projetado .pill-val {
    color: #F8FAFC !important;
    margin-left: 5px !important;
    font-weight: 700 !important;
}

.comp-global-pill.pill-convertido {
    background: rgba(16, 185, 129, 0.15) !important;
    color: #6EE7B7 !important;
}
.comp-global-pill.pill-convertido .pill-val {
    color: #10B981 !important;
    margin-left: 5px !important;
    font-weight: 700 !important;
}

.comp-global-pill.pill-conversao {
    background: rgba(56, 189, 248, 0.15) !important;
    color: #7DD3FC !important;
}
.comp-global-pill.pill-conversao .pill-val {
    color: #38BDF8 !important;
    margin-left: 5px !important;
    font-weight: 700 !important;
}

.light .comp-global-pill.pill-projetado,
[data-theme="light"] .comp-global-pill.pill-projetado {
    background: #F1F5F9 !important;
    color: #475569 !important;
    border: none !important;
}
.light .comp-global-pill.pill-projetado .pill-val,
[data-theme="light"] .comp-global-pill.pill-projetado .pill-val {
    color: #0F172A !important;
    font-weight: 800 !important;
}

.light .comp-global-pill.pill-convertido,
[data-theme="light"] .comp-global-pill.pill-convertido {
    background: #DCFCE7 !important;
    color: #166534 !important;
    border: none !important;
}
.light .comp-global-pill.pill-convertido .pill-val,
[data-theme="light"] .comp-global-pill.pill-convertido .pill-val {
    color: #15803D !important;
    font-weight: 800 !important;
}

.light .comp-global-pill.pill-conversao,
[data-theme="light"] .comp-global-pill.pill-conversao {
    background: #E0F2FE !important;
    color: #075985 !important;
    border: none !important;
}
.light .comp-global-pill.pill-conversao .pill-val,
[data-theme="light"] .comp-global-pill.pill-conversao .pill-val {
    color: #0369A1 !important;
    font-weight: 800 !important;
}

.comp-global-pill.pill-marketplaces {
    background: rgba(6, 182, 212, 0.15) !important;
    color: #67E8F9 !important;
}
.comp-global-pill.pill-marketplaces strong {
    color: #06B6D4 !important;
}
.light .comp-global-pill.pill-marketplaces,
[data-theme="light"] .comp-global-pill.pill-marketplaces {
    background: #E0F2FE !important;
    color: #0369A1 !important;
}
.light .comp-global-pill.pill-marketplaces strong,
[data-theme="light"] .comp-global-pill.pill-marketplaces strong {
    color: #0284C7 !important;
}


/* Badge de Meta Batida nos cards */
.light span[title*="Meta superada"],
[data-theme="light"] span[title*="Meta superada"] {
    background: #DCFCE7 !important;
    color: #15803D !important;
    font-weight: 800 !important;
    border: none !important;
}

/* Ícone de info circular nos cards */
.light .pj-info-circle-btn,
[data-theme="light"] .pj-info-circle-btn {
    background: #F1F5F9 !important;
    color: #64748B !important;
    border: none !important;
}


/* ==========================================================================
   M3 CANÔNICO P&J: REGRA UNIVERSAL ZERO-BORDA
   Remove todas as bordas (border, border-left, border-right, border-bottom, outline)
   de todo o site (todas as telas, modais, cards e principalmente badges/chips).
   Única exceção permitida e mantida: divisores estruturais horizontais que sejam border-top.
   ========================================================================== */

/* 1. Reset universal de contornos e outlines */
*,
*::before,
*::after {
    outline: none !important;
}

/* 2. Badges, Chips, Pills, Tags e Marcadores em todas as telas e modais */
[class*="badge"],
[class*="tag-"],
[class*="pill"],
[class*="chip"],
.pj-badge-classe,
.pj-badge-classe-A,
.pj-badge-classe-B,
.pj-badge-classe-C,
.pj-badge-classe-D,
.pj-badge-prob,
.pj-badge-prob-Alta,
.pj-badge-prob-Média,
.pj-badge-prob-Baixa,
.pj-badge-prob-Oportunidade,
.pj-badge-perfil,
.pj-badge-nao-planejado,
.pj-badge-planejado,
.pj-tag-inline,
.pj-tag-vendedor,
.pj-trigger-pill,
.pj-strategy-card-badge,
.pj-meta-evolucao-badge,
.pj-role-badge,
.pj-status-badge,
.badge,
.chip,
.tag {
    border: none !important;
    border-left: none !important;
    border-right: none !important;
    border-bottom: none !important;
    box-shadow: none !important;
}

/* 3. Cards de clientes, filas, agenda, comparativo e dashboards */
.pj-fila-client-card,
.pj-fila-client-card:hover,
.pj-fila-client-card:focus,
.pj-fila-client-card:focus-visible,
.pj-fila-client-card.is-agendado-card,
.pj-fila-client-card.is-tratado-card,
.pj-fila-client-card.is-atrasado-card,
.pj-fila-client-card.is-fixado-card,
.pj-fila-client-card.is-ignorado-card,
#drawerFilaAgenda .pj-fila-client-card,
#drawerFilaAgenda .pj-fila-client-card:hover,
#drawerFilaAgenda .pj-fila-client-card:focus,
.pj-agenda-card-fila,
.pj-card,
.pj-kpi-card,
.comp-zone-card,
.comp-subcard-item,
.pj-score-card,
.pj-strategy-card,
.pj-table-card,
.pj-config-card,
.pj-hero-card,
.pj-gestao-kpi-card {
    border: none !important;
    border-left: none !important;
    border-right: none !important;
    border-bottom: none !important;
    outline: none !important;
}

/* 4. Modais, Drawers e Painéis Flutuantes */
.modal-content,
.pj-modal-box,
.pj-agenda-drawer,
#drawerFilaAgenda,
#drawerTratativaAgenda,
#modalSemestral .modal-content,
#modalComparativoSemestral .modal-content,
#modalRaioXRep .modal-content {
    border: none !important;
    border-left: none !important;
    border-right: none !important;
    border-bottom: none !important;
    outline: none !important;
}

/* 5. Botões de ação, abas e filtros */
.pj-btn-circle-action,
.pj-btn-action,
.pj-shortcut-btn,
.pj-filter-pill-btn,
.pj-drawer-tab-btn,
.pj-agenda-subtab-btn,
.pj-subtab-btn {
    border: none !important;
    border-left: none !important;
    border-right: none !important;
    border-bottom: none !important;
    outline: none !important;
}



/* ==========================================================================
   PADRONIZAÇÃO MATERIAL 3 FLAT: TELA DE CONFIGURAÇÕES (#view_configuracoes)
   Eliminação de contornos, blur e unificação de superfícies tonais
   ========================================================================== */

#view_configuracoes,
#view_configuracoes * {
    box-shadow: none !important;
}

#view_configuracoes .pj-hero-card,
#view_configuracoes .pj-glass-medium,
#view_configuracoes .pj-glass-strong,
#view_configuracoes .pj-config-card {
    border: none !important;
    border-radius: var(--pj-radius-card, 16px) !important;
    box-shadow: none !important;
    outline: none !important;
}

/* Tema Escuro (Superfície Tonal) */
#view_configuracoes .pj-hero-card,
#view_configuracoes .pj-glass-medium,
#view_configuracoes .pj-glass-strong,
#view_configuracoes .pj-config-card {
    background-color: var(--pj-bg-card, #0e1620) !important;
}

/* Tema Claro (Superfície Branca Flat & Zero-Border) */
.light #view_configuracoes .pj-hero-card,
[data-theme="light"] #view_configuracoes .pj-hero-card,
.light #view_configuracoes .pj-glass-medium,
[data-theme="light"] #view_configuracoes .pj-glass-medium,
.light #view_configuracoes .pj-glass-strong,
[data-theme="light"] #view_configuracoes .pj-glass-strong,
.light #view_configuracoes .pj-config-card,
[data-theme="light"] #view_configuracoes .pj-config-card {
    background-color: #ffffff !important;
    border: none !important;
    box-shadow: none !important;
}

/* Subcards internos / inputs / containers secundários no tema claro */
.light #view_configuracoes [style*="background: rgba(255, 255, 255,"],
[data-theme="light"] #view_configuracoes [style*="background: rgba(255, 255, 255,"],
.light #view_configuracoes [style*="background: rgba(56, 189, 248, 0.04)"],
[data-theme="light"] #view_configuracoes [style*="background: rgba(56, 189, 248, 0.04)"],
.light #view_configuracoes .pj-admin-toolbar-strip,
[data-theme="light"] #view_configuracoes .pj-admin-toolbar-strip {
    background-color: #f8fafc !important;
    border: none !important;
}

/* Sub-abas de navegação de configurações */
#view_configuracoes .pj-admin-subtabs-nav {
    border: none !important;
    gap: 4px !important;
}

#view_configuracoes .pj-subtab-btn {
    border: none !important;
    border-radius: 9999px !important;
    box-shadow: none !important;
    font-weight: 600 !important;
}

.light #view_configuracoes .pj-subtab-btn,
[data-theme="light"] #view_configuracoes .pj-subtab-btn {
    color: #64748b !important;
    background: transparent !important;
}

.light #view_configuracoes .pj-subtab-btn:hover,
[data-theme="light"] #view_configuracoes .pj-subtab-btn:hover {
    background-color: #f1f5f9 !important;
    color: #0f172a !important;
}

.light #view_configuracoes .pj-subtab-btn.active,
[data-theme="light"] #view_configuracoes .pj-subtab-btn.active {
    background-color: #0284c7 !important;
    color: #ffffff !important;
}

/* Inputs de formulário dentro de configurações */
.light #view_configuracoes .pj-form-input,
[data-theme="light"] #view_configuracoes .pj-form-input,
.light #view_configuracoes .pj-form-select,
[data-theme="light"] #view_configuracoes .pj-form-select {
    background-color: #f8fafc !important;
    border: none !important;
    color: #0f172a !important;
}

/* ==========================================================================
   MONITORAMENTO DO PJ INTELLIGENCE CORE (#admin_subtab_core_monitoring)
   100% Borderless Material 3 Flat & Suporte Dual-Theme Light/Dark
   ========================================================================== */

#admin_subtab_core_monitoring .pj-core-diag-metric-box {
    background: rgba(255, 255, 255, 0.03);
    border-radius: var(--pj-radius-card, 14px);
    padding: 14px 18px;
    border: none !important;
    display: flex;
    flex-direction: column;
    justify-content: center;
    transition: background-color 0.2s ease;
}

.light #admin_subtab_core_monitoring .pj-core-diag-metric-box,
[data-theme="light"] #admin_subtab_core_monitoring .pj-core-diag-metric-box {
    background-color: #f8fafc !important;
    border: none !important;
}

#admin_subtab_core_monitoring .pj-wave-card {
    background: rgba(255, 255, 255, 0.02);
    border-radius: var(--pj-radius-card, 14px);
    padding: 16px 20px;
    border: none !important;
    transition: background-color 0.2s ease;
}

.light #admin_subtab_core_monitoring .pj-wave-card,
[data-theme="light"] #admin_subtab_core_monitoring .pj-wave-card {
    background-color: #f8fafc !important;
    border: none !important;
}

/* Badges de Origem Efetiva (CANONICAL_CORE | LEGADO_LOCAL | LEGADO_FALLBACK) */
.pj-origem-badge {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 4px 10px;
    border-radius: 9999px;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 0.3px;
    border: none !important;
}

.pj-origem-canonical {
    background: rgba(16, 185, 129, 0.16) !important;
    color: #10B981 !important;
}

.pj-origem-legado {
    background: rgba(100, 116, 139, 0.16) !important;
    color: #94A3B8 !important;
}

.pj-origem-fallback {
    background: rgba(245, 158, 11, 0.2) !important;
    color: #F59E0B !important;
}

.light .pj-origem-canonical,
[data-theme="light"] .pj-origem-canonical {
    background-color: #DCFCE7 !important;
    color: #15803D !important;
}

.light .pj-origem-legado,
[data-theme="light"] .pj-origem-legado {
    background-color: #F1F5F9 !important;
    color: #475569 !important;
}

.light .pj-origem-fallback,
[data-theme="light"] .pj-origem-fallback {
    background-color: #FEF3C7 !important;
    color: #B45309 !important;
}


/* ==========================================================================
   BLINDAGEM DE CONTRASTE: LINHA BASE DE KPIS E PROGRESSO NO HOVER
   Evita que a trilha/linha base desapareça no hover em Metas e Calendário
   ========================================================================== */

/* 1. GAUGE / KPI REDONDO (TELA METAS & DASHBOARD) */
.pj-gauge-bg {
    stroke: rgba(255, 255, 255, 0.12) !important;
    transition: stroke 0.2s ease !important;
}

.pj-gauge-card:hover .pj-gauge-bg {
    stroke: rgba(255, 255, 255, 0.22) !important;
}

.light .pj-gauge-bg,
[data-theme="light"] .pj-gauge-bg {
    stroke: #CBD5E1 !important;
}

.light .pj-gauge-card,
[data-theme="light"] .pj-gauge-card,
.light #view_dashboard .pj-gauge-card,
[data-theme="light"] #view_dashboard .pj-gauge-card {
    background-color: #F1F5F9 !important;
    border: none !important;
    border-radius: var(--pj-radius-card, 16px) !important;
    box-shadow: none !important;
    transition: all 0.2s cubic-bezier(0.2, 0, 0, 1) !important;
}

.light .pj-gauge-card:hover,
[data-theme="light"] .pj-gauge-card:hover,
.light #view_dashboard .pj-gauge-card:hover,
[data-theme="light"] #view_dashboard .pj-gauge-card:hover {
    background-color: #E2E8F0 !important;
    border-color: #CBD5E1 !important;
    box-shadow: none !important;
}

.light .pj-gauge-card:hover .pj-gauge-bg,
[data-theme="light"] .pj-gauge-card:hover .pj-gauge-bg {
    stroke: #94A3B8 !important;
}

/* 2. CALENDÁRIO: DIAS & BARRAS DE PACING / PROGRESSO */
.pj-calendar-mini-track {
    background: rgba(255, 255, 255, 0.12) !important;
    transition: background-color 0.2s ease !important;
}

.pj-calendar-day:hover .pj-calendar-mini-track {
    background: rgba(255, 255, 255, 0.24) !important;
}

.light .pj-calendar-mini-track,
[data-theme="light"] .pj-calendar-mini-track {
    background: #CBD5E1 !important;
}

.light .pj-calendar-day:hover,
[data-theme="light"] .pj-calendar-day:hover {
    background-color: #F8FAFC !important;
}

.light .pj-calendar-day:hover .pj-calendar-mini-track,
[data-theme="light"] .pj-calendar-day:hover .pj-calendar-mini-track {
    background: #94A3B8 !important;
}


/* ==========================================================================
   PADRONIZAÇÃO MATERIAL 3 (M3): BOTÕES DE PERÍODO & CHIPS DE COMPETÊNCIA
   Elimina botões brancos no fundo claro e garante contraste estrito WCAG AA/AAA
   ========================================================================== */

/* 1. SELEÇÃO DE PERÍODO / COMPETÊNCIA DO RAIO-X (MODAL & FULLPAGE) */
.btn-raiox-periodo,
#modalRaioXRepresentante .btn-raiox-periodo,
#repFullPageView .btn-raiox-periodo,
.pj-raiox-card-section .btn-raiox-periodo {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    font-size: 11.5px !important;
    font-weight: 600 !important;
    line-height: 1.2 !important;
    padding: 6px 14px !important;
    border-radius: 9999px !important;
    cursor: pointer !important;
    transition: all 0.2s cubic-bezier(0.2, 0, 0, 1) !important;
    box-shadow: none !important;
    outline: none !important;
    border: none !important;
    background: rgba(255, 255, 255, 0.08) !important;
    color: #CBD5E1 !important;
}

.btn-raiox-periodo:hover,
#modalRaioXRepresentante .btn-raiox-periodo:hover,
#repFullPageView .btn-raiox-periodo:hover,
.pj-raiox-card-section .btn-raiox-periodo:hover {
    background: rgba(255, 255, 255, 0.16) !important;
    border-color: rgba(255, 255, 255, 0.28) !important;
    color: #FFFFFF !important;
}

.btn-raiox-periodo.active,
#modalRaioXRepresentante .btn-raiox-periodo.active,
#repFullPageView .btn-raiox-periodo.active,
.pj-raiox-card-section .btn-raiox-periodo.active {
    background: #0284C7 !important;
    border-color: #0284C7 !important;
    color: #FFFFFF !important;
    font-weight: 700 !important;
    box-shadow: none !important;
}

.btn-raiox-periodo.active:hover,
#modalRaioXRepresentante .btn-raiox-periodo.active:hover,
#repFullPageView .btn-raiox-periodo.active:hover,
.pj-raiox-card-section .btn-raiox-periodo.active:hover {
    background: #0369A1 !important;
    border-color: #0369A1 !important;
    color: #FFFFFF !important;
}

/* 2. TEMA CLARO: SUPERFÍCIE TONAL M3 (FUNDO #E2E8F0, BORDA #CBD5E1, TEXTO #1E293B) */
.light .btn-raiox-periodo,
[data-theme="light"] .btn-raiox-periodo,
.light #modalRaioXRepresentante .btn-raiox-periodo,
[data-theme="light"] #modalRaioXRepresentante .btn-raiox-periodo,
.light #repFullPageView .btn-raiox-periodo,
[data-theme="light"] #repFullPageView .btn-raiox-periodo,
.light .pj-raiox-card-section .btn-raiox-periodo,
[data-theme="light"] .pj-raiox-card-section .btn-raiox-periodo {
    background: #E2E8F0 !important;
    background-color: #E2E8F0 !important;
    border: none !important;
    color: #1E293B !important;
    font-weight: 700 !important;
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.04) !important;
}

.light .btn-raiox-periodo:hover,
[data-theme="light"] .btn-raiox-periodo:hover,
.light #modalRaioXRepresentante .btn-raiox-periodo:hover,
[data-theme="light"] #modalRaioXRepresentante .btn-raiox-periodo:hover,
.light #repFullPageView .btn-raiox-periodo:hover,
[data-theme="light"] #repFullPageView .btn-raiox-periodo:hover,
.light .pj-raiox-card-section .btn-raiox-periodo:hover,
[data-theme="light"] .pj-raiox-card-section .btn-raiox-periodo:hover {
    background: #CBD5E1 !important;
    background-color: #CBD5E1 !important;
    border-color: #94A3B8 !important;
    color: #0F172A !important;
}

.light .btn-raiox-periodo.active,
[data-theme="light"] .btn-raiox-periodo.active,
.light #modalRaioXRepresentante .btn-raiox-periodo.active,
[data-theme="light"] #modalRaioXRepresentante .btn-raiox-periodo.active,
.light #repFullPageView .btn-raiox-periodo.active,
[data-theme="light"] #repFullPageView .btn-raiox-periodo.active,
.light .pj-raiox-card-section .btn-raiox-periodo.active,
[data-theme="light"] .pj-raiox-card-section .btn-raiox-periodo.active {
    background: #0284C7 !important;
    background-color: #0284C7 !important;
    border-color: #0284C7 !important;
    color: #FFFFFF !important;
    font-weight: 700 !important;
    box-shadow: 0 2px 4px rgba(2, 132, 199, 0.3) !important;
}

.light .btn-raiox-periodo.active:hover,
[data-theme="light"] .btn-raiox-periodo.active:hover,
.light #modalRaioXRepresentante .btn-raiox-periodo.active:hover,
[data-theme="light"] #modalRaioXRepresentante .btn-raiox-periodo.active:hover,
.light #repFullPageView .btn-raiox-periodo.active:hover,
[data-theme="light"] #repFullPageView .btn-raiox-periodo.active:hover,
.light .pj-raiox-card-section .btn-raiox-periodo.active:hover,
[data-theme="light"] .pj-raiox-card-section .btn-raiox-periodo.active:hover {
    background: #0369A1 !important;
    background-color: #0369A1 !important;
    border-color: #0369A1 !important;
    color: #FFFFFF !important;
}

/* 3. ABAS DE FILTRO DE STATUS DO CLIENTE (MODAL RAIO-X CARD) */
.pj-btn-tab,
#modalRaioXCard .pj-btn-tab {
    display: inline-flex !important;
    align-items: center !important;
    gap: 6px !important;
    padding: 6px 14px !important;
    font-size: 12px !important;
    font-weight: 600 !important;
    border-radius: 9999px !important;
    border: none !important;
    background: rgba(255, 255, 255, 0.06) !important;
    color: #CBD5E1 !important;
    cursor: pointer !important;
    transition: all 0.2s cubic-bezier(0.2, 0, 0, 1) !important;
}

.pj-btn-tab:hover,
#modalRaioXCard .pj-btn-tab:hover {
    background: rgba(255, 255, 255, 0.12) !important;
    border-color: rgba(255, 255, 255, 0.25) !important;
    color: #FFFFFF !important;
}

.pj-btn-tab.active,
#modalRaioXCard .pj-btn-tab.active {
    background: #0284C7 !important;
    border-color: #0284C7 !important;
    color: #FFFFFF !important;
    font-weight: 700 !important;
    box-shadow: none !important;
}

.light .pj-btn-tab,
[data-theme="light"] .pj-btn-tab,
.light #modalRaioXCard .pj-btn-tab,
[data-theme="light"] #modalRaioXCard .pj-btn-tab {
    background: #E2E8F0 !important;
    background-color: #E2E8F0 !important;
    border: none !important;
    color: #1E293B !important;
    font-weight: 700 !important;
}

.light .pj-btn-tab:hover,
[data-theme="light"] .pj-btn-tab:hover,
.light #modalRaioXCard .pj-btn-tab:hover,
[data-theme="light"] #modalRaioXCard .pj-btn-tab:hover {
    background: #CBD5E1 !important;
    background-color: #CBD5E1 !important;
    border-color: #94A3B8 !important;
    color: #0F172A !important;
}

.light .pj-btn-tab.active,
[data-theme="light"] .pj-btn-tab.active,
.light #modalRaioXCard .pj-btn-tab.active,
[data-theme="light"] #modalRaioXCard .pj-btn-tab.active {
    background: #0284C7 !important;
    background-color: #0284C7 !important;
    border-color: #0284C7 !important;
    color: #FFFFFF !important;
    font-weight: 700 !important;
}


/* ==========================================================================
   PADRONIZAÇÃO MATERIAL 3 (M3): CARDS INTERNOS TONAL NO TEMA CLARO
   Elimina cards brancos no fundo branco em Metas, Estratégia e Qualidade
   ========================================================================== */

/* 1. Inset faturado discreto dentro do Gauge 1 */
.light .pj-faturado-discreto-box,
[data-theme="light"] .pj-faturado-discreto-box,
.light #view_dashboard .pj-faturado-discreto-box,
[data-theme="light"] #view_dashboard .pj-faturado-discreto-box {
    background: #FFFFFF !important;
    border: none !important;
    border-radius: 8px !important;
}

/* 2. Cards de Estratégia de Fechamento (M3 Tonal Inset) */
.light .pj-strategy-card,
[data-theme="light"] .pj-strategy-card,
.light #view_dashboard .pj-strategy-card,
[data-theme="light"] #view_dashboard .pj-strategy-card,
.light .pj-desempenho-unified-container .pj-strategy-card,
[data-theme="light"] .pj-desempenho-unified-container .pj-strategy-card {
    background-color: #F1F5F9 !important;
    border: none !important;
    border-radius: var(--pj-radius-card, 16px) !important;
    box-shadow: none !important;
    transition: all 0.2s cubic-bezier(0.2, 0, 0, 1) !important;
}

.light .pj-strategy-card:hover,
[data-theme="light"] .pj-strategy-card:hover,
.light #view_dashboard .pj-strategy-card:hover,
[data-theme="light"] #view_dashboard .pj-strategy-card:hover,
.light .pj-desempenho-unified-container .pj-strategy-card:hover,
[data-theme="light"] .pj-desempenho-unified-container .pj-strategy-card:hover {
    background-color: #E2E8F0 !important;
    border: none !important;
    box-shadow: none !important;
}

/* 3. Blocos de Qualidade dos Pedidos (M3 Tonal Inset) */
.light .pj-perf-item,
[data-theme="light"] .pj-perf-item,
.light #view_dashboard .pj-perf-item,
[data-theme="light"] #view_dashboard .pj-perf-item {
    background-color: #F1F5F9 !important;
    border: none !important;
    border-radius: 12px !important;
    box-shadow: none !important;
    transition: all 0.2s cubic-bezier(0.2, 0, 0, 1) !important;
}

.light .pj-perf-item:hover,
[data-theme="light"] .pj-perf-item:hover,
.light #view_dashboard .pj-perf-item:hover,
[data-theme="light"] #view_dashboard .pj-perf-item:hover {
    background-color: #E2E8F0 !important;
    border-color: #CBD5E1 !important;
    box-shadow: none !important;
}

/* ==========================================================================
   MINI-CARDS DE ATENDIMENTO: ESTADO DEFAULT SEM COR (MONOCROMÁTICO / CLEAN)
   Ao passar o mouse no card principal (.pj-strategy-card), os 3 ficam coloridos.
   Ao passar o mouse no próprio mini-card, alterna para porcentagem (%).
   ZERO BORDAS EM TODOS OS ELEMENTOS.
   ========================================================================== */

:root, [data-theme="dark"], .dark {
    --stat-neutral-bg: rgba(255, 255, 255, 0.04);
    --stat-neutral-text: #f8fafc;
    --stat-neutral-label: #94a3b8;

    --stat-comp-bg: rgba(16, 185, 129, 0.14);
    --stat-comp-text: #10b981;

    --stat-naocomp-bg: rgba(239, 68, 68, 0.14);
    --stat-naocomp-text: #ef4444;

    --stat-contatar-bg: rgba(148, 163, 184, 0.12);
    --stat-contatar-text: #f8fafc;
    --stat-contatar-label: #94a3b8;
}

[data-theme="light"], .light {
    --stat-neutral-bg: #FFFFFF;
    --stat-neutral-text: #0f172a;
    --stat-neutral-label: #64748b;

    --stat-comp-bg: #dcfce7;
    --stat-comp-text: #15803d;

    --stat-naocomp-bg: #fee2e2;
    --stat-naocomp-text: #b91c1c;

    --stat-contatar-bg: #e0f2fe;
    --stat-contatar-text: #0369a1;
    --stat-contatar-label: #0284c7;
}

/* Default: Monocromático, sem cor, clean e sem bordas */
.pj-hover-stat-box {
    cursor: pointer;
    border-radius: 8px;
    padding: 8px 4px;
    text-align: center;
    user-select: none;
    border: none !important;
    background: var(--stat-neutral-bg) !important;
    transition: background-color 0.25s ease, transform 0.15s ease, box-shadow 0.15s ease;
}

.light .pj-hover-stat-box,
[data-theme="light"] .pj-hover-stat-box {
    background: #FFFFFF !important;
    background-color: #FFFFFF !important;
    border: none !important;
    box-shadow: none !important;
}

/* Container com Centralização Perfeita dos Números Absoluto e % */
.pj-stat-num-wrap {
    position: relative !important;
    width: 100% !important;
    height: 24px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    text-align: center !important;
}

.pj-hover-stat-box .pj-stat-abs,
.pj-hover-stat-box .pj-stat-pct {
    position: absolute !important;
    inset: 0 !important;
    width: 100% !important;
    height: 100% !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    text-align: center !important;
    margin: 0 auto !important;
    color: var(--stat-neutral-text) !important;
    font-size: 18px !important;
    font-weight: 800 !important;
    font-family: var(--pj-font-numbers, 'DM Sans', sans-serif) !important;
    line-height: 1 !important;
    transition: transform 0.2s cubic-bezier(0.2, 0, 0, 1), opacity 0.2s ease, color 0.25s ease !important;
}

.pj-hover-stat-box .pj-stat-abs {
    opacity: 1 !important;
    transform: translateY(0) !important;
}

.pj-hover-stat-box .pj-stat-pct {
    opacity: 0 !important;
    transform: translateY(12px) !important;
}

.pj-hover-stat-box .pj-stat-label {
    width: 100% !important;
    text-align: center !important;
    color: var(--stat-neutral-label) !important;
    transition: color 0.25s ease !important;
}

/* Ao passar o mouse NO PRÓPRIO MINI-CARD: alterna para porcentagem (%) no centro exato */
.pj-hover-stat-box:hover {
    transform: scale(1.03) !important;
}
.pj-hover-stat-box:hover .pj-stat-abs {
    opacity: 0 !important;
    transform: translateY(-12px) !important;
}
.pj-hover-stat-box:hover .pj-stat-pct {
    opacity: 1 !important;
    transform: translateY(0) !important;
}

.pj-strategy-card:hover .pj-stat-box-comp {
    background: var(--stat-comp-bg) !important;
}
.pj-strategy-card:hover .pj-stat-box-comp .pj-stat-abs,
.pj-strategy-card:hover .pj-stat-box-comp .pj-stat-pct,
.pj-strategy-card:hover .pj-stat-box-comp .pj-stat-label {
    color: var(--stat-comp-text) !important;
}

.pj-strategy-card:hover .pj-stat-box-naocomp {
    background: var(--stat-naocomp-bg) !important;
}
.pj-strategy-card:hover .pj-stat-box-naocomp .pj-stat-abs,
.pj-strategy-card:hover .pj-stat-box-naocomp .pj-stat-pct,
.pj-strategy-card:hover .pj-stat-box-naocomp .pj-stat-label {
    color: var(--stat-naocomp-text) !important;
}

.pj-strategy-card:hover .pj-stat-box-contatar {
    background: var(--stat-contatar-bg) !important;
}
.pj-strategy-card:hover .pj-stat-box-contatar .pj-stat-abs,
.pj-strategy-card:hover .pj-stat-box-contatar .pj-stat-pct {
    color: var(--stat-contatar-text) !important;
}
.pj-strategy-card:hover .pj-stat-box-contatar .pj-stat-label {
    color: var(--stat-contatar-label) !important;
}

/* Ao passar o mouse NO PRÓPRIO MINI-CARD: alterna para porcentagem (%) e sutil elevação */

/* ==========================================================================
   PRIORIDADE MÁXIMA DE HOVER NO MINI-CARD: TRANSIÇÃO PARA %
   ========================================================================== */
.pj-strategy-card .pj-hover-stat-box:hover,
.pj-hover-stat-box:hover {
    transform: scale(1.03) !important;
}

.pj-strategy-card .pj-hover-stat-box:hover .pj-stat-abs,
.pj-hover-stat-box:hover .pj-stat-abs {
    opacity: 0 !important;
    visibility: hidden !important;
    transform: translateY(-12px) !important;
}

.pj-strategy-card .pj-hover-stat-box:hover .pj-stat-pct,
.pj-hover-stat-box:hover .pj-stat-pct {
    opacity: 1 !important;
    visibility: visible !important;
    transform: translateY(0) !important;
}