﻿body {
    font-family: 'Poppins', Arial, sans-serif !important;
    background-color: #f4f6f9;
    color: #2b2b2b;
    -webkit-font-smoothing: antialiased;
}
/* ========================================
   HEADER COMPACTO
   ======================================== */
.header-compact {
    min-height: 130px !important;
    z-index: 1000000;
    background: white !important;
}

    .header-compact .brand img {
        max-height: 145px !important;
        width: auto !important;
    }

    .header-compact .uk-navbar-nav > li > a {
        min-height: 30px !important;
    }

/* ========================================
   CONTENEDOR PRINCIPAL
   ======================================== */
.medio-container {
    /*max-width: 900px !important;*/
    max-width: 900px !important;
    margin: 0 auto !important;
    padding: 0 15px !important;
    width: 100% !important;
}

/* ========================================
   FOOTER
   ======================================== */
.footer {
    width: 100% !important;
    background: #5f1b2d !important;
    position: relative !important;
}

.footer-container {
    max-width: 1200px !important;
    margin: 0 auto !important;
    padding: 0 15px !important;
    width: 100% !important;
}

.copyright-container {
    width: 100% !important;
    max-width: 1400px !important;
    margin: 0 auto !important;
    background: #5f1b2d !important;
}

.copyright {
    width: 100% !important;
}

    .copyright img {
        width: 100% !important;
        max-width: 1400px !important;
        height: auto !important;
        display: block !important;
        margin: 0 auto !important;
    }

/* ========================================
   BANNERS
   ======================================== */
.inferior-bottom-container {
    width: 100% !important;
    padding: 20px 15px !important;
}

.uk-container {
    max-width: 1200px !important;
    margin: 0 auto !important;
    padding: 0 15px !important;
}

/* ========================================
   RESET DE BOOTSTRAP
   ======================================== */
.container-fluid,
.row {
    padding: 0 !important;
    margin: 0 !important;
}

[class*="col-"] {
    padding: 0 !important;
}

/* ========================================
   ESTILOS PARA LOS PANELES
   ======================================== */
.panel-busqueda,
.panel-resultados {
    padding: 20px !important;
}

.result-item {
    padding: 8px 0 !important;
    border-bottom: 1px solid #eee !important;
}

    .result-item label {
        font-weight: bold !important;
        min-width: 120px !important;
        display: inline-block !important;
        color: #555 !important;
    }

    .result-item span {
        font-size: 1.05rem !important;
    }

.captcha-container {
    min-width: 200px !important;
}

#ben-conte {
    padding: 20px !important;
    background: white !important;
    border-radius: 8px !important;
    box-shadow: 0 2px 10px rgba(0,0,0,0.1) !important;
}

.form-control:focus {
    border-color: #0d6efd !important;
    box-shadow: 0 0 0 0.2rem rgba(13, 110, 253, 0.25) !important;
}

.panel-busqueda,
.panel-resultados {
    transition: all 0.3s ease !important;
}

/* ========================================
   CAPTCHA
   ======================================== */
./*dnt-captcha-container {
    display: flex !important;
    flex-wrap: wrap !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 15px !important;
    background: #f8f9fa !important;
    padding: 15px 20px !important;
    border-radius: 8px !important;
    border: 2px solid #dee2e6 !important;
    min-height: 70px !important;
    width: 100% !important;
}

    .dnt-captcha-container img {
        max-height: 60px !important;
        height: auto !important;
        width: auto !important;
        max-width: 100% !important;
        border-radius: 6px !important;
        border: 2px solid #ddd !important;
        background: white !important;
        padding: 4px !important;
        flex-shrink: 0 !important;
    }*/

.dnt-captcha-refresh {
    cursor: pointer !important;
    padding: 10px 16px !important;
    border-radius: 6px !important;
    border: 2px solid #dee2e6 !important;
    background: white !important;
    transition: all 0.3s !important;
    font-size: 16px !important;
    font-weight: 500 !important;
    line-height: 1 !important;
    text-decoration: none !important;
    color: #333 !important;
    display: inline-flex !important;
    align-items: center !important;
    gap: 8px !important;
    white-space: nowrap !important;
}

    .dnt-captcha-refresh:hover {
        background: #e9ecef !important;
        border-color: #0d6efd !important;
        text-decoration: none !important;
        color: #0d6efd !important;
        transform: scale(1.02) !important;
    }

    .dnt-captcha-refresh::before {
        content: "⟳" !important;
        font-size: 22px !important;
    }

    .dnt-captcha-refresh::after {
        content: "Nuevo código" !important;
        font-size: 14px !important;
    }

.glyphicon-refresh::before {
    content: "\f021" !important;
    font-family: "Font Awesome 6 Free" !important;
    font-weight: 900 !important;
    font-size: 1.8rem !important;
}

#dntCaptchaRefreshButton {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    padding: 12px 18px !important;
    border-radius: 8px !important;
    background: white !important;
    border: 2px solid #dee2e6 !important;
    color: #333 !important;
    font-size: 16px !important;
    transition: all 0.3s !important;
    text-decoration: none !important;
    gap: 8px !important;
}

    #dntCaptchaRefreshButton:hover {
        background: #e9ecef !important;
        border-color: #0d6efd !important;
        color: #0d6efd !important;
        transform: scale(1.05) !important;
    }

    #dntCaptchaRefreshButton::after {
        content: " Nuevo código" !important;
        font-size: 14px !important;
        font-weight: 500 !important;
    }

.dnt-captcha-container {
    display: flex !important;
    flex-wrap: wrap !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 15px !important;
    padding: 15px !important;
    background: #f8f9fa !important;
    border-radius: 8px !important;
    border: 2px solid #dee2e6 !important;
}

/*#DNTCaptchaInputText {
    font-size: 2rem !important;
    padding: 10px 15px !important;
    height: 50px !important;
    text-align: center !important;
    border-radius: 6px !important;
    border: 2px solid #ced4da !important;
    width: 100% !important;
    max-width: 200px !important;
}*/

.dnt-captcha-container {
    display: flex !important;
    flex-wrap: wrap !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 20px !important;
    background: #f8f9fa !important;
    padding: 20px 25px !important;
    border-radius: 10px !important;
    border: 2px solid #dee2e6 !important;
    min-height: 90px !important;
    width: 100% !important;
}

/*#dntCaptchaImg {
    height: 60px !important;
    width: 160px !important;
    image-rendering: auto !important;
}*/

#DNTCaptchaInputText {
    font-size: 3rem !important;
    padding: 12px 18px !important;
    height: 56px !important;
    width: 100% !important;
    border-radius: 6px !important;
    border: 2px solid #ced4da !important;
    text-align: center;
}

/* ========================================
   PLACA INPUT
   ======================================== */
#inputPlaca::placeholder {
    font-size: 1.5rem !important;
    color: #6c757d !important;
    opacity: 0.7 !important;
    text-transform: none !important;
    font-family: Arial;
}

#inputPlaca::-webkit-input-placeholder {
    font-size: 1.5rem !important;
}

#inputPlaca::-moz-placeholder {
    font-size: 1.5rem !important;
    opacity: 0.7 !important;
}

#inputPlaca:-ms-input-placeholder {
    font-size: 1.5rem !important;
}

/* ========================================
   PUNTOS ANIMADOS
   ======================================== */
.punto {
    display: inline-block;
    font-size: 28px;
    font-weight: bold;
    animation: puntoPulse 1.4s infinite;
    color: white;
}

    .punto:nth-child(2) {
        animation-delay: 0.2s;
    }

    .punto:nth-child(3) {
        animation-delay: 0.4s;
    }

@keyframes puntoPulse {
    0%, 20% {
        opacity: 0;
        transform: scale(0.8);
    }

    50% {
        opacity: 1;
        transform: scale(1.3);
    }

    80%, 100% {
        opacity: 0;
        transform: scale(0.8);
    }
}

/* ========================================
   ESTILOS DEL FOOTER
   ======================================== */
.escudo img {
    width: 360px !important;
    height: auto !important;
}

.image-hover {
    display: block !important;
    position: relative !important;
    width: auto !important;
    height: 80px !important;
    overflow: hidden !important;
}

    .image-hover img {
        display: block !important;
        width: 100% !important;
        height: 100% !important;
        position: absolute !important;
        top: 0 !important;
        left: 0 !important;
        transition: opacity 0.3s ease !important;
    }

    .image-hover .image-1 {
        opacity: 1 !important;
    }

    .image-hover .image-2 {
        opacity: 0 !important;
    }

    .image-hover:hover .image-1 {
        opacity: 0 !important;
    }

    .image-hover:hover .image-2 {
        opacity: 1 !important;
    }

.Te_Recomendamos a,
.Te_Recomendamos a:hover,
.Te_Recomendamos a:visited,
.Te_Recomendamos a:focus {
    color: #fffbef !important;
    font-size: 14pt !important;
    line-height: 1.8 !important;
}

/* ========================================
   BORDES RESPONSIVE
   ======================================== */
@media (min-width: 768px) {
    .border-end-md {
        border-right: 1px solid #e9ecef !important;
    }
}

@media (max-width: 767.98px) {
    .border-end-md {
        border-right: none !important;
        border-bottom: 1px solid #e9ecef !important;
    }
}

/* ========================================
   RESPONSIVE
   ======================================== */
@media (max-width: 768px) {
    .captcha-container {
        min-width: 100% !important;
    }

    .result-item label {
        min-width: 80px !important;
    }

    #ben-conte {
        padding: 10px !important;
    }

    .panel-busqueda,
    .panel-resultados {
        padding: 10px !important;
    }

    .btn-lg {
        width: 100% !important;
    }

    .header-container {
        padding: 0 10px !important;
    }

    .medio-container {
        padding: 0 10px !important;
    }

    .footer-container {
        padding: 0 10px !important;
    }

    .escudo img {
        width: 200px !important;
    }

    .image-hover {
        height: 50px !important;
    }

    .copyright img {
        width: 100% !important;
    }

    .sombra-horizontal {
        width: 100% !important;
        height: auto !important;
    }

    .Te_Recomendamos a,
    .Te_Recomendamos a:hover,
    .Te_Recomendamos a:visited,
    .Te_Recomendamos a:focus {
        font-size: 12pt !important;
    }

    .dnt-captcha-container {
        flex-direction: column !important;
        padding: 20px !important;
    }

    #DNTCaptchaInputText {
        max-width: 100% !important;
    }

    #dntCaptchaRefreshButton::after {
        content: " ↻ Nuevo" !important;
    }

    .dnt-captcha-container {
        flex-direction: column !important;
        align-items: center !important;
        padding: 20px !important;
        min-height: 100px !important;
        gap: 12px !important;
    }

        .dnt-captcha-container img {
            max-height: 70px !important;
            width: 100% !important;
            max-width: 320px !important;
        }

    .dnt-captcha-refresh {
        width: 100% !important;
        justify-content: center !important;
        padding: 12px !important;
    }

        .dnt-captcha-refresh::after {
            content: "↻ Nuevo código" !important;
        }
}

/* ========================================
   CAPTCHA INPUT PLACEHOLDER
   ======================================== */
.captcha-input::placeholder {
    font-family: Arial;
    font-size: 1.2rem;
    color: #6c757d;
    opacity: 1;
}

.captcha-input:-ms-input-placeholder {
    font-family: Arial;
    font-size: 1.5rem;
    color: #6c757d;
}

.captcha-input::-ms-input-placeholder {
    font-family: Arial;
    font-size: 2rem;
    color: #6c757d;
}


.brand img,
img[src*="logo-transparente.png"] {
    /* Mantiene la proporción sin deformar la imagen */
    height: auto !important;
    /* Controla el alto máximo en pantallas grandes */
    max-height: 85px !important;
    /* Controla el ancho dinámico */
    width: 100% !important;
    max-width: 320px !important;
    /* Asegura que no se desborde */
    object-fit: contain !important;
}


#btnConsultar {
    font-size: 1.8rem !important;
    padding: 18px 50px !important;
    border-radius: 15px !important;
    min-width: 280px;
}

    #btnConsultar i {
        font-size: 1.8rem;
    }

