/* Custom Font */
@font-face {
    font-family: "Mukta", sans-serif;
    src: url('../fonts/Mukta-Bold.ttf') format('ttf'),
        url('../fonts/Mukta-ExtraBold.ttf') format('ttf');
    font-weight: 300;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: "Mukta", sans-serif;
    src: url('../fonts/Mukta-Medium.ttf') format('ttf'),
        url('../fonts/Mukta-Medium.ttf') format('ttf');
    font-weight: 500;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: "Mukta", sans-serif;
    src: url('../fonts/Mukta-Regular.ttf') format('ttf'),
        url('../fonts/Mukta-Medium.ttf') format('ttf');
    font-weight: 400;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: "Mukta", sans-serif;
    src: url('../fonts/Mukta-SemiBold.ttf') format('ttf'),
        url('../fonts/Mukta-SemiBold.ttf') format('ttf');
    font-weight: 400;
    font-style: normal;
    font-display: swap;
}

/* Root Selector and Variables */
:root {
    /* Black Variants */
    --mhr: #003B20;
    --Black: #252324;
    --black-60: rgba(37, 35, 36, 0.60);
    --black-40: rgba(37, 35, 36, 0.40);
    --black-30: rgba(37, 35, 36, 0.30);
    --black-20: rgba(37, 35, 36, 0.20);
    --black-10: rgba(37, 35, 36, 0.10);
    /* White Variants */
    --White: #FFFFFF;
    --white-80: rgba(255, 255, 255, 0.80);
    --white-60: rgba(255, 255, 255, 0.60);
    --white-50: rgba(255, 255, 255, 0.50);
    --white-10: rgba(255, 255, 255, 0.10);
    /* Beige Variants */
    --Beige-01: #FFFCF5;
    --Beige-02: #F4F1E7;
    --Beige-03: #EDEAE0;
    /* Orange */
    --Orange: #A96449;
    --Orange-02: #EEE0DB;
    /* Black 2 and 3 */
    --Black-2: #2F2D2E;
    --Black-3: #393738;
}


.mukta-extralight {
    font-family: "Mukta", sans-serif;
    font-weight: 200;
    font-style: normal;
}

.mukta-light {
    font-family: "Mukta", sans-serif;
    font-weight: 300;
    font-style: normal;
}

.mukta-regular {
    font-family: "Mukta", sans-serif;
    font-weight: 400;
    font-style: normal;
}

.mukta-medium {
    font-family: "Mukta", sans-serif;
    font-weight: 500;
    font-style: normal;
}

.mukta-semibold {
    font-family: "Mukta", sans-serif;
    font-weight: 600;
    font-style: normal;
}

.mukta-bold {
    font-family: "Mukta", sans-serif;
    font-weight: 700;
    font-style: normal;
}

.mukta-extrabold {
    font-family: "Mukta", sans-serif;
    font-weight: 800;
    font-style: normal;
}


/* Custom Scrollbar Styling */
::-webkit-scrollbar-track {
    -webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.3);
    border-radius: 10px;
    background-color: var(--Beige-01);
}

::-webkit-scrollbar {
    width: 7px;
    background-color: var(--Beige-01);
}

::-webkit-scrollbar-thumb {
    border-radius: 10px;
    -webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, .3);
    background-color: var(--Orange);
}