﻿@import 'utilities.css';

:root {
    --bs-font-sans-serif: "Poppins", system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", "Noto Sans", "Liberation Sans", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
    --bs-body-bg: #fefefe;
    --bs-body-color: #000000;
    --bs-body-color-rgb: 00, 00, 00;
    --bs-link-color: #002447;
    --bs-link-color-rgb: 0, 36, 71;
    --bs-link-hover-color: #005191;
    --bs-link-hover-color-rgb: 0, 81, 145;
}

:root {
    --ua-primary: #005191;
    --ua-primary-alt: #002A67;
    --ua-pink: #FF436E;
    --ua-site-header-mobile: 67px;
    --ua-site-header-desktop: 65px;
}



.small, small {
    font-size: 0.6em;
}



@media (min-width: 992px) {
    .col-lg-340 {
        width: calc(340px + var(--bs-gutter-x));
    }
}

.border-002447 {
    border-color: rgba(0, 36, 71,var(--bs-border-opacity)) !important;
}




/* Header */
.site-header {
    padding: 15px 20px;
    background-color: #002447;
    line-height: 1.3;
    min-height: var(--ua-site-header-mobile);
}

.navtop {
    display: flex;
    justify-content: space-between;
    align-items: center;
    font-size: 12px;
    color: #fff;
}

    .navtop .header-logo img {
        height: 35px;
    }

.nav-logout {
    margin: 0;
}

.btn-logout {
    background: transparent;
    border: 1px solid #fff;
    color: #fff;
    padding: 6px 14px;
    border-radius: 4px;
    cursor: pointer;
    font-size: 12px;
}

    .btn-logout:hover {
        background: rgba(255, 255, 255, 0.15);
    }

@media (min-width: 992px) {
    .site-header {
        padding: 9px 30px;
        min-height: 61px;
    }

    .navtop .header-logo img {
        height: 43px;
        margin-left: 75px;
    }
}




/* */
.bg-img {
    padding-top: 70px;
    height: calc(100vh - 50px);
    display: flow-root;
}

@media (max-height: 764px) {
    .bg-img {
        height: auto !important;
    }
}

@media (min-width: 768px) {
    .bg-img {
        background: url('../../img/MiCobertura/background.png') no-repeat center;
        background-size: cover;
    }
}

.container-lg-730 {
}

.container-lg-960 {
}

@media (min-width: 992px) {
    .container-lg-730 {
        max-width: 730px !important;
    }

    .container-lg-960 {
        max-width: 960px !important;
    }
}



.box01 {
    border-radius: 20px;
    background-color: #ffffff;
    box-shadow: rgb(100 100 111 / 10%) 0px 5px 5px 0px;
    color: #005191;
}

    .box01 .box-header {
        padding: 15px 12px 10px;
        border-radius: 20px 20px 0 0;
        background: #06447C;
        color: #fafafa;
    }

        .box01 .box-header h1 {
            margin: 0px;
            font-weight: 400;
        }

    .box01 .form-control,
    .box01 .form-select {
        background-color: #fafafa;
    }

        .box01 .form-control::placeholder {
            color: #005191;
        }


.validation-summary-errors,
#div-mensaje-voucher {
    font-weight: 600;
    color: var(--ua-pink);
}

    .validation-summary-errors > ul {
        margin: 0 0 1rem;
        padding: 0;
        list-style: none;
    }


.form-select,
.form-control {
    --bs-border-width: 1px;
    padding: 10px 20px 11px;
    background-color: #fff;
    font-size: 18px;
    color: #005191;
    border-radius: 10px;
}

    .form-control::placeholder {
        color: #767D83;
    }

    .form-select:focus,
    .form-control:focus {
        color: #005191;
        border-color: #005191;
        box-shadow: none;
    }


.field-validation-error {
    display: block;
    text-align: left;
    font-weight: 600;
    color: var(--ua-pink);
}


.btn-acceder {
    padding: 9px 21px;
    background-color: #005191;
    font-size: 20px;
    font-weight: 500;
    color: #fafafa;
    border-radius: 10px;
}

    .btn-acceder:hover {
        background-color: #005191;
        color: #fafafa;
    }

    .btn-acceder.disabled, .btn-acceder:disabled {
        color: #fafafa;
        background-color: #005191;
    }

.btn-blue {
    padding: 10px 20px 11px;
    background-color: #043C87;
    border: 1px solid #043C87;
    font-size: 18px;
    color: #fafafa;
    border-radius: 10px;
}

    .btn-blue:hover {
        background-color: #e6e6e6;
        border-color: #adadad;
        color: #333;
    }

.btn-icon {
    display: inline-flex;
    gap: 10px;
    align-items: center;
    justify-content: center;
}

    .btn-icon .svg-icon {
        flex-shrink: 0;
        width: 24px;
        height: 24px;
    }



.footer-apps {
    padding: 40px 0;
    color: #005191;
}

    .footer-apps .btn-stores {
        height: 70px; /*width:140px;*/
    }

@media (min-width: 992px) {
    .footer-apps {
        padding: 80px 0;
    }

        .footer-apps .btn-stores {
            height: auto;
            margin: 0 12px; /*width:180px;*/
        }
}




/**/
.sec-title {
    margin: 15px 0;
    font-size: 23px;
    font-weight: 600;
    color: #002447;
}

@media (min-width: 992px) {
    .sec-title {
        text-align: center;
        font-size: 35px;
    }
}


.lst01 {
    padding: 0;
    margin: 0;
    list-style: none;
}

    .lst01 ul {
        padding-left: 22px;
        list-style: disc;
    }



/**/
.box02 {
    background-color: #0961AB;
    color: #fafafa;
    border-radius: 20px;
}

    .box02 .box-header {
        padding: 16px 20px;
        background: #06447C;
        color: #fff;
        border-radius: 20px 20px 0 0;
    }

        .box02 .box-header .box-title {
            margin: 0px;
            font-size: 18px;
            font-weight: 600;
        }

    .box02 .box-body {
        padding: 14px 20px;
        font-size: 13px;
    }

        .box02 .box-body .lst01 > li:not(:last-child) {
            margin-bottom: 5px;
        }

@media (min-width: 992px) {
    .box02 .box-header {
        padding: 23px 28px;
    }

        .box02 .box-header .box-title {
            font-size: 26px;
        }

    .box02 .box-body {
        padding: 20px 28px;
        font-size: 18px;
    }

        .box02 .box-body .lst01 > li:not(:last-child) {
            margin-bottom: 7px;
        }
}


/**/
.box03 {
    background-color: #E3EAFC;
    color: #002447;
    border-radius: 20px;
}

    .box03 .box-body {
        padding: 20px 27px;
        font-size: 14px;
    }

        .box03 .box-body .lst01 > li:not(:last-child) {
            margin-bottom: 15px;
        }

        .box03 .box-body .lst01 li.sep {
            padding-top: 15px;
            border-top: 1px solid #A3B2C9;
        }

        .box03 .box-body .lst01 li b {
            font-weight: 500;
        }

@media (min-width: 992px) {
    .box03 .box-body {
        padding: 20px;
        font-size: 18px;
    }

        .box03 .box-body .lst01 ul {
            padding-left: 27px;
        }
}


/**/
.accordion-01 {
    --bs-accordion-color: #002447;
    --bs-accordion-border-width: 0;
    --bs-accordion-btn-padding-x: 20px;
    --bs-accordion-btn-padding-y: 25px;
    --bs-accordion-btn-color: #002447;
    --bs-accordion-btn-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 18 18'%3E%3Cpath fill='%23002447' stroke='%23002447' d='M9 13.75c.3-.01.58-.13.81-.39l6.68-7.22c.2-.21.3-.47.3-.77 0-.62-.46-1.11-1.04-1.11-.28 0-.55.12-.75.33L9 11.1 2.99 4.59c-.2-.2-.46-.33-.75-.33-.58 0-1.04.49-1.04 1.11 0 .3.11.56.3.77l6.69 7.22c.23.26.5.39.81.39z'/%3E%3C/svg%3E%0A");
    --bs-accordion-btn-icon-width: 16px; /* 1.25rem;*/
    --bs-accordion-btn-active-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 18 18'%3E%3Cpath fill='%23002447' stroke='%23002447' d='M9 13.75c.3-.01.58-.13.81-.39l6.68-7.22c.2-.21.3-.47.3-.77 0-.62-.46-1.11-1.04-1.11-.28 0-.55.12-.75.33L9 11.1 2.99 4.59c-.2-.2-.46-.33-.75-.33-.58 0-1.04.49-1.04 1.11 0 .3.11.56.3.77l6.69 7.22c.23.26.5.39.81.39z'/%3E%3C/svg%3E%0A");
    --bs-accordion-btn-focus-box-shadow: none;
    --bs-accordion-body-padding-x: 7px;
    --bs-accordion-body-padding-y: 30px;
    --bs-accordion-active-color: #002447;
    --bs-accordion-active-bg: #fff;
}

    .accordion-01 .accordion-button {
        font-size: 16px;
        font-weight: 500;
        border-bottom: 2px solid rgba(227, 234, 252, 0.5);
    }

    .accordion-01 .accordion-body {
        font-size: 14px
    }

@media (min-width: 992px) {
    .accordion-01 {
        --bs-accordion-btn-padding-x: 0;
        --bs-accordion-btn-padding-y: 30px;
        --bs-accordion-body-padding-x: 0px;
        --bs-accordion-body-padding-y: 10px;
    }

        .accordion-01 .accordion-button {
            font-size: 24px;
        }

        .accordion-01 .accordion-body {
            font-size: 17px
        }
}


/**/
.container-coberturas-descripcion {
    margin: 0 38px 15px 0;
    padding-left: 25px;
    background-image: url("data:image/svg+xml,%3Csvg width='14' height='15' viewBox='0 0 14 15' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M9.94971 5.27885C10.1603 5.49248 10.1603 5.83876 9.94971 6.05228L6.33351 9.72115C6.12295 9.93466 5.78173 9.93466 5.57117 9.72115L3.84971 7.97456C3.63915 7.76105 3.63915 7.41476 3.84971 7.20125C4.06017 6.98763 4.40149 6.98763 4.61195 7.20125L5.95229 8.56107L9.18737 5.27885C9.39793 5.06534 9.73925 5.06534 9.94971 5.27885ZM13.7994 7.5C13.7994 11.3692 10.713 14.5 6.89971 14.5C3.0859 14.5 0 11.3687 0 7.5C0 3.63075 3.08643 0.5 6.89971 0.5C10.7135 0.5 13.7994 3.63129 13.7994 7.5ZM12.7213 7.5C12.7213 4.23531 10.1172 1.59375 6.89971 1.59375C3.68179 1.59375 1.07808 4.23573 1.07808 7.5C1.07808 10.7647 3.68221 13.4062 6.89971 13.4062C10.1176 13.4062 12.7213 10.7643 12.7213 7.5Z' fill='%23005191'/%3E%3C/svg%3E%0A");
    background-repeat: no-repeat;
    background-position: left center;
}

    .container-coberturas-descripcion:last-child {
        margin-bottom: 0;
    }

    .container-coberturas-descripcion p {
        display: inline;
        margin: 0;
        font-size: 14px;
        font-weight: 300;
    }

        .container-coberturas-descripcion p.mi_BenPcobertura {
            font-weight: 400;
        }

        .container-coberturas-descripcion p.mi_BenPmargin {
            font-weight: 400;
        }

@media (min-width: 992px) {
    .container-coberturas-descripcion {
        display: flex;
        justify-content: space-between;
        margin: 0 0 10px 0;
        background-position: left 4px;
    }

        .container-coberturas-descripcion p {
            font-size: 17px;
        }

            .container-coberturas-descripcion p.mi_BenPcobertura {
                max-width: 85%;
            }
}
