/* Colores personalizados para todos los dashboards */
:root {
    --color-blue: #0066cc;
    --color-red: #dc3545;
    --color-green: #28a745;
    --color-yellow: #ffc107;
}

/* Clases de colores */
.color-blue { color: var(--color-blue) !important; }
.color-red { color: var(--color-red) !important; }
.color-green { color: var(--color-green) !important; }
.color-yellow { color: var(--color-yellow) !important; }

/* Barras de progreso */
.progress-bar.progress-bar-blue { background-color: var(--color-blue) !important; }
.progress-bar.progress-bar-red { background-color: var(--color-red) !important; }
.progress-bar.progress-bar-green { background-color: var(--color-green) !important; }
.progress-bar.progress-bar-yellow { background-color: var(--color-yellow) !important; }

/* Botones */
.btn-blue { 
    background-color: var(--color-blue) !important; 
    border-color: var(--color-blue) !important; 
    color: white !important;
}
.btn-red { 
    background-color: var(--color-red) !important; 
    border-color: var(--color-red) !important; 
    color: white !important;
}
.btn-green { 
    background-color: var(--color-green) !important; 
    border-color: var(--color-green) !important; 
    color: white !important;
}
.btn-yellow { 
    background-color: var(--color-yellow) !important; 
    border-color: var(--color-yellow) !important; 
    color: #333 !important;
}

/* Bordes */
.border-blue { border-color: var(--color-blue) !important; }
.border-red { border-color: var(--color-red) !important; }
.border-green { border-color: var(--color-green) !important; }
.border-yellow { border-color: var(--color-yellow) !important; }

/* Fondos */
.bg-blue { background-color: var(--color-blue) !important; }
.bg-red { background-color: var(--color-red) !important; }
.bg-green { background-color: var(--color-green) !important; }
.bg-yellow { background-color: var(--color-yellow) !important; }

/* Overrides específicos para Chart.js */
canvas {
    max-width: none !important;
}

/* Líneas horizontales */
.hr-blue { border-color: var(--color-blue) !important; }
.hr-red { border-color: var(--color-red) !important; }
.hr-green { border-color: var(--color-green) !important; }
.hr-yellow { border-color: var(--color-yellow) !important; }

/* Indicadores de tendencia */
.trend-neutral { 
    background-color: #6c757d !important; 
    color: white !important; 
    padding: 2px 8px;
    border-radius: 20px;
    font-size: 0.8rem;
    display: inline-block;
}
.trend-positive { 
    background-color: var(--color-green) !important; 
    color: white !important; 
    padding: 2px 8px;
    border-radius: 20px;
    font-size: 0.8rem;
    display: inline-block;
}
.trend-negative { 
    background-color: var(--color-red) !important; 
    color: white !important; 
    padding: 2px 8px;
    border-radius: 20px;
    font-size: 0.8rem;
    display: inline-block;
}

/* Tarjetas estadísticas */
.stat-card.success {
    border-left: 4px solid var(--color-green);
}
.stat-card.warning {
    border-left: 4px solid var(--color-yellow);
}
.stat-card.danger {
    border-left: 4px solid var(--color-red);
}
.stat-card.info {
    border-left: 4px solid var(--color-blue);
}