
/* =========================================================
   TRANSPORTES DANFER
   DARK MASTER FINAL V1
   ========================================================= */

html[data-theme="dark"] {
  color-scheme: dark;

  --df-bg: #071326;
  --df-panel: #0D2040;
  --df-panel-2: #132A50;
  --df-panel-3: #19345F;

  --df-border: #293a50;
  --df-border-2: #354960;

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

  --df-blue: #08285E;
  --df-head: #08285E;
}


/* =========================================================
   BASE
   ========================================================= */

html[data-theme="dark"],
html[data-theme="dark"] body,
html[data-theme="dark"] .main-content,
html[data-theme="dark"] .content,
html[data-theme="dark"] #moduleContent {
  background: var(--df-bg) !important;
  color: var(--df-text-2) !important;
}


html[data-theme="dark"] h1,
html[data-theme="dark"] h2,
html[data-theme="dark"] h3,
html[data-theme="dark"] h4,
html[data-theme="dark"] h5 {
  color: var(--df-text) !important;
}


html[data-theme="dark"] .eyebrow {
  color: #3b82f6 !important;
}


/* =========================================================
   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 4px 14px rgba(0,0,0,.16) !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: #111c30 !important;

  border: 0 !important;

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

  box-shadow: none !important;
}


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


/* =========================================================
   GENERALES
   ========================================================= */

html[data-theme="dark"] #moduleContent .panel,
html[data-theme="dark"] #moduleContent .metric-card,
html[data-theme="dark"] #moduleContent .module-panel,
html[data-theme="dark"] #moduleContent .table-wrap {
  background: var(--df-panel) !important;

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

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


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


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

  color: #fff !important;

  border-color:
    #315d79 !important;
}


html[data-theme="dark"] #moduleContent table td {
  background: var(--df-panel) !important;

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

  border-color:
    #25364a !important;
}


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


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


html[data-theme="dark"]
#moduleContent input,

html[data-theme="dark"]
#moduleContent select,

html[data-theme="dark"]
#moduleContent textarea {
  background: #111c30 !important;

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

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


html[data-theme="dark"]
#moduleContent input::placeholder,

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


/* =========================================================
   O.C. - TARJETAS SUPERIORES
   ========================================================= */

html[data-theme="dark"]
body.danfer-admin-frontier
#moduleContent
.purchase-dashboard
.purchase-kpis > article,

html[data-theme="dark"]
#moduleContent
.purchase-dashboard
.purchase-kpis > article {
  background: var(--df-panel) !important;

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

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

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


html[data-theme="dark"]
#moduleContent
.purchase-kpis > article span {
  color: var(--df-muted) !important;
}


html[data-theme="dark"]
#moduleContent
.purchase-kpis > article strong {
  color: #fff !important;
}


html[data-theme="dark"]
#moduleContent
.purchase-kpis > article small {
  color: #8193a8 !important;
}


html[data-theme="dark"]
#moduleContent
.purchase-kpis > article:nth-child(4) {
  border-left:
    3px solid #c65353 !important;
}


/* =========================================================
   O.C. - DETALLE
   ========================================================= */

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

html[data-theme="dark"]
#purchaseDetailModal
.purchase-detail-dialog,

html[data-theme="dark"]
#purchaseDetailModal
.purchase-detail-content {
  background: #0d1829 !important;

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


html[data-theme="dark"]
#purchaseDetailModal
.purchase-detail-dialog > header,

html[data-theme="dark"]
#purchaseDetailModal
.purchase-detail-dialog > footer {
  background: var(--df-panel) !important;

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


html[data-theme="dark"]
#purchaseDetailModal
.purchase-detail-content > *,

html[data-theme="dark"]
#purchaseDetailModal
.purchase-detail-content section,

html[data-theme="dark"]
#purchaseDetailModal
.purchase-detail-content article {
  background: var(--df-panel) !important;

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

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


html[data-theme="dark"]
#purchaseDetailModal
table th {
  background: var(--df-head) !important;
  color: #fff !important;
}


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


html[data-theme="dark"]
#purchaseDetailModal
strong {
  color: var(--df-text) !important;
}


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

html[data-theme="dark"]
#purchaseDetailModal
span {
  color: var(--df-muted);
}


/* =========================================================
   UNIDADES - EXPEDIENTE
   ========================================================= */

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

html[data-theme="dark"]
#unitFilesModal
.unit-files-shell,

html[data-theme="dark"]
#unitFilesModal
.unit-files-body {
  background: #0d1829 !important;

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


html[data-theme="dark"]
#unitFilesModal
.unit-files-header {
  background: var(--df-panel) !important;

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


html[data-theme="dark"]
#unitFilesModal
.unit-files-header h2 {
  color: var(--df-text) !important;
}


html[data-theme="dark"]
#unitFilesModal
.unit-files-header p,

html[data-theme="dark"]
#unitFilesModal
.unit-files-header span {
  color: var(--df-muted) !important;
}


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

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

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


html[data-theme="dark"]
#unitFilesModal
#unitOperationsSummary
.metric-card strong {
  color: var(--df-text) !important;
}


html[data-theme="dark"]
#unitFilesModal
#unitOperationsSummary
.metric-card span,

html[data-theme="dark"]
#unitFilesModal
#unitOperationsSummary
.metric-card p {
  color: var(--df-muted) !important;
}


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

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


html[data-theme="dark"]
#unitFilesModal
.priority-list,

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

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

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


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


html[data-theme="dark"]
#unitFilesModal
.priority-list p {
  color: var(--df-muted) !important;
}


/* =========================================================
   INVENTARIO
   ========================================================= */

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

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

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


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


html[data-theme="dark"]
#moduleContent
.inventory-kpi span,

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


html[data-theme="dark"]
#moduleContent
.inventory-filters,

html[data-theme="dark"]
#moduleContent
.inventory-table-card,

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

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

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


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

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


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


/* =========================================================
   CONTROL PRESUPUESTAL
   ========================================================= */

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;
}


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

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

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

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


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

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

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


/* =========================================================
   CHAT
   ========================================================= */

html[data-theme="dark"]
.chat-shell,

html[data-theme="dark"]
.chat-sidebar,

html[data-theme="dark"]
.chat-conversation,

html[data-theme="dark"]
.chat-messages,

html[data-theme="dark"]
.chat-composer {
  background: #0d1829 !important;

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

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


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

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


html[data-theme="dark"]
.chat-thread,

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

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

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


html[data-theme="dark"]
.chat-thread strong,

html[data-theme="dark"]
.chat-person strong,

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


html[data-theme="dark"]
.chat-thread small,

html[data-theme="dark"]
.chat-person small,

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


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

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

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


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


/* =========================================================
   AUDITORIA
   ========================================================= */

html[data-theme="dark"]
.activity-live-panel,

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

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


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

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

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


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


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


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


html[data-theme="dark"]
.activity-live-main span,

html[data-theme="dark"]
.activity-live-meta,

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


/* =========================================================
   RESUMEN
   ========================================================= */

html[data-theme="dark"]
.weekly-executive-panel,

html[data-theme="dark"]
.weekly-kpi-card,

html[data-theme="dark"]
.weekly-cost-panel,

html[data-theme="dark"]
.weekly-analytics-panel,

html[data-theme="dark"]
.weekly-service-panel,

html[data-theme="dark"]
.weekly-analytics-view,

html[data-theme="dark"]
.weekly-v4-chart,

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

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

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


html[data-theme="dark"]
.weekly-kpi-card strong,

html[data-theme="dark"]
.weekly-cost-panel strong,

html[data-theme="dark"]
.weekly-analytics-panel strong,

html[data-theme="dark"]
.weekly-service-panel strong {
  color: var(--df-text) !important;
}


html[data-theme="dark"]
.weekly-kpi-card p,

html[data-theme="dark"]
.weekly-kpi-card div,

html[data-theme="dark"]
.weekly-cost-panel p,

html[data-theme="dark"]
.weekly-analytics-panel p,

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


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


html[data-theme="dark"]
.weekly-service-table td {
  background: var(--df-panel) !important;
  color: var(--df-text-2) !important;
}


/* =========================================================
   USUARIOS
   ========================================================= */

html[data-theme="dark"]
#moduleContent:has([data-user-edit]) {
  background: var(--df-bg) !important;
  color: var(--df-text-2) !important;
}


html[data-theme="dark"]
#moduleContent:has([data-user-edit])
table,

html[data-theme="dark"]
#moduleContent:has([data-user-edit])
.users-row,

html[data-theme="dark"]
#moduleContent:has([data-user-edit])
.users-row td {
  background: var(--df-panel) !important;

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

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


html[data-theme="dark"]
#moduleContent:has([data-user-edit])
table th {
  background: var(--df-head) !important;

  color: #fff !important;
}


html[data-theme="dark"]
.users-person-copy strong,

html[data-theme="dark"]
.users-access strong,

html[data-theme="dark"]
.users-date strong,

html[data-theme="dark"]
.users-session-copy-v2 strong {
  color: var(--df-text) !important;
}


html[data-theme="dark"]
.users-person-copy span,

html[data-theme="dark"]
.users-access span,

html[data-theme="dark"]
.users-date span,

html[data-theme="dark"]
.users-session-copy-v2 span {
  color: var(--df-muted) !important;
}


/* =========================================================
   BITACORA
   ========================================================= */

html[data-theme="dark"]
.unitlog-v2-stats > article,

html[data-theme="dark"]
.unitlog-v2-panel,

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

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

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


html[data-theme="dark"]
.unitlog-v2-stats > article strong {
  color: var(--df-text) !important;
}


html[data-theme="dark"]
.unitlog-v2-stats > article span {
  color: var(--df-muted) !important;
}


html[data-theme="dark"]
.unitlog-v2-table td {
  background: var(--df-panel) !important;

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


/* =========================================================
   VIAJES / DESGLOSE DE GASTOS
   ========================================================= */

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

html[data-theme="dark"]
#tripExpenseModal > div,

html[data-theme="dark"]
#tripExpenseModal header,

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

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

html[data-theme="dark"]
#tripExpenseEditor {
  background: #0d1829 !important;

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

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


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

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


html[data-theme="dark"]
#tripExpenseModal
#tripExpenseSummary
.metric-card strong {
  color: var(--df-text) !important;
}


html[data-theme="dark"]
#tripExpenseModal
#tripExpenseSummary
.metric-card span {
  color: var(--df-muted) !important;
}


/* Bloques de casetas / consumos / estancias */

html[data-theme="dark"]
#tripExpenseModal section,

html[data-theme="dark"]
#tripExpenseModal article,

html[data-theme="dark"]
#tripExpenseModal
[class*="trip-expense"] {
  background: var(--df-panel) !important;

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

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


html[data-theme="dark"]
#tripExpenseModal label,

html[data-theme="dark"]
#tripExpenseModal label span {
  color: var(--df-muted) !important;
}


html[data-theme="dark"]
#tripExpenseModal input,

html[data-theme="dark"]
#tripExpenseModal select,

html[data-theme="dark"]
#tripExpenseModal textarea {
  background: #111c30 !important;

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

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


html[data-theme="dark"]
#tripExpenseModal input::placeholder,

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


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


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


/* =========================================================
   MODALES GENERALES
   ========================================================= */

html[data-theme="dark"] dialog,

html[data-theme="dark"] .modal-card,

html[data-theme="dark"] .task-dialog,

html[data-theme="dark"] .incident-delete-card,

html[data-theme="dark"] .purchase-delete-card {
  color: var(--df-text-2) !important;
}


html[data-theme="dark"]
.secondary-button {
  background: #152238 !important;

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

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

