/* === Estilos originales === */
.divContenedor {
    width: 720px;
    min-height: 1056px;
}

.divTitulo {
    width: 50%;
    margin-top: inherit;
    height: 80px;
    float: left;
}

.divLogo {
    width: 50%;
    margin-top: inherit;
    height: 80px;
    float: right;
}

.sintesis {
    font-size: 10px;
    margin-top: 10px;
    text-align: justify;
}

.archivos {
    font-size: 10px;
    margin-top: 10px;
    text-align: justify;
}

.gestiones {
    font-size: 10px;
    margin-top: 10px;
    text-align: justify;
}

.fecha {
    text-align: right;
}

.logo {
    height: 80px;
    float: right;
}

/* === Esquema de colores personalizado SID === */

/* Botones normales - Color de fondo primario */
.btn-primary {
    background-color: #960E53 !important;
    border-color: #960E53 !important;
    color: #ffffff !important;
}

.btn-primary:hover,
.btn-primary:focus,
.btn-primary:active {
    background-color: #7d0b45 !important;
    border-color: #7d0b45 !important;
    color: #ffffff !important;
}

/* Botones agregar */
.btn-success {
    background-color: #237469 !important;
    border-color: #237469 !important;
    color: #ffffff !important;
}

.btn-success:hover,
.btn-success:focus,
.btn-success:active {
    background-color: #1c5d58 !important;
    border-color: #1c5d58 !important;
    color: #ffffff !important;
}

/* Botones editar */
.btn-warning {
    background-color: #DC7F37 !important;
    border-color: #DC7F37 !important;
    color: #ffffff !important;
}

.btn-warning:hover,
.btn-warning:focus,
.btn-warning:active {
    background-color: #c6722f !important;
    border-color: #c6722f !important;
    color: #ffffff !important;
}

/* Botones eliminar */
.btn-danger {
    background-color: #9B2F3E !important;
    border-color: #9B2F3E !important;
    color: #ffffff !important;
}

.btn-danger:hover,
.btn-danger:focus,
.btn-danger:active {
    background-color: #842835 !important;
    border-color: #842835 !important;
    color: #ffffff !important;
}

/* Botones visualizar */
.btn-info {
    background-color: #217ABF !important;
    border-color: #217ABF !important;
    color: #ffffff !important;
}

.btn-info:hover,
.btn-info:focus,
.btn-info:active {
    background-color: #1c6aa3 !important;
    border-color: #1c6aa3 !important;
    color: #ffffff !important;
}

/* Botones secundarios */
.btn-secondary {
    background-color: #B94645 !important;
    border-color: #B94645 !important;
    color: #ffffff !important;
}

.btn-secondary:hover,
.btn-secondary:focus,
.btn-secondary:active {
    background-color: #a23d3c !important;
    border-color: #a23d3c !important;
    color: #ffffff !important;
}

/* Botones siguiente */
.btn-dark {
    background-color: #333333 !important;
    border-color: #333333 !important;
    color: #ffffff !important;
}

.btn-dark:hover,
.btn-dark:focus,
.btn-dark:active {
    background-color: #2b2b2b !important;
    border-color: #2b2b2b !important;
    color: #ffffff !important;
}

/* Botones regresar */
.btn-light {
    background-color: #999999 !important;
    border-color: #999999 !important;
    color: #ffffff !important;
}

.btn-light:hover,
.btn-light:focus,
.btn-light:active {
    background-color: #8a8a8a !important;
    border-color: #8a8a8a !important;
    color: #ffffff !important;
}

/* Variantes outline */
.btn-outline-primary {
    color: #960E53 !important;
    border-color: #960E53 !important;
}

.btn-outline-primary:hover,
.btn-outline-primary:focus,
.btn-outline-primary:active {
    background-color: #960E53 !important;
    border-color: #960E53 !important;
    color: #ffffff !important;
}

.btn-outline-success {
    color: #237469 !important;
    border-color: #237469 !important;
}

.btn-outline-success:hover,
.btn-outline-success:focus,
.btn-outline-success:active {
    background-color: #237469 !important;
    border-color: #237469 !important;
    color: #ffffff !important;
}

.btn-outline-warning {
    color: #DC7F37 !important;
    border-color: #DC7F37 !important;
}

.btn-outline-warning:hover,
.btn-outline-warning:focus,
.btn-outline-warning:active {
    background-color: #DC7F37 !important;
    border-color: #DC7F37 !important;
    color: #ffffff !important;
}

.btn-outline-danger {
    color: #9B2F3E !important;
    border-color: #9B2F3E !important;
}

.btn-outline-danger:hover,
.btn-outline-danger:focus,
.btn-outline-danger:active {
    background-color: #9B2F3E !important;
    border-color: #9B2F3E !important;
    color: #ffffff !important;
}

.btn-outline-info {
    color: #217ABF !important;
    border-color: #217ABF !important;
}

.btn-outline-info:hover,
.btn-outline-info:focus,
.btn-outline-info:active {
    background-color: #217ABF !important;
    border-color: #217ABF !important;
    color: #ffffff !important;
}

.btn-outline-secondary {
    color: #B94645 !important;
    border-color: #B94645 !important;
}

.btn-outline-secondary:hover,
.btn-outline-secondary:focus,
.btn-outline-secondary:active {
    background-color: #B94645 !important;
    border-color: #B94645 !important;
    color: #ffffff !important;
}

/* Variables CSS personalizadas para compatibilidad con AdminLTE */
:root {
    --primary: #960E53;
    --success: #237469;
    --warning: #DC7F37;
    --danger: #9B2F3E;
    --info: #217ABF;
    --secondary: #B94645;
    --dark: #333333;
    --light: #999999;
}

/* Clases semánticas adicionales para facilitar su uso */
.btn-agregar {
    background-color: #237469 !important;
    border-color: #237469 !important;
    color: #ffffff !important;
}

.btn-agregar:hover,
.btn-agregar:focus,
.btn-agregar:active {
    background-color: #1c5d58 !important;
    border-color: #1c5d58 !important;
    color: #ffffff !important;
}

.btn-editar {
    background-color: #DC7F37 !important;
    border-color: #DC7F37 !important;
    color: #ffffff !important;
}

.btn-editar:hover,
.btn-editar:focus,
.btn-editar:active {
    background-color: #c6722f !important;
    border-color: #c6722f !important;
    color: #ffffff !important;
}

.btn-eliminar {
    background-color: #9B2F3E !important;
    border-color: #9B2F3E !important;
    color: #ffffff !important;
}

.btn-eliminar:hover,
.btn-eliminar:focus,
.btn-eliminar:active {
    background-color: #842835 !important;
    border-color: #842835 !important;
    color: #ffffff !important;
}

.btn-visualizar {
    background-color: #217ABF !important;
    border-color: #217ABF !important;
    color: #ffffff !important;
}

.btn-visualizar:hover,
.btn-visualizar:focus,
.btn-visualizar:active {
    background-color: #1c6aa3 !important;
    border-color: #1c6aa3 !important;
    color: #ffffff !important;
}

.btn-siguiente {
    background-color: #333333 !important;
    border-color: #333333 !important;
    color: #ffffff !important;
}

.btn-siguiente:hover,
.btn-siguiente:focus,
.btn-siguiente:active {
    background-color: #2b2b2b !important;
    border-color: #2b2b2b !important;
    color: #ffffff !important;
}

.btn-regresar {
    background-color: #999999 !important;
    border-color: #999999 !important;
    color: #ffffff !important;
}

.btn-regresar:hover,
.btn-regresar:focus,
.btn-regresar:active {
    background-color: #8a8a8a !important;
    border-color: #8a8a8a !important;
    color: #ffffff !important;
}

/* === Fondo personalizado para Home/Index === */
/* Aplicar fondo #B94645 a la página de inicio */
body.hold-transition .wrapper {
    background-color: #B94645 !important;
}

/* Fondo específico para el content-wrapper de Home/Index */
.content-wrapper.home-index {
    background-color: #B94645 !important;
}

/* Fondo base blanco para todas las páginas */
.content-wrapper {
    background-color: #ffffff !important;
}

/* Asegurar que el contenido principal también tenga el fondo blanco */
.content-wrapper .content {
    background-color: transparent !important;
}

/* Card con fondo blanco pero card-body con color específico */
.content-wrapper .card {
    background-color: #ffffff !important;
    border: 1px solid rgba(0,0,0,0.125) !important;
}

/* Card body con color #410324 */
.content-wrapper .card .card-body {
    background-color: #410324 !important;
    color: #ffffff !important;
}

/* Asegurar legibilidad en card headers */
.content-wrapper .card .card-header {
    background-color: #ffffff !important;
    color: #000000 !important;
    border-bottom: 1px solid rgba(0,0,0,0.125) !important;
}

.content-wrapper .card .card-title {
    color: #000000 !important;
}

/* === Menú principal personalizado === */
/* Navbar principal */
.main-header.navbar {
    background-color: #410324 !important;
    border-bottom: 1px solid #2a0217 !important;
}

/* Links del menú principal */
.main-header.navbar .nav-link {
    color: #ffffff !important;
}

.main-header.navbar .nav-link:hover,
.main-header.navbar .nav-link:focus {
    color: #f8f9fa !important;
    background-color: rgba(255, 255, 255, 0.1) !important;
}

/* Enlaces activos */
.main-header.navbar .nav-link.active {
    color: #ffffff !important;
    background-color: rgba(255, 255, 255, 0.2) !important;
}

/* Dropdown toggle */
.main-header.navbar .dropdown-toggle::after {
    border-top-color: #ffffff !important;
}

/* Menús desplegables */
.main-header.navbar .dropdown-menu {
    background-color: #410324 !important;
    border: 1px solid #2a0217 !important;
}

.main-header.navbar .dropdown-item {
    color: #ffffff !important;
}

.main-header.navbar .dropdown-item:hover,
.main-header.navbar .dropdown-item:focus {
    background-color: rgba(255, 255, 255, 0.1) !important;
    color: #ffffff !important;
}

/* Submenu items */
.main-header.navbar .dropdown-submenu .dropdown-menu {
    background-color: #410324 !important;
    border: 1px solid #2a0217 !important;
}

.main-header.navbar .dropdown-submenu .dropdown-item {
    color: #ffffff !important;
}

.main-header.navbar .dropdown-submenu .dropdown-item:hover,
.main-header.navbar .dropdown-submenu .dropdown-item:focus {
    background-color: rgba(255, 255, 255, 0.1) !important;
    color: #ffffff !important;
}

/* Dividers en los menús */
.main-header.navbar .dropdown-divider {
    border-top: 1px solid #5a1a3a !important;
}

/* Navbar toggler para móviles */
.main-header.navbar .navbar-toggler {
    border-color: rgba(255, 255, 255, 0.3) !important;
}

.main-header.navbar .navbar-toggler-icon {
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3e%3cpath stroke='rgba%28255, 255, 255, 0.8%29' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' d='m4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e") !important;
}

/* Iconos del menú */
.main-header.navbar .nav-icon {
    color: #ffffff !important;
}

/* Text items en dropdown */
.main-header.navbar .dropdown-item-text {
    color: #f8f9fa !important;
}

/* Footer items en dropdown */
.main-header.navbar .dropdown-footer {
    color: #ffffff !important;
    background-color: rgba(255, 255, 255, 0.05) !important;
}

.main-header.navbar .dropdown-footer:hover {
    background-color: rgba(255, 255, 255, 0.1) !important;
    color: #ffffff !important;
}

/* === Footer personalizado === */
/* Footer principal */
.main-footer {
    background-color: #410324 !important;
    color: #ffffff !important;
    border-top: 1px solid #2a0217 !important;
}

/* Enlaces en el footer */
.main-footer a {
    color: #ffffff !important;
}

.main-footer a:hover {
    color: #f8f9fa !important;
    text-decoration: underline !important;
}

/* === Logos en el Navbar === */
/* Contenedor de logos */
.navbar-brand-container {
    display: flex;
    align-items: center;
    gap: 15px;
    height: 50px;
}

/* Logo CRESON */
.creson-logo {
    height: 45px;
    width: auto;
    opacity: 0.9;
    transition: opacity 0.3s ease;
}

.creson-logo:hover {
    opacity: 1;
}

/* Logo SID */
.sid-logo {
    height: 40px;
    width: auto;
    opacity: 0.8;
    transition: opacity 0.3s ease;
}

.sid-logo:hover {
    opacity: 1;
}

/* Responsive para móviles */
@media (max-width: 768px) {
    .navbar-brand-container {
        gap: 10px;
    }

    .creson-logo {
        height: 35px;
    }

    .sid-logo {
        height: 30px;
    }
}

/* Separador visual opcional entre logos */
.navbar-brand-container::after {
    content: "|";
    color: rgba(255, 255, 255, 0.5);
    font-size: 24px;
    margin: 0 5px;
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
}