/* MSCrons - Paleta de Colores Personalizada */
/* Azul, Gris, Negro, Blanco */

:root {
    --mscrons-blue: #1a365d;        /* Azul oscuro principal (navy) */
    --mscrons-blue-dark: #0f172a;   /* Azul muy oscuro */
    --mscrons-blue-light: #2563eb;  /* Azul medio para acentos */
    --mscrons-gray: #6b7280;        /* Gris */
    --mscrons-gray-light: #9ca3af;  /* Gris claro */
    --mscrons-gray-dark: #374151;   /* Gris oscuro */
    --mscrons-black: #1f2937;       /* Negro suave */
    --mscrons-white: #ffffff;       /* Blanco */
    --mscrons-bg: #f9fafb;          /* Fondo claro */
}

/* Header */
#d_header {
    background: linear-gradient(135deg, var(--mscrons-blue) 0%, var(--mscrons-blue-dark) 100%) !important;
    border-bottom: 3px solid var(--mscrons-blue-dark) !important;
}

#d_header_title {
    color: var(--mscrons-white) !important;
}

/* Tabs */
.tab_bar {
    background: var(--mscrons-gray-dark) !important;
    border-bottom: 2px solid var(--mscrons-blue) !important;
}

.tab {
    background: var(--mscrons-gray-dark) !important;
    color: var(--mscrons-gray-light) !important;
    border-right: 1px solid var(--mscrons-black) !important;
}

.tab:hover {
    background: var(--mscrons-gray) !important;
    color: var(--mscrons-white) !important;
}

.tab.active {
    background: var(--mscrons-blue) !important;
    color: var(--mscrons-white) !important;
    font-weight: bold !important;
}

/* Botones */
.button,
button,
input[type="button"],
input[type="submit"] {
    background: var(--mscrons-blue) !important;
    color: var(--mscrons-white) !important;
    border: 1px solid var(--mscrons-blue-dark) !important;
    transition: all 0.3s ease !important;
}

.button:hover,
button:hover,
input[type="button"]:hover,
input[type="submit"]:hover {
    background: var(--mscrons-blue-dark) !important;
    transform: translateY(-1px) !important;
    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1) !important;
}

/* Links */
a {
    color: var(--mscrons-blue) !important;
    transition: color 0.2s ease !important;
}

a:hover {
    color: var(--mscrons-blue-dark) !important;
    text-decoration: underline !important;
}

/* Footer */
#d_footer {
    background: var(--mscrons-gray-dark) !important;
    color: var(--mscrons-white) !important;
    border-top: 3px solid var(--mscrons-blue) !important;
    padding: 15px 20px !important;
}

#d_footer a {
    color: var(--mscrons-blue-light) !important;
    font-weight: 500 !important;
}

#d_footer a:hover {
    color: var(--mscrons-white) !important;
}

/* Tablas */
table.data_table thead {
    background: var(--mscrons-blue) !important;
    color: var(--mscrons-white) !important;
}

table.data_table tbody tr:hover {
    background: var(--mscrons-bg) !important;
}

table.data_table tbody tr:nth-child(even) {
    background: #f3f4f6 !important;
}

/* Formularios */
input[type="text"],
input[type="password"],
input[type="email"],
select,
textarea {
    border: 1px solid var(--mscrons-gray-light) !important;
    transition: border-color 0.2s ease !important;
}

input[type="text"]:focus,
input[type="password"]:focus,
input[type="email"]:focus,
select:focus,
textarea:focus {
    border-color: var(--mscrons-blue) !important;
    outline: none !important;
    box-shadow: 0 0 0 3px rgba(37, 99, 235, 0.1) !important;
}

/* Mensajes */
.message {
    border-left: 4px solid var(--mscrons-blue) !important;
}

.message.error {
    border-left-color: #dc2626 !important;
}

.message.success {
    border-left-color: #16a34a !important;
}

/* Gráficos y estadísticas */
.chart_container {
    border: 1px solid var(--mscrons-gray-light) !important;
    background: var(--mscrons-white) !important;
}

/* Sidebar */
.sidebar {
    background: var(--mscrons-bg) !important;
    border-right: 1px solid var(--mscrons-gray-light) !important;
}

/* Cards/Panels */
.panel,
.box {
    background: var(--mscrons-white) !important;
    border: 1px solid var(--mscrons-gray-light) !important;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1) !important;
}

/* Badges */
.badge {
    background: var(--mscrons-blue) !important;
    color: var(--mscrons-white) !important;
}

.badge.success {
    background: #16a34a !important;
}

.badge.error {
    background: #dc2626 !important;
}

.badge.warning {
    background: #f59e0b !important;
}

/* Scrollbar personalizado */
::-webkit-scrollbar {
    width: 10px !important;
    height: 10px !important;
}

::-webkit-scrollbar-track {
    background: var(--mscrons-bg) !important;
}

::-webkit-scrollbar-thumb {
    background: var(--mscrons-gray) !important;
    border-radius: 5px !important;
}

::-webkit-scrollbar-thumb:hover {
    background: var(--mscrons-gray-dark) !important;
}

/* Logo en el header */
#d_header_logo {
    background-image: none !important;
}

/* Ajustes de contraste para accesibilidad */
.text-muted {
    color: var(--mscrons-gray) !important;
}

.text-primary {
    color: var(--mscrons-blue) !important;
}

.bg-primary {
    background: var(--mscrons-blue) !important;
    color: var(--mscrons-white) !important;
}

/* Animaciones suaves */
* {
    transition: background-color 0.2s ease, color 0.2s ease !important;
}

/* Login page específico */
.login_container {
    background: var(--mscrons-white) !important;
    border: 1px solid var(--mscrons-gray-light) !important;
    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1) !important;
}

.login_container h1 {
    color: var(--mscrons-blue) !important;
}