/* Estilos de la home 2025. Extraido del <style> inline de Index2025.cshtml
   para que sea cacheable y reutilizable. Se preservo el comportamiento original:
   algunas media queries traen "min - width" con espacios (invalidas, ya ignoradas
   por el navegador) y se dejan tal cual para no alterar el layout sin QA visual. */

/* Estilos personalizados */
body {
    font-family: sans-serif;
    background-color: #ddd;
}

.table-responsive {
    overflow-x: auto;
}

.navbar {
    background-color: #396100 !important;
    /* Azul para la barra de navegación */
}

.navbar-nav .nav-link {
    color: white !important;
}

.navbar-main {
    padding-top: 0px;
    padding-bottom: 0px;
}

.navbar-brand {
    color: #fff;
    font-family: sans-serif;
    font-size: 1.5em;
    margin-right: 20px;
}

.navbar-brand:hover {
    color: #fff;
}

.span-title {
    color: #ddff81;
}

.card-header {
    background-color: #396100 !important;
    /* Verde para los encabezados de las cards */
    color: white !important;
}

.card-header h3 {
    color: #ffffff !important;
    margin: 0;
    font-size: 1.1rem;
    font-weight: 600;
    text-shadow: 1px 1px 2px rgba(0,0,0,0.3);
}

.btn-primary {
    background-color: #28a745 !important;
    /* Verde para los botones */
    border-color: #28a745 !important;
}

.list-group-item {
    background-color: #f8f9fa;
    /* Gris claro para los elementos de la lista */
}

/* Estilos para la versión boxed */
.boxed {
    max-width: 1200px;
    /* Ajusta el ancho máximo según tus necesidades */
    margin: 0 auto;
    box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
    /* Agrega una sombra suave */
}

/* Estilos para el H1 con marco */
.hero-heading {
    background-color: #f8f9fa;
    border-bottom: solid 1px #00718c;
    /* Color de fondo del H1 */
    padding: 5px;
    /* border: 1px solid #dee2e6;*/
    /* Borde del marco */
    text-align: left;
}

.hero-heading h1 {
    font-size: 24px !important;
    margin-bottom: 0px;
    color: #396100;
}

/* Estilos para el botón de hamburguesa */
.navbar-toggler {
    border: none !important; /* Quita el borde */
}

.navbar-toggler-icon {
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3e%3cpath stroke='rgba(255, 255, 255, 1)' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e") !important; /* Icono negro */
}

/* Elimina el borde al hacer clic */
.navbar-toggler:focus {
    outline: none !important;
}

li.active a {
    background-color: #444;
}

.navbar-nav .dropdown li a:hover {
    background-color: #396100;
    color: #FFF;
}

.navbar-nav li a:hover {
    background-color: #444;
}

.image_bank {
    width: 120px;
    height: auto;
}

.containermain h1, .containermain h2, .containermain h4, .containermain h5, .containermain h6 {
    color: green !important;
}

/* H3 en el contenido principal verde, pero no en cards */
.containermain h3:not(.card-header h3) {
    color: green !important;
}

.containermain h3, .containermain .h3 {
    font-size: 22px !important;
}

.table > thead > tr > th {
    border-bottom: 2px solid #5a9900;
}

.panelsocial, .paneltags {
    padding-left: 7px;
    padding-right: 7px
}

.responsive_banner {
    width: 320px;
    height: 100px
}

@media(min - width: 500px) {
    .responsive_banner {
        width: 468px;
        height: 60px
    }
}

@media(min - width: 800px) {
    .responsive_banner {
        width: 728px;
        height: 90px
    }
}

.adsboxheader {
    text-align: center;
    font-size: small;
}

.tdcompra {
    color: green !important;
}

.tdventa {
    color: #8b0000 !important;
}

.tdlink {
    vertical-align: middle !important
}

.adsbox {
    margin-top: 20px
}

.bannerbox {
    margin-top: 0
}

.paneltags {
    font-size: xx-small
}

.tdcompra, .tdventa {
    font-weight: 700;
    vertical-align: middle !important;
    font-size: 14px
}

.image_bank {
    width: 120px;
    height: auto
}

.tdlink {
    font-size: 12px
}

a {
    color: #244C75;
    text-decoration: none;
}

.widget-link {
    margin-top: 10px !important;
    margin-bottom: 10px !important;
}

#footer-widgets {
    color: #fff;
    padding: 0 0 20px;
    margin-top: 30px;
    background-color: #444;
    border-top: solid 5px #5a9900
}

#footer a, #footer-widgets a {
    color: #ddff81
}

.footer-widget-title {
    font-family: sans-serif;
    font-size: 1.35em;
    color: #fff !important;
}

#footer a:hover, #footer-widgets a:hover {
    color: #fff
}

#footer {
    background-color: #333;
    color: #ccc;
    padding: 17px 0;
    text-align: center;
    border-top: solid 1px #444
}

#footer p {
    margin: 0;
    padding: 0;
    line-height: 100%
}

hr {
    border-top: 1px solid #ddd
}

@media(min - width: 500px) {
    .image_bank {
        width: 130px;
        height: auto
    }

    .tdcompra, .tdventa {
        font-weight: 700;
        vertical-align: middle !important;
        font-size: 14px
    }

    .tdlink {
        font-size: 14px
    }
}

@media(min - width: 800px) {
    .image_bank {
        width: 130px;
        height: auto
    }

    .tdcompra, .tdventa {
        font-weight: 700;
        vertical-align: middle !important;
        font-size: 14px
    }

    .tdlink {
        font-size: 14px
    }
}

.boxed { background-color: #fff }
