/*GENERAL CSS STYLES*/
*,
*::before,
*::after {
    font-family: 'Noto Sans', sans-serif !important; /* Aplica Noto Sans a todos los elementos */
}
body {
    background-image: url("../Img/BG_RAF.png");
    background-size: cover;
    background-repeat: no-repeat;
    background-attachment: fixed;
    background-position: center center;
    width: 100%;
    height: 100vh;
    margin: 0;
    font-family: var(--font-body);
}

input{
        font-family: 'Noto Sans', sans-serif !important;
        font-size:10px;

}

.navbar, .btn, .card, .modal, .alert, .form-control , label {
    font-family: 'Noto Sans', sans-serif !important;
}

.navbar{
    height:10% !important;
}
.container {
    width: 95%;
    max-width: 1700px; 
    margin: 0px auto;
    font-size:12px; 
}

.body-principal{
    margin:20px auto;
}

/* Estilos para LOGO LOGIN RAF*/
.img-principal-login {
    display: flex;
    justify-content: center;
}
    .img-principal-login  img{
    width:100%;
    max-width:1000px;
    height: 100%;
    
}

@media (max-width: 820px) {
    .d-sm-block {
        display: none !important;
    }
}

    /* Media query para Iphones */
    @media (max-width: 600px) {
        body {
            background-image: url("../Img/BG_RAF_MOBILE.jpg");
            background-size: cover;
            background-repeat: no-repeat;
            background-attachment: fixed;
            background-position: center center;
            width: 100%;
            height: 100vh;
            margin: 0;
        }

       

        .img-principal-login img {
            width: 100%;
            max-width: 400px;
            height: 100%;
        }

        .herf-terms-style {
            font-size: 14px !important;
        }
    }
    /* Media query para Iphones */
    @media (max-width: 450px) {
        .form-check-label {
            font-size: 8px !important;
        }

        .navbar, .card, .modal, .alert {
            /*font-family: 'Noto Sans', sans-serif !important;*/
            font-size: 6px !important;
        }

        *,
        *::before,
        *::after {
            font-size: 12px !important; /* Ajusta el tamaño de la fuente globalmente */
        }

        .button-text {
            display: none; /* Ocultamos el texto cuando el ancho sea 450px o menor */
        }

        .button-icon-busqueda {
            display: inline-block !important; /* Mostramos la imagen */
        }
    }