:root {
    --sms-neutral: #525866;
    --sms-dark: #0E121B;
    --sms-light: #E1E4EA;
    --sms-blue-335: #335CFF;
    --sms-light-primary: #0448F41A;
}


@font-face {
    font-family: "inter regular";
    src: url(/assets/media/fonts/Inter-Regular.ttf);
}

@font-face {
    font-family: "inter medium";
    src: url(/assets/media/fonts/Inter-Medium.ttf);
}

@font-face {
    font-family: "inter semibold";
    src: url(/assets/media/fonts/Inter-SemiBold.ttf);
}

@font-face {
    font-family: "inter bold";
    src: url(/assets/media/fonts/Inter-Bold.ttf);
}

@font-face {
    font-family: "inter extrabold";
    src: url(/assets/media/fonts/Inter-ExtraBold.ttf);
}


body {
    font-family: "inter regular" !important;
}

.font-inter-medium {
    font-family: "inter medium";
}

.font-inter-semibold {
    font-family: "inter semibold";
}

.font-inter-bold {
    font-family: "inter bold";
}

.font-inter-extrabold {
    font-family: "inter extrabold";
}

.text-neutral {
    color: var(--sms-neutral) !important;
}

.text-primary-dark {
    color: var(--sms-dark) !important;
}

.border-light-e1 {
    border: var(--sms-light) solid 1px;
}

.bg-blue-335 {
    color: var(--sms-blue-335);
}


.active-menu-border {
    height: 20px;
    width: 4px;
    background: var(--sms-blue-335);
    background: var(--sms-blue-335);
    left: 0;
    border-top-right-radius: 9999px;
    border-bottom-right-radius: 9999px;
    position: absolute;
}

/* Default menu item */
.menu-item .menu_link {
    background-color: transparent;
    border-radius: 8px;
    padding: 8px 12px;
    transition: all 0.3s ease-in-out;
    color: var(--sms-neutral);
    transition: all 0.3s ease-in-out;
    color: var(--sms-neutral);
}


.menu-item .ms-5 .menu_link.active {
    background-color: #F5F7FA !important;
    color: var(--sms-blue-335) !important;
}

.menu-text {
    color: var(--sms-neutral);
    font-size: 14px !important;
}

.menu-item .menu_link.active .menu-text {
    color: var(--sms-blue-335) !important;
}

.menu-item .menu-link.active .menu-text {
    color: var(--sms-blue-335) !important;
}

.menu-item .menu-link.active .menu-bullet .bullet {
    color: var(--sms-blue-335) !important;
}

.menu-icon svg {
    fill: var(--sms-neutral) !important;
    opacity: 1;
}

.menu-item .menu_link.active .menu-icon svg {
    fill: var(--sms-blue-335) !important;
    opacity: 1;
}

.chevron-icon {
    font-size: 20px;
    color: var(--sms-neutral);
    transition: transform 0.2s ease-in-out, color 0.3s;
}

.menu-item .menu_link.active .chevron-icon {
    color: var(--sms-blue-335) !important;
    transform: translateX(2px);
}


.menu-item .menu_link.active {
    background-color: #F5F7FA !important;
    color: var(--sms-blue-335) !important;
}

.menu-text {
    color: var(--sms-neutral);
    font-size: 14px !important;
}

.menu-item .menu_link.active .menu-text {
    color: var(--sms-blue-335) !important;
}

.menu-icon svg {
    fill: var(--sms-neutral) !important;
    opacity: 1;
}

.menu-item .menu_link.active .menu-icon svg {
    fill: var(--sms-blue-335) !important;
    opacity: 1;
}

.chevron-icon {
    font-size: 20px;
    color: var(--sms-neutral);
    transition: transform 0.2s ease-in-out, color 0.3s;
}

.menu-item .menu_link.active .chevron-icon {
    color: var(--sms-blue-335) !important;
    transform: translateX(2px);
}

.app-sidebar .menu .menu-item .menu_link.active .menu-arrow:after {
    background-color: var(--sms-blue-335) !important;
}

.app-sidebar .menu .menu-item.hover:not(.here)>.menu_link:not(.disabled):not(.active):not(.here) .menu-bullet .bullet,
.app-sidebar .menu .menu-item:not(.here) .menu_link:hover:not(.disabled):not(.active):not(.here) .menu-bullet .bullet {
    background-color: var(--sms-blue-335) !important;
}

.app-sidebar .menu .menu-item.hover:not(.here)>.menu_link:not(.disabled):not(.active):not(.here) .menu-title,
.app-sidebar .menu .menu-item:not(.here) .menu_link:hover:not(.disabled):not(.active):not(.here) .menu-title {
    color: var(--sms-blue-335) !important;
}


.text-dark {
    color: #171717 !important;
}

.text-main {
    color: #0448F4 !important;
}

.text-main:hover,
.text-main:focus {
    color: #0e4ded !important;
}

.bg-main {
    background-color: #0448F4 !important;
}

.btn-main {
    --bs-btn-color: #ffffff;
    --bs-btn-bg: #0448F4;
    --bs-btn-border-color: #0448F4;
    --bs-btn-hover-color: #ffffff;
    --bs-btn-hover-bg: #0e4ded;
    --bs-btn-hover-border-color: #0e4ded;
    --bs-btn-focus-shadow-rgb: 23, 112, 217;
    --bs-btn-active-color: #ffffff;
    --bs-btn-active-bg: #0e4ded;
    --bs-btn-active-border-color: #0e4ded;
    --bs-btn-active-shadow: none;
    --bs-btn-disabled-color: #ffffff;
    --bs-btn-disabled-bg: #0448F4;
    --bs-btn-disabled-border-color: #0448F4;
    border-radius: 100px;
}

.btn-transparent {
    box-shadow:
        0px 1px 2px 0px rgba(10, 13, 20, 0.03),
        0px 0px 0px 1px #E1E4EA inset,
        0px 0px 0px 0px #FFFFFF inset;
    background-color: transparent;
    /* border-radius: 100px; */
    border: #E1E4EA solid 1px;
    /* font-family: "inter semibold"; */
    font-size: 14px;
    line-height: 20px;
    letter-spacing: -0.08px;
    text-align: center;
    color: var(--sms-neutral);
    /* padding: calc(0.775rem + 1px) calc(1.5rem + 1px) !important; */

}

.border-shadow {
    box-shadow: 0px 1px 2px 0px #0A0D1408,
        0px 0px 0px 1px #E1E4EA inset,
        0px 0px 0px 0px #FFFFFF inset;
    /* border-radius: 16px; */
}


.tns .tns-nav button.tns-nav-active {
    background-color: #0448F4 !important;
}

.btn.btn-active-light:active:not(.btn-active),
.btn.btn-active-light.active,
.btn.btn-active-color-primary:hover:not(.btn-active) {
    background-color: #FFFFFF !important;
    color: var(--sms-dark) !important;
    padding: 0.5rem 1.25rem !important;
    margin: 0.25rem !important;
    border-radius: 0.625rem !important;
    box-shadow: 0 0.25rem 0.4rem 0.25rem rgba(0, 0, 0, 0.075) !important;
    transition: all 0.5s ease-in-out !important;

    .tns .tns-nav button.tns-nav-active {
        background-color: #0448F4 !important;
    }
}

.cursor-pointer {
    cursor: pointer;
}

.form_control,
.form-selcet {
    color: #2C2C2C !important;
    border: 1px solid rgba(243, 244, 246, 1) !important;
}

table.dataTable thead>tr>th.dt-orderable-asc,
table.dataTable thead>tr>th.dt-orderable-desc,
table.dataTable thead>tr>th.dt-ordering-asc,
table.dataTable thead>tr>th.dt-ordering-desc,
table.dataTable thead>tr>td.dt-orderable-asc,
table.dataTable thead>tr>td.dt-orderable-desc,
table.dataTable thead>tr>td.dt-ordering-asc,
table.dataTable thead>tr>td.dt-ordering-desc {
    padding-right: 20px !important;
}

table.dataTable th.dt-type-numeric,
table.dataTable th.dt-type-date,
table.dataTable td.dt-type-numeric,
table.dataTable td.dt-type-date {
    text-align: center !important;
}


.skeleton {
    position: relative;
    overflow: hidden;
    background: #e3e7eb;
    border-radius: 8px;
}

.skeleton::after {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(90deg,
            transparent,
            rgba(255, 255, 255, 0.6),
            transparent);
    transform: translateX(-100%);
    animation: shimmer 1.4s infinite;
}

@keyframes shimmer {
    100% {
        transform: translateX(100%);
    }
}