/*****MAYUS********/
.form-control{
    text-transform: uppercase;
    font-size:10pt;
    width: 100%;
}
span.error{
    font-size:8pt;
    color:rgb(239, 32, 32);
}

.h-detalles{
    height: 400px;
}

/*****tablas******/
.tb-producto th{
    padding: 1px 4px;
    font-size:9pt
}

.tb-producto td{
    padding: 4px 6px;
    font-size:11pt
}

.ocultar{
    display: none;
}

.fs-t{
    font-size: 18pt;
    font-weight: 800;
}


.table-header {
    background-color: #4539c743;
    color: white;
}


.text-bold {
    font-family: 'Montserrat', sans-serif; /* Cambia la fuente aquí */
    font-weight: 1000; /* Peso de fuente más grueso */
    font-size: 2.0rem; /* Tamaño de fuente más grande */
    text-shadow: 2px 2px 5px rgba(255, 255, 255, 0.2); /* Sombra sutil */
    letter-spacing: 1px; /* Espaciado entre letras */
    text-transform: uppercase; /* Transforma el texto a mayúsculas */
    border-bottom: 2px solid #001eff; /* Línea inferior para destacar */
    padding-bottom: 5px; /* Espaciado inferior */
}

/* Estilo de botones mejorado */
.btn {
    font-size: 1.2rem;
    padding: 20px;
    border-radius: 12px;
    transition: transform 0.3s ease, box-shadow 0.3s ease;
}

.btn i {
    color: white;
}

/* .btn:hover {
    transform: translateY(-10px);
    box-shadow: 0px 8px 15px rgb(0, 0, 0);
} */

/* Footer negro */
footer {
    background-color: #000;
    color: white;
    position: fixed;
    bottom: 0;
    left: 0;
    right: 0;
    text-align: center;
}

.btn-custom {
    background-color: white; /* Color de fondo blanco */
    color: black; /* Color del texto */
    border: 1px solid #ff0000; /* Color del borde (puedes ajustarlo) */
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2); /* Sombra del borde */
}

.btn-custom:hover {
    background-color: #f8f9fa; /* Color de fondo al pasar el ratón */
    color: black; /* Color del texto al pasar el ratón */
}

.navbar-brand h4 {
    margin: 20  15px; /* Ajusta el margen del título */
}

.navbar-nav .nav-link {
    margin-right: 20px; /* Espacio entre los elementos del menú */
}

/* En tu archivo CSS */
.btn-medium {
    padding: 0.500rem 0.75rem;  /* Ajustar el padding */
    font-size: 16px;  /* Tamaño de fuente intermedio */
}

.dataTables_wrapper .dataTables_paginate .paginate_button {
    color: #949494; /* Cambia el color a negro */
}

.dataTables_wrapper .dataTables_length label,
.dataTables_wrapper .dataTables_info,
.dataTables_wrapper .dataTables_filter label {
    color: #949494; /* Cambia el color a negro */
}

.dataTables_wrapper .dataTables_filter input {
    color: #949494; /* Cambia el color del texto del campo de búsqueda a negro */
}


@media (max-width: 768px) {
    .card {
      width: 100%;
    }
    .card-body {
      padding: 10px;
    }
  }

  .row {
    display: flex;
    flex-wrap: wrap;
  }
  
  .card {
    flex: 0 0 50%; /* ocupa la mitad del ancho */
    margin: 10px;
  }





  
 /* Estilos generales del sidebar */

/* Estilo para el contenedor del colapso */

.collapse-inner {
    background-color: #515151; /* Color de fondo más oscuro para el contenedor colapsable */
}

/* Cambia el color de texto de los elementos colapsables */
.collapse-item {
    color: #ffffff !important; /* Color blanco para el texto */
}

/* Efecto al pasar el mouse sobre los elementos colapsables */
.collapse-item:hover {
    background-color: #1b5e47 !important;/* Color gris oscuro al pasar el mouse */
    color: #000000; /* Mantiene el color blanco al pasar el mouse */
}

/* Estilos para el Footer (pie de pagina) */

footer {
    background-color: #000000;/* Color de fondo negro */
    color: white; /* Color del texto blanco para contraste */
    position: relative; /* Cambia a 'relative' si no deseas que sea sticky */
    padding: 20px 0; /* Espaciado interno */
    width: 100%; /* Ancho completo */
}


/* Estilos para el Topbar */
.bg-dark-custom {
    background: linear-gradient(140deg, #19191a, #19191a);
}

.dropdown-menu {
    background-color: black; /* Color negro oscuro para el fondo del menú */
    border: none; /* Elimina el borde para un aspecto más limpio */
}

.dropdown-item {
    color: rgb(255, 255, 255); /* Color blanco para el texto de los elementos del menú */
}

.dropdown-item:hover {
    background-color: #1b5e47; /* Color más claro al pasar el mouse por encima */
    color: white; /* Mantiene el color blanco al pasar el mouse */
}


/* Sidebar */


/* Estilos para el sidebar */
.sidebar {
    transition: all 0.3s ease; /* Transición suave para cambios */
    background-color: #19191a; /* Color negro para el sidebar */
    font-family: 'Poppins', sans-serif; /* Fuente Poppins */
}
.nav-item.active .nav-link {
    font-family: 'Poppins', sans-serif; /* Fuente Poppins */
    font-weight: 400; /* Quitar negrita */
}

.nav-item.active .nav-link span {
    font-weight: 400; /* Quitar negrita del texto "Inicio" */
}


.sidebar-brand-text {
    font-family: 'Quicksand', sans-serif; /* Tipo de letra Quicksand */
    font-size: 10px; /* Tamaño del texto */
    margin-left: 10px; /* Acercamiento al logo */
}

.sidebar-brand-icon {
    margin-right: 10px; /* Ajusta la proximidad del logo al texto */
}

.sidebar-brand img {
    width: 40px; /* Ancho de la imagen del logo */
    height: 40px; /* Alto de la imagen del logo */
}




/* Custom CSS for modal */
.modal-content {
    margin: auto; /* Center the modal */
}

.table {
    font-size: 1.2rem; /* Aumenta el tamaño de la fuente */
}

.table th, .table td {
    padding: 0.5rem; /* Aumenta el padding de las celdas */
}

.table th {
    text-align: center; /* Centra el texto en los encabezados */
}

.table td {
    text-align: center; /* Alinea el texto a la izquierda en las celdas */
}




.modal-lg {
    max-width: 100%; /* Ajusta el ancho máximo del modal */
}

.modal-body {
    padding: 2rem; /* Aumenta el padding del cuerpo del modal */
}

.modal-header {
    border-bottom: 2px solid #afafaf; /* Línea inferior en el encabezado */
}

.modal-footer {
    border-top: 1px solid #afafaf; /* Línea superior en el pie del modal */
}

.modal {
    overflow-y: auto; /* Permite el desplazamiento solo dentro del modal */
}
.modal-dialog {
        max-width: 800px; /* Ancho máximo del modal */
        width: 100%; /* Ancho del modal */
}



/* CSS DEL BOTOM DE INICIAR SECION LOGIN */

.btn-login {
    background-color: #1b5e47 !important; /* Color de fondo azul */
    color: white !important; /* Color del texto */
    border-radius: 5px !important; /* Bordes redondeados */
    padding: 10px 20px !important; /* Espaciado interno */
    font-family: 'Quicksand', sans-serif; /* Tipo de letra Quicksand */
    font-weight: 400; /* Quitar negrita */
    font-size: 1.1rem !important; /* Tamaño de fuente */
    transition: background-color 0.3s ease !important; /* Efecto suave */
}

.btn-login:hover {
    background-color: #066d2d !important; /* Color de fondo cuando se pasa el cursor */
    cursor: pointer !important; /* Cambia el cursor cuando pasa el ratón */
}

.btn-success {
    background-color: #1b5e47;
    border: none;
    color: white; /* Asegura que el texto sea visible */
}

.btn-success:hover {
    background-color: #023a1f; /* Un tono ligeramente más claro para el efecto hover */
    cursor: pointer; /* Cambia el cursor para indicar que es interactivo */
}


/* FIN CSS DEL BOTOM DE INICIAR SECION LOGIN */