html {
    font-size: 14px;
}

@media (min-width: 768px) {
    html {
        font-size: 16px;
    }
}

html {
    position: relative;
    min-height: 100%;
}

body {
    margin-bottom: 60px;
}

/*<!-- Va aquí? -->*/
#login-bg {
    background-image: url('/img/logo.png');
    background-size: 100% 100%;
    color: white;
    padding: 20px;
    background-size: cover;
}

.grp-navbar {
    min-height: 34px;
}

.grp-title-section {
    font-size: 18px;
    color: #4682b4;
    /*background: linear-gradient(135deg, #177dff, #85c1ff) !important;*/
}

.tracking-in-contract {
    animation: tracking-in-contract 0.8s linear both
}

@keyframes tracking-in-contract {
    0% {
        letter-spacing: .6em;
        opacity: 0
    }

    40% {
        opacity: .6
    }

    100% {
        letter-spacing: normal;
        opacity: 1
    }
}


.rotate-vertical-center {
    animation: rotate-vertical-center 1.6s
}

@keyframes rotate-vertical-center {
    0% {
        transform: rotateY(0)
    }

    100% {
        transform: rotateY(360deg)
    }
}

.grp-title-section-content {
    margin: 10px 20px 10px 45px;
}

.grp-title-top {
    text-align: center;
    font-size: 35px;
}

.grp-title-mid {
    font-size: 40px;
}

.grp-title-explanation {
    font-size: 17px;
}


/* Estilo para todos los labels */
label {
    font-weight: bold;
}

/*color sub-menu*/
.nav-item a:hover {
    text-decoration: none !important;
    color: #0d6efd !important;
}


/* Estilo para todos los labels  tipo Date */
input[type="date"] {
    width: 100%; /* Ajusta el ancho según sea necesario */
    padding: 0.375rem 0.75rem; /* Ajusta el relleno según sea necesario */
    font-size: 1rem; /* Ajusta el tamaño de fuente según sea necesario */
    line-height: 1.1; /* Ajusta la altura de línea según sea necesario */
    color: #495057; /* Ajusta el color de texto según sea necesario */
    background-color: #fff; /* Ajusta el color de fondo según sea necesario */
    background-clip: padding-box;
    border: 1px solid #ced4da; /* Ajusta el borde según sea necesario */
    border-radius: 0.25rem; /* Ajusta el radio de borde según sea necesario */
    transition: border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
}


/* Configuración para la info general de datatables */
.dataTables_paginate .paginate_button {
    margin: 0 5px; /* Agrega un margen horizontal de 5px entre cada botón */
}

/* Estilo para los encabezados de la tabla con negritas y línea de borde inferior */
#verDescargarTable th {
    font-weight: bold; /* Texto en negrita */
    border-top: 1px solid #000; /* Línea de borde superior negra */
    border-bottom: 1px solid #000; /* Línea de borde inferior negra */
}

/* Estilo para filas pares */
#verDescargarTable tbody tr:nth-child(even) {
    background-color: #f5f5f5; /* Fila gris */
}

/* Estilo para filas impares */
#verDescargarTable tbody tr:nth-child(odd) {
    background-color: #ffffff; /* Fila blanca */
}

/* Estilo cuando el mouse está sobre una fila */
#verDescargarTable tbody tr:hover {
    background-color: #f5f5f5; /* Gris claro */
    font-weight: bold; /* Texto en negrita */
    color: inherit; /* Mantiene el color original del texto */   
}




/* Estilo para los encabezados de la tabla */
#verComplementoTable th {
    font-weight: bold; /* Texto en negrita */
    border-top: 1px solid #000; /* Línea de borde superior negra */
    border-bottom: 1px solid #000; /* Línea de borde inferior negra */
}

/* Estilo para filas pares */
#verComplementoTable tbody tr:nth-child(even) {
    background-color: #f5f5f5; /* Fila gris */
}

/* Estilo para filas impares */
#verComplementoTable tbody tr:nth-child(odd) {
    background-color: #ffffff; /* Fila blanca */
}

/* Estilo cuando el mouse está sobre una fila */
#verComplementoTable tbody tr:hover {
    background-color: #f5f5f5; /* Gris claro */
    font-weight: bold; /* Texto en negrita */
    color: inherit; /* Mantiene el color original del texto */
}




/* Estilo para los encabezados de la tabla */
#seguimientoPagoTable th {
    font-weight: bold; /* Texto en negrita */
    border-top: 1px solid #000; /* Línea de borde superior negra */
    border-bottom: 1px solid #000; /* Línea de borde inferior negra */
}

/* Estilo para filas pares */
#seguimientoPagoTable tbody tr:nth-child(even) {
    background-color: #f5f5f5; /* Fila gris */
}

/* Estilo para filas impares */
#seguimientoPagoTable tbody tr:nth-child(odd) {
    background-color: #ffffff; /* Fila blanca */
}

/* Estilo cuando el mouse está sobre una fila */
#seguimientoPagoTable tbody tr:hover {
    background-color: #f5f5f5; /* Gris claro */
    font-weight: bold; /* Texto en negrita */
    color: inherit; /* Mantiene el color original del texto */
}



/* Estilo para los encabezados de la tabla */
#miTablaProveedores th {
    background-color: #36a3f7; /* Color de fondo azul para los encabezados */
    color: white; /* Color de texto blanco para los encabezados */
}

/* Estilo para filas pares */
#miTablaProveedores tbody tr:nth-child(even) {
    background-color: #f5f5f5; /* Fila gris */
}

/* Estilo para filas impares */
#miTablaProveedores tbody tr:nth-child(odd) {
    background-color: #ffffff; /* Fila blanca */
}

/* Estilo cuando el mouse está sobre una fila */
#miTablaProveedores tbody tr:hover {
    background-color: #0094ff; /* Fondo azul al pasar el mouse */
}



/* Estilo para los encabezados de la tabla */
#miTablaDatosFiscales th {
    background-color: #36a3f7; /* Color de fondo azul para los encabezados */
    color: white; /* Color de texto blanco para los encabezados */
}

/* Estilo para filas pares */
#miTablaDatosFiscales tbody tr:nth-child(even) {
    background-color: #f5f5f5; /* Fila gris */
}

/* Estilo para filas impares */
#miTablaDatosFiscales tbody tr:nth-child(odd) {
    background-color: #ffffff; /* Fila blanca */
}

/* Estilo cuando el mouse está sobre una fila */
#miTablaDatosFiscales tbody tr:hover {
    background-color: #0094ff; /* Fondo azul al pasar el mouse */
}



/* Estilo para Razón Social */
.razon-social-cell,
.email-cell,
.regimen-fiscal-cell {
    display: inline-block;
    max-width: 150px; /* Limitar ancho */
    white-space: nowrap; /* Evitar que el texto se divida en líneas */
    overflow: hidden; /* Ocultar el texto que se excede del ancho */
    text-overflow: ellipsis; /* Mostrar puntos suspensivos */
    cursor: pointer; /* Cambiar cursor al pasar el mouse */
}

    /* Tooltip en hover */
    .razon-social-cell:hover,
    .email-cell:hover,
    .regimen-fiscal-cell:hover {
        overflow: visible; /* Mostrar texto completo */
        white-space: normal; /* Permitir múltiples líneas */
        position: absolute; /* Flotante */
        background: #fff; /* Fondo blanco */
        z-index: 1000; /* Encima de otros elementos */
        padding: 5px; /* Espaciado */
        border: 1px solid #ccc; /* Borde */
        box-shadow: 0 2px 5px rgba(0, 0, 0, 0.2); /* Sombra */
    }

/* Estilos para los iconos de editar y eliminar */
td a {
    margin: 0 10px;
    text-decoration: none;
    font-size: 18px;
    color: #007bff; /* Color para los iconos */
}

    td a:hover {
        color: #0056b3; /* Cambiar color al pasar el ratón */
    }

.edit-icon i {
    color: green; /* Color verde para el icono de editar */
}

.delete-icon i {
    color: red; /* Color rojo para el icono de eliminar */
}

/* Estilo para centrar los iconos */
td {
    text-align: center;
}

/* Estilos normales sobre los botones */
.btn-primary {
    transition: all 0.3s ease;
}

    /* Estilo cuando pasas el mouse sobre los botones */
    .btn-primary:hover {
        transform: scale(1.4); /* Hace el botón un 10% más grande */
        background-color: green; /* Cambia el color de fondo */
        color: black; /* Cambia el color del texto */
        cursor: pointer; /* Cambia el cursor a una mano */
    }

/* Estilos normales del icono search*/
.icono-lupa {
    transition: all 0.3s ease;
}

    /* Estilo cuando pasas el mouse sobre el icono search */
    .icono-lupa:hover {
        transform: scale(1.8); /* Hace que el icono sea un 20% más grande */
        color: black; /* Cambia el color del icono al pasar el mouse sobre él */
        cursor: pointer; /* Cambia el cursor a una mano */
    }


    /* Estilos para los botones de sweet alert */
.btn-success-border {
    color: #35cd3a; /* Verde bootstrap */
    border: 2px solid #35cd3a;
    background-color: transparent;
    padding: 0.5rem 1rem;
    font-weight: 500;
    border-radius: 0.375rem;
    transition: all 0.2s ease-in-out;
}

    .btn-success-border:hover {
        background-color: #35cd3a;
        color: white;
    }

.btn-cancel-border {
    color: #6c757d; /* Gris bootstrap */
    border: 2px solid #6c757d;
    background-color: transparent;
    padding: 0.5rem 1rem;
    font-weight: 500;
    border-radius: 0.375rem;
    transition: all 0.2s ease-in-out;
}

    .btn-cancel-border:hover {
        background-color: #6c757d;
        color: white;
    }

.btn-info-border {
    color: #0dcaf0; /* Azul info bootstrap */
    border: 2px solid #0dcaf0;
    background-color: transparent;
    padding: 0.5rem 1rem;
    font-weight: 500;
    border-radius: 0.375rem;
    transition: all 0.2s ease-in-out;
}

    .btn-info-border:hover {
        background-color: #0dcaf0;
        color: white;
    }
