@import "tailwindcss";

@font-face {
    font-family: "fo-n";
    src: url("../Fonts/Onest/Onest/static/Onest-Regular.ttf")
        format("woff2");
    font-weight: 400;
    font-style: normal;
}
@theme {
    --breakpoint-xs: 30rem;
    --breakpoint-2xl: 100rem;
    --breakpoint-3xl: 120rem;
    --breakpoint-md: 48.1rem;
    --breakpoint-xl: 80.1rem;
    --breakpoint-lg: 64.1rem;
    --breakpoint-desk: 85.385rem;
    --breakpoint-xldesk: 90.1rem;
}

@font-face {
    font-family: "fo-m";
    src: url("../Fonts/Onest/Onest/static/Onest-Medium.ttf")
        format("woff2");
    font-weight: 500;
    font-style: normal;
}

@font-face {
    font-family: "fo-b";
    src: url("../Fonts/Onest/Onest/static/Onest-Medium.ttf")
        format("woff2");
    font-weight: 600;
    font-style: normal;
}
@font-face {
    font-family: "fo-xb";
    src: url("../Fonts/Onest/Onest/static/Onest-Medium.ttf")
        format("woff2");
    font-weight: 700;
    font-style: normal;
}
@font-face {
    font-family: "fo-xxb";
    src: url("../Fonts/Onest/Onest/static/Onest-Bold.ttf")
        format("woff2");
    font-weight: 700;
    font-style: normal;
}

@font-face {
    font-family: "fm-n";
    src: url("../Fonts/Onest/Mulish/static/Mulish-Regular.ttf")
        format("woff2");
    font-weight: 400;
    font-style: normal;
}

@font-face {
    font-family: "fm-m";
    src: url("../Fonts/Onest/Mulish/static/Mulish-Medium.ttf")
        format("woff2");
    font-weight: 500;
    font-style: normal;
}

@font-face {
    font-family: "fm-b";
    src: url("../Fonts/Onest/Mulish/static/Mulish-Medium.ttf")
        format("woff2");
    font-weight: 600;
    font-style: normal;
}
@font-face {
    font-family: "fm-xb";
    src: url("../Fonts/Onest/Mulish/static/Mulish-Bold.ttf")
        format("woff2");
    font-weight: 700;
    font-style: normal;
}
@font-face {
    font-family: "Poppins";
    src: url("../Fonts/Poppins/Poppins-Regular.ttf") format("woff2");
}
@font-face {
    font-family: "Lato";
    src: url("../Fonts/Lato/Lato-Regular.ttf") format("woff2");
}
@font-face {
    font-family: "Inter";
    src: url("../Fonts/Inter/static/Inter_18pt-Regular.ttf")
        format("woff2");
}
@font-face {
    font-family: "Inter-m";
    src: url("../Fonts/Inter/static/Inter_18pt-Medium.ttf")
        format("woff2");
}
@font-face {
    font-family: "Poppins-medium";
    src: url("../Fonts/Poppins/Poppins-Medium.ttf") format("woff2");
}
@font-face {
    font-family: "Poppins-l";
    src: url("../Fonts/Poppins/Poppins-Light.ttf") format("woff2");
}
@font-face {
    font-family: "Poppins-bold";
    src: url("../Fonts/Poppins/Poppins-Bold.ttf") format("woff2");
}
@font-face {
    font-family: "Roboto";
    src: url("../Fonts/Roboto/static/Roboto-Regular.ttf")
        format("woff2");
}
@font-face {
    font-family: "Syne";
    src: url("../Fonts/Syne/static/Syne-Regular.ttf") format("woff2");
}
@font-face {
    font-family: "Syne-medium";
    src: url("../Fonts/Syne/static/Syne-Medium.ttf") format("woff2");
}
.fo-b {
    font-family: "fo-b", sans-serif;
}
.fo-n {
    font-family: "fo-n", sans-serif;
}
.fo-m {
    font-family: "fo-m", sans-serif;
}
.fm-n {
    font-family: "fm-n", sans-serif;
    font-weight: normal;
}
.fm-m {
    font-family: "fm-m", sans-serif;
}
.fm-xb {
    font-family: "fm-xb", sans-serif;
}
.fo-xxb {
    font-family: "fo-xxb", sans-serif;
}
.fo-xb {
    font-family: "fo-xb", sans-serif;
}
.Poppins {
    font-family: "Poppins", sans-serif;
}
.Lato {
    font-family: "Lato", sans-serif;
}
.Inter {
    font-family: "Inter", sans-serif;
}
.Inter-m {
    font-family: "Inter-m", sans-serif;
    font-weight: 500;
}
.Poppins-medium {
    font-family: "Poppins-medium", sans-serif;
    font-weight: 500;
}
.Poppins-l {
    font-family: "Poppins-l", sans-serif;
    font-weight: 300;
}
.Poppins-bold {
    font-family: "Poppins-bold", sans-serif;
    font-weight: 600;
}
body {
    background-color: #fcfcfc;
}
.tutor-cardstyle {
    border: 1.85px solid #1b7fb942;
    box-shadow:
        0px 0.92px 1.85px 0px rgba(0, 119, 179, 0.1),
        1.85px 2.77px 2.77px 0px rgba(0, 119, 179, 0.09),
        3.69px 5.54px 3.69px 0px rgba(0, 119, 179, 0.05),
        6.46px 10.15px 4.61px 0px rgba(0, 119, 179, 0.01),
        9.23px 15.68px 5.54px 0px rgba(0, 119, 179, 0);
}
.iconshadow {
    box-shadow:
        0px 0px 1px 0px #0000001a,
        0px 1px 1px 0px #00000017,
        0px 3px 2px 0px #0000000d,
        0px 5px 2px 0px #00000003,
        0px 7px 2px 0px #00000000;
    border-radius: 5px;
}
.clone-extrainput {
    box-shadow:
        0px 1px 1px 0px #0000001a,
        0px 2px 2px 0px #00000017,
        0px 5px 3px 0px #0000000d,
        0px 8px 3px 0px #00000003,
        0px 13px 4px 0px #00000000;
}

.radio-button-checked {
    appearance: none;
    -webkit-appearance: none;
    -moz-appearance: none;

    width: 22px;
    height: 22px;
    border-radius: 50%;
    border: 1px solid #1cd8c4;
    background-color: transparent;
    cursor: pointer;
    position: relative;
}

.radio-button-checked:checked {
    border-color: #1cd8c4;
}

.radio-button-checked:checked::before {
    content: "";
    width: 12px;
    height: 12px;
    background-color: #1cd8c4;
    border-radius: 50%;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}

.hide-scrollbar::-webkit-scrollbar {
    display: none;
}

.hide-scrollbar {
    -ms-overflow-style: none;
    scrollbar-width: none;
}

.upcoming{
    background-color: #F49F01;
}

.in_progress{
    background-color: #BBF401;
}

.completed{
    background-color: #BBF401;
}

.pending{
    background-color: #F49F01;
}

.awaiting_completion{
    background-color: #F49F01;
}

.cancelled{
    background-color: #d30000;
    color: white;
}
