@import url('https://fonts.googleapis.com/css2?family=Roboto:wght@100;300&display=swap');

body {
    min-height: 100vh;
    display: flex;
    flex-direction: column;
    font-family: 'Roboto', sans-serif;
}

.content {
    flex: 1;
}

.input-edesal{
    border: 3px solid #00853e;
    /*border-radius: 50px;*/
}

.input-edesal:focus{
    color: #000000;
    background-color: #fff;
    border-color: rgb(0 133 62);
    outline: 0;
    box-shadow: 0 0 0 0.25rem rgba(255, 255, 255, 0.26);
}

.btn-edesal-search{
    background: #00853e;
    color: #fff;
    font-weight: bold;
    /*border-radius: 50px;*/
    width: 95px;
}

.btn-edesal-search:hover{
    background: #00853e;
    color:#fff;
    box-shadow: 2px 2px 5px 4px #00000030;
}

.bg-navbar-edesal{
    background: #e9e9e9 !important;
}

.btn-float{
    position:fixed;
    width:60px;
    height:60px;
    bottom:40px;
    right:20px;
    /* background-color:#25d366; */
    color:#FFF;
    border-radius:50px;
    text-align:center;
    font-size:30px;
    box-shadow: 2px 2px 3px #999;
    z-index:1022;
}

.btn-float-margin{
    margin-top:16px;
}

.error{
    color:rgb(255, 0, 0);
    font-weight: bold;
}

.header-table-edesal{
    background: #00853e !important;
    color:#fff !important;
}

.table-detalles-pago{
    border-top-color: #DEEAC4 !important;
    border-bottom-color: #DEEAC4 !important;
    border-left-color: #DEEAC4 !important;
    border-right-color: #DEEAC4 !important;
    box-shadow: 2px 2px 5px 4px #00000030;
}

.btn-edesal-pay{
    background: #80b71b;
    color: #fff;
    font-weight: bold;
    /*border-radius: 50px;*/
    border: 1px solid #80b71b;
    width: 100%;
}

.btn-edesal-pay:hover{
    background: #80b71b;
    color:#fff;
    /* border: 2px solid #fff; */
    box-shadow: 2px 2px 5px 4px #00000030;
}

.logo-edesal-v{
    width: 450px;
    max-width: 100% !important;
    margin-bottom: 20px;
}

.text-edesal{
    color: #218a3c !important;
}

.jumbotron-edesal{
    background-color:rgb(222 234 196 / 27%);
}

.footer-edesal{
    height: 120px !important;
    background-size: cover !important;
    background-repeat: round !important;
}

.header-edesal-pay{
    height: 95px !important;
    transform: rotate(180deg) !important;
    background-size: cover !important;
    background-repeat: round !important;
}

@media only screen and (max-width: 767px) {
    .footer-edesal {
        height: 45px !important;
    }

    .header-edesal-pay{
        height: 45px !important;
    }
}

.swal2-html-container{
    text-align: justify !important;
}
.swal2-html-container p{
    margin-bottom: 4px !important;
}
.swal2-image {
   margin: 1em auto -1em !important;
}
.swal2-title{
    font-size: 20px !important;
    margin-top: 11px !important;
}

.swal2-container.swal2-center > .swal2-popup {
    font-family: 'Roboto', sans-serif !important;
}

.swal2-actions {
    margin: 1em auto 0 !important;
}


.card-edesal{
    /* border: 2px solid #00853e !important; */
    box-shadow: -1px 0px 16px 4px #ebebeb;
}

.card-footer {
    background-color: #fff !important; 
    border-top: none !important;
}

.timeline {
    position: relative;
    padding: 20px 0;
}

.timeline::before {
    content: '';
    position: absolute;
    width: 4px;
    background-color: #ddd;
    top: 0;
    bottom: 0;
    left: 20px;
    margin-left: -1px;
    z-index: 1;
}

.timeline-event {
    margin: 0;
    padding: 0px 0;
    position: relative;
}

.step1::before {
    background-image: url('../img/step1.png') !important;
    background-size: contain !important;
    background-repeat: no-repeat !important;
    background-position: center !important;
}

.step2::before {
    background-image: url('../img/step2.png') !important;
    background-size: contain !important;
    background-repeat: no-repeat !important;
    background-position: center !important;
}

.step3::before {
    background-image: url('../img/step3.png') !important;
    background-size: contain !important;
    background-repeat: no-repeat !important;
    background-position: center !important;
}

.step4::before {
    background-image: url('../img/step4.png') !important;
    background-size: contain !important;
    background-repeat: no-repeat !important;
    background-position: center !important;
}

.step5::before {
    background-image: url('../img/step5.png') !important;
    background-size: contain !important;
    background-repeat: no-repeat !important;
    background-position: center !important;
}

.timeline-event::before {
    content: '';
    position: absolute;
    width: 20px;
    height: 20px;
    background-color: #00853E;
    border-radius: 50%;
    top: 0;
    left: 7px;
    margin-top: 8px;
    z-index: 1;
    content: '';
    position: absolute;
    width: 27px;
    height: 27px;
    background-color: #00853E;
    border-radius: 50%;
    top: 0;
    z-index: 3;
    /* left: 10px;
    margin-top: 10px;
    z-index: 1;
    display: block;
    border-right: 10px solid transparent;
    border-left: 12px solid transparent;
    border-top: 18px solid #00853E; */
}

.timeline-event.disabled::before {
    background-color: #dfdcdc !important; 
}

.timeline-content {
    margin-left: 25px;
    padding: 1px 17px;
    position: relative;
    top: 7px;
}

.timeline-content h5 {
    margin-bottom: 0;
}

.timeline-content small {
    display: block;
    margin-top: 5px;
    color: #666;
}

/* .disabled .timeline-content {
     background-color: #e0e0e0; 
} */

.timeline-event.completed::after {
    content: '';
    position: absolute;
    width: 4px;
    background-color: #00853E;
    top: 20px;
    bottom: -20px;
    left: 19px;
    z-index: 1;
}

.timeline-event.disabled::after {
    display: none;
}

.tree ul {
    list-style-type: none;
}

.tree ul .nested {
    display: none;
    margin-left: 20px;
}

.tree input[type="checkbox"] {
    margin-right: 10px;
}

/* Mostrar el árbol */
.tree ul .parent-checkbox:checked + label + .nested {
    display: block;
}