@import url("https://fonts.cdnfonts.com/css/soleil");

.ec-title,
.ec-day-head,
.ec-day,
.ec-resource {
    font-weight: bold;
}

.ec-time-grid .ec-header .ec-day {
    min-height: 48px !important;
}

.ec-timeline .ec-sidebar .ec-resource span {
    padding-top: 0;
}

.ec-resource .ec-day span div:first-child {
    height: 100%;
}

.ec-button:disabled {
    color: gray;
}

.ec-timeline .ec-resource {
    display: flex;
    align-items: center;
    /* justify-content: center; */
    flex-basis: 3.5rem !important;
}

.ec-time-grid .ec-body .ec-event {
    min-height: 19px !important;
}

@media (width <=768px) {
    .ec-toolbar {
        flex-direction: column;
        gap: 0.5rem;
    }

    .ec-center,
    .ec-start,
    .ec-today {
        width: 100%;
    }

    .ec-button-group {
        display: flex;
        width: 100%;
    }

    .ec-button {
        flex: 1 1 0%;
    }

    .ec-title,
    .ec-day-head,
    .ec-day,
    .ec-resource,
    .ec-time {
        font-size: 12px;
    }
}

#editPatientTabs .fi-tabs {
    white-space: nowrap;
}

/* Track */
::-webkit-scrollbar-track {
    background: #d3d1d1;
    border-radius: 10px;
}

/* Handle */
::-webkit-scrollbar-thumb {
    background: #a7a7a7;
    border-radius: 10px;
}

/* Handle on hover */
::-webkit-scrollbar-thumb:hover {
    background: theme(colors.gray.400);
}

::-webkit-scrollbar {
    width: 5px;
    height: 5px;
}

.body-chart-content {
    .body-chart-svg-container {
        border-radius: 1rem;
    }

    .toggle-btn {
        display: flex;
        align-items: center;
        justify-content: center;
        height: 100px;
        width: 80px;
        border-color: rgba(0, 0, 0, 0.2);
        padding-inline: 1rem;

        &:hover {
            background: rgba(0, 0, 0, 0.05);
        }

        svg,
        .fi-btn-label {
            height: 100%;
        }
    }

    .body-chart-svg-content {
        background: #f5f5f5a8;
        border-radius: 1rem 0 0 1rem;
    }

    .body-chart-svg {
        svg {
            margin: 0 auto;
        }
    }
    .body-chart-title {
        background: rgb(2 146 249 / 5%);
        padding: 1rem;
    }

    .body-chart-title--start-round {
        border-radius: 1rem 0 0 0;
    }

    .body-chart-title--end-round {
        border-radius: 0 1rem 0 0rem;
    }
}

.dark {
    .body-chart-content {
        .body-chart-svg-content {
            background: #272727a8;
        }
    }
}