@font-face {
    font-family: 'PlusJakartaSans-SemiBold';
    src: url('fonts/PlusJakartaSans-SemiBold.eot');
    src: url('fonts/PlusJakartaSans-SemiBold.eot?#iefix') format('embedded-opentype'),
        url('fonts/PlusJakartaSans-SemiBold.woff2') format('woff2'),
        url('fonts/PlusJakartaSans-SemiBold.woff') format('woff'),
        url('fonts/PlusJakartaSans-SemiBold.ttf') format('truetype'),
        url('fonts/PlusJakartaSans-SemiBold.svg#PlusJakartaSans-SemiBold') format('svg');
    font-weight: 600;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'PlusJakartaSans-Medium';
    src: url('fonts/PlusJakartaSans-Medium.eot');
    src: url('fonts/PlusJakartaSans-Medium.eot?#iefix') format('embedded-opentype'),
        url('fonts/PlusJakartaSans-Medium.woff2') format('woff2'),
        url('fonts/PlusJakartaSans-Medium.woff') format('woff'),
        url('fonts/PlusJakartaSans-Medium.ttf') format('truetype'),
        url('fonts/PlusJakartaSans-Medium.svg#PlusJakartaSans-Medium') format('svg');
    font-weight: 500;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'PlusJakartaSans-Bold';
    src: url('fonts/PlusJakartaSans-Bold.eot');
    src: url('fonts/PlusJakartaSans-Bold.eot?#iefix') format('embedded-opentype'),
        url('fonts/PlusJakartaSans-Bold.woff2') format('woff2'),
        url('fonts/PlusJakartaSans-Bold.woff') format('woff'),
        url('fonts/PlusJakartaSans-Bold.ttf') format('truetype'),
        url('fonts/PlusJakartaSans-Bold.svg#PlusJakartaSans-Bold') format('svg');
    font-weight: bold;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'PlusJakartaSans-Regular';
    src: url('fonts/PlusJakartaSans-Regular.eot');
    src: url('fonts/PlusJakartaSans-Regular.eot?#iefix') format('embedded-opentype'),
        url('fonts/PlusJakartaSans-Regular.woff2') format('woff2'),
        url('fonts/PlusJakartaSans-Regular.woff') format('woff'),
        url('fonts/PlusJakartaSans-Regular.ttf') format('truetype'),
        url('fonts/PlusJakartaSans-Regular.svg#PlusJakartaSans-Regular') format('svg');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}



*{box-sizing: border-box;}
body {
    margin: 0px;
    background-color: var(--bg-Gray-100);
    font-family:var(--Body-Fontface);
    line-height: var(--Body-Font-Lineheight);
}
img{max-width: 100%;}
:root{
    --Font-24:24px;
    --Font-22:22px;
    --Font-20:20px;
    --Heading1-Font-Size:18px;
    --Heading2-Font-Size:16px;
    --Heading3-Font-Size:14px;
    --Heading4-Font-Size:12px;
    --Heading5-Font-Size:10px;
    --Icon-FontSize20:20px;
    --Icon-FontSize18:18px;
    --Icon-FontSize16:16px;
    --Icon-FontSize14:14px;
    --Font-Face-Regular:'PlusJakartaSans-Regular';
    --Font-Face-Medium:'PlusJakartaSans-Medium';
    --Font-Face-SemiBold:'PlusJakartaSans-SemiBold';
    --Font-Face-Bold:'PlusJakartaSans-Bold';
    --MaterialIcons-Font-Face-Regular:'MaterialIcons-Regular';
    --MaterialIcons-Font-Face-Regular-fill:'MaterialIcons-Regular-fill';
    --MaterialIcons-Wight-Light:300;
    --Heading-Font-Lineheight:19px;
    --text-color-Heading:#222;
    --icon-black-color:#222;
    --Body-Font-Size:13px;
    --Body-Font-Lineheight:18px;
    --Body-Font-Color:#333;
    --text-color-Paragraph:#333;
    --Pills-Font-Size:10px;
    --Pills-Icon-Size:12px;
    --Pills-Icon-Md-Size:14px;
    --Pills-Icon-Lg-Size:16px;
    --Body-Fontface:'PlusJakartaSans-Regular';
    --CardShadow:0px 2px 3px 0px rgba(0, 0, 0, 0.15);
    --BodyColor:#f3f3f3;
    --bg-White:#fff;
    --text-White:#fff;
    --bs-border-width: 1px;
    --bs-border-style: solid;
    --bs-border-color: #D1D5DB;
    --Shadow-Small:0 2px 3px rgba(0,0,0,0.15);
    --Shadow-Large:0 0 15px rgba(0,0,0,0.15);
    --Shadow-Dropdown-Menu:0 0 3px rgba(0,0,0,0.15);
    --Shadow-none:none;
    --Border-Radius-sm: 5px !important;
    --Border-Radius-md: 10px !important;
    --Border-Radius-lg: 15px !important;
    --bg-Transparent:transparent;
    --py_10_px_14:10px 14px;
    --pt-10:10px 0 0;
    --pb-10:0 0 10px;
    --p-10:10px;
    --p-14:14px;
    --TH-Spacing:10px 14px;
    --TD-Spacing:10px 14px;
    --Top-Navigation-BgColor:#E3E4E6;
    --bg-PrimaryBlue-50:#EBF3FE;
    --bg-PrimaryBlue-100:#DCE7FE;
    --PrimaryBlue-200:#ADCBFD;
    --border-PrimaryBlue-200:#ADCBFD;
    --PrimaryBlue-300:#75ABFC;
    --text-PrimaryBlue-400:#357EFA;
    --text-PrimaryBlue-500:#0649ED;
    --bg-PrimaryBlue-500:#0649ED;
    --border-PrimaryBlue-500:#0649ED;
    --text-PrimaryBlue-600:#0632DA;
    --bg-PrimaryBlue-600:#0632DA;
    --border-PrimaryBlue-600:#0632DA;
    --PrimaryBlue-700:#0A26C1;
    --border-PrimaryBlue-700:#0A26C1;
    --PrimaryBlue-800:#0E209D;
    --PrimaryBlue-900:#12227A;
    --PrimaryBlue-950:#101749;
    --bg-PrimaryBlue-950:#101749;
    --bg-PomegranateRed-50:#FFF3ED;
    --bg-PomegranateRed-100:#FFE9DB;
    --PomegranateRed-200:#FEC6AA;
    --PomegranateRed-300:#FE9E73;
    --PomegranateRed-400:#FC6C3B;
    --bg-PomegranateRed-500:#FA4616;
    --text-PomegranateRed-500:#FA4616;
    --text-PomegranateRed-600:#EB2B0B;
    --border-PomegranateRed-600:#EB2B0B;
    --PomegranateRed-700:#C31C0B;
    --PomegranateRed-800:#9B1911;
    --PomegranateRed-900:#7C1812;
    --PomegranateRed-950:#430807;
    --bg-Slate-50:#F8FAFC;
    --bg-Slate-100:#F1F5F9;
    --bg-Slate-200:#E2E8F0;
    --Slate-300:#CBD5E1;
    --Slate-400:#94A3B8;
    --text-Slate-500:#64748B;
    --bg-Slate-500:#64748B;
    --text-Slate-600:#475569;
    --border-Slate-600:#475569;
    --Slate-700:#334155;
    --Slate-800:#1E293B;
    --Slate-900:#0F172A;
    --Slate-950:#020617;
    --bg-Gray-50:#F9FAFB;
    --bg-Gray-100:#F3F4F6;
    --bg-Gray-400:#9CA3AF;
    --border-Gray-100:#F3F4F6;
    --Gray-200:#E5E7EB;
    --bg-Gray-200:#E5E7EB;
    --bg-Gray-300:#D1D5DB;
    --text-Gray-300:#D1D5DB;
    --border-Gray-300:#D1D5DB;
    --text-Gray-400:#9CA3AF;
    --border-Gray-400:#9CA3AF;
    --text-Gray-500:#6B7280;
    --bg-Gray-500:#6B7280;
    --text-Gray-600:#4B5563;
    --border-Gray-600:#4B5563;
    --Gray-700:#374151;
    --Gray-800:#1F2937;
    --Gray-900:#111827;
    --Gray-950:#030712;
    --bg-Purple-50:#F5F3FF;
    --bg-Purple-100:#EDE9FE;
    --Purple-200:#DDD6FE;
    --Purple-300:#C4B5FD;
    --Purple-400:#A78BFA;
    --text-Purple-500:#8B5CF6;
    --bg-Purple-500:#8B5CF6;
    --text-Purple-600:#7C3AED;
    --border-Purple-600:#7C3AED;
    --Purple-700:#6D28D9;
    --Purple-800:#5B21B6;
    --Purple-900:#4C1D95;
    --Purple-950:#2E1065;
    --bg-Blue-50:#F0F9FF;
    --bg-Blue-100:#E0F2FE;
    --Blue-200:#BAE6FD;
    --Blue-300:#7DD3FC;
    --Blue-400:#38BDF8;
    --text-Blue-500:#0EA5E9;
    --bg-Blue-500:#0EA5E9;
    --text-Blue-600:#0284C7;
    --border-Blue-600:#0284C7;
    --Blue-700:#0369A1;
    --Blue-800:#075985;
    --Blue-900:#0C4A6E;
    --Blue-950:#082F49;
    --bg-Green-50:#F2FBF4;
    --bg-Green-100:#E1F7E6;
    --Green-200:#C5EDCE;
    --Green-300:#97DEA8;
    --text-Green-400:#62C679;
    --text-Green-500:#3BA755;
    --bg-Green-500:#3BA755;
    --text-Green-600:#2D8C44;
    --bg-Green-600:#2D8C44;
    --border-Green-600:#2D8C44;
    --Green-700:#266F38;
    --Green-800:#235830;
    --Green-900:#1E492A;
    --Green-950:#0C2714;
    --bg-Yellow-50:#FFFBEB;
    --bg-Yellow-100:#FEF3C7;
    --Yellow-200:#FDE68A;
    --Yellow-300:#FCD34D;
    --text-Yellow-400:#FBBF24;
    --text-Yellow-500:#F59E0B;
    --border-Yellow-500:#F59E0B;
    --bg-Yellow-500:#F59E0B;
    --text-Yellow-600:#D97706;
    --bg-Yellow-600:#D97706;
    --border-Yellow-600:#D97706;
    --Yellow-700:#B45309;
    --Yellow-800:#92400E;
    --Yellow-900:#78350F;
    --Yellow-950:#451A03;
    --bg-Orange-50:#FFF7ED;
    --bg-Orange-100:#FFEDD5;
    --Orange-200:#FED7AA;
    --Orange-300:#FDBA74;
    --Orange-400:#FB923C;
    --text-Orange-500:#F97316;
    --bg-Orange-500:#F97316;
    --border-Orange-500:#F97316;
    --text-Orange-600:#EA580C;
    --border-Orange-600:#EA580C;
    --Orange-700:#C2410C;
    --Orange-800:#9A3412;
    --Orange-900:#7C2D12;
    --Orange-950:#431407;
    --bg-Red-50:#FEF2F2;
    --bg-Red-100:#FEE2E2;
    --Red-200:#FECACA;
    --Red-300:#FCA5A5;
    --text-Red-400:#F87171;
    --text-Red-500:#EF4444;
    --bg-Red-500:#EF4444;
    --text-Red-600:#DC2626;
    --border-Red-600:#DC2626;
    --bg-Red-600:#DC2626;
    --Red-700:#B91C1C;
    --Red-800:#991B1B;
    --Red-900:#7F1D1D;
    --Red-950:#450A0A;
    --bg-Pink-50:#FDF2F8;
    --bg-Pink-100:#FCE7F3;
    --Pink-200:#FBCFE8;
    --Pink-300:#F9A8D4;
    --Pink-400:#F472B6;
    --text-Pink-500:#EC4899;
    --bg-Pink-500:#EC4899;
    --text-Pink-600:#DB2777;
    --border-Pink-600:#DB2777;
    --Pink-700:#BE185D;
    --Pink-800:#9D174D;
    --Pink-900:#831843;
    --Pink-950:#500724;
    --bs-modal-header-padding-x: 16px;
    --bs-modal-header-padding-y: 16px;
    --bs-modal-header-padding: 16px 16px;
}
.col, .col-1, .col-10, .col-11, .col-12, .col-2, .col-3, .col-4, .col-5, .col-6, .col-7, .col-8, .col-9, .col-auto, .col-lg, .col-lg-1, .col-lg-10, .col-lg-11, .col-lg-12, .col-lg-2, .col-lg-3, .col-lg-4, .col-lg-5, .col-lg-6, .col-lg-7, .col-lg-8, .col-lg-9, .col-lg-auto, .col-md, .col-md-1, .col-md-10, .col-md-11, .col-md-12, .col-md-2, .col-md-3, .col-md-4, .col-md-5, .col-md-6, .col-md-7, .col-md-8, .col-md-9, .col-md-auto, .col-sm, .col-sm-1, .col-sm-10, .col-sm-11, .col-sm-12, .col-sm-2, .col-sm-3, .col-sm-4, .col-sm-5, .col-sm-6, .col-sm-7, .col-sm-8, .col-sm-9, .col-sm-auto, .col-xl, .col-xl-1, .col-xl-10, .col-xl-11, .col-xl-12, .col-xl-2, .col-xl-3, .col-xl-4, .col-xl-5, .col-xl-6, .col-xl-7, .col-xl-8, .col-xl-9, .col-xl-auto {
    padding-right: 0;
    padding-left: 0;
}
[type=button]:not(:disabled), [type=reset]:not(:disabled), [type=submit]:not(:disabled), button:not(:disabled) {
    cursor: pointer;
}
hr{border-color:var(--border-Gray-300);opacity: 1;}
.material-symbols-outlined{color: var(--text-Gray-400);}
h1,h2,h3,h4,h5,h6,p{margin: 0;}
/* Firefox ONLY */
@-moz-document url-prefix() {
  .cus-scrollbar {
    scrollbar-width: thin;
    scrollbar-color: var(--bg-Gray-300) var(--bg-Transparent);
  }
}
::-webkit-scrollbar{
    height:5px;
    width: 5px;
    border-radius: var(--Border-Radius-md);
}
::-webkit-scrollbar-thumb{
    background-color:var(--bg-Gray-300);
    border-radius: var(--Border-Radius-md);
}
::-webkit-scrollbar-track {
    background: var(--bg-Transparent);
    border-radius: var(--Border-Radius-md);
}
.font-italic{font-style:italic;}
.font-regular{font-family: var(--Font-Face-Regular);}
.font-Medium{font-family: var(--Font-Face-Medium);}
.font-semibold{font-family: var(--Font-Face-SemiBold);}
.font-bold, strong{font-family: var(--Font-Face-Bold);}
.Icon-FontSize20{font-size:var(--Icon-FontSize20) !important;line-height:20px;}
.Icon-FontSize18{font-size:var(--Icon-FontSize18) !important;line-height:18px;}
.Icon-FontSize16{font-size:var(--Icon-FontSize16) !important;line-height:16px;}
.Icon-FontSize14{font-size:var(--Icon-FontSize14) !important;line-height:14px;}
.Pills-Icon-Md-Size{font-size:var(--Pills-Icon-Md-Size) !important;}
.Pills-Icon-Lg-Size{font-size:var(--Pills-Icon-Lg-Size) !important;}
.Shadow-Small{box-shadow: var(--Shadow-Small) !important;}
.Shadow-Large{box-shadow: var(--Shadow-Large) !important;}
.Shadow-Dropdown-Menu{box-shadow: var(--Shadow-Dropdown-Menu) !important;}
.Border-Radius-sm{border-radius: var(--Border-Radius-sm) !important;}
.Border-Radius-md{border-radius: var(--Border-Radius-md) !important;}
.Border-Radius-lg{border-radius: var(--Border-Radius-lg) !important;}
.border{border: 1px solid var(--border-Gray-300) !important;}
.border-top{border-top: 1px solid var(--border-Gray-300) !important;}
.border-right{border-right: 1px solid var(--border-Gray-300) !important;}
.border-bottom{border-bottom: 1px solid var(--border-Gray-300) !important;}
.border-left{border-left: 1px solid var(--border-Gray-300) !important;}
.border-2{border: 2px solid var(--border-Gray-300) !important;}
.border-right-2{border-right: 2px solid var(--border-Gray-300) !important;}
.border-bottom-2{border-bottom: 2px solid var(--border-Gray-300) !important;}
.border-left-2{border-left: 2px solid var(--border-Gray-300) !important;}
.bg-Gray-50{background-color: var(--bg-Gray-50) !important;}
.bg-Gray-100{background-color: var(--bg-Gray-100) !important;}
.bg-Gray-200{background-color: var(--bg-Gray-200) !important;}
.bg-Gray-300{background-color: var(--bg-Gray-300) !important;}
.text-Gray-400{color: var(--text-Gray-500) !important;}
.text-Gray-500{color: var(--text-Gray-500) !important;}
.text-Gray-600{color: var(--text-Gray-600) !important;}
.bg-Yellow-50{background-color: var(--bg-Yellow-50) !important;}
.bg-Yellow-100{background-color: var(--bg-Yellow-100) !important;}
.text-Yellow-400{color: var(--text-Yellow-400) !important;}
.text-Yellow-500{color: var(--text-Yellow-500) !important;}
.text-Yellow-600{color: var(--text-Yellow-600) !important;}
.bg-Purple-50{background-color: var(--bg-Purple-50) !important;}
.bg-Purple-100{background-color: var(--bg-Purple-100) !important;}
.text-Purple-500{color: var(--text-Purple-500) !important;}
.text-Purple-600{color: var(--text-Purple-600) !important;}
.bg-PrimaryBlue-50{background-color: var(--bg-PrimaryBlue-50) !important;}
.bg-PrimaryBlue-100{background-color: var(--bg-PrimaryBlue-100) !important;}
.text-PrimaryBlue-400{color: var(--text-PrimaryBlue-400) !important;}
.text-PrimaryBlue-500{color: var(--text-PrimaryBlue-500) !important;}
.text-PrimaryBlue-600{color: var(--text-PrimaryBlue-600) !important;}
.bg-PrimaryBlue-600{background-color: var(--bg-PrimaryBlue-600) !important;}
.bg-PomegranateRed-50{background-color: var(--bg-PomegranateRed-50) !important;}
.bg-PomegranateRed-100{background-color: var(--bg-PomegranateRed-100) !important;}
.text-PomegranateRed-500{color: var(--text-PomegranateRed-500) !important;}
.text-PomegranateRed-600{color: var(--text-PomegranateRed-600) !important;}
.bg-Green-50{background-color: var(--bg-Green-50) !important;}
.bg-Green-100{background-color: var(--bg-Green-100) !important;}
.text-Green-400{color: var(--text-Green-400) !important;}
.text-Green-500{color: var(--text-Green-500) !important;}
.text-Green-600{color: var(--text-Green-600) !important;}
.bg-Green-600{background-color: var(--bg-Green-600) !important;}
.bg-Red-50{background-color: var(--bg-Red-50) !important;}
.bg-Red-100{background-color: var(--bg-Red-100) !important;}
.text-Red-400{color: var(--text-Red-400) !important;}
.text-Red-500{color: var(--text-Red-500) !important;}
.text-Red-600{color: var(--text-Red-600) !important;}
.bg-Red-600{background-color: var(--bg-Red-600) !important;}
.bg-Orange-50{background-color: var(--bg-Orange-50) !important;}
.bg-Orange-100{background-color: var(--bg-Orange-100) !important;}
.text-Orange-500{color: var(--text-Orange-500) !important;}
.text-Orange-600{color: var(--text-Orange-600) !important;}
.bg-Blue-50{background-color: var(--bg-Blue-50) !important;}
.bg-Blue-100{background-color: var(--bg-Blue-100) !important;}
.text-Blue-500{color: var(--text-Blue-500) !important;}
.text-Blue-600{color: var(--text-Blue-600) !important;}
.bg-Pink-50{background-color: var(--bg-Pink-50) !important;}
.bg-Pink-100{background-color: var(--bg-Pink-100) !important;}
.text-Pink-500{color: var(--text-Pink-500) !important;}
.text-Pink-600{color: var(--text-Pink-600) !important;}
.bg-Slate-50{background-color: var(--bg-Slate-50) !important;}
.bg-Slate-100{background-color: var(--bg-Slate-100) !important;}
.bg-Slate-200{background-color: var(--bg-Slate-200) !important;}
.text-Slate-500{color: var(--text-Slate-500) !important;}
.text-Slate-600{color: var(--text-Slate-600) !important;}
.text-White{color: var(--text-White) !important;}
.bg-White{background-color: var(--bg-White) !important;}
.text-color-Paragraph{color: var(--text-color-Paragraph) !important;}
.text-color-Heading{color: var(--text-color-Heading) !important;}
.bg-Gray-500{background-color: var(--bg-Gray-500) !important;}
.bg-Yellow-500{background-color: var(--bg-Yellow-500) !important;}
.bg-Purple-500{background-color: var(--bg-Purple-500) !important;}
.bg-PrimaryBlue-500{background-color: var(--bg-PrimaryBlue-500) !important;}
.bg-PomegranateRed-500{background-color: var(--bg-PomegranateRed-500) !important;}
.bg-Green-500{background-color: var(--bg-Green-500) !important;}
.bg-Red-400{background-color: var(--bg-Red-400) !important;}
.bg-Red-500{background-color: var(--bg-Red-500) !important;}
.bg-Orange-500{background-color: var(--bg-Orange-500) !important;}
.bg-Blue-500{background-color: var(--bg-Blue-500) !important;}
.bg-Pink-500{background-color: var(--bg-Pink-500) !important;}
.bg-Slate-500{background-color: var(--bg-Slate-500) !important;}
span.paragraph{display: inline-block;}
.border-Yellow-600{border-color: var(--border-Yellow-600) !important;}
.border-Green-600{border-color: var(--border-Green-600) !important;}
.border-Blue-600{border-color: var(--border-Blue-600) !important;}
.border-Red-600{border-color: var(--border-Red-600) !important;}
.border-Purple-600{border-color: var(--border-Purple-600) !important;}
.border-Pink-600{border-color: var(--border-Pink-600) !important;}
.border-PrimaryBlue-600{border-color: var(--border-PrimaryBlue-600) !important;}
.border-PomegranateRed-600{border-color: var(--border-PomegranateRed-600) !important;}
.border-Orange-600{border-color: var(--border-Orange-600) !important;}
.border-Slate-600{border-color: var(--border-Slate-600) !important;}
.border-Gray-600{border-color: var(--border-Gray-600) !important;}
.icon-black-color{color: var(--icon-black-color) !important;}
/* Padding */
.px-2{
    padding-right: 2px !important;
    padding-left: 2px !important;
}
.px-4{
    padding-right: 4px !important;
    padding-left: 4px !important;
}
.px-6{
    padding-right: 6px !important;
    padding-left: 6px !important;
}
.px-8{
    padding-right: 8px !important;
    padding-left: 8px !important;
}
.px-10{
    padding-right: 10px !important;
    padding-left: 10px !important;
}
.px-12{
    padding-right: 12px !important;
    padding-left: 12px !important;
}
.px-12{
    padding-right: 12px !important;
    padding-left: 12px !important;
}
.px-14{
    padding-right: 14px !important;
    padding-left: 14px !important;
}
.px-16{
    padding-right: 16px !important;
    padding-left: 16px !important;
}
.px-18{
    padding-right: 18px !important;
    padding-left: 18px !important;
}
.px-20{
    padding-right: 20px !important;
    padding-left: 20px !important;
}
.px-22{
    padding-right: 22px !important;
    padding-left: 22px !important;
}
.px-24{
    padding-right: 24px !important;
    padding-left: 24px !important;
}
.px-26{
    padding-right: 26px !important;
    padding-left: 26px !important;
}
.px-28{
    padding-right: 28px !important;
    padding-left: 28px !important;
}
.px-30{
    padding-right: 30px !important;
    padding-left: 30px !important;
}
.py-2{
    padding-top: 2px !important;
    padding-bottom: 2px !important;
}
.py-4{
    padding-top: 4px !important;
    padding-bottom: 4px !important;
}
.py-6{
    padding-top: 6px !important;
    padding-bottom: 6px !important;
}
.py-8{
    padding-top: 8px !important;
    padding-bottom: 8px !important;
}
.py-10{
    padding-top: 10px !important;
    padding-bottom: 10px !important;
}
.py-12{
    padding-top: 12px !important;
    padding-bottom: 12px !important;
}
.py-12{
    padding-top: 12px !important;
    padding-bottom: 12px !important;
}
.py-14{
    padding-top: 14px !important;
    padding-bottom: 14px !important;
}
.py-16{
    padding-top: 16px !important;
    padding-bottom: 16px !important;
}
.py-18{
    padding-top: 18px !important;
    padding-bottom: 18px !important;
}
.py-20{
    padding-top: 20px !important;
    padding-bottom: 20px !important;
}
.py-22{
    padding-top: 22px !important;
    padding-bottom: 22px !important;
}
.py-24{
    padding-top: 24px !important;
    padding-bottom: 24px !important;
}
.py-26{
    padding-top: 26px !important;
    padding-bottom: 26px !important;
}
.py-28{
    padding-top: 28px !important;
    padding-bottom: 28px !important;
}
.py-30{
    padding-top: 30px !important;
    padding-bottom: 30px !important;
}
.p-2{padding: 2px !important;}
.p-4{padding: 4px !important;}
.p-6{padding: 6px !important;}
.p-8{padding: 8px !important;}
.p-10{padding: 10px !important;}
.p-12{padding: 12px !important;}
.p-14{padding: 14px !important;}
.p-16{padding: 16px !important;}
.p-18{padding: 18px !important;}
.p-20{padding: 20px !important;}
.p-22{padding: 22px !important;}
.p-24{padding: 24px !important;}
.p-26{padding: 26px !important;}
.p-28{padding: 28px !important;}
.p-30{padding: 30px !important;}
.pe-2{padding-right: 2px !important;}
.pe-4{padding-right: 4px !important;}
.pe-6{padding-right: 6px !important;}
.pe-8{padding-right: 8px !important;}
.pe-10{padding-right: 10px !important;}
.pe-12{padding-right: 12px !important;}
.pe-14{padding-right: 14px !important;}
.pe-16{padding-right: 16px !important;}
.pe-18{padding-right: 18px !important;}
.pe-20{padding-right: 20px !important;}
.pe-22{padding-right: 22px !important;}
.pe-24{padding-right: 24px !important;}
.pe-26{padding-right: 26px !important;}
.pe-28{padding-right: 28px !important;}
.pe-30{padding-right: 30px !important;}
.ps-2{padding-left: 2px !important;}
.ps-4{padding-left: 4px !important;}
.ps-6{padding-left: 6px !important;}
.ps-8{padding-left: 8px !important;}
.ps-10{padding-left: 10px !important;}
.ps-12{padding-left: 12px !important;}
.ps-14{padding-left: 14px !important;}
.ps-16{padding-left: 16px !important;}
.ps-18{padding-left: 18px !important;}
.ps-20{padding-left: 20px !important;}
.ps-22{padding-left: 22px !important;}
.ps-24{padding-left: 24px !important;}
.ps-26{padding-left: 26px !important;}
.ps-28{padding-left: 28px !important;}
.ps-30{padding-left: 30px !important;}
.pt-2{padding-top: 2px !important;}
.pt-4{padding-top: 4px !important;}
.pt-6{padding-top: 6px !important;}
.pt-8{padding-top: 8px !important;}
.pt-10{padding-top: 10px !important;}
.pt-12{padding-top: 12px !important;}
.pt-14{padding-top: 14px !important;}
.pt-16{padding-top: 16px !important;}
.pt-18{padding-top: 18px !important;}
.pt-20{padding-top: 20px !important;}
.pt-22{padding-top: 22px !important;}
.pt-24{padding-top: 24px !important;}
.pt-26{padding-top: 26px !important;}
.pt-28{padding-top: 28px !important;}
.pt-30{padding-top: 30px !important;}
.pb-2{padding-bottom: 2px !important;}
.pb-4{padding-bottom: 4px !important;}
.pb-6{padding-bottom: 6px !important;}
.pb-8{padding-bottom: 8px !important;}
.pb-10{padding-bottom: 10px !important;}
.pb-12{padding-bottom: 12px !important;}
.pb-14{padding-bottom: 14px !important;}
.pb-16{padding-bottom: 16px !important;}
.pb-18{padding-bottom: 18px !important;}
.pb-20{padding-bottom: 20px !important;}
.pb-22{padding-bottom: 22px !important;}
.pb-24{padding-bottom: 24px !important;}
.pb-26{padding-bottom: 26px !important;}
.pb-28{padding-bottom: 28px !important;}
.pb-30{padding-bottom: 30px !important;}
.pt-0{padding-top: 0 !important;}
.pe-0{padding-right: 0 !important;}
.pb-0{padding-bottom: 0 !important;}
.ps-0{padding-left: 0 !important;}
/* Maring */
.mx-2{
    margin-right: 2px !important;
    margin-left: 2px !important;
}
.mx-4{
    margin-right: 4px !important;
    margin-left: 4px !important;
}
.mx-6{
    margin-right: 6px !important;
    margin-left: 6px !important;
}
.mx-8{
    margin-right: 8px !important;
    margin-left: 8px !important;
}
.mx-10{
    margin-right: 10px !important;
    margin-left: 10px !important;
}
.mx-12{
    margin-right: 12px !important;
    margin-left: 12px !important;
}
.mx-12{
    margin-right: 12px !important;
    margin-left: 12px !important;
}
.mx-14{
    margin-right: 14px !important;
    margin-left: 14px !important;
}
.mx-16{
    margin-right: 16px !important;
    margin-left: 16px !important;
}
.mx-18{
    margin-right: 18px !important;
    margin-left: 18px !important;
}
.mx-20{
    margin-right: 20px !important;
    margin-left: 20px !important;
}
.mx-22{
    margin-right: 22px !important;
    margin-left: 22px !important;
}
.mx-24{
    margin-right: 24px !important;
    margin-left: 24px !important;
}
.mx-26{
    margin-right: 26px !important;
    margin-left: 26px !important;
}
.mx-28{
    margin-right: 28px !important;
    margin-left: 28px !important;
}
.mx-30{
    margin-right: 30px !important;
    margin-left: 30px !important;
}
.my-2{
    margin-top: 2px !important;
    margin-bottom: 2px !important;
}
.my-4{
    margin-top: 4px !important;
    margin-bottom: 4px !important;
}
.my-6{
    margin-top: 6px !important;
    margin-bottom: 6px !important;
}
.my-8{
    margin-top: 8px !important;
    margin-bottom: 8px !important;
}
.my-10{
    margin-top: 10px !important;
    margin-bottom: 10px !important;
}
.my-12{
    margin-top: 12px !important;
    margin-bottom: 12px !important;
}
.my-12{
    margin-top: 12px !important;
    margin-bottom: 12px !important;
}
.my-14{
    margin-top: 14px !important;
    margin-bottom: 14px !important;
}
.my-16{
    margin-top: 16px !important;
    margin-bottom: 16px !important;
}
.my-18{
    margin-top: 18px !important;
    margin-bottom: 18px !important;
}
.my-20{
    margin-top: 20px !important;
    margin-bottom: 20px !important;
}
.my-22{
    margin-top: 22px !important;
    margin-bottom: 22px !important;
}
.my-24{
    margin-top: 24px !important;
    margin-bottom: 24px !important;
}
.my-26{
    margin-top: 26px !important;
    margin-bottom: 26px !important;
}
.my-28{
    margin-top: 28px !important;
    margin-bottom: 28px !important;
}
.my-30{
    margin-top: 30px !important;
    margin-bottom: 30px !important;
}
.m-n14{margin: -14px !important;}
.me-2{margin-right: 2px !important;}
.me-4{margin-right: 4px !important;}
.me-6{margin-right: 6px !important;}
.me-8{margin-right: 8px !important;}
.me-10{margin-right: 10px !important;}
.me-12{margin-right: 12px !important;}
.me-14{margin-right: 14px !important;}
.me-16{margin-right: 16px !important;}
.me-18{margin-right: 18px !important;}
.me-20{margin-right: 20px !important;}
.me-22{margin-right: 22px !important;}
.me-24{margin-right: 24px !important;}
.me-26{margin-right: 26px !important;}
.me-28{margin-right: 28px !important;}
.me-30{margin-right: 30px !important;}
.ms-2{margin-left: 2px !important;}
.ms-4{margin-left: 4px !important;}
.ms-6{margin-left: 6px !important;}
.ms-8{margin-left: 8px !important;}
.ms-10{margin-left: 10px !important;}
.ms-12{margin-left: 12px !important;}
.ms-14{margin-left: 14px !important;}
.ms-16{margin-left: 16px !important;}
.ms-18{margin-left: 18px !important;}
.ms-20{margin-left: 20px !important;}
.ms-22{margin-left: 22px !important;}
.ms-24{margin-left: 24px !important;}
.ms-26{margin-left: 26px !important;}
.ms-28{margin-left: 28px !important;}
.ms-30{margin-left: 30px !important;}
.mt-2{margin-top: 2px !important;}
.mt-4{margin-top: 4px !important;}
.mt-6{margin-top: 6px !important;}
.mt-8{margin-top: 8px !important;}
.mt-10{margin-top: 10px !important;}
.mt-12{margin-top: 12px !important;}
.mt-14{margin-top: 14px !important;}
.mt-16{margin-top: 16px !important;}
.mt-18{margin-top: 18px !important;}
.mt-20{margin-top: 20px !important;}
.mt-22{margin-top: 22px !important;}
.mt-24{margin-top: 24px !important;}
.mt-26{margin-top: 26px !important;}
.mt-28{margin-top: 28px !important;}
.mt-30{margin-top: 30px !important;}
.mb-2{margin-bottom: 2px !important;}
.mb-4{margin-bottom: 4px !important;}
.mb-6{margin-bottom: 6px !important;}
.mb-8{margin-bottom: 8px !important;}
.mb-10{margin-bottom: 10px !important;}
.mb-12{margin-bottom: 12px !important;}
.mb-14{margin-bottom: 14px !important;}
.mb-16{margin-bottom: 16px !important;}
.mb-18{margin-bottom: 18px !important;}
.mb-20{margin-bottom: 20px !important;}
.mb-22{margin-bottom: 22px !important;}
.mb-24{margin-bottom: 24px !important;}
.mb-26{margin-bottom: 26px !important;}
.mb-28{margin-bottom: 28px !important;}
.mb-30{margin-bottom: 30px !important;}
.m-2{margin: 2px !important;}
.m-4{margin: 4px !important;}
.m-6{margin: 6px !important;}
.m-8{margin: 8px !important;}
.m-10{margin: 10px !important;}
.m-12{margin: 12px !important;}
.m-14{margin: 14px !important;}
.m-16{margin: 16px !important;}
.m-18{margin: 18px !important;}
.m-20{margin: 20px !important;}
.m-22{margin: 22px !important;}
.m-24{margin: 24px !important;}
.m-26{margin: 26px !important;}
.m-28{margin: 28px !important;}
.m-30{margin: 30px !important;}
.ms-n14{margin-left: -14px !important;}
.mt-0{margin-top: 0 !important;}
.me-0{margin-right: 0 !important;}
.mb-0{margin-bottom: 0 !important;}
.ms-0{margin-left: 0 !important;}
.gap-y-10{row-gap: 10px;}
.gap-y-14{row-gap: 14px;}
.gap-y-20{row-gap: 20px;}
/* Heading Font Size */
.font-18{font-size: var(--Heading1-Font-Size) !important;}
.font-16{font-size: var(--Heading2-Font-Size) !important;}
.font-14{font-size: var(--Heading3-Font-Size) !important;}
.font-12{font-size: var(--Heading4-Font-Size) !important;}
.font-10{font-size: var(--Heading5-Font-Size) !important;}
.font-13{font-size: var(--Body-Font-Size) !important;}
.start-50{left: 50% !important;}
.top-0{top: 0 !important;}
.top-50{top: 50% !important;}
.d-grid {display: grid !important;}
.rounded-5{border-radius: 40px !important;}
.overflow-hidden{overflow: hidden !important;}
h1 small{font-family: var(--Font-Face-SemiBold);}
.material-symbols-outlined {
    font-family: var(--MaterialIcons-Font-Face-Regular) !important;
}
.material-symbols-outlined.fill{
    font-family: var(--MaterialIcons-Font-Face-Regular-fill) !important;
}
h1, .Heading1-Font-Size{
    font-size: var(--Heading1-Font-Size);
    color: var(--text-color-Heading);
    line-height: var(--Heading-Font-Lineheight);
    font-family: var(--Font-Face-SemiBold);
}
h2, .Heading2-Font-Size{
    font-size: var(--Heading2-Font-Size);
    color: var(--text-color-Heading);
    line-height: var(--Heading-Font-Lineheight);
}
h3, .Heading3-Font-Size{
    font-size: var(--Heading3-Font-Size);
    color: var(--text-color-Heading);
    line-height: var(--Heading-Font-Lineheight);
}
h4, .Heading4-Font-Size{
    font-size: var(--Heading4-Font-Size);
    color: var(--text-color-Heading);
    line-height: var(--Heading-Font-Lineheight);
}
h5, .Heading5-Font-Size{
    font-size: var(--Heading5-Font-Size);
    color: var(--text-color-Heading);
    line-height: var(--Heading-Font-Lineheight);
}
p, .paragraph{
    font-size: var(--Body-Font-Size);
    color: var(--Body-Font-Color);
    line-height: var(--Body-Font-Lineheight);
}
aside.sidebar {
    width: 190px;
    border-right: none;
    font-size: var(--Heading-4);
    position: fixed;
    top: 0;
    bottom: 0;
    left: 0;
    transition: transform .25s ease-out;
    z-index: 99;
    background-color: var(--bg-White);
    box-shadow:var(--CardShadow);
    height: 100vh;
    overflow: auto;
}
.sidebar .sidebar-nav {
    line-height: 20px;
    margin: 0 0 5px;
    list-style: none;
    padding: 0;
}
.sidebar .sidebar-nav li{
    padding: 10px 10px 0 10px;
}
.sidebar ul li.sidebar-nav-title{
    padding: var(--p-10);
    border-top: 1px solid var(--border-Gray-100);
    border-bottom: 1px solid var(--border-Gray-100);
    background-color: var(--bg-Gray-100);
}
.sidebar ul li p{
    display: block;
    text-transform: uppercase;
    transition: all .05s ease-out !important;
    font-size: var(--Heading3-Font-Size);
    margin: 0;
    color: var(--text-Gray-600);
    font-family: var(--Font-Face-SemiBold);
}
.sidebar ul li a {
    display: block;
    font-weight: 500;
    transition: all .05s ease-out !important;
    border-radius: 7px;
    padding: 7px 10px;
    text-decoration: none;
    width: 100%;
    font-size: var(--Heading3-Font-Size);
    color: var(--text-color-Heading);
}
.sidebar ul li a.active,
.sidebar ul li a:hover {
    background-color:var(--bg-PrimaryBlue-100);
    color: var(--text-PrimaryBlue-500);
}
.aside-with-content {
    width: calc(100% - 190px);
    float: right;
}
.shadow{
    box-shadow: var(--Shadow-Small) !important;
}
.table-regular thead th{
    font-size: var(--Paragraph);
    color: var(--text-color-Heading);
    padding: var(--TH-Spacing);
}
.table-regular tbody td{
    padding: var(--TD-Spacing);
    font-size: var(--Paragraph);
    color: var(--Body-Font-Color);
    border: 0;
    background-color: var(--bg-Transparent);
}
.badge{
    border-radius: var(--Border-Radius-lg);
    font-size: var(--Pills-Font-Size);
    font-family:var(--Font-Face-SemiBold);
    padding: 1px 16px;
    min-width: 70px;
    display: inline-flex;
    flex-wrap: wrap;
    align-items: center;
    min-height: 18px;
    justify-content: center;
    text-align: center;
}
.badge>i{
    font-size: var(--Pills-Icon-Size);
}
.text-bg-primary{
    color: var(--text-Blue-600) !important;
    background-color: var(--bg-Blue-100) !important;
}
.text-bg-primary>i{
    color: var(--text-Blue-600) !important;
}
.badge-sm{
    padding: 0 0 1px;
    min-width: 22px;
    min-height: 14px;
    font-size: 9px;
}
.badge-sm.text-bg-danger{
    color: var(--text-White) !important;
    background-color: var(--bg-PomegranateRed-500) !important;
}
.menubar{
    padding: 0 0 40px;
    background-color: var(--bg-Gray-100);
}
.menubar ul{
    padding: 0;
    margin: 0;
}
.menubar ul li{
    list-style: none;
    display: inline-block;
}
.menubar>ul>li>a{
    padding: 10px 8px;
    text-decoration-line: none;
    display: flex;
    flex-wrap: wrap;
    font-size: var(--Heading4-Font-Size);
    line-height: var(--Heading-Font-Lineheight);
    color: var(--text-color-Heading);
    /* background-color: var(--Top-Navigation-BgColor); */
    font-family: var(--Font-Face-SemiBold);
    /* border-bottom:2px solid var(--bs-border-color); */
    border-left: 2px solid var(--bg-Transparent);
    border-right: 2px solid var(--bg-Transparent);
    border-radius: 0;
}
.menubar>ul>li>a.active {
    color: var(--text-PrimaryBlue-600);
    background-color: var(--bg-White);
    /* border-bottom: 2px solid var(--bg-White); */
    border-left-color: var(--border-Gray-300);
    border-right-color: var(--border-Gray-300);
    position: relative;
}
.menubar>ul>li>a.active::before {
    position: absolute;
    content: '';
    background-color: var(--bg-White);
    width: 100%;
    height: 2px;
    bottom: -2px;
    left: 0;
    z-index: 9;
}
.mega-menu{
    left: 0;
    min-height: 40px;
    border-bottom: 2px solid var(--border-Gray-300);
    display: none;
    position: absolute;
    background-color: var(--bg-White);
    width: 100%;
    border-top: 2px solid var(--border-Gray-300);
}
.menubar ul.mega-menu li a{
    padding: 10px 8px;
    font-size: var(--Heading4-Font-Size);
    line-height: var(--Heading-Font-Lineheight);
    color: var(--text-color-Heading);
    font-family: var(--Font-Face-Regular);
    text-decoration-line: none;
    display: flex;
    flex-wrap: wrap;
    position: relative;
}
.menubar ul.mega-menu li a::before{
    position: absolute;
    content: '';
    left: 0;
    background-color: var(--bg-PrimaryBlue-600);
    width: 0;
    height: 2px;
    bottom: -2px;
    transition: all 0.4s ease;
}
.menubar ul.mega-menu li a.child-active{
    color: var(--text-PrimaryBlue-600);
}
.menubar ul.mega-menu li a.child-active::before{
    width: 100%;
}
.nav-tabs {
    background-color: var(--bg-White);
}
.nav-tabs .nav-link {
    border: 0;
    border-top-left-radius: 0;
    border-top-right-radius: 0;
    padding: var(--py_10_px_14);
    position: relative;
    color: var(--text-color-Heading);
    font-size: var(--Heading3-Font-Size);
    font-family: var(--Font-Face-Bold);
    cursor: pointer;
    outline: 0;
    background-color: var(--bg-Transparent);
}
.nav-tabs .nav-link:focus,
.nav-tabs .nav-link.active, 
.nav-tabs .nav-item.show .nav-link{
    color: var(--text-PrimaryBlue-600);
    border-bottom-color: var(--border-PrimaryBlue-600);
    background-color: var(--bg-Transparent);
}
.nav-tabs .nav-link::before{
    content: "";
    position: absolute;
    height: 2px;
    left: 0;
    right: 0;
    bottom: 0;
    transform: scaleX(0);
    transform-origin: 0 50%;
    transition-duration: 0.4s;
    transition-property: transform;
    transition-timing-function: ease-out;
    background: var(--bg-PrimaryBlue-600);
}
.nav-tabs .nav-link.active:before {
    -webkit-transform: scaleX(1);
    transform: scaleX(1);
}
.border-bottom-2.nav-tabs .nav-link::before{
    bottom: -1px;
}

/* Google icon */
.loading-icon{
    animation: loading-shine 2s ease infinite;
    background: -webkit-linear-gradient(330deg, transparent 20%, 
    color-mix(in srgb, var(--bg-Gray-500) 20%, transparent) 40%, 
    color-mix(in srgb, var(--bg-Gray-500) 20%, transparent) 60%, transparent 80%) 100% / 800% 100%;
        background: linear-gradient(120deg, transparent 20%, 
    color-mix(in srgb, var(--bg-Gray-500) 20%, transparent) 40%, 
    color-mix(in srgb, var(--bg-Gray-500) 20%, transparent) 60%, transparent 80%) 100% / 800% 100%;
    font-size: 0 !important;
    min-height: 24px;
    min-width: 24px;
}
@keyframes loading-shine{50%,to{background-position-x:0}}
.material-symbols-outlined::after {
    content: attr(data-icon);
    display: inline-block;
}
.tab-slider{
    display:inline-block;
    width:46px;
    height:26px;
    position:absolute;
    bottom:5px;
    transition:all .2s linear;
    z-index: -9;
    box-shadow: var(--Shadow-Small);
    background: var(--bg-White);
    border-radius: var(--Border-Radius-sm);
}
.animated-tab.nav-tabs{
    border-radius: var(--Border-Radius-sm);
    background-color: var(--bg-Gray-200);
    box-shadow: none;
    padding: 5px;
    position: relative;
    z-index: 9;
    display: inline-flex;
}
.animated-tab.nav-tabs .nav-link{
    padding: 4px 10px;
    font-size: var(--Body-Font-Size);
    color: var(--Body-Font-Color);
    font-family: var(--Font-Face-SemiBold);
    line-height: var(--Body-Font-Lineheight);
}
.animated-tab.nav-tabs .nav-link.active, 
.animated-tab.nav-tabs .nav-item.show .nav-link{
    color: var(--text-color-Heading);
    background-color: var(--bg-Transparent);
}
.animated-tab.nav-tabs .nav-link::before{
    height: 0;
    width: 0;
}
/* First Pagination */
.pagination.pagination-with-entries .page-item{
    font-size: var(--Body-Font-Size);
    color: var(--Body-Font-Color);
}
.pagination.pagination-with-entries .page-item .page-link {
    border-radius: 0;
    border: 0;
    padding: 0;
    background-color: transparent;
    box-shadow: none;
    min-width: auto;
    min-height: auto;
}
.pagination.pagination-with-entries .page-item{
    border-right: 0;
}
/* Second Pagination */
.pagination {
    overflow: hidden;
}
.pagination .page-item{
    font-size: var(--Heading3-Font-Size);
    font-family: var(--Font-Face-Bold);
    color: var(--text-color-Heading);
    padding: var(--py_10_px_14);
    border-right: 1px solid var(--border-Gray-300);
    background-color: var(--bg-White);
}
.pagination .page-item .page-link{
    font-size: var(--Heading3-Font-Size);
    font-family: var(--Font-Face-Bold);
    color: var(--text-color-Heading);
    box-shadow: var(--Shadow-none);
    background-color: var(--bg-White);
    padding: var(--py_10_px_14);
    border: 0;
    margin: 0px;
    min-width: 40px;
    min-height: 40px;
    text-align: center;
    display: flex;
    align-items: center;
}
.pagination .page-item:has(.page-link),
.pagination .page-item:has(.current-page){
    padding: 0;
}
.pagination .page-item:last-child{
    border-right: 0;
}
.page-link.disabled,
.page-link.disabled>span{
    color: var(--text-Gray-300);
}
.pagination .page-item .current-page {
    background-color: var(--bg-Transparent);
    font-size: var(--Heading3-Font-Size);
    font-family: var(--Font-Face-Bold);
    color: var(--text-PrimaryBlue-600);
    border: 0;
    width: auto;
    padding: 10px 0;
    min-height: 40px;
    max-width: 40px;
    text-align: center;
    outline: 0;
}
.pagination .page-item .current-page:focus{
    outline-offset: -3px;
    border-radius: 5px;
    outline: 1px solid #222;
}
.pagination .page-item input.current-page[type=number]::-webkit-inner-spin-button, 
.pagination .page-item input.current-page[type=number]::-webkit-outer-spin-button { 
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    margin: 0; 
}
.pagination .page-item input.current-page[type="number"] {
  -moz-appearance: textfield; 
  appearance: textfield; 
}

.pagination .page-item:nth-child(3) {
    padding: 10px 0 10px 14px;
    border-right: 0;
}
.pagination .page-item:nth-child(5) {
    padding: 10px 14px 10px 0;
}
.pagination .page-item.page-item.current{
    border-right: 0;
}
.avatar.btn,
.avatar{
    font-size: var(--Body-Font-Size);
    font-family: var(--Font-Face-SemiBold);
    width: 32px;
    height: 32px;
    min-width: 32px;
    min-height: 32px;
    border-radius: 100%;
    overflow: hidden;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: center;
}
.avatar.avatar-sm{
    width: 40px;
    height: 40px;
    min-width: 40px;
    font-size: var(--Heading3-Font-Size);
}
.avatar.avatar-md{
    width: 50px;
    height: 50px;
    min-width: 50px;
    font-size: var(--Heading2-Font-Size);
}
.avatar.avatar-lg{
    width: 90px;
    height: 90px;
    min-width: 90px;
    font-size: 26px;
}
.avatar.avatar-xl{
    width: 120px;
    height: 120px;
    min-width: 120px;
    font-size: 46px;
}
.form-group .input-label{
    font-size: var(--Heading4-Font-Size);
    color: var(--text-color-Heading);
    font-family: var(--Font-Face-SemiBold);
}
.input-group {
    border-radius: var(--Border-Radius-sm);
    border: 1px solid var(--border-Gray-300);
    padding: 0 10px 0 0;
}
.form-control,
.form-control.dropdown-toggle{
    font-size: var(--Body-Font-Size);
    color: var(--Body-Font-Color);
    border: 1px solid var(--border-Gray-300);
    border-radius: var(--Border-Radius-sm);
    box-shadow: var(--Shadow-none) !important;
    width: 100%;
    height: 40px;
    padding: 2px 14px;
}
.input-group>.form-control{
    height: 38px;
}
.form-control:hover,
.form-control:focus{
    border-color:var(--border-Gray-300);
}
textarea.form-control {
    height: 90px;
    min-height: 90px;
    padding: var(--py_10_px_14);
    resize: none;
}
.dropdown.input-group .normal-icn.dropdown-toggle {
    padding: 6px 14px;
    border-right: 1px solid var(--border-Gray-300);
    display: flex;
    align-items: center;
}
select.form-control{
    background-image: url('data:image/svg+xml,<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg"><mask id="mask0_408_346" style="mask-type:alpha" maskUnits="userSpaceOnUse" x="0" y="0" width="24" height="24"><rect width="24" height="24" fill="%23D9D9D9"/></mask><g mask="url(%23mask0_408_346)"><path d="M12 15L7 10H17L12 15Z" fill="%239CA3AF"/></g></svg>') ;
    background-repeat: no-repeat;
    background-position: 98%;
    padding: 2px 30px 2px 14px;
    cursor: pointer;
    appearance: none;
}
.form-control[readonly]{
    padding: 0;
    border: 0;
    height: auto;
    border-radius: 0;
}
.dropdown .dropdown-menu {
    font-size: var(--Body-Font-Size);
    color: var(--Body-Font-Color);
    border: 0;
    border-radius: var(--Border-Radius-sm);
    box-shadow: var(--Shadow-Dropdown-Menu);
    width: max-content !important;
    overflow: hidden;
}
.dropdown-menu .dropdown-item{
    font-size: var(--Body-Font-Size);
    color: var(--Body-Font-Color);
    padding: 6px 14px;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
	font-family: var(--Body-Fontface);
    font-weight: normal;
}
.dropdown-item:focus, .dropdown-item:hover {
    color: var(--Body-Font-Color);
    background-color: var(--bg-Gray-100);
}
.custom-file-input {
    box-shadow: var(--Shadow-none);
    width: 100%;
    cursor: pointer;
    position: absolute;
    margin: 0;
    text-indent: -999px;
    outline: 0;
    right: 0;
    left: 0;
    max-width: 100%;
    height: 100%;
    top: 0;
    z-index: 9;
}
/* .custom-file-label.selected{
    max-width: calc(100% - 85px);
    white-space: nowrap;
    text-overflow: ellipsis;
    display: inline-block !important;
    overflow: hidden;
    line-height: 34px;
}
.custom-file-animated .custom-file-label.selected{
    max-width: 100%;
    white-space: unset;
    text-overflow: unset;
    overflow: unset;
    line-height: normal;
} */
.custom-file-label{
    border: 0;
    border-radius: var(--Border-Radius-sm);
    overflow: hidden;
    padding: 0 85px 0 0;
    position: unset;
    margin: 0;  
}
.inline-file-name{
    display: inline-block;
    line-height: 32px;
    white-space: nowrap;
    text-overflow: ellipsis;
}
.custom-file-label::after {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    z-index: 3;
    display: flex;
    align-items: center;
    content: "Browse";
    cursor: pointer;
    padding: 10px 25px;
    height: 100%;
    border: 0;
    border-radius:0;
    font-size: var(--Body-Font-Size);
    font-family: var(--Font-Face-SemiBold);
    color: var(--Body-Font-Color);
    background: var(--bg-Gray-200);
}
.custom-file-icn-new label.custom-file-label::after {
    font-size: 0;
    background-color: transparent;
    width: 0;
    padding: 0;
}
.custom-file-animated .file__input {
    border-radius: var(--Border-Radius-sm);
    border: 1px dashed var(--border-PrimaryBlue-200);
}
.custom-file-animated .custom-file, .custom-file-animated label.custom-file-label {
    height: 60px;
    display: flex;
    align-items: center;
    color: var(--Body-Font-Color);
    font-family: var(--Font-Face-Regular);
    font-size: var(--Body-Font-Size);
    padding: 0;
    border: 0;
    position: relative;
}
.custom-file-animated .upload-icn-bg {
    width: 60px;
    min-width: 60px;
    height: 60px;
    border-top-left-radius: var(--Border-Radius-sm);
    border-bottom-left-radius: var(--Border-Radius-sm);
    background: var(--bg-PrimaryBlue-50);
    color: var(--text-PrimaryBlue-500);
    z-index: 9;
    display: flex;
    align-items: center;
    justify-content: center;
}
.custom-file-animated .custom-file label {
    color: var(--Body-Font-Color);
    font-family: var(--Font-Face-Regular);
    font-size: var(--Body-Font-Size);
    margin: 0;
    width: calc(100% - 185px);
    padding: 0 10px;
    line-height: var(--Body-Font-Lineheight);
}
.form-group .custom-file-input~.custom-file-browse::after {
    border-radius: var(--Border-Radius-sm);
    border: 1px solid var(--border-PrimaryBlue-500);
    color: var(--text-PrimaryBlue-500);
    background: var(--bg-White);
    font-family: var(--Font-Face-SemiBold);
    padding: 6px 14px;
    height: auto;
    top: 50%;
    bottom: unset;
    content: 'Browse Files';
    transform: translateY(-50%);
    right: 20px;
    position: absolute;
}
.custom-file-reupload.upload-attachment .form-group .custom-file-input~.custom-file-browse::after{
    content: 'Reupload Resume';
}
.custom-file-animated.custom-file-reupload .custom-file label {
    padding: 0 200px 0 10px;
}
.custom-file-reupload .cus-file-action-icon{
    right: 172px;
    z-index: 9;
}
.custom-file-icn-new {
    display: none;
}
.custom-file-animated.upload-attachment .custom-file-icn-new {
    display: flex;
    justify-content: space-between;
    margin: 15px 0 0;
}
.custom-file-icn-new .paperclip {
    transform: rotate(-90deg);
    margin: 0 3px 0 -4px;
}
.custom-file-icn-new label.custom-file-label {
    color: var(--Body-Font-Color);
    font-size: var(--Body-Font-Size);
    height: auto;
    position: unset;
    margin: 0 30px 0 0;
    border: 0;
    outline: 0;
    padding: 0;
    background-color: transparent;
    word-break: break-all;
}
input[type=number]::-webkit-inner-spin-button, 
input[type=number]::-webkit-outer-spin-button {
   opacity: 1;
   cursor: pointer;
}
.cursor-pointer{cursor: pointer !important;}
.iti-flag{
    display: none;
}
.intl-tel-input.separate-dial-code .selected-dial-code{
    padding: 0;
}
.intl-tel-input .flag-container {
    min-width: 70px;
    padding: 0;
}
.iti-sdc-4.intl-tel-input .flag-container {
    min-width: 75px;
}
.iti-sdc-5.intl-tel-input .flag-container {
    min-width: 80px;
}
.intl-tel-input .flag-container>.selected-flag {
    width: 100% !important;
    background-color: var(--bg-Transparent) !important;
    border-right: 1px solid var(--border-Gray-300);
    font-size: var(--Body-Font-Size);
    color: var(--Body-Font-Color);
    padding: 0 14px;
}
.intl-tel-input .selected-flag .iti-arrow{
    margin-top: -1px;
    right: 10px;
    border-left: 5px solid var(--bg-Transparent);
    border-right: 5px solid var(--bg-Transparent);
    border-top: 5px solid var(--border-Gray-400);
}
.intl-tel-input .country-list .flag-box{
    width: auto;
}
.intl-tel-input .country-list{
    border: 1px solid var(--border-Gray-400);
    font-size: var(--Body-Font-Size);
    color: var(--Body-Font-Color);
}
.intl-tel-input .country-list .country .dial-code{
    color: var(--text-color-Heading);
    font-size: var(--Heading3-Font-Size);
}
.input-group .form-control{
    border: 0;
}
.input-group-text{
    padding: 0;
    border: 0;
    background-color: var(--bg-Transparent);
    border-radius: 0;
    outline: 0 !important;
}
.bootstrap-datetimepicker-widget.dropdown-menu{
    top: 100% !important;
    width: max-content;
    min-width: 170px;
    margin: 40px 0 0;
    inset: unset !important;
    box-shadow: var(--Shadow-Dropdown-Menu);
    border: 0;
}
.tempus-dominus-widget{
    width: max-content;
    min-width: 200px;
    margin: 40px 0 0;
    box-shadow: var(--Shadow-Dropdown-Menu);
    font-size: var(--Body-Font-Size);
    color: var(--Body-Font-Color) !important;
}
.tempus-dominus-widget .time-container-clock,
.tempus-dominus-widget .time-container-hour,
.tempus-dominus-widget .time-container-minute{
    grid-auto-rows: 40px;
    grid-template-areas: "a a a a ";
    gap: 0 10px;
}
.tempus-dominus-widget .time-container-clock div:not(.no-highlight),
.tempus-dominus-widget .time-container-hour div:not(.no-highlight),
.tempus-dominus-widget .time-container-minute div:not(.no-highlight){
    width: 40px;
    height: 40px;
    border-radius: var(--Border-Radius-sm);
}
.tempus-dominus-widget .time-container-clock div:not(.no-highlight):hover,
.tempus-dominus-widget.light .time-container-hour div:not(.no-highlight):hover,
.tempus-dominus-widget .time-container-minute div:not(.no-highlight):hover{
    background-color: var(--bg-Slate-100);
}
.tempus-dominus-widget .time-container {
    margin-bottom: 0;
}
.tempus-dominus-widget .time-container-clock .no-highlight{
    width: 100%;
    height: 100%;
}
.bootstrap-datetimepicker-widget td span,
.bootstrap-datetimepicker-widget td{
    height: 40px !important;
    line-height: 40px !important;
    width: 40px !important;
    padding: 0 !important;
    margin: 0 !important;
}
.bootstrap-datetimepicker-widget.dropdown-menu::before, 
.bootstrap-datetimepicker-widget.dropdown-menu::after {
    border: 0 !important;
    margin: 0;
}
.bootstrap-datetimepicker-widget .timepicker .btn {
    padding: 0;
}
.bootstrap-datetimepicker-widget .btn[data-action=togglePeriod]{
    width: 40px;
    height: 40px;
    font-family: var(--Body-Fontface);
}
.tempus-dominus-widget .fa-solid,
.timepicker .fas{
    color: var(--text-color-Heading);
    font-family: var(--MaterialIcons-Font-Face-Regular) !important;
    font-weight: var(--MaterialIcons-Wight-Light);
    font-style: normal;
    font-size: var(--Font-24);
    line-height: 1;
    letter-spacing: normal;
    text-transform: none;
    display: inline-block;
    white-space: nowrap;
    word-wrap: normal;
    direction: ltr;
    -webkit-font-feature-settings: "liga";
    -webkit-font-smoothing: antialiased;
}
.tempus-dominus-widget .fa-arrow-up::before,
.timepicker .fa-arrow-up::before {
    content: '\e316';
}
.tempus-dominus-widget .fa-arrow-down::before,
.timepicker .fa-arrow-down::before{
    content: '\e313';
}
.tempus-dominus-widget .toggleMeridiem,
.timepicker .btn{
    padding: 5px 7px;
    line-height: normal;
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    justify-content: center;
    border: 0 !important;
    min-width: 40px;
    min-height: 40px;
    text-transform: uppercase;
}
.timepicker-picker tr td {
    text-align: center;
}
.timepicker-minutes, 
.timepicker-minutes table,
.timepicker-hours, 
.timepicker-hours table {
    width: 100%;
}
.timepicker-minutes table td,
.timepicker-hours table td {
    padding: var(--pt-10);
    text-align: center;
    font-size: var(--Body-Font-Size);
    color: var(--Body-Font-Color);
}
.bootstrap-datetimepicker-widget.dropdown-menu>ul{
    margin: 0;
}
.timepicker-picker tr td>button.btn {
    cursor: pointer;
    margin: 0 auto;
    border: 0;
    background-color: var(--bg-PrimaryBlue-100) !important;
    color: var(--text-PrimaryBlue-500) !important;
    border-radius: var(--Border-Radius-sm);
    padding: 7px;
    min-width: auto;
}
.timepicker-picker>table{
    width: 100%;
    font-size: var(--Body-Font-Size);
}
.timepicker-minutes table td.minute,
.timepicker-hours table td.hour,
.timepicker-picker .timepicker-minute,
.timepicker-picker .timepicker-hour{
    cursor: pointer;
}
.form-control.dropdown-toggle::after{
    border-left: 5px solid var(--bg-Transparent);
    border-right: 5px solid var(--bg-Transparent);
    border-top: 5px solid var(--border-Gray-400);
    float: right;
    margin: 0 0 0 auto;
}
label.cus-checkbox {
    margin: 0px;
    line-height: 22px;
    min-height: 22px;
    font-family: var(--Font-Face-Regular);
    font-size: var(--Body-Font-Size);
    color: var(--Body-Font-Color);
    cursor: pointer;
    position: relative;
}
.cus-checkbox input {
    position: absolute;
    opacity: 0;
    cursor: pointer;
    height: 0;
    width: 0;
}
.cus-checkmark {
    border: 2px solid var(--border-Gray-300);
    border-radius: 3px;
    position: absolute;
    top: 2px;
    left: 0;
    height: 18px;
    width: 18px;
}
.cus-checkbox .cus-checkmark:after {
    left: 5px;
    top: 1px;
    width: 5px;
    height: 10px;
    border: solid var(--border-PrimaryBlue-500);
    border-width: 0 2px 2px 0;
    -webkit-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    transform: rotate(45deg);
    content: "";
    position: absolute;
    display: none;
}
.cus-checkbox input:checked ~ .cus-checkmark:after {
    display: block;
}
.cus-checkbox input:checked ~ .cus-checkmark{
    border-color: var(--border-PrimaryBlue-500);
}
.multi-select-checkbox.cus-checkbox .cus-checkmark:after{
    width: 4px;
    border-width: 0 2px 0 0;
    transform: rotate(90deg);
}
.cus-radio .cus-checkmark {
    height: 20px;
    width: 20px;
    border-radius: 100%;
    top: 1px;
}
.cus-checkbox.cus-radio .cus-checkmark::after {
    width: 100%;
    height: 100%;
    left: 0;
    top: 0;
    bottom: 0;
    right: 0;
    margin: 0 auto;
    border-radius: 100%;
    background-color: var(--bg-PrimaryBlue-500);
    border: 0;
    border-width: 0;
    transform: unset;
    border-radius: 50px;
    transform: scale(0);
    transition: all 0.2s ease;
    display: block;
}
.cus-radio input:checked ~ .cus-checkmark:after {
    transform: scale(0.6);
}
.btn-toggle.switch-btn.btn-xs {
    padding: 0;
    position: relative;
    border: none;
    height: 16px;
    width: 32px;
    min-width: 32px;
    border-radius: 16px;
    min-height: unset;
    top: 0;
    box-shadow: var(--Shadow-none);
    background: var(--bg-Gray-200);
    font-family: var(--Font-Face-Regular);
    font-size: var(--Body-Font-Size);
    color: var(--Body-Font-Color);
}
.btn-toggle.switch-btn.active {
    background-color: var(--bg-PrimaryBlue-500);
}
.btn-toggle.switch-btn.btn-xs > .handle {
    position: absolute;
    top: 2px;
    left: 2px;
    width: 12px;
    height: 12px;
    border-radius: 12px;
    background: var(--bg-White);
    transition: left 0.25s;
}
.btn-toggle.switch-btn.btn-xs.active > .handle {
    left: 18px;
    transition: left 0.25s;
}
.carousel .carousel-indicators button::before, .carousel .carousel-indicators button::after {
    width: 0;
    height: 0;
}
.carousel .carousel-indicators button {
    background-color: var(--bg-Gray-300);
    width: 8px;
    height: 8px;
    border-radius: 50px;
    transition: all 0.4s ease;
    list-style: none;
    margin: 0 2px;
    cursor: pointer;
    border: 0;
    opacity: 1;
    padding: 0;
    outline: 0;
}
.carousel .carousel-indicators button.active{
    width: 40px;
}
.btn{
    font-size: var(--Body-Font-Size);
    font-family: var(--Font-Face-SemiBold);
    padding: 8px 14px; /*Reduced 2px padding top bottom to fix height issue as per design system.*/
    min-height: 40px; /*Add height as per the design system standard*/
    min-width: 86px;
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    justify-content: center;
    border-radius: var(--Border-Radius-sm);
}
.btn.focus, .btn:focus{
    box-shadow: none !important;
}
.btn-primary{
    background-color: var(--bg-PrimaryBlue-500) !important;
    color: var(--bg-White) !important;
    border-color: var(--border-PrimaryBlue-500) !important;
    line-height: var(--Body-Font-Lineheight);
}
.btn-outline-primary{
    background-color: var(--bg-White) !important;
    color: var(--text-PrimaryBlue-500) !important;
    border-color: var(--border-PrimaryBlue-500) !important;
    line-height: var(--Body-Font-Lineheight);
}
.btn-outline-secondary{
    background-color: var(--bg-White) !important;
    color: var(--Body-Font-Color) !important;
    border-color: var(--border-Gray-400) !important;
    line-height: var(--Body-Font-Lineheight);
}
.drop-button .dropdown-toggle.btn-outline-secondary{
    border-color: var(--border-Gray-400) !important;
}
.dropdown-toggle::after{
    border-top: 5px solid;
    border-right: 5px solid transparent;
    border-bottom: 0;
    border-left: 5px solid transparent;
}
.btn-group{
    border-radius: var(--Border-Radius-md);
}
.drop-button .dropdown-toggle {
    border-left-color:var(--border-PrimaryBlue-700) !important;
    min-width: auto;
    padding: 8px 10px;
    z-index: 9;
    box-shadow: none !important;
}

.btn-group > .btn:not(:last-child):not(.dropdown-toggle), 
.btn-group > .btn-group:not(:last-child) > .btn {
    border-top-right-radius: 0;
    border-bottom-right-radius: 0;
}
.btn-group > .btn:not(:first-child), 
.btn-group > .btn-group:not(:first-child) > .btn {
    border-top-left-radius: 0;
    border-bottom-left-radius: 0;
}
.btn.btn-md{
    padding: 6px 14px; /*Reduced 2px padding top bottom to fix height issue as per design system.*/
    min-height: 34px; /*Add height as per the design system standard*/
}
.drop-button .btn.btn-md.dropdown-toggle {
    padding: 6px 10px;
}
.btn.btn-sm{
    padding: 4px 14px;/*Reduced 2px padding top bottom to fix height issue as per design system.*/
    min-height: 30px; /*Add height as per the design system standard*/
}
.drop-button .btn.btn-sm.dropdown-toggle {
    padding: 4px 10px;
}
.text-primary{
    color: var(--text-PrimaryBlue-500) !important;
}
.drop-button .btn-outline-primary.dropdown-toggle{
    border-left-color: var(--border-PrimaryBlue-500) !important;
}
.text-secondary{
    color: var(--text-Gray-400) !important;
}
.drop-button .btn-outline-secondary.dropdown-toggle{
    border-left-color: var(--border-Gray-400) !important;
}
.drop-button .btn-outline-secondary.dropdown-toggle::after{
    border-top-color: var(--border-Gray-400) !important;
}
.progress, .progress-stacked{
    --bs-progress-bg: var(--bg-Gray-300);
    --bs-progress-bar-bg: var(--bg-PrimaryBlue-500);
    border-radius: var(--Border-Radius-lg);
    --bs-progress-height: 8px;
    background-color: var(--bg-Gray-300);
}
.progress .progress-value {
    font-size: var(--Heading4-Font-Size);
    font-family: var(--Font-Face-Regular);
    color: var(--text-color-Heading);
    position: absolute;
    top: -40px;
    right: 0;
    visibility: hidden;
    overflow: hidden;
    width: 0;
    height: 0;
}
.progress .progress-bar {
    box-shadow: none;
    position: relative;
    -webkit-animation: animate-positive 2s;
    animation: animate-positive 2s;
    border-radius: var(--Border-Radius-lg);
    overflow: visible;
    animation: animate-positive 2s;
    background: var(--bg-PrimaryBlue-500);
}
@keyframes animate-positive {
    0% {
        width: 0;
    }
}
.progress .progress-bar:after {
    content: "";
    display: block;
    border: 10px solid transparent;
    border-bottom: 12px solid transparent;
    position: absolute;
    top: -19px;
    right: 3px;
    border-bottom-color: var(--border-PrimaryBlue-500);
}
.progress{
    overflow: visible;
    height: 8px;
    border-radius: var(--Border-Radius-lg);
    margin: 0 10px;
}
.card-shadow{
    box-shadow: var(--Shadow-Small);
    background-color: var(--bg-White);
    border-radius: var(--Border-Radius-md);
}
.shadow-box{
    box-shadow: var(--Shadow-Small);
    background-color: var(--bg-White);
    border-radius: var(--Border-Radius-md);
    padding: var(--p-14);
}
.card-shadow-header{
    box-shadow: var(--Shadow-Small);
    background-color: var(--bg-White);
    padding: var(--p-14);
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
}
.card-bg{
    background-color: var(--bg-White);
    border-radius: var(--Border-Radius-md);
    position: relative;
}

.stepper-tabs{
    width: 100%;
    display: flex;
    flex-wrap: nowrap;
    justify-content: space-between;
}
.stepper-tabs .nav-item{
    width: 100%;
}
.nav-tabs .nav-item {
    margin-bottom: 0;
}
.stepper-tabs .nav-item::before {
    position: absolute;
    content: '';
    width: 100%;
    height: 2px;
    bottom: 0;
    left: -20px;
    z-index: 9;
}
.stepper-tabs .nav-item:has(.nav-link.active)::before {
    background-color: var(--bg-PrimaryBlue-500);
    transform: scaleX(1);
}
.stepper-tabs .nav-item::after {
    position: absolute;
    content: '';
    background-image: url('data:image/svg+xml,<svg width="22" height="58" viewBox="0 0 22 58" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M1 58L20.6344 30.1674C20.8719 29.8293 21 29.4206 21 29.0008C21 28.5811 20.8719 28.1723 20.6344 27.8342L1 0" fill="white"/><path d="M1 58L20.6344 30.1674C20.8719 29.8293 21 29.4206 21 29.0008C21 28.5811 20.8719 28.1723 20.6344 27.8342L1 0" stroke="%239CA3AF" stroke-miterlimit="10" stroke-linecap="round"/></svg>');
    right: 0px;
    top: 0px;
    width: 22px;
    height: 58px;
    background-repeat: no-repeat;
    background-size: cover;
}
.stepper-tabs .nav-item:last-child::before {
    width: calc(100% + 22px);
}
.stepper-tabs .nav-item:last-child::after{
    background-image: none;
    width: 0;
    height: 0;
}
.stepper-tabs .nav-item .nav-link {
    color: var(--Body-Font-Color);
    font-size: var(--Heading4-Font-Size);
    font-family: var(--Font-Face-Bold);
    width: calc(100% - 22px);
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    padding: 14px 10px;
    justify-content: center;
    border-radius: 0px;
    position: relative;
    pointer-events: none;
}
.stepper-tabs .nav-item .nav-link::before{
    width: 0;
    height: 0;
}
.stepper-tabs .nav-link.active {
    color:var(--text-PrimaryBlue-500);
    background-color: transparent;
}
.stepper-tabs .avatar{
    width: 30px;
    height: 30px;
    min-width: 30px;
    min-height: 30px;
    font-family: var(--Font-Face-Bold);
    color: var(--Body-Font-Color);
    font-size: var(--Body-Font-Size);
}
.stepper-tabs .nav-link.success .avatar,
.stepper-tabs .nav-link.active .avatar{
    background-color: var(--bg-PrimaryBlue-500) !important;
    color: var(--bg-White) !important;
}
.no-data-found {
    padding: 14px;
    width: 100%;
    text-align: center;
    min-height: 243px;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;
    flex-direction: column;
}
.no-data-found>.material-symbols-outlined {
    font-size: 100px;
    color: var(--text-Gray-300);
    font-weight: 200;
}
.no-data-found>.loading-icon{
    min-height: 100px;
    min-width: 100px;
}
.badge.badge-md{
    min-height: 22px;
    padding: 3px 16px;
}
.badge.badge-lg{
    min-height: 24px;
    padding: 3px 16px;
}
.status-rg{
    width: 8px;
    height: 8px;
    border-radius: 100%;
    display: inline-block;
}
.chips-btn{
    border: 1px solid var(--border-Gray-300);
    font-size: var(--Body-Font-Size);
    color: var(--Body-Font-Color);
    padding: 6px 14px;
    border-radius: 40px;
    background-color: transparent;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
}
.chips-btn>i{
    color: var(--Body-Font-Color);
}
.chips-btn.PrimaryBlue-100{
    border-color: var(--border-PrimaryBlue-100);
}
.chips-btn.Slate-100{
    background-color: var(--bg-Slate-100);
}
.new-modal-dialog .modal-dialog{
    max-width: 556px;
    margin: 20px auto;
}
.new-modal-dialog .modal-dialog.modal-sm{
    max-width: 333px;
}
.new-modal-dialog .modal-dialog.modal-md{
    max-width: 556px;
}
.new-modal-dialog .modal-dialog.modal-lg{
    max-width: 816px;
}
.new-modal-dialog .modal-dialog.modal-xl{
    max-width: 1076px;
}

.new-modal-dialog .modal-content {
    border-radius: var(--Border-Radius-md);
    background: var(--bg-White);
    box-shadow: var(--CardShadow);
    overflow: hidden;
}
.new-modal-dialog .modal-header{
    padding: 14px 20px;
    min-height: 52px;
    align-items: center;
    background-color: var(--bg-Slate-200);
    border: 0;
}
.new-modal-dialog .modal-title{
    font-size: var(--Heading2-Font-Size);
    line-height: var(--Heading-Font-Lineheight);
    color: var(--text-color-Heading);
    font-family: var(--Font-Face-SemiBold);
    
}
.new-modal-dialog .btn-close{
    opacity: 1;
    text-shadow: none;
    background-image: none;
    padding: 0;
    color: var(--text-Gray-400);
    box-shadow: none !important;
    background-color: var(--bg-Transparent);
    outline: 0;
    border: 0;
    margin: calc(-.5 * var(--bs-modal-header-padding-y)) calc(-.5 * var(--bs-modal-header-padding-x)) calc(-.5 * var(--bs-modal-header-padding-y)) auto;
}
.new-modal-dialog .modal-footer{
    justify-content: flex-start;
}
.avatar-with-msg p{
    color: var(--Body-Font-Color);
}
.bg-celebrate{
    z-index: 9;
}
.bg-celebrate::before {
    content: '';
    background-image: url('../images/celebrate-shape1.svg');
    width: 100%;
    height: 100%;
    position: absolute;
    background-repeat: no-repeat;
    top: 0;
    left: 0;
    z-index: -9;
}
.bg-celebrate::after {
    content: '';
    background-image: url('../images/cake.svg');
    background-size: 50px;
    width: 50px;
    height: 50px;
    position: absolute;
    background-repeat: no-repeat;
    bottom:10px;
    right:10px;
    z-index: -9;
}#Work_Anniversary_Celebrate.bg-celebrate::after{
    background-image: url('../images/work-anniversary-celebrate.svg');
}
#Mrg_Anniversary_Celebrate.bg-celebrate::after{
    background-image: url('../images/mrg-anniversary-celebrate.svg');
}
.card-bg.Purple-50.bg-celebrate .Heading3-Font-Size{
    color: var(--Purple-950);
}
.card-bg.Blue-50.bg-celebrate .Heading3-Font-Size{
    color: var(--Blue-950);
}
.card-bg.Orange-100.bg-celebrate .Heading3-Font-Size{
    color: var(--Orange-950);
}
.carousel-indicators {
    margin: 14px auto 0;
    bottom: 0;
}
button.avatar.btn{
    padding: 0;
    border-radius: 100%;
    min-width: auto;
    background-color: var(--bg-Transparent) !important;
}
.new-topbar {
    width: 100%;
    background-color: var(--bg-Green-50);
    box-shadow: var(--Shadow-Small);
    padding: var(--py_10_px_14);
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
}
.New_Topbar_Close {
    cursor: pointer;
    outline: 0 !important;
    background-color: transparent;
    border: 0;
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    right: 14px;
    padding: 0;
}
.alert{
    border: 0;
    overflow: hidden;
    padding: 14px 40px 14px 64px;
    max-width: 366px;
    border-radius: var(--Border-Radius-sm);
    font-size: var(--Body-Font-Size);
    color: var(--Body-Font-Color);
    line-height: var(--Body-Font-Lineheight);
}
.alert-icon-lf {
    min-width: 52px;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: center;
    position: absolute;
    top: 0;
    left: 0;
    height: 100%;
}
.alert-dismissible .btn-close {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    right: 10px;
    padding: 0;
    opacity: 1;
    background-image: none;
    text-shadow: none;
    box-shadow: none;
    background-color: transparent;
    border: 0;
    outline: 0;
}
.tooltip-inner:has(.custom-tooltip){
    background-color: var(--bg-White);
    box-shadow: var(--Shadow-Large);
    font-size: var(--Body-Font-Size);
    color: var(--Body-Font-Color);
    font-family:var(--Body-Fontface);
    border-radius: var(--Border-Radius-md);
    padding: 14px;
    width: max-content;
	border:0;
}
.tooltip-inner:has(.avatar-with-msg-tooltip){
    min-width: 270px;
}
.tooltip-inner:has(.tooltip-lg){
    min-width: 400px;
}
.tooltip.show{
    opacity: 1;
}
.custom-tooltip>.col-lg-12:not(:last-child){
    padding: 0 0 14px;
}
.table-responsive table tr th{
    font-size: var(--Heading4-Font-Size);
    color: var(--text-color-Heading);
    font-family: var(--Font-Face-Bold);
    line-height: var(--Heading-Font-Lineheight);
    padding: 10px;
    border: 0;
}
.table-responsive table tr td {
    padding: 10px;
    color: var(--Body-Font-Color);
    font-size: var(--Body-Font-Size);
    font-family: var(--Font-Face-Regular);
    border-bottom: 1px solid var(--border-Gray-300);
}
.table-responsive table tr th:first-child,
.table-responsive table tr td:first-child{
    padding: 10px 10px 10px 14px;
}
.table-responsive table tr th:last-child,
.table-responsive table tr td:last-child{
    padding: 10px 14px 10px 10px;
}
.form-control[readonly] {
    background-color: transparent;
    border: 0;
    padding: 0;
    height: auto;
    min-height: auto;
    font-size: var(--Heading3-Font-Size);
}
select.form-control[readonly] {
    background-image: none;
    pointer-events: none;
}
.input-group:has(.form-control[readonly]){
    border: 0;
    padding: 0;
    background-color: transparent !important;
}
.input-group:has(.form-control:disabled) .input-group-append, 
.input-group:has(.form-control[readonly]) .input-group-append {
    display: none;
}
input.form-control.hidden-arrow[type=number]::-webkit-inner-spin-button, 
input.form-control.hidden-arrow[type=number]::-webkit-outer-spin-button { 
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    margin: 0; 
}
.normal-icn{
    background-color: var(--bg-Transparent);
    color: var(--text-Gray-400);
    display: inline-block;
    border: 0;
    padding: 0;
}
.normal-icn:has(.material-symbols-outlined){
    line-height: 0;
}
table.dataTable{
    border-collapse: collapse !important;
}
table.dataTable thead .sorting:after, 
table.dataTable thead .sorting_asc:after, 
table.dataTable thead .sorting_desc:after, 
table.dataTable thead .sorting_asc_disabled:after, 
table.dataTable thead .sorting_desc_disabled:after{
    font-family: var(--MaterialIcons-Font-Face-Regular) !important;
    font-style: normal;
    font-weight: var(--MaterialIcons-Wight-Light);
    font-size: var(--Font-24);
    line-height: 1;
    letter-spacing: normal;
    text-transform: none;
    display: inline-block;
    white-space: nowrap;
    word-wrap: normal;
    direction: ltr;
    -webkit-font-feature-settings: "liga";
    -webkit-font-smoothing: antialiased;
    color: var(--text-Gray-400);
    bottom: 8px;
    right: unset;
    opacity: 1;
}
table.dataTable thead .sorting:after{
    content: "\e5d7";
    font-size: var(--Font-20);
}
table.dataTable thead .sorting_asc:after {
    content: "\e5c5";
    font-size: var(--Font-20);
}
table.dataTable thead .sorting_desc:after {
    content: "\e5c7";
    font-size: var(--Font-20);
}
.dataTables_length,
.dataTables_filter,
.dataTables_paginate,
.dataTables_info{
    display: none;
}
.odd-even-bg tbody tr:has(.dataTables_empty) {
    background-color: transparent;
}
table.dataTable{
    margin: 0 !important;
}
.odd-even-bg tbody tr:nth-child(odd) td{
    background-color: var(--bg-PrimaryBlue-50);
}
/* .table-responsive table.data-table-sorting tr th{
    padding: var(--py_10_px_14);
} */
.table-responsive table.data-table-sorting tr th{
    background-color: var(--bg-Transparent);
}
.sidebar-menu {
    background: var(--bg-PrimaryBlue-950);
    width: 90px;
    z-index: 999;
    padding: 10px 0 0;
    position: fixed;
    top: 0;
    bottom: 0;
    margin: 65px 0 0;
}
.sidebar-menu ul{
    padding: 0;
    margin: 0;
    list-style: none;
}
.sidebar-menu ul>li>a{
    padding: 6px 4px;
    text-align: center;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    flex-direction: column;
    text-decoration-line: none;
    width: 100%;
    color: var(--bg-White);
    font-size: var(--Heading4-Font-Size);
    font-family: var(--Font-Face-SemiBold);
    line-height: var(--Heading-Font-Lineheight);
}
.dropdown-submenu .dropdown-menu{
    transform: translateX(-10px);
    transition: all 0.3s ease-in-out;
    display: block;
    opacity: 0;
    visibility: hidden;
    max-height: 195px;
    overflow: auto;
    border: 0;
    border-radius: 0;
    top: 0;
    left: 100%;
    box-shadow: var(--Shadow-Dropdown-Menu);
    background-color: var(--bg-PrimaryBlue-950);
}

.dropdown-submenu:hover .dropdown-menu{
    transform: translateX(-1px);
    opacity: 1;
    visibility: visible;
}
.dropdown-submenu .dropdown-menu .dropdown-item{
    color: var(--bg-White);
    text-align: left;
    justify-content: flex-start;
    flex-direction: row;
}
.dropdown-submenu .dropdown-item:focus, 
.dropdown-submenu .dropdown-item:hover{
    background-color: var(--bg-Transparent);
    color: var(--bg-White);
}
.header.new_ui_header {
    height: auto;
    top: 0px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 10px 20px;
    width: 100%;
    position: sticky;
    top: 0;
    z-index: 999;
    background-size: cover !important;
}
.header .logo>a{
    font-size: var(--Heading2-Font-Size);
    color: var(--bg-White);
    font-family: var(--Font-Face-Bold);
    text-decoration-line: none;
}
.header .logo>a>span>small{
    font-family: var(--Font-Face-Regular);
}
.logo-img {
    max-width: 170px;
    min-width: 170px;
    max-height: 100px;
    min-height: 100px;
    border-radius: 10px;
    padding: 10px;
    overflow: hidden;
    background-color: #fff;
    box-shadow: 0 0 3px rgba(0, 0, 0, 0.15);
    display: flex;
    flex-wrap: wrap;
    align-items: center;
}
.logo-img>img {
    max-width: 100%;
    height: 100%;
    max-height: 80px;
    margin: 0 auto;
}
.logo-img.logo-img-sm {
    max-width: 75px;
    min-width: 75px;
    max-height: 45px;
    min-height: 45px;
    border-radius: 5px;
    padding: 5px;
}
.logo-img.logo-img-sm>img {
    max-height: 35px;
}
.logo{
    width: auto;
    max-width: 45%;
}
.LogoCompanyName,
.LogoCompanyName > span,
.LogoCompanyName > small {
    display: inline-block;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    width: 100%;
}
.LogoCompanyName {
    display: flex;
    flex-wrap: wrap;
}
.header_searchbar{
    min-width: 280px;
}

.user-profile-dropdown button.dropdown-toggle{
    background-color: var(--bg-Transparent);
    font-size: var(--Heading4-Font-Size);
    color: var(--bg-White);
    font-family: var(--Font-Face-Regular);
    padding: 0;
    border: 0;
}
.user-profile-dropdown .dropdown-toggle::after{
    border: 0;
}
.user-profile-dropdown.dropdown .dropdown-menu {
    min-width: 280px;
    right: 100%;
}
.user-profile-dropdown .dropdown-menu .dropdown-item{
    padding: 6px 14px;
}
.right-content{
    width: calc(100% - 90px);
    margin: 0 0 0 90px;
}
#main-site:has(.sidebar-menu.position-fixed) .right-content{
    margin: 62px 0 0 90px;
}
.right-content.p-14>.card-shadow-header {
    margin: -14px -14px 14px;
}
.card-header{
    padding: var(--py_10_px_14);
    border-bottom:1px solid var(--border-Gray-300);
    border-radius: 0;
    background-color: var(--bg-Transparent);
}
.card-body{
    padding: var(--py_10_px_14);
}
.row{
    --bs-gutter-x: 7px;
    margin-right: calc(-1* var(--bs-gutter-x));
    margin-left: calc(-1* var(--bs-gutter-x));
    width: calc(100% + 2 * var(--bs-gutter-x));
}
.row.w-100{
    width: calc(100% + 2 * var(--bs-gutter-x)) !important;
}
.row>*{
    padding-right: calc(var(--bs-gutter-x)* 1);
    padding-left: calc(var(--bs-gutter-x)* 1);
}
.table-without-border tr td>label{
    font-size: var(--Heading4-Font-Size);
    color: var(--text-color-Heading);
    border: 0;
    margin: 0 0 4px;
}
.table-without-border tr td{
    font-size: var(--Heading3-Font-Size);
    color: var(--text-color-Heading);
    border: 0;
    padding: 10px 10px 0;
}
.table-without-border tr th:first-child,
.table-without-border tr td:first-child{
    padding: 10px 10px 0 14px;
}
.table-without-border tr th:last-child,
.table-without-border tr td:last-child{
    padding: 10px 14px 0 10px;
}
.missing-class::after{
    content: "*";
    color:var(--bg-Red-500);
    padding-left: 2px;
    font-size: 14px;
}
.odd-even-bg tbody tr td {
    border: 0;
}
.odd-even-bg .input-group-text,
.odd-even-bg .input-group{
    background-color: var(--bg-White);
}
.odd-even-bg .input-group:has(.form-control[readonly]),
.odd-even-bg .input-group:has(.form-control[readonly]) .input-group-text{
    background-color: var(--bg-Transparent);
}
.date .form-control[readonly] {
    pointer-events: none;
}
.pagination.pagination-with-entries .page-item{
    background-color: var(--bg-Transparent);
}
.datepicker table tr td span.focused, 
.datepicker table tr td span:hover,
.datepicker table tr td span.active.active, 
.datepicker table tr td span.active.disabled.active, 
.datepicker table tr td span.active.disabled:active, 
.datepicker table tr td span.active.disabled:hover.active, 
.datepicker table tr td span.active.disabled:hover:active, 
.datepicker table tr td span.active:active, 
.datepicker table tr td span.active:hover.active, 
.datepicker table tr td span.active:hover:active,
.datepicker table tr td.day:hover, 
.datepicker table tr td.focused,
.datepicker table tr td.today,
.datepicker table tr td.active.active, 
.datepicker table tr td.active.highlighted.active, 
.datepicker table tr td.active.highlighted:active, 
.datepicker table tr td.active:active{
    background-color: var(--bg-PrimaryBlue-100) !important;
    color: var(--text-PrimaryBlue-600) !important;
}
.datepicker .datepicker-switch:hover, 
.datepicker .next:hover, 
.datepicker .prev:hover, 
.datepicker tfoot tr th:hover {
    background-color: var(--bg-PrimaryBlue-100) !important;
    color: var(--text-PrimaryBlue-600) !important;
}
.align-middle td{
    vertical-align: middle !important;
}
.small, small {
    font-size: .875em;
}
.bottom-0 {
    bottom: 0 !important;
}
h1 small.font-13 {
    font-weight: var(--Font-Weight-Regular) !important;
}
.custom-file-input:focus~.custom-file-label {
    border-color: transparent;
    box-shadow: none;
}
button:focus{
    outline: 0;
}
.custom-file{
    overflow: hidden;
    display: grid;
    position: relative;
}
input[type=date].form-control{
    position: relative;
    cursor: pointer;
    background-repeat: no-repeat;
    background-position: calc(100% - 10px) 50%;
    background-size: 24px;
}
input[type=date].form-control::-webkit-calendar-picker-indicator{
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    opacity: 0;
    cursor: pointer;
    z-index: 2;
}
.dropdown-arrow-none::before,
.dropdown-arrow-none::after{
    border: 0 !important;
    margin: 0 !important;
}
.row-px-7{
    padding: 0 7px;
}
.tooltip-inner:has(.custom-tooltip.tooltip-sm){
    padding: 10px 14px;
    border-radius: var(--Border-Radius-sm);
    min-width: auto;
}
.tooltip-inner:has(.custom-tooltip){
    text-align: left;
}
.notification-rg.status-rg.notification-rg {
    width: 7px;
    height: 7px;
    top: 3px;
    right: 3px;
}
.form-group:has(.form-control[required]) .input-label::after{
    content: "*";
    color:var(--text-Red-500);
    padding-left: 2px;
    font-size: 12px;
}
.form-control[readonly][type=number]::-webkit-inner-spin-button, 
.form-control[readonly][type=number]::-webkit-outer-spin-button { 
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    margin: 0; 
}
.form-group:has(.form-control[readonly]) .input-label.mb-10{
    margin-bottom: 4px !important;
}
.datepicker table tr td, .datepicker table tr th{
    width: 34px;
    height: 34px;
    border-radius: var(--Border-Radius-sm);
}
.datepicker .prev, .datepicker .next {
    font-size: 0;
    display: flex;
    align-items: center;
    justify-content: center;
}
.datepicker th.next::before,
.datepicker th.prev::before{
    font-family: var(--MaterialIcons-Font-Face-Regular) !important;
    font-size: 24px;
    font-weight: 300;
}
.datepicker th.prev::before{
    content: '\e5cb';
}
.datepicker th.next::before{
    content: '\e5cc';
}
.datepicker.datepicker-dropdown {
    border: 0;
    box-shadow: var(--Shadow-Dropdown-Menu);
    padding: 5px;
    z-index: 9999 !important;
    margin: 3px 0 0;
}
.datepicker-dropdown:before,
.datepicker-dropdown:after{
    border: 0;
    background-color: var(--bg-Transparent);
}
.normal-link{
    font-size: 14px;
    color: var(--text-PrimaryBlue-600);
    text-decoration-line: none;
}
.normal-link:hover {
    color: var(--text-PrimaryBlue-600);
    text-decoration: none;
}
.card-shadow.h-100:has(.no-data-found) {
    height: calc(100vh - 160px) !important;
}
.card-shadow.h-100>.no-data-found{
    height: 100%;
}
.popover:has(.custom-popover-content){
    min-width: 600px;
    border: 0;
    box-shadow: none;
    padding: 0;
    background-color:transparent;
    font-family: inherit;
}
.popover:has(.custom-popover-content) .popover-body{
    padding: 0;
}
.bs-popover-auto[x-placement^=top] .arrow::before, 
.bs-popover-top .arrow::before{
    border-top-color: var(--bg-White);
}
.bs-popover-auto[x-placement^=right] .arrow::before, 
.bs-popover-right .arrow::before{
    border-right-color: var(--bg-White);
}
.bs-popover-auto[x-placement^=bottom] .arrow::before, 
.bs-popover-bottom .arrow::before{
    border-bottom-color: var(--bg-White);
}
.bs-popover-auto[x-placement^=left] .arrow::before, 
.bs-popover-left .arrow::before{
    border-left-color: var(--bg-White);
}
.bs-popover-auto[x-placement^=left] .arrow::before, 
.bs-popover-left .arrow::before,
.bs-popover-auto[x-placement^=left] .arrow::after, 
.bs-popover-left .arrow::after{
    right: 2px;
}
.bs-popover-auto[x-placement^=right] .arrow::before, 
.bs-popover-right .arrow::before,
.bs-popover-auto[x-placement^=right] .arrow::after, 
.bs-popover-right .arrow::after{
    left: 2px;
}
.bs-popover-auto[x-placement^=top] .arrow::before, 
.bs-popover-top .arrow::before,
.bs-popover-auto[x-placement^=top] .arrow::after, 
.bs-popover-top .arrow::after{
    bottom: 2px;
}
.bs-popover-auto[x-placement^=bottom] .arrow::before, 
.bs-popover-bottom .arrow::before,
.bs-popover-auto[x-placement^=bottom] .arrow::after, 
.bs-popover-bottom .arrow::after{
    top: 2px;
}
.position-absolute-icn{
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    right: 10px;
}
/* Select with Search */
.select2-container--default .select2-selection--single{
    cursor: pointer;
    appearance: none;
    font-size: var(--Body-Font-Size);
    color: var(--Body-Font-Color);
    border: 1px solid var(--border-Gray-300);
    border-radius: var(--Border-Radius-sm);
    box-shadow: var(--Shadow-none) !important;
    width: 100%;
    height: 40px;
    padding: 2px 30px 2px 14px;
}
.select2-container--default .select2-selection--single .select2-selection__arrow{
    background-image: url('data:image/svg+xml,<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg"><mask id="mask0_408_346" style="mask-type:alpha" maskUnits="userSpaceOnUse" x="0" y="0" width="24" height="24"><rect width="24" height="24" fill="%23D9D9D9"/></mask><g mask="url(%23mask0_408_346)"><path d="M12 15L7 10H17L12 15Z" fill="%239CA3AF"/></g></svg>') ;
    background-repeat: no-repeat;
    background-position: 98%;
    top: 0;
    right: 5px;
    width: 24px;
    height: 100%;
    transition: all 0.4s ease;
}
.select2-container--default.select2-container--open .select2-selection--single .select2-selection__arrow{
    transform: rotateX(-180deg);
}
.select2-container--default .select2-selection--single .select2-selection__arrow b{
    display: none;
}
.select2-container--default .select2-selection--single .select2-selection__rendered {
    color: var(--Body-Font-Color);
    line-height: normal;
    padding: 0;
    height: 100%;
    display: flex;
    align-items: center;
}
.select2-dropdown{
    font-size: var(--Body-Font-Size);
    color: var(--Body-Font-Color);
    border: 1px solid var(--border-Gray-300);
    border-radius: var(--Border-Radius-sm);
}
.select2-container--default .select2-search--dropdown .select2-search__field {
    font-size: var(--Body-Font-Size);
    color: var(--Body-Font-Color);
    border: 1px solid var(--border-Gray-300);
    border-radius: var(--Border-Radius-sm);
    padding: 6px 10px;
    outline: 0;
}
.select2-container--default .select2-results__option[aria-selected=true]{
    background-color: var(--bg-Gray-200);
}
.select2-container--default .select2-results__option--highlighted[aria-selected]{
    background-color: var(--bg-PrimaryBlue-100);
    color: var(--Body-Font-Color);
}
.select2-container--default .select2-results > .select2-results__options {
    max-height: 200px;
    overflow-y: auto;
}
.select2-results__option{
    padding: 6px 10px;
}
/* #Candidate_Details_Sidebar{
    max-height: 635px;
    overflow: auto;
} */
.Sidebar-Scroll{
    max-height: 530px;
    overflow: auto;
}
/* Tree View Select */
.multiselect-catheader {
    padding: 0 0 10px;
    border-bottom: 1px solid var(--border-Gray-300);
    margin: 0 0 10px;
}
.gj-icon {
    font-size: 20px;
    font-family: var(--MaterialIcons-Font-Face-Regular) !important;
    font-style: normal;
}
.gj-icon.minus:before{
    content: "\e15b";
}
.gj-icon.plus:before{
    content: "\e145";
}
ul.gj-list-bootstrap,
.gj-list-bootstrap {
    padding: 0 10px;
    width: 100%;
    margin: 0;
}
.Tree_View_Select_Main{
    width: 100%;
    z-index: 99;
    position: relative;
    border: 0;
    padding: var(--py_10_px_14);
    font-size: var(--Body-Font-Size);
    color: var(--Body-Font-Color);
    border-radius: var(--Border-Radius-sm);
    box-shadow: var(--Shadow-Dropdown-Menu);
    background-color: var(--bg-White);
}
.gj-tree-bootstrap-4 ul.gj-list-bootstrap li {
    color: var(--Body-Font-Color);
    font-size: var(--Body-Font-Size);
    padding: 5px 0;
    border: 0;
}
.gj-checkbox-bootstrap span{
    border:2px solid #9CA3AF;
    color: #0649ED;
    background: #fff;
    display: block;
    content: " ";
    width: 18px;
    height: 18px;
    border-radius: 3px;
    transition: box-shadow .2s linear, border-color .2s linear;
    cursor: pointer;
    margin: auto;
    line-height: 13px;
    padding: 0 0 0 1px;
}
.gj-checkbox-material-icons input[type=checkbox]:checked+span {
    border-color: #0649ED;

}
.gj-tree-bootstrap-4 ul.gj-list-bootstrap li.active {
    background-color:transparent;
    color:var(--Body-Font-Color);
}
.gj-icon{
    font-size: 20px;
    font-family: var(--MaterialIcons-Font-Face-Regular) !important;
}
ul.gj-list-bootstrap li [data-role=expander].gj-tree-material-icons-expander {
    padding: 2px 0 0;
    color: #9CA3AF;
}
.gj-checkbox-material-icons input[type=checkbox]:checked+span:after {
    content: "\e5ca";
    line-height: 13px;
    color: #0649ED;
    position: relative;
    top: 1px;
    left: -1px;
}
.mcat_block{
    overflow: auto;
    max-height: 250px;
    padding: 0;
}
.mcat_block ul.gj-list-bootstrap li [data-role=wrapper] {
    padding: 0;
}
.multiselect-catheader .form-control {
    padding: 2px 26px 3px 15px;
}
.multiselect-catheader .reset-searchbar {
    position: absolute;
    top: 0;
    font-size: 20px;
    cursor: pointer !important;
    right: 0;
    padding: 10px 7px;
}
.gj-checkbox-bootstrap input[type=checkbox] {
    display: none;
    margin-bottom: -12px;
}
.gj-checkbox-bootstrap{
    margin: 0;
}
.gj-checkbox-material-icons input[type=checkbox]:indeterminate+span:after {
    content: "\e15b";
    left: -1px;
    top: -1px;
    position: relative;
}
.gj-icon.minus, .gj-icon.plus {
    line-height: 20px;
    cursor: pointer;
}
ul.gj-list-bootstrap li [data-role=display]
.gj-tree-material-icons-expander + span + span {
    padding: 0 0 0 10px;
    display: inline-block;
    position: relative;
    bottom: 5px;
}
.gj-list-bootstrap .gj-list-bootstrap .list-group-item {
    padding: 10px 0 0 3px;
}
.gj-list-bootstrap .gj-list-bootstrap .gj-list-bootstrap {
    padding: 0 0 0 16px;
}
.gj-hidden {
    display: none;
}
.gj-list-bootstrap .gj-list-bootstrap {
    padding: 0 0 0 15px;
}
ul.gj-list li [data-role=spacer] {
    display: unset;
}
ul.gj-list-bootstrap li [data-role=display] {
    padding: 0 0 0 5px;
}

.modal-body{
    max-height: calc(100vh - 92px);
    overflow: auto;
}
.modal-content:has(.modal-footer) .modal-body{
    max-height: calc(100vh - 156px);
}
.ul_content{
    margin: 8px 0;
    padding: 0 0 0 20px;
}
.ul_content li{
    font-size: var(--Body-Font-Size);
    color: var(--Body-Font-Color);
    list-style: var(--Body-Font-Lineheight);
}
.gap-y-10.row,
.gap-y-10>.row{
    --bs-gutter-x: 10px;
}
.gap-y-20.row,
.gap-y-20>.row{
    --bs-gutter-x: 10px;
}
.modal-content:has(.modal-body.bg-Gray-100) .modal-footer {
    box-shadow: 0px -2px 3px 0px rgba(0, 0, 0, 0.15);
    margin: 0;
    position: sticky;
}
@media (min-width: 576px){
    .modal.position-static .modal-dialog.modal-dialog-centered {
        min-height: unset;
    }
    .modal.position-static .modal-dialog.modal-dialog-centered::before{
        height: unset;
    }
}
.shorting-searchbar>.input-group{
    min-width: 240px;
}
.card-shadow>.border-left.h-100.position-absolute{
    left: -30px;
}
.card-animated {
  opacity: 0;
  transform: translateY(-20px);
  transition: opacity 0.5s ease, transform 0.5s ease;
}
.card-animated.show {
  opacity: 1;
  transform: translateY(0);
}
.acc-card-body{
    opacity: 0;
    transform: translateY(-20px);
    transition: opacity 0.5s ease, transform 0.5s ease;
}
.acc-card-body.show{
    opacity: 1;
    transform: translateY(0);
}
.acc-card-header span{
    transition: all 0.4s ease;
}
.acc-card-header.open span{
    transform: rotateX(180deg);
}
.mw-auto{
    min-width: auto !important;
}
.card:has(.card-animated-icon) .card-shadow::before{
    position: absolute;
    content: '';
    width: 1px;
    height: 100%;
    background-color: var(--border-Gray-300);
    top: 0;
    left: -30px;
}
.bg-value-btn{
    padding: var(--p-14);
    background-color: var(--bg-Gray-100);
    color: var(--text-Gray-600);
    border-radius: var(--Border-Radius-md);
    display: inline-flex;
    font-size: var(--Heading4-Font-Size);
}
.hide-hover-show{
    opacity: 0;
    transition: all 0.3s ease;
}
.hover-to-show:hover .hide-hover-show{
    opacity: 1;
}
.card-menu-list>ul{
    padding: 0;
    margin: 0;
    list-style: none;
}
.card-menu-list ul li a{
    padding: 10px 14px;
    font-size: var(--Body-Font-Size);
    color: var(--text-color-Heading);
    display: inline-block;
    text-decoration-line: none;
    width: 100%;
    transition: all 0.4s ease;
}
.card-menu-list ul li a:hover {
    background-color: var(--bg-PrimaryBlue-50);
    color: var(--text-PrimaryBlue-500);
}
.column-count-3{
    column-count: 3;
}
select.form-control.border-0.bg-transparent.text-PrimaryBlue-500{
    background-position: 100%;
    background-image: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" height="24px" viewBox="0 -960 960 960" width="24px" fill="%230649ED"><path d="M480-360 280-560h400L480-360Z"/></svg>');
}
.table-without-border tr th:nth-child(1), 
.table-without-border tr td:nth-child(1){
    padding: 10px 10px 0 14px;
}
.column-count-3:has(#noDataFound.show) {
    column-count: 1;
}
.dropdown-menu .dropdown-item:hover{
    color: var(--text-PrimaryBlue-500);
    background-color: var(--bg-PrimaryBlue-50);
}
.sidebar-menu ul.menu-list  li a:hover {
    background-color: #101749 !important;
    color: #fff !important;
}
/*Page Loader CSS*/
body:has(.new-loader){
    overflow: hidden;
}
body.page-loaded{
    overflow: auto;
}
.new-loader{
    display: flex;
    height: 100%;
    justify-content: center;
    align-items: center;
    position: fixed;
    top: 0px;
    left: 0;
    background-color: rgba(0, 0, 0, 0.5);
    width: 100%;
    z-index: 9999;
}
.new-loader .spinner{
    padding:14px;
    min-width: auto;
    min-height: auto;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: center;
    border-radius: var(--Border-Radius-sm);
    background-color: var(--bg-White);
    position: relative;
}
.new-loader .spinner::before{
    width: 0;
    height: 0;
    border:0;
    position: absolute;
    content: '';
    border-radius: 100%;
    animation: rotation 0.6s infinite linear 0.25s;
    top: 18px;
    left: 15px;
}
.new-loader .triple-spinner {
    display: block;
    width: 50px;
    height: 50px;
    border-radius: 50%;
    border: 2px solid transparent;
    border-top: 2px solid var(--border-PrimaryBlue-500);
    -webkit-animation: spin 1.5s linear infinite;
    animation: spin 1.5s linear infinite;
}
.new-loader .triple-spinner::before, .triple-spinner::after {
    content: "";
    position: absolute;
    border-radius: 50%;
    border: 2px solid transparent;
}
.new-loader .triple-spinner::before {
    top: 5px;
    left: 5px;
    right: 5px;
    bottom: 5px;
    border-top-color: var(--border-Orange-500);
    -webkit-animation: spin 3s linear infinite;
    animation: spin 3.5s linear infinite;
}
.new-loader .triple-spinner::after {
    top: 10px;
    left: 10px;
    right: 10px;
    bottom: 10px;
    border-top-color:var(--border-Yellow-500);
    -webkit-animation: spin 1.5s linear infinite;
    animation: spin 1.75s linear infinite;
}
@keyframes spin {
    from {
        -webkit-transform: rotate(0deg);
        transform: rotate(0deg);
    }
    to {
        -webkit-transform: rotate(360deg);
        transform: rotate(360deg);
    }
}
/*Page Loader CSS*/
/*Card Loader CSS*/
.new-loader-sm{
    width: 48px;
    height: 48px;
    border-radius: 50%;
    display: inline-block;
    border-top: 3px solid var(--border-PrimaryBlue-500);
    border-right: 3px solid transparent;
    -webkit-animation: rotation 1s linear infinite;
    animation: rotation 1s linear infinite;
}
.card-loader{
    min-height: 243px;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: center;
}
@keyframes rotation {
    0% { transform: rotate(0deg) }
    100% { transform: rotate(360deg) }
}
/*Card Loader CSS*/
/* START :: Postion Master */
.card-border{
    border-radius: var(--Border-Radius-md);
    border:1px solid var(--border-Gray-300);
    background: var(--bg-White);
}
.tooltip-inner:has(.custom-tooltip.custom-tooltip-sm){
    padding: 10px;
}
.normal-icn.dropdown-toggle:has(.material-symbols-outlined) {
    line-height: unset;
}
.card-footer{
    padding: 10px 14px;
    background-color: transparent;
    border-top: 1px solid var(--border-Gray-300);
}
.tooltip-inner{
    background-color: var(--bg-White);
    box-shadow: var(--Shadow-Large);
    font-size: var(--Body-Font-Size);
    color: var(--Body-Font-Color);
    font-family:var(--Body-Fontface);
    border-radius: var(--Border-Radius-sm);
    padding: 6px 10px;
    width: max-content;
	border:0 !important;
}
.bs-tooltip-auto[x-placement^=bottom].tooltip .arrow::before, 
.bs-tooltip-bottom.tooltip .arrow::before,
.bs-tooltip-auto[data-popper-placement^=bottom].tooltip .tooltip-arrow::before, 
.bs-tooltip-bottom.tooltip.tooltip-arrow::before{
    border-bottom-color: var(--bg-White);
}
.bs-tooltip-auto[x-placement^=top].tooltip .arrow::before, 
.bs-tooltip-top.tooltip .arrow::before,
.bs-tooltip-auto[data-popper-placement^=top].tooltip .tooltip-arrow::before, 
.bs-tooltip-top.tooltip.tooltip-arrow::before{
    border-top-color: var(--bg-White);
}
.bs-tooltip-auto[x-placement^=left].tooltip .arrow::before, 
.bs-tooltip-left.tooltip .arrow::before, 
.bs-tooltip-auto[data-popper-placement^=left].tooltip .tooltip-arrow::before, 
.bs-tooltip-left.tooltip.tooltip-arrow::before{
    border-left-color: var(--bg-White);
}
.bs-tooltip-auto[x-placement^=right].tooltip .arrow::before, 
.bs-tooltip-right.tooltip .arrow::before,
.bs-tooltip-auto[data-popper-placement^=right].tooltip .tooltip-arrow::before, 
.bs-tooltip-right.tooltip.tooltip-arrow::before{
    border-right-color: var(--bg-White);
}
.form-control:disabled{
    background-color: var(--bg-Gray-100);
}
.normal-icn.dropdown-toggle {
    display: flex;
    align-items: center;
}
.col-lg-12:has(#selectedBadges:empty) {
    display: none;
}
.new-modal-dialog .bootstrap-select.Chip .dropdown-menu{
    position: unset !important;
    transform: unset !important;
}
/* START :: Postion Master */
.btn-toggle.switch-btn.bg-Red-600.active {
    background-color: var(--bg-Green-500) !important;
}
.SchedulerContent,
.RepeatsContent{
    display: none;
}
.SchedulerContent#SchedulerDaily{
    display: block;
}
.check-btn-bg{
    padding: 10px 14px;
    background-color: var(--bg-PrimaryBlue-50);
    color: var(--Body-Font-Color);
    font-size: var(--Body-Font-Size);
    border-radius: var(--Border-Radius-sm);
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: center;
    width: auto;
    position: relative;
    cursor: pointer;
    margin: 4px;
    min-width: 65px;
}
.check-btn-bg::before{
    position: absolute;
    content: '';
    border: 1px solid transparent;
    top: -4px;
    left: -4px;
    width: calc(100% + 8px);
    height: calc(100% + 8px);
    border-radius: var(--Border-Radius-sm);
}
.check-btn-bg:has(input:checked):before{
    border-color:var(--border-PrimaryBlue-500);
}
.check-btn-hide{
    position: absolute;
    top: 0;
    left: 0;
    opacity: 0;
}
.check-btn-selected{
    background-color: var(--bg-White);
    border-radius: 100%;
    position: absolute;
    top: -8px;
    right: -8px;
    flex-wrap: wrap;
    align-items: center;
    padding: 1px;
    font-size: var(--Icon-FontSize14) !important;
    color: var(--text-PrimaryBlue-600);
    display: none !important;
}
.check-btn-bg input:checked ~ .check-btn-selected{
    display: flex !important;
}
.selectpicker-dropdown .dropdown-toggle,
.bootstrap-select>.dropdown-toggle{
    background-image: url('data:image/svg+xml,<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg"><mask id="mask0_408_346" style="mask-type:alpha" maskUnits="userSpaceOnUse" x="0" y="0" width="24" height="24"><rect width="24" height="24" fill="%23D9D9D9"/></mask><g mask="url(%23mask0_408_346)"><path d="M12 15L7 10H17L12 15Z" fill="%239CA3AF"/></g></svg>');
    background-repeat: no-repeat;
    background-position: 98%;
    padding: 2px 30px 2px 14px;
    cursor: pointer;
    appearance: none;
    font-size: var(--Body-Font-Size);
    color: var(--Body-Font-Color) !important;
    border: 1px solid var(--border-Gray-300);
    border-radius: var(--Border-Radius-sm);
    box-shadow: var(--Shadow-none) !important;
    width: 100%;
    height: 40px;
    font-family: var(--Font-Face-Regular);
    background-color: var(--bg-Transparent) !important;
}
.selectpicker-dropdown .dropdown-toggle:focus, 
.bootstrap-select .dropdown-toggle:focus{
    outline: 0 !important;
    outline-offset: 0 !important;
}
.selectpicker-dropdown .dropdown-toggle:after,
.bootstrap-select>.dropdown-toggle:after{
    border: 0;
    margin: 0;
}
.dropdown-menu.bootstrap-select .dropdown-toggle .filter-option,
.bootstrap-select .dropdown-toggle .filter-option {
    display: flex;
    align-items: center;
}
.dropdown-menu.bootstrap-select .bs-ok-default:after,
.bootstrap-select .bs-ok-default:after {
    left: 5px;
    top: 1px;
    width: 5px;
    height: 10px;
    border: solid var(--border-PrimaryBlue-500);
    border-width: 0 2px 2px 0;
    -webkit-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    transform: rotate(45deg);
    content: "";
    position: absolute;
    display: none;
}
.dropdown-menu.bootstrap-select li a span.check-mark,
.bootstrap-select .dropdown-menu li a span.check-mark{
    border: 2px solid var(--border-Gray-300);
    border-radius: 3px;
    height: 18px;
    width: 18px;
    display: flex;
    align-items: center;
    position: relative !important;
    right: unset !important;
    top: 0 !important;
}
.dropdown-menu.bootstrap-select .selected span.check-mark,
.bootstrap-select.show-tick .dropdown-menu .selected span.check-mark{
    border-color: var(--border-PrimaryBlue-600);
}
.dropdown-menu.bootstrap-select li a span.text,
.bootstrap-select.show-tick .dropdown-menu li a span.text {
    margin: 0 0 0 10px;
}
.dropdown-menu.bootstrap-select li a.selected  .bs-ok-default:after,
.bootstrap-select .dropdown-menu li a.selected  .bs-ok-default:after{
    display: block;
}
.dropdown-menu.bootstrap-select,
.bootstrap-select .dropdown-menu{
    padding: 4px 0;
    max-height: max-content !important;
}
.dropdown-menu.bootstrap-select{
    font-size: var(--Body-Font-Size);
    color: var(--Body-Font-Color);
    border: 0;
    border-radius: var(--Border-Radius-sm);
    box-shadow: var(--Shadow-Dropdown-Menu);
    width: max-content !important;
    overflow: hidden;
    min-width: 240px;
    display: none;
}
.dropdown-menu.bootstrap-select.show{
    display: block;
}
.bs-searchbox {
    padding: 6px 14px 10px;
    border-bottom: 1px solid var(--border-Gray-300);
}
.dropdown-menu.bootstrap-select li.no-results,
.bootstrap-select .dropdown-menu li.no-results {
    background-color: transparent;
    text-align: center;
    padding: 10px 14px;
    font-size: var(--Body-Font-Size);
    color: var(--Body-Font-Color);
}
.dropdown-menu .dropdown-item.active {
    background-color: transparent;
}
.btn.actions-btn.bs-select-all,
.btn.actions-btn.bs-deselect-all {
    font-size: var(--Body-Font-Size);
    color: var(--Body-Font-Color);
    padding: 6px 14px;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: start;
    background-color: transparent;
    border: 0;
    width: auto;
    font-family: var(--Font-Face-Regular);
        min-height: auto;
    width: 100%;
}
.bs-actionsbox{
    padding: 0;
}
.btn.actions-btn.bs-select-all::before,
.btn.actions-btn.bs-deselect-all::before{
    content: '';
    display: inline-block;
    border: 2px solid var(--border-Gray-300);
    border-radius: 3px;
    height: 18px;
    width: 18px;
    position: relative !important;
    margin: 0 10px 0 0;
}
.btn.actions-btn.bs-select-all::after,
.btn.actions-btn.bs-deselect-all::after{
    left: 21px;
    top: 9px;
    width: 5px;
    height: 10px;
    border: solid var(--border-PrimaryBlue-500);
    border-width: 0 2px 2px 0;
    -webkit-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    transform: rotate(45deg);
    content: "";
    position: absolute;
    display: none;
}
.btn.actions-btn.bs-select-all.CheckAll::after,
.btn.actions-btn.bs-deselect-all::after{
    display: block;
}
.btn.actions-btn.bs-select-all.CheckAll::before,
.btn.actions-btn.bs-deselect-all::before{
    border-color: var(--border-PrimaryBlue-600);
}
.btn.actions-btn.bs-deselect-all,
.btn.actions-btn.bs-select-all.CheckAll{
    display: none;
}
.bs-actionsbox :has(.bs-select-all.CheckAll) .btn.actions-btn.bs-deselect-all{
    display: flex;
}
.new-modal-dialog .modal-fullscreen {
    max-width: calc(100vw - 100px);
    margin: 65px 0 0 auto;
}
.two-col-tooltip,
.two-col-tooltip .tooltip-inner{
    min-width: 330px;
}
.three-col-tooltip,
.three-col-tooltip .tooltip-inner{
    min-width: 490px;
}
.dropdown.dropdown-hover:hover .dropdown-menu {
    display: block;
}
.dropdown.selectpicker-dropdown,
.dropdown.selectpicker-dropdown>*{
    min-width: 240px;
}
.dropdown .dropdown-menu .dropdown-menu.inner {
    width: 100% !important;
}
.cursor-move{
    cursor: move;
}
.custom-check-scroll>* {
    max-height: 150px;
    overflow-y: auto;
}
.custom-file-reupload.upload-attachment .custom-file-input {
    width: auto;
    left: unset;
    max-width: 142px;
    margin: 13px 20px;
    height: auto;
    min-height: 33px;
}
.vertical-tab .nav-item{
    width: 100%;
    border-bottom: 1px solid var(--border-Gray-300);
}
.vertical-tab .nav-item .nav-link{
    width: 100%;
}
.vertical-tab.nav-tabs .nav-link::before {
    height: 100%;
    width: 2px;
    transform: scaleX(1) scaleY(0);
    transition-duration: 0.3s;
}
.vertical-tab.nav-tabs .nav-link.active:before {
    transform: scaleX(1) scaleY(1);
}
.table-responsive .bordered-table tr th{
    border-bottom: 1px solid var(--border-Gray-300);
}
/* .table-responsive.cus-scrollbar:has(td .material-symbols-outlined) {
    max-height: 279px;
}
.table-responsive.cus-scrollbar {
    max-height: 229px;
}
.table-responsive.cus-scrollbar:has(.bordered-table) {
    max-height: 234px;
}
.table-responsive.cus-scrollbar:has(.bordered-table):has(td .material-symbols-outlined) {
    max-height: 264px;
}
.table-responsive.cus-scrollbar:has(.inline-edit-table){
    max-height: 279px !important;
} */
.card-shadow:not(:has(.card-body)) .card-header {
    border-bottom: 0 !important;
}
.card-shadow:not(:has(.card-body)) .card-footer {
    border-top: 0 !important;
}
.card-body:has(.table-without-border){
    padding: 0 0 10px !important;
}
.text-end .form-control{
    text-align: end;
}
.table-responsive table tfoot td{
    font-family: var(--Font-Face-Bold);
}
.table-responsive table tfoot tr:last-child td{
    border-bottom: 0;
}
.form-control:disabled[readonly]{
    background-color: transparent;
}
.fixed-sidebar{
    position: fixed;
    max-width: calc(25% - 40px);
    top: 79px;
    height: calc(100vh - 93px);
    overflow: auto;
}
.main-sticky-header{
    position: sticky;
    top: 65px;
    z-index: 99;
}
/* .text-ellipsis{
    -webkit-line-clamp: 1;
    overflow: hidden;
    -webkit-box-orient: vertical;
    display: -webkit-box;
} */
.avatar.avatar-sm>.material-symbols-outlined{
    font-size: 28px;
}
.avatar.avatar-md>.material-symbols-outlined{
    font-size: 36px;
}
.avatar.avatar-lg>.material-symbols-outlined{
    font-size: 80px;
    font-weight: 200;
}
.avatar.avatar-xl>.material-symbols-outlined{
    font-size: 100px;
    font-weight: 200;
}
.full-width-row.row,
.full-width-row .row{
    width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
    --bs-gutter-x: 0;
}
.full-width-row>* {
    padding: 0 7px;
}
.row.col-lg-8{
    width: 66.66%;
}
.horizontal_scroll{
    display: inline-block;
    white-space: nowrap;
    width: 100%;
    overflow: auto;
}
.pointer-events-auto{
    pointer-events: unset !important;
}
.table-responsive table tr:last-child td{
    border-bottom: 0;
}
.table-responsive table tfoot tr:first-child td{
    border-top: 1px solid var(--border-Gray-300);
}
.no-data-found {
    min-height: 60vh;
}
.menubar.position-sticky{
    top: 65px;
    z-index: 99;
    margin: 0 0 0 90px;
    width: 100%;
}
main:has(.main-sticky-header) .fixed-sidebar {
    top: 126px;
    height: calc(100vh - 140px);
}
main:has(.main-sticky-header .btn) .fixed-sidebar{
    top: 147px;
    height: calc(100vh - 161px);
}
main:has(.main-sticky-header .material-symbols-outlined) .fixed-sidebar{
    top: 131px;
    height: calc(100vh - 145px);
}
main:has(.menubar.position-sticky) .fixed-sidebar {
    top: 161px;
    height: calc(100vh - 175px);
}
main:has(.menubar.position-sticky) .main-sticky-header{
    top: 147px;
}
main:has(.menubar.position-sticky):has(.main-sticky-header .btn) .fixed-sidebar {
    top: 228px;
    height: calc(100vh - 242px);
}
main:has(.menubar.position-sticky):has(.main-sticky-header .material-symbols-outlined) .fixed-sidebar{
    top: 214px;
    height: calc(100vh - 228px);
}
main:has(.menubar.position-sticky):has(.main-sticky-header) .fixed-sidebar {
    top: 208px;
    height: calc(100vh - 222px);
}
.main-sticky-footer {
    position: fixed;
    bottom: 0;
    background-color:var(--bg-White);
    z-index: 99;
    width: calc(100% + 28px);
    margin: 0 -14px;
    box-shadow: var(--Shadow-Small);
}
main:has(.main-sticky-header .material-symbols-outlined) .bottom-sticky-footer .fixed-sidebar {
    top: 131px;
    height: calc(100vh - 207px);
}
.right-content .bottom-sticky-footer {
    padding-bottom: 62px !important;
}
.table-responsive table .form-control[readonly]{
    font-size: 13px;
}
.table-responsive table{
    word-break:break-all;
}
.new-modal-dialog .modal-fullscreen{
    max-width: calc(100vw - 90px);
    margin: 65px 0 0 90px;
}
body:has(.new-modal-dialog.show),
.new-modal-dialog:has(.modal-fullscreen){
    overflow: hidden;
}
.new-modal-dialog .modal-fullscreen .modal-content{
    border-radius: 0;
}
.form-control:disabled[readonly] {
    background-color: var(--bg-Gray-100);
    border: 1px solid var(--border-Gray-300);
    padding: 2px 14px;
    height: 40px;
    border-radius: var(--Border-Radius-sm);
}
.form-group:has(.form-control:disabled[readonly]) .input-label.mb-10 {
    margin-bottom: 10px !important;
}
.bs-searchbox+.bs-actionsbox {
    padding: 0;
}
.card-header-height-calc{
    height: calc(100% - 40px);
    flex-direction: column;
    align-content: center;
}
.avatar.avatar-xxl {
    width: 180px;
    height: 180px;
    min-width: 180px;
    font-size: 62px;
}
.avatar.avatar-xxl>img {
    max-height: 180px;
    max-width: 180px;
}
.new-modal-dialog .modal-fullscreen .modal-body{
    max-height: calc(100vh - 117px);
}
.cus-file-with-list-item .custom-file-label {
    display: flex;
    align-items: center;
    padding: 0 100px 0 0;
}
.cus-file-with-list-item .custom-file-icn-new label.custom-file-label{
    max-width: 130px;
    text-overflow: ellipsis;
    white-space: nowrap;
    overflow: hidden;
    display: inline-block;
}
.cus-file-with-list-item .custom-file-label::after{
    border-left: 1px solid var(--border-Gray-300);
}
.modal-fullscreen .modal-header {
    position: relative;
    z-index: 9;
}
.gap-y-40{
    row-gap: 40px;
}
.profile-picture-upload{
    width: 100%;
    border-radius: var(--Border-Radius-sm);
    border: 1px dashed var(--border-PrimaryBlue-200);
    padding: 14px;
}
.Read_More_Text{
    -webkit-line-clamp: 1;
    overflow: hidden;
    -webkit-box-orient: vertical;
    display: -webkit-box;
    transition: max-height 0.3s ease-in-out;
    margin: 0px;
    line-height: 20px;
}
.form-control[readonly].dropdown-toggle::after{
    border: 0;
}
.new-modal-dialog .modal-fullscreen:has(.modal-sticky-footer.d-block) .modal-body {
    max-height: calc(100vh - 178px);
}
.form-control.readonly:disabled{
    background-color: transparent;
    border: 0;
    padding: 0;
    height: auto;
    min-height: auto;
    font-size: var(--Heading3-Font-Size);
    background-image: none;
    cursor: default;
}
.form-group:has(.form-control.readonly[disabled]) .input-label.mb-10{
    margin-bottom: 4px !important;
}
.text-ellipsis {
    text-overflow: ellipsis;
    display: inline-block;
    white-space: nowrap;
    overflow: hidden;
}
.modal-dialog.modal-dialog-bottom {
    margin: 0 0 0 auto;
    display: flex;
    align-items: flex-end;
    height: 100%;
}
.list-item-with-line{
    width: 100%;
    padding: 0;
    margin: 0;
    display: flex;
    flex-wrap: wrap;
}
.list-item-with-line li{
    position: relative;
    font-size: var(--Body-Font-Size);
    color: var(--Body-Font-Color);
    list-style: none;
    display: inline-block;
    padding: 0 8px 0 0;
    margin: 0 8px 0 0;
}
.list-item-with-line li:not(:last-child)::after {
    content: '';
    height: 14px;
    border-right: 1px solid var(--border-Gray-400);
    display: inline-block;
    position: absolute;
    right: 0;
    top: 50%;
    transform: translateY(-50%);
}
.animated-modal .modal-body{
    max-height: calc(100vh - 130px);
    transition: all 0.4s ease;
}
.animated-modal .modal-body.minimize {
    padding: 0 !important;
    overflow: hidden;
    max-height: 0;
}
.animated-modal{
    top: auto;
    left: unset;
    bottom: 0;
    right: 0;
    max-width: 420px;
    margin: 0 0 0 auto;
    height: auto;
    z-index: 999;
    position: fixed;
    display: none;
}
.tooltip.show {
    opacity: 1;
}
body:has(.animated-modal.d-block) .tooltip {
    z-index: 999;
}
body:has(.new-modal-full.show) .animated-modal.d-block {
    z-index: 999999;
}
body:has(.new-modal-full.show):has(.animated-modal.d-block) .tooltip{
    z-index: 999999;
}
.table-responsive table.data-table-sorting tr .cus-checkbox{
    line-height: 18px;
    min-height: 18px;
}
.form-group:has(.form-control[readonly]) .input-label::after,
.form-group:has(.form-control.readonly[disabled]) .input-label::after,
.form-group:has(.form-control.readonly[readonly]) .input-label::after{
    display: none;
}
.form-control:has(.custom-file-input[readonly]) {
    background-color: transparent;
    border: 0;
    padding: 0;
    height: auto;
    min-height: auto;
    font-size: 13px;
    display: none;
}
.MobsearchBox{
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    transform: translateY(-100%);
    transition: all 0.4s ease;
    background-color: var(--bg-White);
    display: flex;
    align-items: center;
    padding: 0 14px;
    z-index: 999;
}
.MobsearchBox.open{
    transform: translateY(0);
}
.MobsearchBox .form-control {
    height: 65px;
    border: 0;
    border-radius: 0;
    padding: 0;
}
.searchbar-backdrop{
    position: fixed;
    background-color: rgba(0,0,0,0.5);
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    display: none;
}
.searchbar-backdrop.show{
    display: block;
}
.pagination .page-item .current-page:focus,
.pagination .page-item .page-link:focus{
    outline-offset: -3px;
    border-radius: 5px;
    outline: 1px solid var(--border-PrimaryBlue-500);
}
.table-layout-fixed{
    table-layout: fixed;
}
.odd-even-bg tbody tr td.dataTables_empty {
    background-color: transparent;
    border-top: 1px solid var(--border-Gray-300);
    height: 150px;
    vertical-align: middle;
    text-align:center;
}
.odd-even-bg tbody tr td.dataTables_empty > .material-symbols-outlined {
    font-size: 100px;
    font-weight: 200;
    color: var(--text-Gray-300);
}
.odd-even-bg tbody tr td.dataTables_empty > .material-symbols-outlined.loading-icon {
    min-height: 100px;
    min-width: 100px;
}
.jstree-default .jstree-node, .jstree-default .jstree-icon {
    background-image: url(../images/32px.png);
}
.jstree-default .jstree-closed > .jstree-ocl,
.jstree-default .jstree-open > .jstree-ocl{
    background: none !important;
    background-color: #fff !important;
    margin: 0 0 14px 0;
}
.jstree-default .jstree-closed > .jstree-ocl::before {
    content: '\e146';
    font-family: 'MaterialIcons-Regular';
    font-style: normal;
    color: var(--text-Gray-400);
}
.jstree-default .jstree-open > .jstree-ocl::before {
    content: '\e909';
    font-family: 'MaterialIcons-Regular';
    font-style: normal;
    color: var(--text-Gray-400);
}
.jstree-default .jstree-icon:empty {
    width: 20px;
    height: 20px;
    line-height: 20px;
}
.jstree-default .jstree-node {
    background-position: -293px -4px;
}
.jstree-default .jstree-leaf>.jstree-ocl {
    background-position: -69px -4px;
}
.jstree-anchor{
    font-family: var(--Body-Fontface);
    font-size: var(--Body-Font-Size);
}
.jstree-default .jstree-clicked {
    background: transparent;
    border-radius: 0;
    box-shadow: none;
    color: #0649ED;
    font-family: var(--Font-Face-Bold);
}
.jstree-default .jstree-hovered {
    background: transparent;
    border-radius: 0;
    box-shadow: none;
    color: #0649ED;
}
.table-responsive table.without-bordered-table tr td{border: 0;}
.border-bottom-2 .nav-tabs .nav-link::before{bottom: -2px;}
.text-black-body{color: var(--Body-Font-Color);}
/* Custom Spacing for without Border Table */
.table-responsive table tr .table-td-spacing{padding: 14px 10px 0;}
.table-responsive table tr td.table-td-spacing:first-child{padding: 14px 10px 0 14px;}
.table-responsive table tr td.table-td-spacing:last-child{padding: 14px 14px 0 10px;}
.table-responsive table tr td.table-td-spacing:first-child{padding: 14px 10px 0 14px;}
.table-responsive table tbody tr:last-child td.table-td-spacing{padding: 14px 10px;}
.tale-responsive table tbody tr:last-child td.table-td-spacing:first-child{padding: 14px 10px 14px 14px;}
.table-responsive table tbody tr:last-child td.table-td-spacing:last-child{padding: 14px 14px 14px 10px;}
.cursore-default{cursor: default !important;}
.avatar-group{
    display: flex;
    align-items: center;
}
:where(.avatar-group>.avatar){
    border: 1px solid var(--bg-White);
}
:where(.avatar-group>:not(:last-child)){
    margin-inline-end: -10px;
}
/* Add Outline to changes with tab */
.form-control.dropdown-toggle:focus-visible,
.form-control:focus-visible{    
    border-color: var(--border-PrimaryBlue-500);
}
.btn:focus-visible{
    box-shadow:rgba(6, 73, 237, 0.9) 0 9px 9px -7px !important;
}
.input-group:has(.form-control:focus-visible){
    border-color: var(--border-PrimaryBlue-500);
}
.custom-file-animated .file__input:has(.custom-file-input:focus-visible){
    border:1px solid var(--border-PrimaryBlue-500);
}
select.form-control.border-0:focus-visible{
    outline-offset: -2px;
    border-radius: 5px;
    outline: 1px solid var(--border-PrimaryBlue-500);
}
.btn-close:focus-visible,
.normal-icn:focus-visible{
    border-radius: 3px;
    outline: 1px solid var(--border-PrimaryBlue-500);
}
/* START :: Journal Entry */
.input-group:has(.form-control:disabled), 
.input-group:has(.form-control[readonly]){
    padding: 0;
    overflow: hidden;
}
.form-control.cursor-pointer:disabled,
.form-controlcursor-pointer[readonly]{
    cursor: default !important;
}
.Toggle_Arrow .material-symbols-outlined{
    transition: all 0.4s ease;
}
.Toggle_Arrow_Open .material-symbols-outlined{
    transform:rotateX(180deg);
}
.table-responsive table{
    word-break:break-word;
}
/* END :: Journal Entry */

/* START :: Exit Interview Form */
.border-radius-box{
    padding: 8px 14px;
    min-height: 40px;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    color: var(--Body-Font-Color);
    border: 1px solid var(--border-Gray-300);
    border-radius: var(--Border-Radius-sm);
    font-size: var(--Body-Font-Size);
    color: var(--Body-Font-Color);
    line-height: var(--Body-Font-Lineheight);
}
.border-radius-textarea{
    min-height: 90px;
    align-items: start;
}
.border-bottom-2 .nav-tabs .nav-link::before{bottom: -1px;}
.Qus_Type_Cnt{
    display: none;
}
.border-dashed{
    border-style: dashed !important;
}
.rating-star:not(:checked) > input {
    position: absolute;
    visibility: hidden;
}
.rating-star:not(:checked) > label {
    width: 24px;
    overflow: hidden;
    white-space: nowrap;
    cursor: pointer;
    font-size: 24px;
    color: var(--text-Gray-400);
    margin: 0;
}
.rating-star label{
    transition: transform .3s;
    font-weight: 700;
    line-height: normal;
}
.rating-star label:hover{
    transform: scale(1.3);
}
.rating-star:not(:checked) > label:before {
    content: '\e838';
    font-family: var(--MaterialIcons-Font-Face-Regular-fill) !important;
}
.rating-star > input:checked ~ label {
    color:var(--text-Yellow-600);
}
.rating-star:not(:checked) > label:hover, 
.rating-star:not(:checked) > label:hover ~ label{
    color:var(--text-Yellow-600);
}
.rating-star.disabled:not(:checked) > label:hover, 
.rating-star.disabled:not(:checked) > label:hover ~ label{
    color:var(--text-Gray-400);
    transform: scale(1);
}
/* END :: Exit Interview Form */

/* START :: Task Management */
.gap-10{gap: 10px;}
.gap-14{gap: 14px;}
.gap-20{gap: 20px;}
.sticky-left-right-col table tr th:first-child, 
.sticky-left-right-col table tr td:first-child,
.sticky-left-right-col table tr th:last-child, 
.sticky-left-right-col table tr td:last-child {
    position: sticky;
    background-color: var(--bg-White);
    z-index: 9;
}
.sticky-left-right-col table tr th:first-child, 
.sticky-left-right-col table tr td:first-child{
    left: 0;
}
.sticky-left-right-col table tr th:last-child, 
.sticky-left-right-col table tr td:last-child{
    right: 0;
}
.sticky-left-right-col table tr th:first-child::before, 
.sticky-left-right-col table tr td:first-child::before,
.sticky-left-right-col table tr th:last-child::before, 
.sticky-left-right-col table tr td:last-child::before{
    content: '';
    height: 100%;
    position: absolute;
    top: 0;
}
.sticky-left-right-col table tr th:first-child::before, 
.sticky-left-right-col table tr td:first-child::before{
    border-right: 1px solid var(--border-Gray-300);
    right: 0;
}
.sticky-left-right-col table tr th:last-child::before, 
.sticky-left-right-col table tr td:last-child::before {
    border-left: 1px solid var(--border-Gray-300);
    left: 0;
}
.horizontal_scroll {
    margin-bottom: -3px;
}
.sticky-left-right-col table tr>*.border-right-0::before{
    border: 0 !important;
}
.sticky-left-right-col table tr>*.border-left-0::before{
    border: 0 !important;
}
.border-bottom-2 .nav-tabs .nav-link::before {
    bottom: -2px;
}
.table.table-bordered{
    border-color: var(--border-Gray-300);
}
.table-responsive .table-bordered tr th{
    border:1px solid var(--border-Gray-300);
    border-width: 0 1px 1px 0;
}
table.table.bordered-table.table-bordered {
    border-top-color: transparent;
    border-bottom-color: transparent;
    border-collapse: separate;
    border-spacing: 0;
}
.bootstrap-datetimepicker-widget {position: absolute;}
.align-middle td.align-top {vertical-align: top !important;}
.font-regular{font-weight: 400;}
.align-middle th{vertical-align: middle !important;}
.progress.progress-without-arrow .progress-bar:after{
    border: 0;
    background-color: var(--bg-Transparent);
}
.progress.progress-without-arrow{
    margin: 0;
    overflow: hidden;
}
.normal-link{
    background-color: var(--bg-Transparent);
    border: 0;
    padding: 0;
}
.d-table-caption{display: table-caption !important;}
.card-body.pb-0{padding-bottom: 0 !important;}
.card-border table.bordered-table tr:last-child td{background-color: var(--bg-Transparent);}
.acc-arrow{transition: all 0.4s ease;}
.View_Task_Dtl.open>.acc-arrow{transform: rotateX(180deg);}
.hidden{display: none !important;}
.VoiceWaveForm{
    display:flex;
    align-items:center;
    height:40px;
    overflow:hidden;
}
.VoiceBar{
    width:2px;
    margin:0 2px 0 0;
    background-color:var(--text-Gray-400);
    transition:background 0.25s ease;
}
.table-responsive .table:has(thead th.position-sticky) tbody tr.position-sticky{
    top:40px;
}
.table-bordered>:not(caption)>*>* {
    border-width: 0 1px 0 0;
}
.table-bordered tr th:last-child,
.table-bordered tr td:last-child{
    border-right-width: 0;
}
.table-responsive table tr:has(.AddTimeRow.d-none) td{
    border-bottom: 0;
}
.table-responsive table tr.Same_Date_Timesheet td:first-child{
    padding: 10px;
}
.new-modal-dialog .modal-dialog.modal-auto{
    max-width: 816px;
    min-width: 556px;
    margin: 20px auto;
}
.new-modal-dialog .modal-dialog.modal-auto .modal-content{
    min-width: 500px;
}
.input-group:has(input:read-only, select:read-only){
    border-radius: 0;
}
.w-90{width: 90% !important;}
/* END :: Task Management */
.cus-file-with-list-item .custom-file-icn-new>.d-flex:first-child {
    width: calc(100% - 60px);
}
.cus-file-with-list-item .custom-file-icn-new>.d-flex:first-child label.custom-file-label{
    max-width: 100%;
}
/* START :: Feed Editor */
.feed-editor{
    background-color:#fff;
    border: 1px solid #D1D5DB;
    border-radius: 10px;
    width: 100%;
    position: relative;
    min-height: 120px;
    border-radius: 10px;
}
.feed-editor-textarea {
    overflow: auto;
    padding: 15px;
    min-height: 75px;
    outline: none;
    font-size: 13px;
    color: #333;
    max-height: 75px;
    border: 0;
}
.feed-editor-textarea:empty:before {
    content: attr(data-placeholder);
    color: #333;
}
.feed-editor-textarea img {
    max-width: 100%;
    border-radius: 8px;
    margin: 8px 0;
    display: block
}
.feed-editor-toolbar{
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 8px;
    padding: 8px 15px;
    border-top: 1px solid #D1D5DB;
}
.feed-editor-toolbar .normal-icn{
    line-height: 16px;
    color: #9CA3AF;
}
.feed-editor-group {
    display: flex;
    gap: 10px;
    align-items: center
}
.add-image-btn{
    border-radius: 5px;
    font-size: 10px;
    color: #374151;
    padding: 5px 14px;
    background-color: #E5E7EB;
    min-width: 70px;
    border: 0;
    font-weight: 600;
    cursor: pointer;
    outline: 0 !important;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    margin: 0;
}
.add-image-btn>span{
    color: #374151;
}
.hidden-input {
    display: none
}
.feed-editor-fullscreen{
    position: fixed;
    inset: 0;
    z-index: 999;
    max-width: none;
    margin: 15px;
    width: calc(100% - 30px);
}
.feed-editor-fullscreen .feed-editor-textarea{
    min-height: calc(100vh - 75px);
    max-height: calc(100vh - 75px);
    cursor: text;
}
.feed-editor-backdrop {
    position: fixed;
    inset: 0;
    background: rgba(0, 0, 0, 0.5);
    z-index: 99;
    display: none
}
.feed-editor-backdrop.show {
    display: block
}
.feed-editor-fullscreen #btnFull .material-symbols-outlined,
.feed-editor-toolbar .formatted .material-symbols-outlined{
    color: #374151;   
}
.gradient-btn{
    background: linear-gradient(93deg, rgba(6, 73, 237, 1) 0%, rgba(139, 92, 246, 1) 100%);
    color: #fff;
    border:0 !important;
}
.new-design-modal .feed-editor-fullscreen .feed-editor-textarea {
    min-height: calc(100vh - 120px);
    max-height: calc(100vh - 120px);
}
/* END :: Feed Editor */
.toggle-switch-text:before, 
.toggle-switch-text:after {
    width: 20px;
    text-align: center;
    font-family: var(--Font-Face-SemiBold);
    position: absolute;
    transition: opacity 0.25s;
    font-size: 10px;
    color: var(--text-White);
    line-height: var(--Body-Font-Lineheight);
    left: 8px;
    top: -2px;
}
.toggle-switch-text:before {
    content: 'N';
    left: 6px;
    text-align: right;
}
.toggle-switch-text:after {
    content: 'Y';
    right: -8px;
    text-align: left;
    opacity: 0;
}
.toggle-switch-text.active:before {opacity: 0;}
.toggle-switch-text.active:after {opacity: 1;}
/* END :: Toggle Switch */
/*MR 06/08/2025 FBP Design issue on existing*/
.factohrbase1:has(.right-content) {
    padding: 39px 0 0px 10px;
}
.input-group .input-group-append.input-group-text {
    width: auto;
}
.input-group .input-group-append.input-group-text > span {
    color: var(--text-Gray-400);
    font-size: 24px;
    padding: 0;
    height: auto;
}
.datepicker.datepicker-dropdown{
    width:auto !important;
}
.form-group {
    margin-bottom: 0;
}
select.form-control {
    background-image: url('data:image/svg+xml,<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg"><mask id="mask0_408_346" style="mask-type:alpha" maskUnits="userSpaceOnUse" x="0" y="0" width="24" height="24"><rect width="24" height="24" fill="%23D9D9D9"/></mask><g mask="url(%23mask0_408_346)"><path d="M12 15L7 10H17L12 15Z" fill="%239CA3AF"/></g></svg>') !important;
    background-repeat: no-repeat !important;
    background-position: 98% !important;
    background-size: 24px !important;
}
.table-responsive table tr th {
    text-transform: unset;
}
select.form-control.border-0.bg-transparent.text-PrimaryBlue-500 {
    background-position: 100% !important;
    background-image: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" height="24px" viewBox="0 -960 960 960" width="24px" fill="%230649ED"><path d="M480-360 280-560h400L480-360Z"/></svg>') !important;
}
.pagination{
    border-radius:0;
}
h4, .Heading4-Font-Size {
    font-weight: normal;
    font-family: var(--Body-Fontface);
}
select.form-control[readonly] {
    background-image: none !important;
}
.form-control, .form-control.dropdown-toggle {
    font-family: var(--Body-Fontface);
}
.table-responsive table.data-table-sorting tr {
    background-color: transparent;
}
.normal-link {
    color: var(--text-PrimaryBlue-600) !important;
    font-weight: normal !important;
}
table.dataTable thead .sorting:before,
table.dataTable thead .sortable:before {
    font-size: 0;
    line-height: normal;
}
.tooltip > .tooltip-inner {
    border: 0;
    color: #333;
    /*max-width: max-content;*/
}
.dropdown-menu.bootstrap-select {
    border-radius: var(--Border-Radius-sm) !important;
    width: max-content !important;
    font-family: var(--Body-Fontface);
}
.bootstrap-select:not([class*=col-]):not([class*=form-control]):not(.input-group-btn) {
    width: 100%;
    min-width: 0;
}
/* ellipsis in the button label */
.bootstrap-select .dropdown-toggle .filter-option-inner {
    min-width: 0;
}
.bootstrap-select .dropdown-toggle .filter-option-inner-inner {
    text-overflow: ellipsis;
    white-space: nowrap;
}
.dropdown-menu.bootstrap-select.show .inner {
    width: 100%;
}
.badge-notification {
    position: absolute;
    right: -30px;
    top: 22px;
    z-index: 9;
}
@-moz-document url-prefix() {
    option {
        font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
    }
}
/* START :: Exit Interview Form */
.border-radius-box {
    padding: 8px 14px;
    min-height: 40px;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    color: var(--Body-Font-Color);
    border: 1px solid var(--border-Gray-300);
    border-radius: var(--Border-Radius-sm);
    font-size: var(--Body-Font-Size);
    color: var(--Body-Font-Color);
    line-height: var(--Body-Font-Lineheight);
}
.border-radius-textarea {
    min-height: 90px;
    align-items: start;
}
.border-bottom-2 .nav-tabs .nav-link::before {
    bottom: -1px;
}
.Qus_Type_Cnt {
    display: none;
}
.border-dashed {
    border-style: dashed !important;
}
.rating-star:not(:checked) > input {
    position: absolute;
    visibility: hidden;
}
.rating-star:not(:checked) > label {
    width: 24px;
    overflow: hidden;
    white-space: nowrap;
    cursor: pointer;
    font-size: 24px;
    color: var(--text-Gray-400);
    margin: 0;
}
.rating-star label {
    transition: transform .3s;
    font-weight: 700;
    line-height: normal;
}
.rating-star label:hover {
    transform: scale(1.3);
}
.rating-star:not(:checked) > label:before {
    content: '\e838';
    font-family: var(--MaterialIcons-Font-Face-Regular-fill) !important;
}
.rating-star > input:checked ~ label {
    color: var(--text-Yellow-600);
}
.rating-star:not(:checked) > label:hover,
.rating-star:not(:checked) > label:hover ~ label {
    color: var(--text-Yellow-600);
}
.rating-star.disabled:not(:checked) > label:hover,
.rating-star.disabled:not(:checked) > label:hover ~ label {
    color: var(--text-Gray-400);
    transform: scale(1);
}
.ui-widget.ui-widget-content.ui-front {
    z-index: 9999;
}
.hide{
    display:none !important;
}
/* END :: Exit Interview Form */


/* MR:JG : 16012026 #FP1-T1 (OTP based SignUp) - this below is newly added */
/* START :: Free Plan */
.card-gradient {
    background: linear-gradient(180deg, #CFCDFD 0%, #FFE8CC 100%);
}

.new-modal-dialog .modal-dialog.modal-xxl {
    max-width: 1248px;
}

.carousel-arrow-text {
    opacity: 1 !important;
    color: var(--text-PrimaryBlue-500) !important;
    font-size: var(--Body-Font-Size);
    line-height: var(--Body-Font-Lineheight);
    font-family: var(--Font-Face-SemiBold);
    width: auto;
}

    .carousel-arrow-text.disable {
        color: var(--Body-Font-Color) !important;
        font-family: var(--Font-Face-Regular);
        cursor: default !important;
    }

    .carousel-arrow-text.carousel-control-prev {
        left: auto;
        right: 40px;
    }

    .carousel-arrow-text:not(:last-child)::after {
        content: '|';
        color: var(--text-Gray-400) !important;
        margin: 0 0 0 10px;
    }

.circular-progress {
    width: 30px;
    height: 30px;
    border-radius: 50%;
    display: flex;
    justify-content: center;
    align-items: center;
}

.inner-circle {
    position: absolute;
    width: calc(30px - 6px);
    height: calc(30px - 6px);
    border-radius: 50%;
    background-color: var(--bg-PrimaryBlue-100);
}

.confetti-canvas {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    pointer-events: none;
    z-index: -9;
}

.file__input .font-10 {
    line-height: 15px;
}

.Sidebar-TabMenu {
    width: 100%;
    padding: 0;
    margin: 0;
}

    .Sidebar-TabMenu > li > a {
        font-size: var(--Heading3-Font-Size);
        color: var(--text-color-Heading);
        padding: 10px 16px;
        display: flex;
        flex-wrap: wrap;
        border-bottom: 1px solid var(--border-Gray-300);
        text-decoration-line: none;
        font-family: var(--Font-Face-SemiBold);
        position: relative;
    }

    .Sidebar-TabMenu .has-children > a::after {
        content: '\e315';
        font-family: var(--MaterialIcons-Font-Face-Regular);
        color: var(--text-Gray-400);
        font-size: var(--Heading1-Font-Size);
        position: absolute;
        top: 0;
        right: 0;
        margin: 10px;
        transition: all 0.4s ease;
    }

    .Sidebar-TabMenu .has-children > a.active::after {
        transform: rotate(90deg);
    }

    .Sidebar-TabMenu > li.has-children .sub-menu {
        padding: 6px 10px;
        list-style: none;
    }

    .Sidebar-TabMenu > li.has-children .sub-menu > li > a {
        font-size: var(--Heading4-Font-Size);
        color: var(--text-color-Heading);
        padding: 10px 20px;
        display: flex;
        flex-wrap: wrap;
        text-decoration-line: none;
        border-radius: var(--Border-Radius-sm);
        transition: all 0.4s ease;
        position: relative;
    }

        .Sidebar-TabMenu > li.has-children .sub-menu > li > a::after {
            margin: 10px 0;
        }

    .Sidebar-TabMenu > li.has-children .sub-menu li a:hover,
    .Sidebar-TabMenu > li.has-children .sub-menu li a.active {
        background-color: var(--bg-PrimaryBlue-50);
        font-family: var(--Font-Face-SemiBold);
    }

    .Sidebar-TabMenu > li.has-children .sub-menu li.has-children > a:hover,
    .Sidebar-TabMenu > li.has-children .sub-menu li.has-children > a.active {
        background-color: transparent;
        font-family: var(--Font-Face-Regular);
    }

    input.form-control.hidden-arrow[type=number] {
        -moz-appearance: textfield;
    }
    .Filter_Apply {
        margin-right: 10px;
    }

    p, .paragraph {
        font-family: var(--Font-Face-Regular);
    }
    }

/* START :: Task Management */
.gap-10 {
    gap: 10px;
}

.gap-14 {
    gap: 14px;
}

.gap-20 {
    gap: 20px;
}

.sticky-left-right-col table tr th:first-child,
.sticky-left-right-col table tr td:first-child,
.sticky-left-right-col table tr th:last-child,
.sticky-left-right-col table tr td:last-child {
    position: sticky;
    background-color: var(--bg-White);
    z-index: 9;
}

.sticky-left-right-col table tr th:first-child,
.sticky-left-right-col table tr td:first-child {
    left: 0;
}

.sticky-left-right-col table tr th:last-child,
.sticky-left-right-col table tr td:last-child {
    right: 0;
}

.sticky-left-right-col table tr th:first-child::before,
.sticky-left-right-col table tr td:first-child::before,
.sticky-left-right-col table tr th:last-child::before,
.sticky-left-right-col table tr td:last-child::before {
    content: '';
    height: 100%;
    position: absolute;
    top: 0;
}

.sticky-left-right-col table tr th:first-child::before,
.sticky-left-right-col table tr td:first-child::before {
    border-right: 1px solid var(--border-Gray-300);
    right: 0;
}

.sticky-left-right-col table tr th:last-child::before,
.sticky-left-right-col table tr td:last-child::before {
    border-left: 1px solid var(--border-Gray-300);
    left: 0;
}

.horizontal_scroll {
    margin-bottom: -3px;
}

.sticky-left-right-col table tr > *.border-right-0::before {
    border: 0 !important;
}

.sticky-left-right-col table tr > *.border-left-0::before {
    border: 0 !important;
}

.border-bottom-2 .nav-tabs .nav-link::before {
    bottom: -2px;
}

.table.table-bordered {
    border-color: var(--border-Gray-300);
}

.table-responsive .table-bordered tr th {
    border: 1px solid var(--border-Gray-300);
    border-width: 0 1px 1px 0;
}

table.table.bordered-table.table-bordered {
    border-top-color: transparent;
    border-bottom-color: transparent;
    border-collapse: separate;
    border-spacing: 0;
}

.bootstrap-datetimepicker-widget {
    position: absolute;
}

.align-middle td.align-top {
    vertical-align: top !important;
}

.font-regular {
    font-weight: 400;
}

.align-middle th {
    vertical-align: middle !important;
}

.progress.progress-without-arrow .progress-bar:after {
    border: 0;
    background-color: var(--bg-Transparent);
}

.progress.progress-without-arrow {
    margin: 0;
    overflow: hidden;
}

.normal-link {
    background-color: var(--bg-Transparent);
    border: 0;
    padding: 0;
}

.d-table-caption {
    display: table-caption !important;
}

.card-body.pb-0 {
    padding-bottom: 0 !important;
}

.card-border table.bordered-table tr:last-child td {
    background-color: var(--bg-Transparent);
}

.acc-arrow {
    transition: all 0.4s ease;
}

.View_Task_Dtl.open > .acc-arrow {
    transform: rotateX(180deg);
}

.hidden {
    display: none !important;
}

.VoiceWaveForm {
    display: flex;
    align-items: center;
    height: 40px;
    overflow: hidden;
}

.VoiceBar {
    width: 2px;
    margin: 0 2px 0 0;
    background-color: var(--text-Gray-400);
    transition: background 0.25s ease;
}

.table-responsive .table:has(thead th.position-sticky) tbody tr.position-sticky {
    top: 40px;
}

.table-bordered > :not(caption) > * > * {
    border-width: 0 1px 0 0;
}

.table-bordered tr th:last-child,
.table-bordered tr td:last-child {
    border-right-width: 0;
}

.table-responsive table tr:has(.AddTimeRow.d-none) td {
    border-bottom: 0;
}

.table-responsive table tr.Same_Date_Timesheet td:first-child {
    padding: 10px;
}

.new-modal-dialog .modal-dialog.modal-auto {
    max-width: 816px;
    min-width: 556px;
    margin: 20px auto;
}

.new-modal-dialog .modal-dialog.modal-auto .modal-content {
    min-width: 500px;
}

.input-group:has(input:read-only, select:read-only) {
    border-radius: 0;
}

.w-90 {
    width: 90% !important;
}
/* END :: Task Management */
.cus-file-with-list-item .custom-file-icn-new > .d-flex:first-child {
    width: calc(100% - 60px);
}

.cus-file-with-list-item .custom-file-icn-new > .d-flex:first-child label.custom-file-label {
    max-width: 100%;
}
/* START :: Feed Editor */
.feed-editor {
    background-color: #fff;
    border: 1px solid #D1D5DB;
    border-radius: 10px;
    width: 100%;
    position: relative;
    min-height: 120px;
    border-radius: 10px;
}

.feed-editor-textarea {
    overflow: auto;
    padding: 15px;
    min-height: 75px;
    outline: none;
    font-size: 13px;
    color: #333;
    max-height: 75px;
    border: 0;
}

.feed-editor-textarea:empty:before {
    content: attr(data-placeholder);
    color: #333;
}

.feed-editor-textarea img {
    max-width: 100%;
    border-radius: 8px;
    margin: 8px 0;
    display: block
}

.feed-editor-toolbar {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 8px;
    padding: 8px 15px;
    border-top: 1px solid #D1D5DB;
}

.feed-editor-toolbar .normal-icn {
    line-height: 16px;
    color: #9CA3AF;
}

.feed-editor-group {
    display: flex;
    gap: 10px;
    align-items: center
}

.add-image-btn {
    border-radius: 5px;
    font-size: 10px;
    color: #374151;
    padding: 5px 14px;
    background-color: #E5E7EB;
    min-width: 70px;
    border: 0;
    font-weight: 600;
    cursor: pointer;
    outline: 0 !important;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    margin: 0;
}

.add-image-btn > span {
    color: #374151;
}

.hidden-input {
    display: none
}

.feed-editor-fullscreen {
    position: fixed;
    inset: 0;
    z-index: 999;
    max-width: none;
    margin: 15px;
    width: calc(100% - 30px);
}

.feed-editor-fullscreen .feed-editor-textarea {
    min-height: calc(100vh - 75px);
    max-height: calc(100vh - 75px);
    cursor: text;
}

.feed-editor-backdrop {
    position: fixed;
    inset: 0;
    background: rgba(0, 0, 0, 0.5);
    z-index: 99;
    display: none
}

.feed-editor-backdrop.show {
    display: block
}

.feed-editor-fullscreen #btnFull .material-symbols-outlined,
.feed-editor-toolbar .formatted .material-symbols-outlined {
    color: #374151;
}

.gradient-btn {
    background: linear-gradient(93deg, rgba(6, 73, 237, 1) 0%, rgba(139, 92, 246, 1) 100%);
    color: #fff;
    border: 0 !important;
}

.new-design-modal .feed-editor-fullscreen .feed-editor-textarea {
    min-height: calc(100vh - 120px);
    max-height: calc(100vh - 120px);
}
/* END :: Feed Editor */
.toggle-switch-text:before,
.toggle-switch-text:after {
    width: 20px;
    text-align: center;
    font-family: var(--Font-Face-SemiBold);
    position: absolute;
    transition: opacity 0.25s;
    font-size: 10px;
    color: var(--text-White);
    line-height: var(--Body-Font-Lineheight);
    left: 8px;
    top: -2px;
}

.toggle-switch-text:before {
    content: 'N';
    left: 6px;
    text-align: right;
}

.toggle-switch-text:after {
    content: 'Y';
    right: -8px;
    text-align: left;
    opacity: 0;
}

.toggle-switch-text.active:before {
    opacity: 0;
}

.toggle-switch-text.active:after {
    opacity: 1;
}
/* END :: Toggle Switch */

/* START :: Free Plan */
.card-gradient {
    background: linear-gradient(180deg, #CFCDFD 0%, #FFE8CC 100%);
}

.new-modal-dialog .modal-dialog.modal-xxl {
    max-width: 1248px;
}

.carousel-arrow-text {
    opacity: 1 !important;
    color: var(--text-PrimaryBlue-500) !important;
    font-size: var(--Body-Font-Size);
    line-height: var(--Body-Font-Lineheight);
    font-family: var(--Font-Face-SemiBold);
    width: auto;
}

.carousel-arrow-text.disable {
    color: var(--Body-Font-Color) !important;
    font-family: var(--Font-Face-Regular);
    cursor: default !important;
}

.carousel-arrow-text.carousel-control-prev {
    left: auto;
    right: 40px;
}

.carousel-arrow-text:not(:last-child)::after {
    content: '|';
    color: var(--text-Gray-400) !important;
    margin: 0 0 0 10px;
}

.circular-progress {
    width: 30px;
    height: 30px;
    border-radius: 50%;
    display: flex;
    justify-content: center;
    align-items: center;
}

.inner-circle {
    position: absolute;
    width: calc(30px - 6px);
    height: calc(30px - 6px);
    border-radius: 50%;
    background-color: var(--bg-PrimaryBlue-100);
}

.confetti-canvas {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    pointer-events: none;
    z-index: -9;
}

.file__input .font-10 {
    line-height: 15px;
}

.Sidebar-TabMenu {
    width: 100%;
    padding: 0;
    margin: 0;
}

.Sidebar-TabMenu > li > a {
    font-size: var(--Heading3-Font-Size);
    color: var(--text-color-Heading);
    padding: 10px 16px;
    display: flex;
    flex-wrap: wrap;
    border-bottom: 1px solid var(--border-Gray-300);
    text-decoration-line: none;
    font-family: var(--Font-Face-SemiBold);
    position: relative;
}

.Sidebar-TabMenu .has-children > a::after {
    content: '\e315';
    font-family: var(--MaterialIcons-Font-Face-Regular);
    color: var(--text-Gray-400);
    font-size: var(--Heading1-Font-Size);
    position: absolute;
    top: 0;
    right: 0;
    margin: 10px;
    transition: all 0.4s ease;
}

.Sidebar-TabMenu .has-children > a.active::after {
    transform: rotate(90deg);
}

.Sidebar-TabMenu > li.has-children .sub-menu {
    padding: 6px 10px;
    list-style: none;
}

    .Sidebar-TabMenu > li.has-children .sub-menu > li > a {
        font-size: var(--Heading4-Font-Size);
        color: var(--text-color-Heading);
        padding: 10px 20px;
        display: flex;
        flex-wrap: wrap;
        text-decoration-line: none;
        border-radius: var(--Border-Radius-sm);
        transition: all 0.4s ease;
        position: relative;
    }

        .Sidebar-TabMenu > li.has-children .sub-menu > li > a::after {
            margin: 10px 0;
        }

    .Sidebar-TabMenu > li.has-children .sub-menu li a:hover,
    .Sidebar-TabMenu > li.has-children .sub-menu li a.active {
        background-color: var(--bg-PrimaryBlue-50);
        font-family: var(--Font-Face-SemiBold);
    }

    .Sidebar-TabMenu > li.has-children .sub-menu li.has-children > a:hover,
    .Sidebar-TabMenu > li.has-children .sub-menu li.has-children > a.active {
        background-color: transparent;
        font-family: var(--Font-Face-Regular);
    }

input.form-control.hidden-arrow[type=number] {
    -moz-appearance: textfield;
}