body {
    font-family: Arial, sans-serif;
    background-color: #f8f9fa;
}

h1 {
    color: #333;
}

header {
    border-bottom: 3px solid #333;
}

header img {
    height: 130px;
}

header h1 {
    color: #444;
}
.highlight {
    background-color: #ffffe0; /* Amarillo muy claro */
    padding: 10px; /* Espaciado interno para mejor visibilidad */
    border-radius: 5px; /* Bordes redondeados opcionales */
}
.navbar {
    justify-content: center !important;
    text-align: center;
}

.navbar-nav {
    justify-content: center;
}

.navbar-nav .nav-link {
    margin: 0 10px; /* Espaciado horizontal entre los enlaces */
    color: #333;
    text-transform: uppercase;
    font-weight: bold;
}

.navbar-nav .nav-link:hover {
    color: #28a745; /* Color de hover */
    text-decoration: underline;
}






/* Estilos de los botones con degradado */
.btn-predial {
    background: linear-gradient(135deg, #EA0277, #FCBF00);
    border: none;
    color: #fff;
}

.btn-contraloria {
    background: linear-gradient(135deg, #EB8506, #F2C203);
    border: none;
    color: #fff;
}

.btn-ddu {
    background: linear-gradient(135deg, #8BBB47, #0A8997);
    border: none;
    color: #fff;
}

.btn-proteccion-civil {
    background: linear-gradient(135deg, #80217D, #E868A4);
    border: none;
    color: #fff;
}

.btn-ecologia {
    background: linear-gradient(135deg, #07954F, #92C039);
    border: none;
    color: #fff;
}

.btn-catastro {
    background: linear-gradient(135deg, #F08455, #EB4F0E);
    border: none;
    color: #fff;
}

.btn-impresiones {
    background: linear-gradient(135deg, #505050, #707070); /* Tonos de grises */
    border: none;
    color: #fff; /* Texto blanco */
}



/* Hover en botones */
.btn-predial:hover, .btn-impresiones:hover, .btn-contraloria:hover, .btn-ddu:hover, .btn-proteccion-civil:hover, .btn-ecologia:hover, .btn-catastro:hover {
    background: linear-gradient(135deg, #1D1D1D, #BBB5B8);
}

/* Carrusel */
.carousel-inner img {
    max-width: 80%;
    height: auto;
}

/* Bordes redondeados en botones */
.btn-rounded-corners {
    border-radius: 15px;
    box-shadow: 4px 4px 8px rgba(0, 0, 0, 0.3);
}

/* Líneas de colores en header */
.linea-verde, .linea-roja, .linea-guinda {
    width: 100%;
    height: 4px;
    margin-bottom: 8px;
}

.linea-verde {
    background: linear-gradient(90deg, #28a745, #a3d4af);
}

.linea-roja {
    background: linear-gradient(90deg, #dc3545, #f8b0b5);
}

.linea-guinda {
    background: linear-gradient(90deg, #800000, #b56576);
}

/* Estilos de tablas */
.consulta-table {
    background-color: #f8f9fa;
    border-radius: 8px;
    overflow: hidden;
    margin-top: 20px;
}

.table {
    width: 100%;
    margin-bottom: 1rem;
    color: #212529;
}

.table-bordered {
    border: 2px solid #dee2e6;
}

.table thead th {
    background-color: #28a745; /* Color de encabezado */
    color: #fff;
    font-weight: bold;
    text-align: center;
}

.table-bordered th, .table-bordered td {
    border: 1px solid #dee2e6;
    padding: 10px;
    vertical-align: middle;
    text-align: center;
}

.table-hover tbody tr:hover {
    background-color: #e9f7ef; /* Efecto hover en filas */
}

/* Estilo de enlaces en tablas */
.buttontable-submit {
    display: block;
    width: 100%;
    padding: 10px;
    text-align: center;
    color: #fff;
    background-color:cadetblue;
    border-radius: 4px;
    text-decoration: none;
    transition: background-color 0.3s ease;
}

.buttontable-submit:hover {
    background-color:cornflowerblue;
}

/* Estilos del modal */
.modal-content {
    border-radius: 8px;
    padding: 20px;
}

.modal-header {
    border-bottom: 2px solid #28a745;
}

.modal-title {
    color: #333;
}

.close {
    color: #333;
}

.floating-whatsapp {
    position: fixed;
    bottom: 50px; 
    right: 30px;  
    z-index: 1000; 
}

.floating-whatsapp a {
    display: inline-block;
    text-decoration: none;
}

.whatsapp-icon {
    width: 60px;
    height: 60px;
    border-radius: 50%;
    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.2);
    transition: transform 0.3s ease;
}

.whatsapp-icon:hover {
    transform: scale(1.1);
}

/* Footer */
footer {
    color: #666;
}

footer p {
    margin: 0;
}