/*-------------------------------
    Switch entre temas CSS
    -------------------------------*/
#theme-switcher {
    position: fixed;
    bottom: 25px;
    right: 25px;
    z-index: 9999;
    background-color: #007cbb;
    color: white;
    border: none;
    border-radius: 50%;
    width: 55px;
    height: 55px;
    font-size: 24px;
    cursor: pointer;
    box-shadow: 0 4px 10px rgba(0, 0, 0, 0.3);
    transition: background-color 0.3s ease;
}

    #theme-switcher:hover {
        background-color: #194f90;
    }


#theme-menu {
    position: fixed;
    bottom: 90px;
    right: 25px;
    background: #ffffff;
    border: 1px solid #c6c6c6;
    border-radius: 10px;
    box-shadow: 0 4px 12px rgba(0,0,0,0.15);
    display: none;
    flex-direction: column;
    overflow: hidden;
    width: 180px;
    font-family: 'Lato', sans-serif;
}

    #theme-menu button {
        background: none;
        border: none;
        text-align: left;
        padding: 10px 15px;
        cursor: pointer;
        font-size: 14px;
        color: #194f90;
        transition: background 0.2s ease;
    }

        #theme-menu button:hover {
            background: #f1f6fc;
            color: #007cbb;
        }

        #theme-menu button.active {
            background: #007cbb;
            color: white;
        }



/* -----------------------------
   TEMA 1
   ----------------------------- */
body.theme-opcion1 {
    background-color: #f9f9f9;
    color: #194f90;
    font-family: 'Lato', sans-serif;
}

    body.theme-opcion1 h1, body.theme-opcion1 h3,
    body.theme-opcion1 h4, body.theme-opcion1 h5, body.theme-opcion1 h6 {
        color: #007cbb;
    }

    body.theme-opcion1 h2 {
        color: white;
    }

    body.theme-opcion1 .btn-primary {
        background-color: #007cbb;
        border-color: #194f90;
        color: #fff;
    }

        body.theme-opcion1 .btn-primary:hover {
            background-color: #194f90;
        }

    body.theme-opcion1 .btn-secondary {
        background-color: #3cb4e5;
        border-color: #007cbb;
        color: #fff;
    }

    body.theme-opcion1 table {
        border-color: #c6c6c6;
    }

    body.theme-opcion1 thead {
        background-color: #194f90;
        color: #fff;
    }

    body.theme-opcion1 tbody tr:nth-child(even) {
        background-color: #f2f6fa;
    }

    body.theme-opcion1 tbody tr:hover {
        background-color: rgba(0,124,187,0.1);
    }

    body.theme-opcion1 footer {
        background: #194f90;
        color: #ffffff;
    }

        body.theme-opcion1 footer a:hover {
            color: #3cb4e5;
        }

    body.theme-opcion1 .navbar-inverse {
        background-color: #194f90;
        border-color: #080808;
    }

        body.theme-opcion1 .navbar-inverse .navbar-nav > li > a {
            color: #c6c6c6;
        }

    body.theme-opcion1 .alert-info {
        color: #fff;
        background-color: #3cb4e5;
        border-color: #3cb4e5;
    }

    body.theme-opcion1 .btn-info {
        color: #ffffff;
        background-color: #3cb4e5;
        border-color: #007cbb;
    }

    body.theme-opcion1 .bg-primary {
        background-color: white; /* azul principal del tema 1 */
        color: #ffffff;
    }

    body.theme-opcion1 .btn-danger {
        color: #ffffff;
        background-color: #007cbb; /* azul principal */
        border-color: #194f90; /* azul oscuro */
    }

        body.theme-opcion1 .btn-danger:hover,
        body.theme-opcion1 .btn-danger:focus {
            background-color: #194f90; /* más oscuro al pasar mouse */
            border-color: #007cbb;
        }

        body.theme-opcion1 .btn-danger:active,
        body.theme-opcion1 .btn-danger.active,
        body.theme-opcion1 .open .dropdown-toggle.btn-danger {
            background-color: #3cb4e5; /* azul secundario al presionar */
            border-color: #007cbb;
        }

    body.theme-opcion1 .modal-footer {
        padding: 19px 20px 20px;
        margin-top: 15px;
        text-align: right;
        border-top: 1px solid #c6c6c6; /* tono neutro que combina con tema 1 */
    }

    body.theme-opcion1 .alert a {
        color: #901944;
        text-decoration: none;
    }

    body.theme-opcion1 .datepicker thead {
        background-color: white;
        color: black;
        font-size: 12px;
    }

    body.theme-opcion1 .uib-daypicker thead {
        background-color: white;
        color: black;
        font-size: inherit;
    }

/* -----------------------------
   TEMA 2
   ----------------------------- */
body.theme-opcion2 {
    background-color: #ffffff;
    color: #194f90;
    font-family: 'Lato', sans-serif;
}

    body.theme-opcion2 h1, body.theme-opcion2 h2 {
        color: #007cbb;
    }

    body.theme-opcion2 .btn-primary {
        background-color: #3cb4e5;
        border-color: #007cbb;
        color: #fff;
    }

        body.theme-opcion2 .btn-primary:hover {
            background-color: #007cbb;
        }

    body.theme-opcion2 .btn-secondary {
        background-color: #c6c6c6;
        border-color: #3cb4e5;
        color: #194f90;
    }

    body.theme-opcion2 table thead {
        background-color: #007cbb;
        color: #fff;
    }

    body.theme-opcion2 tbody tr:hover {
        background-color: rgba(0,124,187,0.08);
    }

    body.theme-opcion2 footer {
        background-color: #706f6f;
        color: #ffffff;
    }

        body.theme-opcion2 footer a:hover {
            color: #3cb4e5;
        }

    body.theme-opcion2 .navbar-inverse {
        background-color: #706f6f;
        border-color: #080808;
    }

        body.theme-opcion2 .navbar-inverse .navbar-nav > li > a {
            color: #fff;
        }

    body.theme-opcion2 .alert-info {
        color: #fff;
        background-color: #c6c6c6;
        border-color: #c6c6c6;
    }

    body.theme-opcion2 .btn-info {
        color: #ffffff;
        background-color: #5bc0de;
        border-color: #46b8da;
    }

    body.theme-opcion2 .btn-info {
        color: #ffffff;
        background-color: #007cbb;
        border-color: #194f90;
    }

    body.theme-opcion2 .bg-primary {
        background-color: #3cb4e5; /* azul secundario del tema 2 */
        color: #ffffff;
    }

    body.theme-opcion2 .btn-danger {
        color: #ffffff;
        background-color: #3cb4e5; /* azul secundario */
        border-color: #007cbb;
    }

        body.theme-opcion2 .btn-danger:hover,
        body.theme-opcion2 .btn-danger:focus {
            background-color: #007cbb; /* azul principal */
            border-color: #194f90;
        }

        body.theme-opcion2 .btn-danger:active,
        body.theme-opcion2 .btn-danger.active,
        body.theme-opcion2 .open .dropdown-toggle.btn-danger {
            background-color: #706f6f; /* gris oscuro */
            border-color: #c6c6c6;
        }

    body.theme-opcion2 .modal-footer {
        padding: 19px 20px 20px;
        margin-top: 15px;
        text-align: right;
        border-top: 1px solid #706f6f; /* tono neutro de footer */
    }


/* -----------------------------
   TEMA 3 
   ----------------------------- */
body.theme-opcion3 {
    background-color: #ffffff;
    color: #333333;
    font-family: 'Lato', sans-serif;
}

    body.theme-opcion3 h1, body.theme-opcion3 h2 {
        color: #194f90;
    }

    body.theme-opcion3 .btn-primary {
        background-color: #194f90;
        border-color: #194f90;
        color: #fff;
    }

    body.theme-opcion3 .btn-secondary {
        background-color: #c6c6c6;
        border-color: #706f6f;
        color: #194f90;
    }

    body.theme-opcion3 table thead {
        background-color: #c6c6c6;
        color: #194f90;
    }

    body.theme-opcion3 tbody tr:nth-child(even) {
        background-color: #f9f9f9;
    }

    body.theme-opcion3 footer {
        background-color: #706f6f;
        color: #fff;
    }

        body.theme-opcion3 footer a:hover {
            color: #3cb4e5;
        }

    body.theme-opcion3 .navbar-inverse {
        background-color: #706f6f;
        border-color: #080808;
    }

        body.theme-opcion3 .navbar-inverse .navbar-nav > li > a {
            color: #194f90;
        }

    body.theme-opcion3 .btn-info {
        color: #ffffff;
        background-color: #5bc0de;
        border-color: #46b8da;
    }

    body.theme-opcion3 .btn-info {
        color: #ffffff;
        background-color: #194f90;
        border-color: #007cbb;
    }

    body.theme-opcion3 .bg-primary {
        background-color: #194f90; /* azul principal del tema 3 */
        color: #ffffff;
    }

    body.theme-opcion3 .btn-danger {
        color: #ffffff;
        background-color: #194f90; /* azul oscuro */
        border-color: #007cbb;
    }

        body.theme-opcion3 .btn-danger:hover,
        body.theme-opcion3 .btn-danger:focus {
            background-color: #007cbb; /* azul principal */
            border-color: #3cb4e5;
        }

        body.theme-opcion3 .btn-danger:active,
        body.theme-opcion3 .btn-danger.active,
        body.theme-opcion3 .open .dropdown-toggle.btn-danger {
            background-color: #c6c6c6; /* gris claro */
            border-color: #706f6f;
        }

    body.theme-opcion3 .modal-footer {
        padding: 19px 20px 20px;
        margin-top: 15px;
        text-align: right;
        border-top: 1px solid #c6c6c6; /* tono neutro de tabla/tema */
    }


/* -----------------------------
   TEMA 4
   ----------------------------- */
body.theme-opcion4 {
    background-color: #f5f8fa;
    color: #194f90;
    font-family: 'Lato', sans-serif;
}

    body.theme-opcion4 h1, body.theme-opcion4 h2, body.theme-opcion4 h3 {
        color: #194f90;
    }

    body.theme-opcion4 .btn-primary {
        background: linear-gradient(90deg, #194f90, #007cbb);
        border: none;
        color: #ffffff;
    }

        body.theme-opcion4 .btn-primary:hover {
            background: #3cb4e5;
        }

    body.theme-opcion4 .btn-secondary {
        background-color: #3cb4e5;
        border-color: #007cbb;
        color: #ffffff;
    }

    body.theme-opcion4 table thead {
        background-color: #194f90;
        color: #ffffff;
    }

    body.theme-opcion4 tbody tr:hover {
        background-color: rgba(60,180,229,0.15);
    }

    body.theme-opcion4 footer {
        background: linear-gradient(90deg, #194f90, #007cbb);
        color: #ffffff;
    }

        body.theme-opcion4 footer a:hover {
            color: #3cb4e5;
        }

    body.theme-opcion4 .navbar-inverse {
        background: linear-gradient(90deg, #194f90, #007cbb);
        border-color: #080808;
    }

        body.theme-opcion4 .navbar-inverse .navbar-nav > li > a {
            color: #fff;
        }

    body.theme-opcion4 .btn-info {
        color: #ffffff;
        background-color: #007cbb;
        border-color: #194f90;
    }

    body.theme-opcion4 .bg-primary {
        background-color: #194f90;
        color: #ffffff;
    }


    body.theme-opcion4 .btn-danger {
        color: #ffffff;
        background-color: #d2322d;
        border-color: #a52828;
    }

    body.theme-opcion4 .btn-danger {
        color: #ffffff;
        background-color: #007cbb; /* azul principal */
        border-color: #194f90;
    }

        body.theme-opcion4 .btn-danger:hover,
        body.theme-opcion4 .btn-danger:focus {
            background-color: #3cb4e5; /* azul secundario */
            border-color: #007cbb;
        }

        body.theme-opcion4 .btn-danger:active,
        body.theme-opcion4 .btn-danger.active,
        body.theme-opcion4 .open .dropdown-toggle.btn-danger {
            background-color: #706f6f; /* gris oscuro */
            border-color: #c6c6c6;
        }

    body.theme-opcion4 .modal-footer {
        padding: 19px 20px 20px;
        margin-top: 15px;
        text-align: right;
        border-top: 1px solid #3cb4e5; /* combinando con el degradado azul */
    }




/*********************************/

.label-custom {
    display: inline-block;
    margin-bottom: 5px;
    font-weight: bold;
}

.inline-force {
    display: inline-block;
}


table {
    /*font-size: 0.80rem;*/ /* 75% del tamaño normal */
}

    /* Ajustar las celdas para que no crezcan demasiado */
    table td, table th {
        white-space: normal; /* permite que el texto haga wrap */
        word-break: break-word; /* rompe palabras largas si es necesario */
        padding: 4px 6px; /* reduce padding para caber más */
    }

    /* Opcional: reducir encabezados un poco */
    table thead th {
        /*font-size: 0.9rem;*/
    }

/* Para celdas de comentarios más largas */
td.comment-cell {
    max-width: 150px; /* ajusta según necesidad */
    overflow: hidden;
}

/*****************
 *  Tablas responsivas   
 ****************/

.custom-table-responsive-compact {
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    border-radius: 0.5rem;
    margin-bottom: 1rem;
    box-shadow: 0 2px 6px rgba(0,0,0,0.05);
}

    /* Tabla compacta */
    .custom-table-responsive-compact .table {
        min-width: 800px; /* evita colapso de muchas columnas */
        font-size: 0.75rem; /* más compacta */
        white-space: nowrap; /* evita que se rompan celdas */
    }

        /* Cabecera sticky */
        .custom-table-responsive-compact .table thead th {
            background-color: #343a40;
            color: #fff;
            position: sticky;
            top: 0;
            z-index: 2;
            text-align: center;
        }

    /* Bordes y hover */
    .custom-table-responsive-compact .table-bordered th,
    .custom-table-responsive-compact .table-bordered td {
        border: 1px solid #dee2e6;
    }

    .custom-table-responsive-compact .table-hover tbody tr:hover {
        background-color: #f1f1f1;
    }

    /* Scroll horizontal con barra elegante */
    .custom-table-responsive-compact::-webkit-scrollbar {
        height: 6px;
    }

    .custom-table-responsive-compact::-webkit-scrollbar-thumb {
        background-color: rgba(0,0,0,0.2);
        border-radius: 3px;
    }

    .custom-table-responsive-compact::-webkit-scrollbar-track {
        background-color: rgba(0,0,0,0.05);
        border-radius: 3px;
    }

    /* Alineación centrada para celdas */
    .custom-table-responsive-compact td,
    .custom-table-responsive-compact th {
        vertical-align: middle;
        padding: 0.3rem 0.5rem;
    }