
/* =========================================================
   DANFER DARK FINAL V4
   O.C. + PRESUPUESTO + CHAT + AUDITORIA + SEARCH + RESUMEN
   ========================================================= */

html[data-theme="dark"] {
  --df-page: #091322;
  --df-panel: #101b2d;
  --df-panel-2: #142238;
  --df-panel-3: #172840;

  --df-border: #293a50;
  --df-border-2: #33465d;

  --df-text: #f8fafc;
  --df-text-2: #dce5ee;
  --df-muted: #8fa2b8;

  --df-blue: #2563eb;
  --df-table-head: #164b6d;
}


/* =========================================================
   1. BUSCADOR SUPERIOR
   ========================================================= */

html[data-theme="dark"] .global-search {
  background: var(--df-panel) !important;

  border:
    1px solid var(--df-border-2) !important;

  border-radius: 10px !important;

  box-shadow:
    0 3px 12px rgba(0,0,0,.15) !important;

  overflow: hidden !important;
}


html[data-theme="dark"] .global-search > span {
  background: var(--df-panel) !important;
  color: var(--df-muted) !important;
}


html[data-theme="dark"] .global-search input,
html[data-theme="dark"] #globalSearch,
html[data-theme="dark"] .topbar #globalSearch {
  background: var(--df-panel) !important;

  border: 0 !important;

  color: var(--df-text) !important;

  box-shadow: none !important;
}


html[data-theme="dark"] #globalSearch::placeholder {
  color: #71849a !important;
}


html[data-theme="dark"] #globalSearch:focus {
  background: #132039 !important;

  box-shadow:
    inset 0 0 0 1px #3b82f6 !important;
}


html[data-theme="dark"] #globalSearch:disabled {
  opacity: .58;
}


/* =========================================================
   2. COMPRAS / O.C.
   Se detecta por #newPurchaseButton
   ========================================================= */

html[data-theme="dark"]
.content:has(#newPurchaseButton)
#moduleContent
.metric-card,

html[data-theme="dark"]
.content:has(#newPurchaseButton)
#moduleContent
.panel,

html[data-theme="dark"]
.content:has(#newPurchaseButton)
#moduleContent
.table-wrap {
  background: var(--df-panel) !important;

  border-color: var(--df-border) !important;

  color: var(--df-text-2) !important;

  box-shadow:
    0 7px 22px rgba(0,0,0,.13) !important;
}


html[data-theme="dark"]
.content:has(#newPurchaseButton)
#moduleContent
.metric-card > div,

html[data-theme="dark"]
.content:has(#newPurchaseButton)
#moduleContent
.metric-card > span,

html[data-theme="dark"]
.content:has(#newPurchaseButton)
#moduleContent
.metric-card > p {
  color: var(--df-muted) !important;
}


html[data-theme="dark"]
.content:has(#newPurchaseButton)
#moduleContent
.metric-card > strong {
  color: var(--df-text) !important;
}


html[data-theme="dark"]
.content:has(#newPurchaseButton)
#moduleContent table {
  background: var(--df-panel) !important;
  color: var(--df-text-2) !important;
}


html[data-theme="dark"]
.content:has(#newPurchaseButton)
#moduleContent table thead,

html[data-theme="dark"]
.content:has(#newPurchaseButton)
#moduleContent table th {
  background: var(--df-table-head) !important;
  color: #fff !important;

  border-color:
    #315d79 !important;
}


html[data-theme="dark"]
.content:has(#newPurchaseButton)
#moduleContent table td {
  background: var(--df-panel) !important;
  color: var(--df-text-2) !important;

  border-color:
    #25364a !important;
}


html[data-theme="dark"]
.content:has(#newPurchaseButton)
#moduleContent table tbody tr:nth-child(even) td {
  background: #0e192a !important;
}


html[data-theme="dark"]
.content:has(#newPurchaseButton)
#moduleContent table tbody tr:hover td {
  background: var(--df-panel-3) !important;
}


html[data-theme="dark"]
.content:has(#newPurchaseButton)
#moduleContent td strong,

html[data-theme="dark"]
.content:has(#newPurchaseButton)
#moduleContent .purchase-folio {
  color: var(--df-text) !important;
}


html[data-theme="dark"]
.content:has(#newPurchaseButton)
#moduleContent td small {
  color: var(--df-muted) !important;
}


/* O.C. detalle */

html[data-theme="dark"] .purchase-workflow-panel,

html[data-theme="dark"] #purchaseDetailModal,

html[data-theme="dark"] #purchaseDetailModal > form,

html[data-theme="dark"] #purchaseDetailModal .modal-card {
  background: var(--df-panel) !important;
  color: var(--df-text-2) !important;

  border-color:
    var(--df-border) !important;
}


/* =========================================================
   3. CONTROL PRESUPUESTAL
   ========================================================= */

html[data-theme="dark"]
#moduleContent:has(.budget-v2-header) {
  color: var(--df-text-2) !important;
}


html[data-theme="dark"]
#moduleContent:has(.budget-v2-header)
.budget-v2-header,

html[data-theme="dark"]
#moduleContent:has(.budget-v2-header)
.budget-v2-ledger,

html[data-theme="dark"]
#moduleContent:has(.budget-v2-header)
section,

html[data-theme="dark"]
#moduleContent:has(.budget-v2-header)
article {
  background: var(--df-panel) !important;

  border-color:
    var(--df-border) !important;

  color: var(--df-text-2) !important;
}


/* Encabezado financiero */

html[data-theme="dark"]
#moduleContent:has(.budget-v2-header)
.budget-v2-header h3,

html[data-theme="dark"]
#moduleContent:has(.budget-v2-header)
.budget-v2-header strong,

html[data-theme="dark"]
#moduleContent:has(.budget-v2-header)
h3,

html[data-theme="dark"]
#moduleContent:has(.budget-v2-header)
h4 {
  color: var(--df-text) !important;
}


html[data-theme="dark"]
#moduleContent:has(.budget-v2-header)
.budget-v2-header p,

html[data-theme="dark"]
#moduleContent:has(.budget-v2-header)
dt,

html[data-theme="dark"]
#moduleContent:has(.budget-v2-header)
small {
  color: var(--df-muted) !important;
}


/* KPI presupuesto */

html[data-theme="dark"]
#moduleContent:has(.budget-v2-header)
.metric-card {
  background: var(--df-panel-2) !important;

  border:
    1px solid var(--df-border) !important;
}


html[data-theme="dark"]
#moduleContent:has(.budget-v2-header)
.metric-card strong,

html[data-theme="dark"]
#moduleContent:has(.budget-v2-header)
.metric-card dd {
  color: var(--df-text) !important;
}


html[data-theme="dark"]
#moduleContent:has(.budget-v2-header)
.metric-card span,

html[data-theme="dark"]
#moduleContent:has(.budget-v2-header)
.metric-card p {
  color: var(--df-muted) !important;
}


/* Gasto por categoria / como funciona */

html[data-theme="dark"]
#moduleContent:has(.budget-v2-header)
[class*="budget-v2-"] {
  border-color:
    var(--df-border) !important;
}


html[data-theme="dark"]
#moduleContent:has(.budget-v2-header)
[class*="budget-v2-"] p {
  color: var(--df-muted) !important;
}


/* Tabla presupuesto */

html[data-theme="dark"]
#moduleContent:has(.budget-v2-header)
table {
  background: var(--df-panel) !important;
}


html[data-theme="dark"]
#moduleContent:has(.budget-v2-header)
table th {
  background: var(--df-table-head) !important;
  color: #fff !important;

  border-color:
    #315d79 !important;
}


html[data-theme="dark"]
#moduleContent:has(.budget-v2-header)
table td {
  background: var(--df-panel) !important;
  color: var(--df-text-2) !important;

  border-color:
    #25364a !important;
}


html[data-theme="dark"]
#moduleContent:has(.budget-v2-header)
table tbody tr:nth-child(even) td {
  background: #0e192a !important;
}


html[data-theme="dark"]
#moduleContent:has(.budget-v2-header)
table tbody tr:hover td {
  background: var(--df-panel-3) !important;
}


/* =========================================================
   4. CHAT
   ========================================================= */

html[data-theme="dark"]
#moduleContent:has(.chat-shell)
.chat-shell {
  background: var(--df-panel) !important;

  border:
    1px solid var(--df-border) !important;
}


html[data-theme="dark"]
#moduleContent:has(.chat-shell)
.chat-sidebar {
  background: #0d1829 !important;

  border-color:
    var(--df-border) !important;
}


html[data-theme="dark"]
#moduleContent:has(.chat-shell)
.chat-sidebar-section {
  background: #0d1829 !important;
}


html[data-theme="dark"]
#moduleContent:has(.chat-shell)
.chat-section-title,

html[data-theme="dark"]
#moduleContent:has(.chat-shell)
.chat-section-title span {
  color: var(--df-muted) !important;
}


html[data-theme="dark"]
#moduleContent:has(.chat-shell)
.chat-thread,

html[data-theme="dark"]
#moduleContent:has(.chat-shell)
.chat-person {
  background: var(--df-panel-2) !important;

  border:
    1px solid #243750 !important;

  color: var(--df-text-2) !important;
}


html[data-theme="dark"]
#moduleContent:has(.chat-shell)
.chat-thread:hover,

html[data-theme="dark"]
#moduleContent:has(.chat-shell)
.chat-person:hover {
  background: var(--df-panel-3) !important;
}


html[data-theme="dark"]
#moduleContent:has(.chat-shell)
.chat-thread.is-active {
  background: #173153 !important;

  border-color:
    #2563eb !important;

  box-shadow:
    inset 3px 0 0 #3b82f6 !important;
}


html[data-theme="dark"]
#moduleContent:has(.chat-shell)
.chat-thread strong,

html[data-theme="dark"]
#moduleContent:has(.chat-shell)
.chat-person strong {
  color: var(--df-text) !important;
}


html[data-theme="dark"]
#moduleContent:has(.chat-shell)
.chat-thread small,

html[data-theme="dark"]
#moduleContent:has(.chat-shell)
.chat-person small {
  color: var(--df-muted) !important;
}


/* Conversacion */

html[data-theme="dark"]
#moduleContent:has(.chat-shell)
.chat-conversation {
  background: #0b1526 !important;

  border-color:
    var(--df-border) !important;
}


html[data-theme="dark"]
#moduleContent:has(.chat-shell)
.chat-conversation-header {
  background: var(--df-panel) !important;

  border-bottom:
    1px solid var(--df-border) !important;
}


html[data-theme="dark"]
#moduleContent:has(.chat-shell)
.chat-conversation-header strong {
  color: var(--df-text) !important;
}


html[data-theme="dark"]
#moduleContent:has(.chat-shell)
.chat-conversation-header small {
  color: var(--df-muted) !important;
}


html[data-theme="dark"]
#moduleContent:has(.chat-shell)
.chat-messages {
  background: #0b1526 !important;
}


html[data-theme="dark"]
#moduleContent:has(.chat-shell)
.chat-empty strong {
  color: var(--df-text) !important;
}


html[data-theme="dark"]
#moduleContent:has(.chat-shell)
.chat-empty,
html[data-theme="dark"]
#moduleContent:has(.chat-shell)
.chat-empty p {
  color: var(--df-muted) !important;
}


/* Mensajes */

html[data-theme="dark"]
#moduleContent:has(.chat-shell)
.chat-bubble {
  background: #18283f !important;

  color: var(--df-text-2) !important;

  border-color:
    #2b3d55 !important;
}


html[data-theme="dark"]
#moduleContent:has(.chat-shell)
.chat-message--mine
.chat-bubble {
  background: #1d4ed8 !important;
  color: #fff !important;
}


/* Composer */

html[data-theme="dark"]
#moduleContent:has(.chat-shell)
.chat-composer {
  background: var(--df-panel) !important;

  border-top:
    1px solid var(--df-border) !important;
}


html[data-theme="dark"]
#moduleContent:has(.chat-shell)
.chat-composer textarea {
  background: #111c30 !important;

  border:
    1px solid var(--df-border-2) !important;

  color: var(--df-text) !important;
}


html[data-theme="dark"]
#moduleContent:has(.chat-shell)
.chat-composer textarea::placeholder {
  color: #71849a !important;
}


/* =========================================================
   5. AUDITORIA / CENTRO DE ACTIVIDAD
   ========================================================= */

html[data-theme="dark"]
#moduleContent:has(.activity-live-panel)
.activity-live-panel {
  background: var(--df-panel) !important;

  border-color:
    var(--df-border) !important;
}


/* Cualquier zona de filtros de auditoria */

html[data-theme="dark"]
#moduleContent:has(.activity-live-panel)
[class*="activity-"][class*="filter"],

html[data-theme="dark"]
#moduleContent:has(.activity-live-panel)
[class*="activity-"][class*="toolbar"] {
  background: var(--df-panel) !important;

  border-color:
    var(--df-border) !important;
}


html[data-theme="dark"]
#moduleContent:has(.activity-live-panel)
input,

html[data-theme="dark"]
#moduleContent:has(.activity-live-panel)
select {
  background: #111c30 !important;

  border:
    1px solid var(--df-border-2) !important;

  color: var(--df-text) !important;
}


html[data-theme="dark"]
#moduleContent:has(.activity-live-panel)
input::placeholder {
  color: #71849a !important;
}


html[data-theme="dark"]
#moduleContent:has(.activity-live-panel)
select option {
  background: #111c30 !important;
  color: var(--df-text) !important;
}


/* Métricas */

html[data-theme="dark"]
#moduleContent:has(.activity-live-panel)
.module-strip,

html[data-theme="dark"]
#moduleContent:has(.activity-live-panel)
.module-strip > div {
  background: var(--df-panel) !important;

  border-color:
    var(--df-border) !important;
}


html[data-theme="dark"]
#moduleContent:has(.activity-live-panel)
.module-strip span {
  color: var(--df-muted) !important;
}


html[data-theme="dark"]
#moduleContent:has(.activity-live-panel)
.module-strip strong {
  color: var(--df-text) !important;
}


/* Feed */

html[data-theme="dark"]
#moduleContent:has(.activity-live-panel)
.activity-live-feed {
  background: #0b1526 !important;

  border-color:
    var(--df-border) !important;
}


html[data-theme="dark"]
#moduleContent:has(.activity-live-panel)
.activity-live-item {
  background: var(--df-panel) !important;

  border-color:
    var(--df-border) !important;

  color: var(--df-text-2) !important;
}


html[data-theme="dark"]
#moduleContent:has(.activity-live-panel)
.activity-live-item:nth-child(even) {
  background: #0e192a !important;
}


html[data-theme="dark"]
#moduleContent:has(.activity-live-panel)
.activity-live-item:hover {
  background: var(--df-panel-3) !important;
}


html[data-theme="dark"]
#moduleContent:has(.activity-live-panel)
.activity-live-main strong {
  color: var(--df-text) !important;
}


html[data-theme="dark"]
#moduleContent:has(.activity-live-panel)
.activity-live-main span,

html[data-theme="dark"]
#moduleContent:has(.activity-live-panel)
.activity-live-meta {
  color: var(--df-muted) !important;
}


html[data-theme="dark"]
#moduleContent:has(.activity-live-panel)
.activity-live-detail {
  color: #becbd9 !important;
}


/* =========================================================
   6. RESUMEN
   ========================================================= */

html[data-theme="dark"]
.content:has(#refreshDashboard)
#moduleContent {
  color: var(--df-text-2) !important;
}


/* KPIs generales */

html[data-theme="dark"]
.content:has(#refreshDashboard)
#moduleContent
.metric-card {
  background: var(--df-panel) !important;

  border:
    1px solid var(--df-border) !important;

  color: var(--df-text-2) !important;
}


html[data-theme="dark"]
.content:has(#refreshDashboard)
#moduleContent
.metric-card > div,

html[data-theme="dark"]
.content:has(#refreshDashboard)
#moduleContent
.metric-card > p {
  color: var(--df-muted) !important;
}


html[data-theme="dark"]
.content:has(#refreshDashboard)
#moduleContent
.metric-card > strong {
  color: var(--df-text) !important;
}


/* Dashboard ejecutivo */

html[data-theme="dark"]
.content:has(#refreshDashboard)
.weekly-executive-panel,

html[data-theme="dark"]
.content:has(#refreshDashboard)
.weekly-cost-panel,

html[data-theme="dark"]
.content:has(#refreshDashboard)
.weekly-analytics-panel,

html[data-theme="dark"]
.content:has(#refreshDashboard)
.weekly-service-panel {
  background: var(--df-panel) !important;

  border-color:
    var(--df-border) !important;

  color: var(--df-text-2) !important;
}


/* KPI semanales */

html[data-theme="dark"]
.content:has(#refreshDashboard)
.weekly-kpi-card {
  background: var(--df-panel-2) !important;

  border:
    1px solid var(--df-border) !important;
}


html[data-theme="dark"]
.content:has(#refreshDashboard)
.weekly-kpi-card > div {
  color: var(--df-muted) !important;
}


html[data-theme="dark"]
.content:has(#refreshDashboard)
.weekly-kpi-card > strong {
  color: var(--df-text) !important;
}


html[data-theme="dark"]
.content:has(#refreshDashboard)
.weekly-kpi-card > p {
  color: var(--df-muted) !important;
}


/* Analisis operativo */

html[data-theme="dark"]
.content:has(#refreshDashboard)
.weekly-analytics-header,

html[data-theme="dark"]
.content:has(#refreshDashboard)
.weekly-cost-header,

html[data-theme="dark"]
.content:has(#refreshDashboard)
.weekly-service-header {
  background: var(--df-panel) !important;

  border-color:
    var(--df-border) !important;
}


html[data-theme="dark"]
.content:has(#refreshDashboard)
.weekly-analytics-header h4,

html[data-theme="dark"]
.content:has(#refreshDashboard)
.weekly-cost-header h4,

html[data-theme="dark"]
.content:has(#refreshDashboard)
.weekly-service-header h4 {
  color: var(--df-text) !important;
}


html[data-theme="dark"]
.content:has(#refreshDashboard)
.weekly-analytics-header p,

html[data-theme="dark"]
.content:has(#refreshDashboard)
.weekly-cost-header p,

html[data-theme="dark"]
.content:has(#refreshDashboard)
.weekly-service-header p {
  color: var(--df-muted) !important;
}


html[data-theme="dark"]
.content:has(#refreshDashboard)
.weekly-analytics-tabs {
  background: #0d1829 !important;

  border-color:
    var(--df-border) !important;
}


html[data-theme="dark"]
.content:has(#refreshDashboard)
.weekly-analytics-tabs button {
  background: transparent !important;
  color: var(--df-muted) !important;
}


html[data-theme="dark"]
.content:has(#refreshDashboard)
.weekly-analytics-tabs button.is-active {
  background: #1d4ed8 !important;
  color: #fff !important;
}


html[data-theme="dark"]
.content:has(#refreshDashboard)
.weekly-analytics-view,

html[data-theme="dark"]
.content:has(#refreshDashboard)
.weekly-v4-chart,

html[data-theme="dark"]
.content:has(#refreshDashboard)
.weekly-cost-chart {
  background: #0e192a !important;

  border-color:
    var(--df-border) !important;

  color: var(--df-text-2) !important;
}


/* Servicios por kilometraje */

html[data-theme="dark"]
.content:has(#refreshDashboard)
.weekly-service-table,

html[data-theme="dark"]
.content:has(#refreshDashboard)
.weekly-service-table tbody {
  background: var(--df-panel) !important;
}


html[data-theme="dark"]
.content:has(#refreshDashboard)
.weekly-service-table th {
  background: var(--df-table-head) !important;
  color: #fff !important;

  border-color:
    #315d79 !important;
}


html[data-theme="dark"]
.content:has(#refreshDashboard)
.weekly-service-table td {
  background: var(--df-panel) !important;

  color: var(--df-text-2) !important;

  border-color:
    #25364a !important;
}


html[data-theme="dark"]
.content:has(#refreshDashboard)
.weekly-service-table
tbody tr:nth-child(even) td {
  background: #0e192a !important;
}


html[data-theme="dark"]
.content:has(#refreshDashboard)
.weekly-service-table
tbody tr:hover td {
  background: var(--df-panel-3) !important;
}


/* Paneles inferiores del resumen */

html[data-theme="dark"]
.content:has(#refreshDashboard)
#moduleContent
.dashboard-grid
.panel,

html[data-theme="dark"]
.content:has(#refreshDashboard)
#moduleContent
.panel {
  background: var(--df-panel) !important;

  border-color:
    var(--df-border) !important;
}


html[data-theme="dark"]
.content:has(#refreshDashboard)
#moduleContent
.panel-header {
  background: var(--df-panel) !important;

  border-color:
    var(--df-border) !important;
}


html[data-theme="dark"]
.content:has(#refreshDashboard)
#moduleContent
.panel-header h3,

html[data-theme="dark"]
.content:has(#refreshDashboard)
#moduleContent
.panel-header strong {
  color: var(--df-text) !important;
}


/* Últimos mantenimientos y cualquier tabla del resumen */

html[data-theme="dark"]
.content:has(#refreshDashboard)
#moduleContent
table {
  background: var(--df-panel) !important;
}


html[data-theme="dark"]
.content:has(#refreshDashboard)
#moduleContent
table th {
  background: var(--df-table-head) !important;
  color: #fff !important;

  border-color:
    #315d79 !important;
}


html[data-theme="dark"]
.content:has(#refreshDashboard)
#moduleContent
table td {
  background: var(--df-panel) !important;
  color: var(--df-text-2) !important;

  border-color:
    #25364a !important;
}


html[data-theme="dark"]
.content:has(#refreshDashboard)
#moduleContent
table tbody tr:nth-child(even) td {
  background: #0e192a !important;
}


/* Prioridades */

html[data-theme="dark"]
.content:has(#refreshDashboard)
.priority-list,

html[data-theme="dark"]
.content:has(#refreshDashboard)
.priority-list li {
  background: var(--df-panel) !important;

  color: var(--df-text-2) !important;

  border-color:
    var(--df-border) !important;
}


html[data-theme="dark"]
.content:has(#refreshDashboard)
.priority-list li strong {
  color: var(--df-text) !important;
}


/* Presupuesto del resumen */

html[data-theme="dark"]
.content:has(#refreshDashboard)
.budget-card {
  background: var(--df-panel) !important;
}


html[data-theme="dark"]
.content:has(#refreshDashboard)
.budget-card dt {
  color: var(--df-muted) !important;
}


html[data-theme="dark"]
.content:has(#refreshDashboard)
.budget-card dd {
  color: var(--df-text) !important;
}


html[data-theme="dark"]
.content:has(#refreshDashboard)
.budget-ring > div {
  background: var(--df-panel) !important;

  color: var(--df-text) !important;
}


/* =========================================================
   TEXTO QUE QUEDE ATRAPADO EN BLANCO
   ========================================================= */

html[data-theme="dark"]
.content:has(#newPurchaseButton)
#moduleContent h3,

html[data-theme="dark"]
#moduleContent:has(.budget-v2-header) h3,

html[data-theme="dark"]
#moduleContent:has(.chat-shell) h3,

html[data-theme="dark"]
#moduleContent:has(.activity-live-panel) h3,

html[data-theme="dark"]
.content:has(#refreshDashboard)
#moduleContent h3 {
  color: var(--df-text) !important;
}

