/* Submenús dentro de dropdowns */
.dropdown-submenu {
    position: relative;
}

.dropdown-submenu > .dropdown-menu {
    top: 0;
    left: 100%;
    margin-top: -0.1rem;
    margin-left: 0.1rem;
    display: none;
    position: absolute;
}

.dropdown-submenu:hover > .dropdown-menu {
    display: block;
}

/*ENTORNO DE COLORES PARA SHEKAPAN*/
/*INPUT*/
/* Cambiar color de fondo y borde de todos los inputs */
input.form-control { /* Nuevos cambios */
    padding: 10px;
    border-radius: 8px;
    border: 1px solid #ccc;
    outline: none;
    transition: 0.3s;
}

/* Opcional: cambiar el color al hacer focus */
input.form-control:focus { /* Nuevos cambios */
    border-color: #e62331;
    box-shadow: 0 0 5px rgba(230,35,49,.5);
}

/* Nuevos selectores de clase */
/* Cambio de los bordes y agregación de sombras a los contenedores de elementos */
.container, .modal-content { /* Nuevo selector */
    background: #fff;
    padding: 25px;
    border-radius: 15px;
    box-shadow: 0 4px 12px rgba(0,0,0,0.1);
}

.container h2 { /* Nuevo selector */
    margin-bottom: 20px;
    color: #e62331;
    font-size: 2.3rem;
}

/* Estilos nuevos para los textos label */
.form-label { /* Nuevo selector */
    font-weight: bold;
    margin-bottom: 5px;
    color: #754c28;
}

/* Cambio de colores para los inputs que solo muestran los datos */
.form-control[disabled] { /* Nuevo selector */
    background-color: #f2e31c33;
    border: 1px solid #c2986b;
    cursor: not-allowed;
    color: #333;
    font-weight: 500;
}

.form-control[readonly] { /* Nuevo selector */
    background-color: #f2e31c33;
    border: 1px solid #c2986b;
    cursor: not-allowed;
    color: #333;
    font-weight: 500;
}

/* Cambio de forma y colores a los botones */
.btn { /* Nuevo selector */
    background: #e62331;
    color: white;
    padding: 12px;
    border: none;
    border-radius: 15px;
    font-size: 1rem;
    font-weight: bold;
    cursor: pointer;
    transition: background 0.3s;
    margin: 12px;
    outline: none !important;
    box-shadow: none !important;
}

.btn:hover { /* Nuevo selector */
    background: #c91e2b;
}

/* Cambios de colores para le etiqueta select */
select.form-control:focus { /* Nuevo selector */
    border-color: #e62331;
    box-shadow: 0 0 5px rgba(230,35,49,.5);
}

/*TABLAS*/
.text-secondary, h5[class="modal-title"] { /* Nuevo selector */
    margin-bottom: 15px;
    color: #754c28 !important;
    font-size: 1.8rem;
}

table { /* Nuevo selector */
    width: 100%;
    border-collapse: collapse;
    overflow: hidden;
    border-radius: 10px;
}

thead th { /* Nuevo Selector */
    background: #e62331 !important;
    color: white !important;
}

td[class="text-center fw-bold"] { /* Nuevo selector */
    background: white;
}

tfoot tr[class="table-info fw-bold"] td { /* Nuevo selector */
    background: #e62331 !important;
    color: white !important;
}

tfoot tr[class="table-info fw-bold"] td input { /* Nuevo selector */
    background: white !important;
}

textarea:focus { /* Nuevo selector */
    border-color: #e62331 !important;
    box-shadow: 0 0 5px rgba(230,35,49,0.5) !important;
}

/* Cabecera de la tabla */
#tablaDetalles thead {
    background-color: #996633;
    color: white; /* color del texto */
}

/* Filas del cuerpo */
#tablaDetalles tbody tr:nth-child(even) {
    background-color: #f2f2f2; /* gris claro para filas pares */
}

#tablaDetalles tbody tr:nth-child(odd) {
    background-color: #ffffff; /* blanco para filas impares */
}

/* Hover sobre filas */
#tablaDetalles tbody tr:hover {
    background-color: #c8e6c9; /* verde claro al pasar el mouse */
}

/* Bordes y alineación de las celdas */
#tablaDetalles th, #tablaDetalles td {
    border: 1px solid #996633;
    text-align: center;
    padding: 8px;
}

/*========= CAMBIOS PARA EL BOTÓN "ENVIAR PEDIDO" Y FORMULARIO "INGRESAR DATOS DEL CLIENTE" =========*/
button[class="btn btn-primary btn-sm"] { /*Nuevo selector*/
    background-color: #e62331 !important;
    border-color: #e62331 !important;
    color: #fff !important;
    outline: none !important;
    box-shadow: none !important;
}

button[class="btn btn-primary btn-sm"]:hover, button[class="btn btn-primary btn-sm"]:active { /*Nuevo selector*/
    background: #c91e2b !important;
}

.btn-info:hover {
    color: #fff !important;
}

.input-group > button {
    margin-left: 12px !important;
    border-radius: 15px;
}

#btnBuscarNIT {
    background-color: #e62331;
    border-radius: 12px;
    color: #fff;
}

#btnBuscarNIT:hover {
    background-color: #c91e2b !important;
}

#btnIngresoCF:focus {
    background-color: #c91e2b !important;
    color: #fff;
}

#NITCliente {
    margin-top: 12px;
    height: 3rem;
    border-radius: 13px;
}

div[class="mb-3 p-3 rounded shadow-sm border bg-light"] {
    background-color: #f2e31c33 !important;
    border: 24px !important;
}

#btnEnviar {
    background-color: #e62331;
}

#btnEnviar:hover {
    background-color: #c91e2b !important;
}

div[class="row"] {
    margin: 12px auto;
}

.odd:hover, .even:hover {
    background-color: #f2e31c33 !important;
}

footer.footer {
    border-top: none !important;
}

footer .container {
    border-radius: 0px 0px 12px 12px !important;
    box-shadow: 0 4px 6px rgba(0,0,0,.10);
}

/*========= CAMBIOS PARA TABLA DE PRODUCTOS =========*/
h3[class="border-bottom pb-2 text-secondary"], ul[class="nav nav-tabs mb-3"] {
    border-bottom: 1px solid #e62331 !important;
}

button[class="nav-link active"] {
    border-color: #e62331 !important;
    border-bottom: none !important;
    background: #f2e31c33 !important;
    color: #754c28 !important;
    font-weight: 600;
}

button[class="nav-link"], button[aria-selected="false"] {
    color: #754c28 !important;
    font-weight: 400;
}

button[class="nav-link"]:hover, button[aria-selected="false"]:hover {
    border-color: #e62331 !important;
    box-shadow: 0 0 5px rgba(230,35,49,.5);
    border-bottom: none;
}

/*CARDS*/
.card {
    background: #fff;
    border-radius: 15px;
    overflow: hidden;
    box-shadow: 0 4px 12px rgba(0,0,0,0.05);
    display: flex;
    flex-direction: column;
    transition: transform 0.3s ease, box-shadow 0.3s ease;
}

.card:hover {
    transform: translateY(-2px);
    box-shadow: 0 8px 18px rgba(0,0,0,0.05);
}

.card img {
    background-color: #fff !important;
    border: 2px solid #f2e31c;
    border-radius: 13px;
}

.card-title {
    font-size: 1.1rem !important;
    font-weight: bold !important;
    color: #e62331 !important;
    margin-bottom: 10px;
}

/*========= CAMBIOS PARA EL MODULO DE RIFA =========*/
h3[class="text-center mb-4"] {
    margin-bottom: 20px;
    color: #e62331;
    font-size: 1.8rem;
}

#btnParticipar {
    background-color: #e62331 !important;
}

/*========= CAMBIOS EN EL TABLERO DE UBICACIONES =========*/
h4[class="card-title"], p[class="card-title"] {
    color: #f2e31c !important;
}