:root {
    --tooltip-background-color: #b3e4dc;
    --tooltip-color: #000036;
    --modal-body-background: #f7f7f8;
    --drawer-border: #d3d4dc;
    --drawer-border-50: #d3d4dc80;
    --drawer-header-background: #f7f7f7;
    --drawer-body-background: #ffffff;
    --modal-header-background: #ffffff80;
    --calendar-icon-color: #000036;
    --calendar-background-primary: #f8f8f9;
    --calendar-background-secondary: #fcfcfc;
    --calendar-border: #dddee2;
    --header-height: 10px;
    --header-tabs-height: 50px;
    --notification-background-color: #f8f8f9;
    --notification-background-border-color: #dadbdd;
    --notification-item-border-color: #f0f0f0;
    --notification-header-background-color: #f0f0f0;
    --bulk-action-button-background: #f7f7f7bf;
    --bulk-action-button-active-background: #f7f7f7;
    --drag-drop-background: #f1f2f3;
    --drag-drop-background-active: #ffffff;
    --folder-navigation-background: #ffffff;
    --dropdown-option-header-background-color: #ffffff80;
    --assets-folder-top: #b6b9bd80;
    --assets-folder-bottom: #00003680;
    --table-class-table-header-background-color-no-opacity: #f6f6f7;
    --pagination-wrapper-background: #ffffff;
    --icon-wrapper-normal: #ffffff;
    --icon-wrapper-active: #00aeef;
    --icon-wrapper-content: #747593;
    --navigation-expand-icon: #331b27;
    /*buttons*/
    --primary-button-color: #00aeef;
    --primary-button-color-75: #00aeefbf;
    --primary-button-color-50: #00aeef80;
    --primary-button-color-25: #00aeef40;
    --primary-button-color-hover: #007dbe;
    /*secondary-button*/
    --secondary-button-color: #b6b9bd;
    --secondary-button-color-75: #b6b9bdbf;
    --secondary-button-color-50: #b6b9bd80;
    --secondary-button-color-25: #b6b9bd40;
    --secondary-button-color-hover: #747593;
    /*default-button*/
    --default-button-color: #ebecee;
    --default-button-color-75: #ebeceebf;
    --default-button-color-50: #ebecee80;
    --default-button-color-25: #ebecee40;
    --default-button-color-hover: #ebecee;
    /*disabled-button*/
    --button-disabled: #ebecee;
    /*danger-button*/
    --danger-button-color: #f83e3e;
    --danger-button-color-hover: #bb2d3b;
    /*warning-button*/
    --warning-button-color: #ffb507;
    --warning-button-color-hover: #f5ac00;
    /*info-button*/
    --info-button-color: #06a98f;
    --info-button-color-hover: #3a8575;
    /*status*/
    --status-danger: #f83e3e;
    --status-warning: #ffb507;
    --status-info: #a5e6dc;
    --status-success: #00da9f;
    /*text colors*/
    --text-main-color: #000036;
    --text-main-color-75: #000036bf;
    --text-main-color-50: #00003680;
    --text-main-color-25: #00003640;
    --text-secondary-color: #ffffff;
    --text-disabled-color: #b6b9bd;
    --text-link-color: #00aeef;
    --text-link-color-hover: #007dbe;
    --text-menu-color: #7f7f9a;
    --checked-button-color: #00aeef;
    --unchecked-button-color: #ffffff7c;
    --primary-item-color: #00aeef;
    --primary-item-color-75: #00aeefbf;
    --primary-item-color-50: #00aeef80;
    --primary-item-color-25: #00aeef40;
    --primary-item-color-hover: #007dbe;
    /*background-color*/
    --background-color-v1: #f7f7f7;
    --background-color-v1-95: #f7f7f7f2; /* 95% (≈94.9%) */
    --background-color-v1-75: #f7f7f7bf;
    --background-color-v1-50: #f7f7f780;
    --background-color-v1-25: #f7f7f740;
    --background-color-v2: #ebecee;
    --background-color-v2-75: #ebeceebf;
    --background-color-v2-50: #ebecee80;
    --background-color-v2-25: #ebecee40;
    --background-color-v3: #d3d4dc;
    --background-color-v3-75: #d3d4dcbf;
    --background-color-v3-50: #d3d4dc80;
    --background-color-v3-25: #d3d4dc40;
    --background-color-v4: #747593;
    --background-color-v4-75: #747593bf;
    --background-color-v4-50: #74759380;
    --background-color-v4-25: #74759340;
    --background-color-v5: #ffffff;
    --background-color-menu-header: #f7f7f7;
    /*input*/
    --input-background-color: #f0f0f2;
    --input-background-color-disabled: #f0f0f2;
    --input-border-color: #b6b9bd;
    --input-focus-border-color: #00aeef !important;
    --input-disabled-text-color: #b6b9bd;
    --input-disabled-border-color: #ebecee;
    /*my table*/
    --table-class-table-header-background-color: #f5f5f6;
    --table-class-table-text-color: #747593;
    --table-class-table-row-background-color: #ffffff;
    /*select options(dropdown)*/
    --dropdown-option-background-color: #f7f7f8;
    --dropdown-option-text-color: #747593;
    /*MENU*/
    /*side menu dropdown*/
    --menu-dropdown-background-color: #ffffff;
    --menu-dropdown-item-text-color: #7f7f9a;
    --menu-dropdown-text-color: #404068;
    --dropdown-text-hover: #7c7c9c;
    --dropdown-background-color-hover: #ebecee80;
    --menu-active-page-menu: #000035;
    --header-tabs-border-color: #331b271f;
    /*box shadow*/
    --box-shadow-color: #a0a0a00f;
    --box-shadow-side-menu-color: #0000000d;
    --box-shadow-color-v2: #00000029;
    /*scroll-bar*/
    --scrollbar-color: #c1c1c1;
    --scrollbar-background-color: #ffffff;
    /*pagination*/
    --pagination-item-active-background-color: #b6b9bd;
    --pagination-item-background-color: #9999991a;
    --pagination-item-background-color-hover: #9999994d;
    --pagination-input-background-color: #747593;
    --pagination-whole-background-color: var(--background-color-v5);
    /*mobile breakpoints*/
    --breakpoint-max-mobile: 575.98px;
    --breakpoint-min-large-mobile: 576px;
    --breakpoint-max-large-mobile: 767.98px;
    --breakpoint-min-tablet: 768px;
    --breakpoint-max-tablet: 991.98px;
    --breakpoint-min-desktop: 992px;
}

:root .my-form-switch:checked {
    --bs-form-switch-bg: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3e%3ccircle r='3' fill='%2300aeef' /%3e%3c/svg%3e") !important;
}

@font-face {
    font-family: "Inter";
    src: url("/font-family/Inter-Thin.ttf") format("truetype");
    font-weight: 100;
    font-display: swap;
}

@font-face {
    font-family: "Inter";
    src: url("/font-family/Inter-ExtraLight.ttf") format("truetype");
    font-weight: 200;
    font-display: swap;
}

@font-face {
    font-family: "Inter";
    src: url("/font-family/Inter-Light.ttf") format("truetype");
    font-weight: 300;
    font-display: swap;
}

@font-face {
    font-family: "Inter";
    src: url("/font-family/Inter-Regular.ttf") format("truetype");
    font-weight: 400;
    font-display: swap;
}

@font-face {
    font-family: "Inter";
    src: url("/font-family/Inter-Medium.ttf") format("truetype");
    font-weight: 500;
    font-display: swap;
}

@font-face {
    font-family: "Inter";
    src: url("/font-family/Inter-SemiBold.ttf") format("truetype");
    font-weight: 600;
    font-display: swap;
}

@font-face {
    font-family: "Inter";
    src: url("/font-family/Inter-Bold.ttf") format("truetype");
    font-weight: 700;
    font-display: swap;
}

@font-face {
    font-family: "Inter";
    src: url("/font-family/Inter-ExtraBold.ttf") format("truetype");
    font-weight: 800;
    font-display: swap;
}

@font-face {
    font-family: "Inter";
    src: url("/font-family/Inter-Black.ttf") format("truetype");
    font-weight: 900;
    font-display: swap;
}

@font-face {
    font-family: "Sacramento";
    src: url("/font-family/Sacramento-Regular.ttf") format("truetype");
    font-display: swap;
}

@font-face {
    font-family: "Satisfy";
    src: url("/font-family/Satisfy-Regular.ttf") format("truetype");
    font-display: swap;
}