* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

main {
    background-color: #dfdae7 !important;
    height: 100vh !important;
}
/*-------------- HEADER------------------------------ */
.bg-body-tertiary {
    --bs-bg-opacity: 1;
    background: linear-gradient(90deg, #7b2cbf, #9d4edd);
}

.header,
.navbar-brand {
    color: #fff !important;
}

.btn-outline-success {
    --bs-btn-border-color: #A5D6A7 !important;
    --bs-btn-color: #4cd350 !important;
}

.botones {
    filter: drop-shadow(1px 2px 5px #9d4eddd2);
    gap: 10px;
    flex-wrap: wrap;
}

#citas {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    align-items: stretch;
    gap: 80px;

    background-color: #dfdae7 !important;
    height: auto;
}
/* --------------CARDS CITAS------------------------ */

.profile-card {
    width: 300px;
    border-radius: 1rem;
    /* box-shadow: 4px 4px 10px 4px #b0ff3aab; */
    text-align: center;
    border: 0px !important;
    background-color: #F5F5F5 !important;
    margin-right: 2rem;
}

.badge {
    left: 91% !important;
}

.col-1,
.col-2,
.col-3,
.col-4,
.col-6,
.col-7,
.col-8,
.col-9 {
    padding: 0 0 0 10px !important;
}

.profile-header {
    height: 150px;
    border-radius: 1rem 0 0 0;
}

.card-body {
    padding: 10px 0px !important;
}

.profile-img {
    width: 100px;
    height: 100px;
    border-radius: 50%;
    /* border: 4px solid #18d818 ; */
    margin-top: -40px;
    background-color: #fff;
}

.btn-custom {
    margin: 5px;
}

/*------------------ MODAL------------------- */

.modal-header{
    --bs-bg-opacity: 1;
    background: linear-gradient(212deg, #a871d7, #8e3dcf) !important;
    color: white;
}

.modal-body {
    background-color: #dfdae7 !important;
}

.border{
    border-color:  #9d4edd !important;
}
.modal-footer {
    --bs-bg-opacity: 1;
    background: linear-gradient(212deg, #b291ce, #9b63c9) !important;
    color: white;
}

legend {
        color: #005dff;
        font-weight: 600;
    }
/*------------------ MEDIAQUERYS ------------------*/

@media(max-width:360px) {
    .profile-card {
        margin: 0;
    }

    .badge {
        left: 82% !important;
    }
}