:root {
    /* Variables para modo oscuro (default) */
    --bg-color: ##161b22;
    --text-color: #ffffff;
    --title-color: #ffc825;
    --navbar-bg: #161b22;
    --navbar-text: #ffffff;
    --section-bg: #0a192f;
    --section-alt-bg: #0a192f;
    --footer-bg: #0a192f;
    --footer-text: #ffffff;
    --link-color: #ffc825;
    --table-hover: #0a192f;
}

/* Clase para modo claro */
.light-mode {
    --bg-color: #750202;
    --text-color: #333333;
    --title-color: #0a192f;
    --navbar-bg: #ffffff;
    --navbar-text: #112240;
    --section-bg: #f5f5f5;
    --section-alt-bg: #C0C0C0;
    --footer-bg: #C0C0C0;
    --footer-text: #333333;
    --link-color: #0a192f;
    --table-hover: #C0C0C0;
}

/* Aplicar variables a elementos */
body {
    background-color: var(--bg-color);
    color: var(--text-color);
}

h1,
h2,
h3 {
    color: var(--title-color);
}

h4,
h5 {
    color: #cecfd1 !important
}

.navbar {
    background-color: var(--navbar-bg) !important;
    height: 96px;
}

.navbar-brand,
.nav-link {
    color: var(--navbar-text) !important;
}

.section {
    background-color: var(--section-bg);
}

.section.bg-dark {
    background-color: var(--section-alt-bg) !important;
}

.footer {
    background-color: var(--footer-bg);
    color: var(--footer-text);
}

.footer a {
    color: var(--link-color);
}

/* Estilos para la tabla en modo oscuro/claro */
tbody tr.hover,
tbody tr:hover {
    background-color: var(--table-hover) !important;
}

/* Mantener los degradados consistentes con el tema */
.degradado,
.degradado2 {
    background-image: linear-gradient(to right, var(--section-alt-bg), transparent);
}

.degradado .contenido h1,
.degradado2 .contenido h1,
.degradado .contenido p,
.degradado2 .contenido p {
    color: var(--text-color);
}

.nowrap {
    white-space: nowrap;
}

.textcenter {
    align-content: center;
    font-weight: bold;
    text-transform: uppercase;
}

.dropdown-toggle::after {
    display: none !important;
}