/* =====================================
   DASHBOARD GERENCIAL CSS AISLADO - DBX
   VERSION LIMPIA / TEXTOS NEGROS TABLAS
===================================== */

/* =========================
   LAYOUT
========================= */
.dbx-layout{
  padding:20px;
  width:100%;
  box-sizing:border-box;
}

.dbx-main{
  display:flex;
  flex-direction:column;
  gap:20px;
}

.dbx-left,
.dbx-right{
  width:100%;
  display:flex;
  flex-direction:column;
  gap:20px;
}

/* =========================
   HEADER
========================= */
.dbx-header{
  margin-bottom:20px;
}

.dbx-header h2{
  margin:0;
  font-size:34px;
  font-weight:700;
  color:#111827;
}

/* =========================
   BOTONES
========================= */
.dbx-btn{
  border:none;
  border-radius:10px;
  height:44px;
  padding:0 18px;
  cursor:pointer;
  font-size:14px;
  font-weight:700;
  transition:.2s ease;
  white-space:nowrap;
}

.dbx-btn:hover{
  transform:translateY(-1px);
}

.dbx-btn-primary{
  background:#2f56a6;
  color:#fff;
}

.dbx-btn-light{
  background:#eef2f7;
  color:#111827;
}

.dbx-btn-danger{
  background:#ea4335;
  color:#fff;
}

/* =========================
   FILTROS
========================= */
.dbx-filters-box{
  background:#fff;
  border:1px solid #e5e7eb;
  border-radius:14px;
  padding:18px;
  display:flex;
  flex-direction:column;
  gap:14px;
  margin-bottom:18px;
}

.dbx-toolbar{
  display:grid;
  grid-template-columns:
    auto auto auto
    110px
    auto auto auto auto
    auto auto auto;
  gap:10px;
  align-items:center;
}

.dbx-toolbar .dbx-select{
  width:110px;
}



.dbx-group{
  display:flex;
  flex-direction:column;
}

.dbx-group label{
  font-size:12px;
  font-weight:600;
  color:#6b7280;
  margin-bottom:6px;
}

.dbx-group input,
.dbx-select{
  width:100%;
  height:44px;
  padding:0 12px;
  border:1px solid #d1d5db;
  border-radius:10px;
  font-size:14px;
  background:#fff;
  box-sizing:border-box;
}

.dbx-btn-group{
  display:flex;
  align-items:end;
}

.dbx-btn-group .dbx-btn{
  width:100%;
}

/* =========================
   KPI CARDS
========================= */
#cardsDashboard.dbx-cards{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:16px;
  margin-bottom:22px;
}

.dbx-cards .card{
  background:#fff;
  border:1px solid #e5e7eb;
  border-radius:14px;
  padding:18px;
  position:relative;
}

.dbx-cards .card::before{
  content:"";
  position:absolute;
  left:0;
  top:0;
  bottom:0;
  width:5px;
  border-radius:14px 0 0 14px;
}

.dbx-cards .card h3{
  margin:0 0 10px;
  font-size:12px;
  font-weight:700;
  text-transform:uppercase;
  color:#6b7280;
  letter-spacing:.4px;
}

.dbx-cards .card p{
  margin:0;
  font-size:22px;
  font-weight:800;
  color:#111827;
}

.small-kpi{
  font-size:17px !important;
  line-height:1.4;
}

/* cards colors */
.card.periodo::before{ background:#34495e; }
.card.ingreso::before{ background:#27ae60; }
.card.egreso::before{ background:#e74c3c; }
.card.utilidad::before{ background:#3498db; }
.card.margen::before{ background:#8e44ad; }
.card.viajes::before{ background:#f39c12; }
.card.facturas::before{ background:#16a085; }
.card.operacional::before{ background:#c0392b; }

/* =========================
   TARJETAS
========================= */
.dbx-table-card,
.dbx-chart-card{
  background:#fff;
  border:1px solid #e5e7eb;
  border-radius:14px;
  padding:16px;
}

.dbx-table-card h2,
.dbx-chart-card h3{
  margin:0 0 14px;
  font-size:18px;
  font-weight:700;
  color:#111827;
}

/* =========================
   TABLAS
========================= */
.dbx-table{
  width:100%;
  border-collapse:collapse;
}

.dbx-table th{
  position:sticky;
  top:0;
  background:#f5f7fb;
  z-index:5;
  text-align:left;
  padding:12px 14px;
  font-size:13px;
  font-weight:700;
  color:#111827;
}

.dbx-table td{
  padding:12px 14px;
  font-size:14px;
  border-bottom:1px solid #f1f1f1;
  white-space:nowrap;
  color:#111827 !important;
  font-weight:500 !important;
}

.dbx-table tbody tr:hover{
  background:#fafafa;
}

/* =========================
   TOTALES
========================= */
.dbx-table tfoot td{
  position:sticky;
  bottom:0;
  background:#eef2f7 !important;
  border-top:2px solid #d9dee8 !important;
  padding:13px 14px;
  color:#111827 !important;
  font-weight:800 !important;
}

.dbx-table tfoot td:first-child{
  font-weight:900 !important;
}

/* =========================
   SCROLL
========================= */
.tabla-scroll-wrap{
  max-height:340px;
  overflow-y:auto;
  overflow-x:auto;
  border-radius:10px;
}

/* =========================
   GRAFICAS
========================= */
.dbx-chart-wrap{
  position:relative;
  width:100%;
  height:320px;
}

.dbx-chart-wrap canvas{
  width:100% !important;
  height:100% !important;
}

/* =========================
   FILA 50 / 50
========================= */
.dbx-row-50{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:20px;
  margin-top:20px;
}

.facturacion-half,
.grafica-half{
  width:100%;
  min-height:420px;
}

.grafica-half .dbx-chart-wrap{
  height:340px;
}

/* =========================
   ELIMINAR TODOS LOS COLORES
========================= */
.text-green,
.text-red,
.text-blue,
.text-orange,
.text-purple,
.total-green,
.total-red,
.total-blue,
.total-orange,
.total-purple,
.text-facturado,
.text-ingreso,
.text-pendiente,
.text-egreso,
.text-utilidad,
.total-facturado,
.total-ingreso,
.total-pendiente,
.total-egreso,
.total-utilidad{
  color:#111827 !important;
  font-weight:700 !important;
}

/* tablas específicas negras */
#tablaRentabilidadTable tbody td,
#tablaRentabilidadTable tfoot td,
#tablaEstadoFacturacionTable tbody td,
#tablaEstadoFacturacionTable tfoot td{
  color:#111827 !important;
}

/* =========================
   RESPONSIVE
========================= */
@media(max-width:1400px){
  .dbx-toolbar{
    grid-template-columns:repeat(6,auto);
  }
}

@media(max-width:1300px){
  #cardsDashboard.dbx-cards{
    grid-template-columns:repeat(2,1fr);
  }
}

@media(max-width:1100px){
  .dbx-toolbar{
    grid-template-columns:repeat(4,auto);
  }

  .dbx-row-50{
    grid-template-columns:1fr;
  }
}

@media(max-width:768px){

  #cardsDashboard.dbx-cards{
    grid-template-columns:1fr;
  }

  .dbx-toolbar{
    grid-template-columns:1fr;
  }



  .dbx-layout{
    padding:14px;
  }

  .dbx-header h2{
    font-size:28px;
  }

  .dbx-table{
    min-width:760px;
  }
}

@media(max-width:480px){

  .dbx-header h2{
    font-size:24px;
  }

  .dbx-cards .card p{
    font-size:20px;
  }

  .dbx-chart-wrap{
    height:240px;
  }
}

/* =====================================
FIX CARD #3 ESTADO FACTURACIÓN
Pegar al FINAL de dashboard.css
===================================== */

/* Card #7 */
#cardsDashboard .card:nth-child(3) p{
  font-size:16px !important;
  line-height:1.45 !important;
  font-weight:700 !important;
  white-space:normal !important;
}

/* título más limpio */
#cardsDashboard .card:nth-child(3) h3{
  font-size:12px !important;
  margin-bottom:10px !important;
}

/* responsive */
@media(max-width:768px){
  #cardsDashboard .card:nth-child(3) p{
    font-size:16px !important;
    line-height:1.4 !important;
  }
}

/* =====================================
FIX CARD #2 ESTADO FACTURACIÓN
Pegar al FINAL de dashboard.css
===================================== */

/* Card #7 */
#cardsDashboard .card:nth-child(2) p{
  font-size:16px !important;
  line-height:1.45 !important;
  font-weight:700 !important;
  white-space:normal !important;
}

/* título más limpio */
#cardsDashboard .card:nth-child(2) h3{
  font-size:12px !important;
  margin-bottom:10px !important;
}

/* responsive */
@media(max-width:768px){
  #cardsDashboard .card:nth-child(2) p{
    font-size:16px !important;
    line-height:1.4 !important;
  }
}

/* =====================================
FIX CARD #5 ESTADO FACTURACIÓN
Pegar al FINAL de dashboard.css
===================================== */

/* Card #7 */
#cardsDashboard .card:nth-child(5) p{
  font-size:16px !important;
  line-height:1.45 !important;
  font-weight:700 !important;
  white-space:normal !important;
}

/* título más limpio */
#cardsDashboard .card:nth-child(5) h3{
  font-size:12px !important;
  margin-bottom:10px !important;
}

/* responsive */
@media(max-width:768px){
  #cardsDashboard .card:nth-child(5) p{
    font-size:16px !important;
    line-height:1.4 !important;
  }
}




/* ==========================================
RENTABILIDAD COMPACTA SIN SCROLL CONSTANTE
REEMPLAZA SOLO ESTE BLOQUE FINAL
========================================== */

#tablaRentabilidadTable{
  width:100%;
  table-layout:fixed;
}

/* wrapper */
.rentabilidad-full .tabla-scroll-wrap{
  overflow-x:auto;
  overflow-y:auto;
  max-height:420px;
}

/* encabezado */
#tablaRentabilidadTable thead th{
  font-size:12px !important;
  padding:8px 10px !important;
  line-height:1.15;
  white-space:normal;
  text-align:left;
}

/* body */
#tablaRentabilidadTable tbody td{
  font-size:13px !important;
  padding:8px 10px !important;
  line-height:1.2;
  white-space:nowrap;
}

/* footer */
#tablaRentabilidadTable tfoot td{
  font-size:13px !important;
  padding:9px 10px !important;
  font-weight:800;
  white-space:nowrap;
}

/* anchos reducidos */
#tablaRentabilidadTable th:nth-child(1),
#tablaRentabilidadTable td:nth-child(1){
  width:120px;
}

#tablaRentabilidadTable th:nth-child(2),
#tablaRentabilidadTable td:nth-child(2){
  width:170px;
}

#tablaRentabilidadTable th:nth-child(3),
#tablaRentabilidadTable td:nth-child(3){
  width:150px;
}

#tablaRentabilidadTable th:nth-child(4),
#tablaRentabilidadTable td:nth-child(4),
#tablaRentabilidadTable th:nth-child(5),
#tablaRentabilidadTable td:nth-child(5),
#tablaRentabilidadTable th:nth-child(6),
#tablaRentabilidadTable td:nth-child(6),
#tablaRentabilidadTable th:nth-child(7),
#tablaRentabilidadTable td:nth-child(7),
#tablaRentabilidadTable th:nth-child(8),
#tablaRentabilidadTable td:nth-child(8),
#tablaRentabilidadTable th:nth-child(9),
#tablaRentabilidadTable td:nth-child(9){
  width:110px;
}

#tablaRentabilidadTable th:nth-child(10),
#tablaRentabilidadTable td:nth-child(10){
  width:95px;
}

/* hover */
#tablaRentabilidadTable tbody tr:hover{
  background:#fafafa;
}

/* si cabe en pantallas grandes, no scroll */
@media (min-width:1500px){
  #tablaRentabilidadTable{
    min-width:100%;
  }
}

/* laptop */
@media (max-width:1400px){

  #tablaRentabilidadTable{
    min-width:1220px;
  }

  #tablaRentabilidadTable thead th{
    font-size:11px !important;
    padding:7px 8px !important;
  }

  #tablaRentabilidadTable tbody td,
  #tablaRentabilidadTable tfoot td{
    font-size:12px !important;
    padding:7px 8px !important;
  }
}

/* tablet */
@media (max-width:992px){
  #tablaRentabilidadTable{
    min-width:1180px;
  }
}

/* móvil */
@media (max-width:768px){
  #tablaRentabilidadTable{
    min-width:1100px;
  }
}




/* ==========================================
ESTADO DE FACTURACIÓN COMPACTO + NUEVA COLUMNA
Pegar al FINAL de dashboard.css
========================================== */

#tablaEstadoFacturacionTable{
  width:100%;
  table-layout:fixed;
}

/* contenedor */
.fact-scroll,
.facturacion-half .tabla-scroll-wrap{
  overflow-x:auto;
  overflow-y:auto;
  max-height:360px;
}

/* encabezado */
#tablaEstadoFacturacionTable thead th{
  font-size:12px !important;
  padding:8px 10px !important;
  line-height:1.15;
  white-space:normal;
  text-align:left;
}

/* body */
#tablaEstadoFacturacionTable tbody td{
  font-size:13px !important;
  padding:8px 10px !important;
  line-height:1.2;
  white-space:nowrap;
  color:#111827 !important;
}

/* footer */
#tablaEstadoFacturacionTable tfoot td{
  font-size:13px !important;
  padding:9px 10px !important;
  font-weight:800;
  color:#111827 !important;
}

/* anchos columnas */
#tablaEstadoFacturacionTable th:nth-child(1),
#tablaEstadoFacturacionTable td:nth-child(1){
  width:180px;
}

#tablaEstadoFacturacionTable th:nth-child(2),
#tablaEstadoFacturacionTable td:nth-child(2){
  width:150px;
}

#tablaEstadoFacturacionTable th:nth-child(3),
#tablaEstadoFacturacionTable td:nth-child(3),
#tablaEstadoFacturacionTable th:nth-child(4),
#tablaEstadoFacturacionTable td:nth-child(4),
#tablaEstadoFacturacionTable th:nth-child(5),
#tablaEstadoFacturacionTable td:nth-child(5){
  width:120px;
}

/* hover */
#tablaEstadoFacturacionTable tbody tr:hover{
  background:#fafafa;
}

/* pantallas grandes */
@media (min-width:1400px){
  #tablaEstadoFacturacionTable{
    min-width:100%;
  }
}

/* laptop */
@media (max-width:1400px){

  #tablaEstadoFacturacionTable{
    min-width:820px;
  }

  #tablaEstadoFacturacionTable thead th{
    font-size:11px !important;
    padding:7px 8px !important;
  }

  #tablaEstadoFacturacionTable tbody td,
  #tablaEstadoFacturacionTable tfoot td{
    font-size:12px !important;
    padding:7px 8px !important;
  }
}

/* móvil */
@media (max-width:768px){
  #tablaEstadoFacturacionTable{
    min-width:780px;
  }
}

/* =====================================
   AJUSTE COMPACTO DASHBOARD GERENCIAL
   AGREGAR AL FINAL
===================================== */

/* layout */
.dbx-layout{
  padding:14px !important;
}

.dbx-main,
.dbx-left,
.dbx-right{
  gap:14px !important;
}

/* header */
.dbx-header{
  margin-bottom:14px !important;
}

.dbx-header h2{
  font-size:28px !important;
}

/* botones */
.dbx-btn{
  height:34px !important;
  padding:0 14px !important;
  font-size:12px !important;
  border-radius:9px !important;
}

/* =========================
   FILTROS MÁS COMPACTOS
========================= */
.dbx-filters-box{
  padding:14px !important;
  gap:10px !important;
  margin-bottom:14px !important;
}

/* toolbar superior en 6 columnas */
.dbx-toolbar{
  grid-template-columns:repeat(6,1fr) !important;
  gap:8px !important;
}

/* toolbar inferior */


.dbx-group label{
  font-size:11px !important;
  margin-bottom:4px !important;
}

.dbx-group input,
.dbx-select{
  height:34px !important;
  font-size:12px !important;
  padding:0 10px !important;
  border-radius:9px !important;
}

/* =========================
   KPI CARDS MÁS PEQUEÑAS
========================= */
#cardsDashboard.dbx-cards{
  grid-template-columns:repeat(4,1fr) !important;
  gap:10px !important;
  margin-bottom:14px !important;
}

.dbx-cards .card{
  padding:12px 14px !important;
  border-radius:12px !important;
}

.dbx-cards .card::before{
  width:4px !important;
}

.dbx-cards .card h3{
  font-size:10px !important;
  margin-bottom:4px !important;
}

.dbx-cards .card p{
  font-size:18px !important;
  line-height:1.25 !important;
}

.small-kpi{
  font-size:14px !important;
  line-height:1.3 !important;
}

/* fixes cards especiales */
#cardsDashboard .card:nth-child(2) p,
#cardsDashboard .card:nth-child(3) p,
#cardsDashboard .card:nth-child(5) p{
  font-size:14px !important;
  line-height:1.3 !important;
}

/* =========================
   TARJETAS TABLAS / CHARTS
========================= */
.dbx-table-card,
.dbx-chart-card{
  padding:12px !important;
  border-radius:12px !important;
}

.dbx-table-card h2,
.dbx-chart-card h3{
  font-size:16px !important;
  margin-bottom:10px !important;
}

/* =========================
   TABLAS MÁS COMPACTAS
========================= */
.dbx-table th{
  font-size:12px !important;
  padding:9px 10px !important;
}

.dbx-table td{
  font-size:12px !important;
  padding:9px 10px !important;
}

.dbx-table tfoot td{
  font-size:12px !important;
  padding:9px 10px !important;
}

/* scroll más elegante */
.tabla-scroll-wrap{
  max-height:320px !important;
}

/* =========================
   GRÁFICAS MÁS COMPACTAS
========================= */
.dbx-chart-wrap{
  height:280px !important;
}

.grafica-half .dbx-chart-wrap{
  height:300px !important;
}

/* fila 50/50 */
.dbx-row-50{
  gap:14px !important;
  margin-top:14px !important;
}

.facturacion-half,
.grafica-half{
  min-height:auto !important;
}

/* =========================
   RESPONSIVE
========================= */
@media (max-width:1400px){

  .dbx-toolbar{
    grid-template-columns:repeat(3,1fr) !important;
  }

  #cardsDashboard.dbx-cards{
    grid-template-columns:repeat(2,1fr) !important;
  }
}

@media (max-width:992px){


  .dbx-row-50{
    grid-template-columns:1fr !important;
  }
}

@media (max-width:768px){

  .dbx-layout{
    padding:10px !important;
  }



  #cardsDashboard.dbx-cards{
    grid-template-columns:1fr !important;
  }

  .dbx-btn{
    width:100% !important;
  }

  .dbx-header h2{
    font-size:24px !important;
  }

  .dbx-chart-wrap{
    height:240px !important;
  }
}





.dbx-toolbar .dbx-btn{
  height:34px !important;
  font-size:12px !important;
  padding:0 10px !important;
  white-space:nowrap !important;
}

.dbx-toolbar .dbx-select{
  min-width:95px !important;
  height:34px !important;
}

/* scrollbar elegante */
.dbx-toolbar::-webkit-scrollbar{
  height:6px;
}
.dbx-toolbar::-webkit-scrollbar-thumb{
  background:#c7cfdd;
  border-radius:20px;
}

/* responsive */
@media (max-width:1200px){
  .dbx-toolbar{
    flex-wrap:wrap !important;
  }
}

@media (max-width:768px){
  .dbx-toolbar{
    display:grid !important;
    grid-template-columns:1fr !important;
  }
}

.dbx-toolbar{
  display:flex;
  gap:8px;
  margin-bottom:10px;
}

.dbx-toolbar .dbx-btn{
  min-width:120px;
  max-width:120px;
}

.dbx-btn{
  height:34px !important;
  font-size:12px !important;
  padding:0 14px !important;
}

.dbx-group input,
.dbx-group select{
  height:34px !important;
  font-size:12px !important;
}

.dbx-group label{
  font-size:11px !important;
  margin-bottom:4px !important;
}

/* =====================================
   KPI V2
===================================== */

.card.flete::before{
  background:#2f56a6;
}

.card.utilidad-operativa::before{
  background:#27ae60;
}

.card.margen-operativo::before{
  background:#8e44ad;
}

.card.gastos-operacionales::before{
  background:#e74c3c;
}

.card.utilidad-neta::before{
  background:#16a085;
}

.card.facturado::before{
  background:#f39c12;
}

.card.pendiente::before{
  background:#c0392b;
}

/* ==========================================
TOP CLIENTES
========================================== */

#tablaTopClientesTable{
  width:100%;
  table-layout:fixed;
}

#tablaTopClientesTable thead th{
  font-size:12px !important;
  padding:8px 10px !important;
}

#tablaTopClientesTable tbody td{
  font-size:13px !important;
  padding:8px 10px !important;
}

#tablaTopClientesTable tfoot td{
  font-size:13px !important;
  padding:9px 10px !important;
  font-weight:800;
}

/* anchos */

#tablaTopClientesTable th:nth-child(1),
#tablaTopClientesTable td:nth-child(1){
  width:220px;
}

#tablaTopClientesTable th:nth-child(2),
#tablaTopClientesTable td:nth-child(2){
  width:80px;
}

#tablaTopClientesTable th:nth-child(3),
#tablaTopClientesTable td:nth-child(3),
#tablaTopClientesTable th:nth-child(4),
#tablaTopClientesTable td:nth-child(4){
  width:140px;
}

#tablaTopClientesTable th:nth-child(5),
#tablaTopClientesTable td:nth-child(5){
  width:90px;
}

@media(max-width:1400px){

  #tablaTopClientesTable{
    min-width:750px;
  }

}



.rent-tooltip-icon{
  font-size:12px;
  margin-left:4px;
  opacity:.7;
  cursor:help;
}

/* ==========================================
RENTABILIDAD V4 ULTRA COMPACTA
========================================== */

#tablaRentabilidadTable{
  min-width:1450px !important;
}

/* encabezados */
#tablaRentabilidadTable thead th{
  font-size:11px !important;
  padding:6px 8px !important;
  line-height:1.1;
}

/* filas */
#tablaRentabilidadTable tbody td{
  font-size:12px !important;
  padding:6px 8px !important;
  line-height:1.1;
}

/* totales */
#tablaRentabilidadTable tfoot td{
  font-size:12px !important;
  padding:7px 8px !important;
}

/* manifiesto */
#tablaRentabilidadTable th:nth-child(1),
#tablaRentabilidadTable td:nth-child(1){
  width:150px;
  max-width:150px;
}

#tablaRentabilidadTable td:nth-child(1){
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}

/* fecha */
#tablaRentabilidadTable th:nth-child(2),
#tablaRentabilidadTable td:nth-child(2){
  width:85px;
}

/* cliente */
#tablaRentabilidadTable th:nth-child(3),
#tablaRentabilidadTable td:nth-child(3){
  width:60px;
  text-align:center;
}

/* empresa */
#tablaRentabilidadTable th:nth-child(4),
#tablaRentabilidadTable td:nth-child(4){
  width:110px;
}

/* columnas monetarias */
#tablaRentabilidadTable th:nth-child(5),
#tablaRentabilidadTable td:nth-child(5),

#tablaRentabilidadTable th:nth-child(6),
#tablaRentabilidadTable td:nth-child(6),

#tablaRentabilidadTable th:nth-child(7),
#tablaRentabilidadTable td:nth-child(7),

#tablaRentabilidadTable th:nth-child(8),
#tablaRentabilidadTable td:nth-child(8),

#tablaRentabilidadTable th:nth-child(9),
#tablaRentabilidadTable td:nth-child(9),

#tablaRentabilidadTable th:nth-child(10),
#tablaRentabilidadTable td:nth-child(10),

#tablaRentabilidadTable th:nth-child(11),
#tablaRentabilidadTable td:nth-child(11),

#tablaRentabilidadTable th:nth-child(12),
#tablaRentabilidadTable td:nth-child(12){
  width:105px;
}

/* margen */
#tablaRentabilidadTable th:nth-child(13),
#tablaRentabilidadTable td:nth-child(13){
  width:80px;
}

/* hover */
#tablaRentabilidadTable tbody tr:hover{
  background:#fafafa;
}

.rent-tooltip-icon{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:14px;
  height:14px;
  margin-left:4px;

  border-radius:50%;

  background:#2f56a6;
  color:#fff;

  font-size:10px;
  font-weight:700;

  cursor:help;
}



.dbx-toolbar .dbx-group{
  margin:0 !important;
}

.dbx-toolbar .dbx-group input{
  width:150px !important;
}

.dbx-toolbar .dbx-select{
  width:120px !important;
}

.dbx-toolbar .dbx-btn{
  min-width:120px !important;
}




.dbx-toolbar .dbx-group{
  margin:0 !important;
}


.dbx-toolbar .dbx-btn,
.dbx-toolbar .dbx-select,
.dbx-toolbar input{

  height:34px !important;
  font-size:12px !important;

}

.dbx-toolbar label{

  font-size:10px !important;
  margin-bottom:2px !important;

}


.dbx-toolbar .dbx-group{
  margin:0 !important;
  width:auto !important;
}

.dbx-toolbar .dbx-btn{
  min-width:120px;
}

.dbx-toolbar .dbx-select{
  min-width:120px;
}

.dbx-toolbar input[type="date"]{
  min-width:150px;
}

/* =====================================
   FILTROS DASHBOARD GERENCIAL
===================================== */

.dbx-toolbar{
  display:flex !important;
  align-items:flex-end !important;
  flex-wrap:nowrap !important;
  gap:8px !important;
}

.dbx-toolbar .dbx-group{
  margin:0 !important;
  width:auto !important;
}

.dbx-toolbar .dbx-btn{
  width:120px !important;
  min-width:120px !important;
}

.dbx-toolbar .dbx-select{
  width:120px !important;
}

.dbx-toolbar input[type="date"]{
  width:150px !important;
}

.dbx-toolbar label{
  font-size:11px !important;
  margin-bottom:4px !important;
}

.dbx-toolbar .dbx-group:last-child .dbx-btn{
  width:120px !important;
}

/* =====================================
   RESPONSIVE FILTROS DASHBOARD
===================================== */

/* Laptop */
@media (max-width: 1400px){

  .dbx-toolbar{
    flex-wrap:wrap !important;
  }

}

/* Tablet */
@media (max-width: 992px){

  .dbx-toolbar{
    display:grid !important;
    grid-template-columns:
      repeat(2, minmax(220px, 1fr));
    gap:10px !important;
  }

  .dbx-toolbar .dbx-group{
    width:100% !important;
  }

  .dbx-toolbar .dbx-btn,
  .dbx-toolbar .dbx-select,
  .dbx-toolbar input[type="date"]{
    width:100% !important;
    min-width:unset !important;
  }

}

/* Celular */
@media (max-width: 768px){

  .dbx-toolbar{
    display:grid !important;
    grid-template-columns:1fr !important;
    gap:10px !important;
  }

  .dbx-toolbar .dbx-group{
    width:100% !important;
  }

  .dbx-toolbar .dbx-btn,
  .dbx-toolbar .dbx-select,
  .dbx-toolbar input[type="date"]{
    width:100% !important;
    min-width:unset !important;
  }

}

.rent-badge-ok{
  display:inline-block;
  padding:3px 8px;
  border-radius:20px;
  font-size:11px;
  font-weight:700;
  background:#dcfce7;
  color:#166534;
}

.rent-badge-no{
  display:inline-block;
  padding:3px 8px;
  border-radius:20px;
  font-size:11px;
  font-weight:700;
  background:#fee2e2;
  color:#991b1b;
}

.rent-badge-ok,
.rent-badge-no{
  padding:2px 6px;
  font-size:10px;
  min-width:32px;
  text-align:center;
}

/* ==========================================
   BOTONES EXPORTAR DASHBOARD
========================================== */

.dbx-header{

    display:flex;

    justify-content:space-between;

    align-items:center;

}

.dbx-header-actions{

    display:flex;

    gap:8px;

    align-items:center;

}

/* Excel */

.dbx-btn-excel{

    width:38px;

    height:38px;

    border:none;

    border-radius:6px;

    background:#217346;

    color:#fff;

    display:flex;

    align-items:center;

    justify-content:center;

    gap:2px;

    cursor:pointer;

    transition:.2s;

    box-shadow:0 2px 6px rgba(0,0,0,.15);

}

.dbx-btn-excel:hover{

    background:#1b5e37;

    transform:translateY(-1px);

}

/* Íconos */

.dbx-btn-excel i,
.dbx-btn-pdf i{

    font-size:14px;

}