/* @import url('https://fonts.cdnfonts.com/css/proxima-nova-condensed'); */
:root {
    --primary: #2667BD;
    --secondary: #7E58AE;
    --third: #f15b5d;
    --success: #61ce70;
    --warning: #FCC204;
    --btn-primary: #2667BD;
    --gray-light: #f3f3f3;
    --gray-medium: #999999;
    --gray-dark: #5b6e88;
    --body-color: #ecf0fa;
    --logo-right: #eae8f1;
    --bg-white: #ffffff;
    --text-black: #003372;
    --table-row: #dde2ef;
    --default-font: 'Proxima Nova Condensed', sans-serif;
}

a[aria-label="Procurement Category"],
a[aria-label="Procurement Sub Category"]{
  display: none !important;
}
/* fallback */
@font-face {
    font-family: 'Material Icons';
    font-style: normal;
    font-weight: 400;
    src: url(https://fonts.gstatic.com/s/materialicons/v141/flUhRq6tzZclQEJ-Vdg-IuiaDsNc.woff2) format('woff2');
}

.material-icons {
    font-family: 'Material Icons';
    font-weight: normal;
    font-style: normal;
    font-size: 24px;
    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;
}

* {
    margin: 0;
    padding: 0;
    font-family: 'Proxima Nova Condensed', sans-serif;
    box-sizing: border-box;
    font-size: 14px;
}

body {
    background-color: var(--body-color);
    font-family: 'Proxima Nova Condensed', sans-serif;
}

a,
.a,
ul,
ul li,
ul li a,
p,
h1,
h2,
h3,
h4,
h5,
h6,
div {
    font-family: var(--default-font);
    color: var(--text-black);

}

a[aria-label="Tool Configuration"]{
  display: none !important;
}

p {color: var(--gray-dark);font-size: 16px;}
h3 {color: var(--text-black);letter-spacing: -0.3px;}
h3>strong{font-size: 24px;}
h4{font-size: 18px;}
.width_80 {width: 80% !important;}
.width_70 {width: 70% !important;}
.width_50 {width: 50% !important;}
.width_33 {width: 33% !important}
.width_20 {width: 20% !important}
.width_10 {width: 10% !important}
.m-0 {margin: 0 !important}
.mt-0 {margin-top: 0 !important}
.mb-0 {margin-bottom: 0 !important}
.p-0 {padding: 0 !important}
.p-1 {padding: 10px !important}
.pb-1 {padding-bottom: 10px !important}
.pb-2 {padding-bottom: 20px !important}
.pb-3 {padding-bottom: 30px !important}
.pt-0 {padding-top: 0 !important}
.pt-1 {padding-top: 10px !important}
.pt-2 {padding-top: 20px !important}
.pt-3 {padding-top: 30px !important}
.pr-0 {padding-right: 0 !important}
.p-325{padding: 3.25rem;}
.m-auto{margin-left: auto; margin-right: auto;}
.mb-1 {margin-bottom: 10px !important}
.mb-2 {margin-bottom: 20px !important}
.mt-1 {margin-top: 10px !important}
.mt-2 {margin-top: 20px !important}
.mt-3 {margin-top: 30px !important}
.mt-4 {margin-top: 40px !important}
.ml-auto {margin-left: auto !important}
.ml-0 {margin-left: 0 !important}
.ml-1 {margin-left: 10px !important}
.ml-2 {margin-left: 20px !important}
.ml-3 {margin-left: 30px !important}
.mr-0 {margin-right: 0 !important}
.mr-1 {margin-right: 10px !important}
.mr-2 {margin-right: 20px !important}
.mr-3 {margin-right: 30px !important}
.h-100{height: 100%;}
.row{display: flex; -webkit-flex:flex; flex-wrap: wrap;}
.d-flex {display: flex !important}
.flex-column {flex-direction: column !important}
.d-inline-flex {display: inline-flex !important}
.flex-wrap {flex-wrap: wrap !important}
.align-items-center {align-items: center !important}
.justify-content-center {justify-content: center !important}
.justify-content-start {justify-content: start !important}
.justify-content-end {justify-content: end !important}
.justify-content-between {justify-content: space-between !important}
.align-items-end{align-items: flex-end !important;}
.col{flex-basis: 0;-webkit-box-flex: 1;-ms-flex-positive: 1;flex-grow: 1;
max-width: 100%;padding-right: 15px;padding-left: 15px;}
.gap-10{gap: 10px;}
.text-success{color: var(--success);}
.cursor-pointer{cursor: pointer;}
b, strong{font-size: inherit;} 
legend {color: var(--primary);margin-top: 15px;font-size: 16px;font-weight: 600;}
.shadow-none{box-shadow: none !important;}
.position-relative{position: relative;}
.w-100{width: 100% !important;}
.unstyle-list li{list-style: none;}
.label.label-default, .label.label-primary, .label.label-success, 
.label.label-info, .label.label-warning, .label.label-warning, 
.label.label-danger{padding: 4px;}
.label-title-sucess{padding: 6px 7px !important; font-size: 14px;}
.colc-3.w-100{flex:initial;}
input::-webkit-outer-spin-button, input::-webkit-inner-spin-button { -webkit-appearance: none;}
.text-info{color: var(--secondary);font-size: 13px;}
.height-93{min-height: 93px;}
/* ------------- Sidebar CSS ------------- */
.sidebar {width: 250px;position: fixed;overflow-y: hidden;top: 0px;overflow-x: hidden;
    z-index: 999;height: 100%;margin-bottom: 20px; background-color: var(--bg-white);  
    border-bottom: 1px solid #dce7f5; box-shadow: 5px 7px 26px -5px #cdd4e7;
    /* background-image: linear-gradient(180deg, #f15b5d 0%, #7e58ae 50%, #2667bd 100%);     */
}
.sidebar+.page-copy, .top_header {width: calc(100% - 251px);margin-left: auto;margin-right: 0;position: relative;margin-top: 0px;margin-bottom: 0px;}
.top_header.topheaderside {width: calc(100% - 80px);}
.sidebar .sidebar_logo{display: flex; padding: 20px;}
.sidebar .sidebar_logo img{width: auto; height: 55px; margin: 0 10px;}
.sidebar .navbar-inverse.navbar-lefsidebar{display: flex;flex-direction: column; background-color: transparent;}
.sidebar .navbar .nav.navbar-nav{float: none;display: flex;flex-direction: column;}
.sidebar .navbar .nav.navbar-nav .divider-vertical{display: none;} 
/* .sidebar .navbar .nav.navbar-nav li:first-child{display: none;} */
.sidebar .navbar .nav.navbar-nav li a{width: 100%; display: inline-flex; align-items: center; margin-left: 0; font-size: 16px; padding: 10px 20px 10px 22px; border: none; color: var(--gray-dark);}
.sidebar .navbar .nav.navbar-nav li.active a{background: var(--body-color); color: var(--primary);}
.sidebar .navbar .nav.navbar-nav li.active a:is(:hover, :focus, :focus-visible){color: var(--primary); text-decoration: none; outline: 0;}
.sidebar .navbar .nav.navbar-nav li a:is(:hover, :focus, :focus-visible){background-color: transparent; color: var(--primary); text-decoration: none;outline: none;border: none !important;}
.sidebar .navbar .nav.navbar-nav li.weblink>a::before{font-family: 'Material Icons'; position: relative; font-size: 20px;}
.sidebar .navbar .nav.navbar-nav li.weblink>a::after{font-family: 'Material Icons'; position: absolute; right: 22px; font-size: 20px; content: '\e5cc';}
.sidebar .navbar .nav.navbar-nav li.weblink>a[aria-label="Dashboard"]::before {content: '\e66b';}
.sidebar .navbar .nav.navbar-nav li.weblink>a[aria-label="Log Out"]::before {content: '\e9ba';}
.sidebar .navbar .nav.navbar-nav li.weblink>a[aria-label="Sign out"]::before {content: '\e9ba';}
.sidebar .navbar .nav.navbar-nav li a span{font-size: 14px; font-weight: 500; padding-left: 8px; text-transform: capitalize;word-break: break-word;
  max-width: calc(100% - 40px);}
.sidebar .navbar-lefsidebar .navbar-header{background-color: var(--bg-white); border-bottom: solid 1px var(--logo-right) ;}
.sidebar .navbar .navbar-brand-left{height: 64px; width: 100%;}
/* .top_header{display: none;} */
.private-mode-banner{display: none;}
.navbar-logo-mobile{padding: 0}
/* .page_copy_top_header{display: flex; justify-content: space-between; align-items: center; padding: 20px 16px;background:var(--bg-white);box-shadow: rgba(0, 0, 0, 0.16) 0px 1px 4px;} */
.mobile-menu{height: 28px; width: 30px; background-color: transparent; border: solid 2px var(--primary); border-radius: 4px;}
.mobile-menu span{color: var(--primary);}
.page_copy_top_header>ul{display: flex; justify-content: end; align-items: center; gap: 16px;position:relative;
    box-sizing:border-box;color:var(--bg-white); margin-bottom: 0;}
.page_copy_top_header>ul li{position: relative; list-style: none;}
.page_copy_top_header>ul li:first-child{border-right: solid 1px var(--gray-medium); padding: 0 16px;}
.page_copy_top_header>ul li a{color: var(--primary);}
.page_copy_top_header>ul li a:is(:hover, :focus, :focus-visible){text-decoration: none; color:var(--gray-medium);}
.page_copy_top_header>ul li a.drop_profile_menu{display: flex; align-items: center; gap: 8px;}
.page_copy_top_header>ul li a.drop_profile_menu p{display: flex; flex-direction: column; color: var(--primary); margin-bottom: 0; line-height: 16px; font-weight: 500; font-size: 16px;}
.page_copy_top_header>ul li a.drop_profile_menu p span{font-size: 12px; color: var(--gray-medium); font-weight: 300; font-size: 12px;}
 .profile_menu a img{width: 30px;}
.page_copy_top_header ul li .dd-menu {position: absolute;top: 130%;right: 0px;z-index: 1000;font-size: 14px;
    text-align: left;background-color: var(--bg-white);border: 1px solid var(--gray-light);
    border: 1px solid rgba(0,0,0,0.15);border-radius: 4px;box-shadow: rgba(0, 0, 0, 0.16) 0px 1px 4px;;
    background-clip: padding-box;-webkit-transition: all 0.2s ease;opacity:0;-webkit-transform-origin: right top 0px; 
    -webkit-transform: scale(0); 
}
.page_copy_top_header ul li .dd-menu>ul {min-width: 160px;padding: 5px 0;margin: 2px 0 0;list-style: none;position:relative;}
.page_copy_top_header ul li .dd-menu.active {opacity:1;-webkit-transform-origin: right top 0px; -webkit-transform: scale(1); }
.page_copy_top_header ul li .dd-menu>ul>li {color:var(--gray-medium);margin: 0;padding: 5px 0 5px 15px;height: 24px;list-style: none;opacity: 0; transform: translateY(0px);}
.page_copy_top_header ul li .dd-menu>ul>li {-webkit-transition: all 0.3s ease;transform: translateY(-30%);}
.page_copy_top_header ul li .dd-menu.active>ul>li {opacity: 1; transform: translateY(0px);}
.navbar-static-top.navbar-inverse{box-shadow: none; background-color: var(--bg-white); display: flex; }
.navbar-static-top.navbar-inverse.top_header{height: 64px; z-index: 1;}
/* .mobile-menu{visibility: hidden; cursor: pointer;} */
/* .collapse{display: block;} */
.menu-toggle {position: relative;width: 40px;height: 40px;cursor: not-allowed;display: flex;justify-content: center;align-items: center;}
.menu-toggle::before {content: '';position: absolute;width: 24px;height: 4px;background: var(--text-black);box-shadow: 0 8px 0 var(--text-black),0 -8px 0 var(--text-black);}
/* ------------- profile menu ------------- */
.top_header .profile {position: relative;display: flex;justify-content: flex-end;align-items: center;/* gap: 12px; */cursor: pointer;/* text-align: end; */height: 51px;margin-right: 16px;}
.top_header .profile .img-box {position: relative;width: 30px;height: 30px;border-radius: 50%;overflow: hidden;}
.top_header .profile .img-box img {position: absolute;top: 0;left: 0;width: 100%;height: 100%;object-fit: cover;}
/* menu (the right one) */
.top_header .menu {position: absolute;top: calc(100% + 24px);right: 16px;width: 200px;min-height: 100px;background: var(--bg-white);box-shadow: 0 10px 20px rgba(0, 0, 0, .2);opacity: 0;transform: translateY(-10px);visibility: hidden;transition: 300ms;}
.top_header .menu::before {content: '';position: absolute;top: -10px;right: 14px;width: 20px;height: 20px;background:var(--bg-white);transform: rotate(45deg);z-index: -1;}
.top_header .menu.active {opacity: 1;transform: translateY(0);visibility: visible;}

/* ------------- menu links ------------- */
.top_header .menu ul {position: relative;display: flex;flex-direction: column;z-index: 10;background: var(--bg-white);}
.top_header .menu ul li {list-style: none;}
.top_header .menu ul li:hover {background: #eee;}
.top_header .menu ul li a {text-decoration: none;color: #000;display: flex;align-items: center;padding: 15px 20px;gap: 6px;}
.top_header .menu ul li a i {font-size: 1.2em;}
.navbar-logo-mobile{display: none;}
.container_default{margin-right: auto;margin-left: auto;padding-left: 15px;padding-right: 15px;}

.header_right{ display: flex;justify-content: space-between;align-items: center;height: 100%; padding-top: 12px;}
.header_right .username{font-size:16px; font-weight: 600; text-transform: capitalize;}
.header_right .dropdown-menu { right: 0; left: initial;}  

/* ------------- Button CSS ------------- */
.btn{border: none; font-size: 16px; font-weight: 400;border-radius: 4px;box-shadow: 0px 2px 2px 0px rgba(0, 0, 0, 0.25);transition: all 0.3s ease-in-out;text-transform: capitalize;overflow: hidden;position: relative;padding: 8px 20px;}
.btn-primary{background-color: var(--primary);color: var(--bg-white);}
.btn-primary:hover,
.btn-primary:active:hover, 
.btn-primary:active:focus, 
.btn-primary:active.focus, 
.btn-primary.active:hover, 
.btn-primary.active:focus, 
.btn-primary.active.focus,
.btn-primary:active, 
.btn-primary.active, 
.btn-primary:focus, 
.btn-primary.focus {background-color: var(--primary);box-shadow: 0 4px 10px 0px rgba(0, 0, 0, 0.225); outline: 0; border-color: var(--primary); }
.btn-outline {background-color: transparent;color: var(--third);border: solid 1px var(--third);border-radius: 4px;transition: all 0.3s ease-out;position: relative;overflow: hidden;}
.btn-outline:is(:hover, :focus, :focus-visible){background-color: var(--third); color: var(--bg-white); box-shadow: 0 4px 10px 0px rgba(0, 0, 0, 0.225); outline:0;}
.btn-info{background-color: var(--bg-white);color: var(--third);border:solid 1px var(--third);}
.btn-info:is(:hover, :focus, :focus-visible){color: var(--bg-white);background-color: var(--third);}
.btn-sm{padding: 4px 8px; font-size: 13px;}
.btn-primary::after{content: '';position: absolute;top: 0%;left: 50%;width: 5rem;height: 5rem;background: rgba(255,255,255,0.5);transform-origin: center left;transform: scale(0) translateX(-50%);border-radius: 50%;}
.btn:hover::after{animation: expand 1s ease;}
@keyframes expand{100%{opacity: 0;transform: scale(4) translateX(-50%);}}
.btn-success-outline{background-color: var(--bg-white);border: solid 1px var(--success);color: var(--success);}

/* ------------- Table CSS ------------- */
.table{ border: solid 1px var(--table-row);}
.table>thead>tr>th, 
.table>thead>tr>td, 
.table>tbody>tr>th, 
.table>tbody>tr>td, 
.table>tfoot>tr>th, 
.table>tfoot>tr>td{padding: 12px 6px;vertical-align: middle; border-color: var(--table-row);font-size: 12px;}
.table tbody>tr>td .table-action-icon{display: inline-block;width: 24px;height: 24px;}
.table tbody>tr>td .table-action-icon .material-icons{font-size: 20px; color: var(--primary);}
.table tbody>tr>td:last-child, .table thead>tr>th:last-child{text-align: center;}
.table tbody>tr>td:last-child>div:not(.more-contents){display: inline-flex; align-items: center;}
.table tbody>tr>td, .table thead>tr>th{white-space: pre-line;}
.table tbody>tr>td, .table tbody>tr>td{word-break: break-word;} 
/* .table tbody>tr>td>span {
  text-align: center;
} */
.table>tbody>tr>td:last-child>div>a{white-space: nowrap;}
.table>tbody>tr>td a.btn{white-space: nowrap;}
.table>thead>tr>th>span{font-size: 12px;}
/* .table-custom thead tr th{background-color: var(--gray-light);} */
.table-responsive{border: none;}
/* .table-custom tbody tr:nth-child(even) td{background-color: var(--gray-light);} */
.dt-container .dt-layout-row:first-child, .dt-container .dt-layout-row:last-child{display: flex; flex-wrap: wrap; justify-content: space-between;}
.dt-container .dt-layout-row:first-child{margin-bottom:15px}
.table.dataTableCustom tfoot{display: table-header-group;}
table tfoot th input{border:solid 1px var(--gray-medium); border-radius: 4px; font-weight: 400; font-size: 12px; padding: 6px 12px;}
table tfoot th input::placeholder, table tfoot th input::-moz-placeholder, table tfoot th input::-webkit-input-placeholder{color: var(--gray-medium);}
.dt-paging.paging_full_numbers button{padding: 6px 12px; border: solid 1px var(--gray-light); color: var(--gray-dark); background-color: var(--bg-white);}
button.dt-paging-button.current{ border: solid 1px var(--primary); color: var(--primary); }
.dt-paging.paging_full_numbers button:first-child{border-bottom-left-radius:4px; border-top-left-radius:4px;}
.dt-paging.paging_full_numbers button:last-child{border-bottom-right-radius:4px; border-top-right-radius:4px;}
.dt-paging.paging_full_numbers button span{ color: var(--text-black)}
.dt-container .dt-layout-row .dt-length .dt-input, .dt-container .dt-layout-row .dt-search .dt-input{border: solid 1px var(--body-color);padding: 8px 10px;border-radius: 4px; outline: 0;}
.dt-container .dt-layout-row .dt-length label, .dt-container .dt-layout-row .dt-search label{display: none;}
.dt-container .dt-layout-row .dt-length .dt-input, .dt-container .dt-layout-row .dt-search{position: relative;}
.dt-container .dt-layout-row .dt-search .dt-input{padding-left: 30px;}
.dt-container .dt-layout-row .dt-search .dt-input::-moz-placeholder,
.dt-container .dt-layout-row .dt-search .dt-input::-moz-placeholder,
.dt-container .dt-layout-row .dt-search .dt-input::placeholder{
    color: var(--text-black);
}
.dt-container .dt-layout-row .dt-search::after {
    content: "\e8b6"; position: absolute; font-family: 'Material Icons'; 
    font-size: 20px; color: var(--text-black); left: 8px; top: 5px;
}

table tr td legend{border: none; margin-bottom: 0px;}
table tfoot th input {width: 150px;}
table tfoot th:first-child input, table tfoot th:last-child input {max-width: 100px;}

table thead th{background: var(--body-color);}
table thead th.req_id_th {width: 110px;}
table thead th.ven_name_th {width: 150px;}
table thead th.proc_cat_th {width: 110px;}
table thead th.ven_type_th {width: 170px;} 
table thead th.apprv_status_th {width: 165px;}
table thead th.legal_ent_th  {width: 100px;}
table thead th.approv_status_th {width: 120px;}
table thead th.req_date_th {width: 110px;}
table thead th.action_th {width: 80px;}

/* ------------- Form CSS ------------- */
form{display: inline-block;}
input.form-control, select.form-control, textarea.form-control, .select2-container--default .select2-selection--multiple {border-radius: 4px; border: solid 1px var(--gray-medium); min-height: 40px; padding:6px 12px; font-size: 14px; appearance: none;}
.form-group .select2-container .select2-selection--single{height: 40px;}
.form-group .select2-container--default .select2-selection--single .select2-selection__rendered{line-height: 36px;}
.form-control.error-input{border-color: var(--third);}
label{color: var(--text-black); font-weight: normal; font-size: 16px;}
label+p {font-weight: 700; color: var(--text-black);}
label+p > span{ font-size: inherit; font-weight: inherit;}
label.error{color: var(--third); font-size: 14px;}
.form-group, .input-group {margin-bottom: 25px;}
.form-group .input-group{margin-bottom: 0;}  
.form-group label>span{color: var(--third);}
/* .form-group-select {position: relative;} */
.form-group-select select.form-select{-webkit-appearance: none; appearance: none; }
#otherEntityVendor option{text-transform: uppercase;}
/* .form-group-select::after {content: "\e313";font-family: 'Material Icons';position: absolute;right: 8px; */
    /* bottom: 2px;font-size: 24px; color: var(--text-black);} */  
.form-group-select select, .form-group .select2-container--default .select2-selection--single .select2-selection__rendered {background-image: url(/icon-dropdown.svg);background-position: right;background-repeat: no-repeat;}
.form-group .select2-container--default .select2-selection--single{background-color: transparent;border: none}
.form-control[disabled], .form-control[readonly], fieldset[disabled]{background-color: var(--gray-light) !important;}
.form-control:focus {border-color: var(--btn-primary);outline: 0;box-shadow: inset 0 1px 1px rgb(0 0 0 / 8%), 0 0 8px rgb(38 103 189 / 20%);}
.form-group .select2-container.select2-container--default{min-width: 100% !important; width: 100% !important;    border: solid 1px var(--gray-medium);
    border-radius: 4px;background-color: var(--bg-white)}
.form-group .select2-container--default .select2-selection--single .select2-selection__arrow{display: none;}
.select2-container--default .select2-selection--multiple{padding-left: 5px; height: 40px; padding-top: 4px;}
.select2-container--default .select2-results__option--highlighted.select2-results__option--selectable{background-color: var(--primary) !important;}
#vendorAdresss.form-control[readonly]{background-color: var(--bg-white) !important;}
.input-group.form-group-select .input-group-btn{width: 90px;}
.input-group.form-group-select .input-group-btn select{border-bottom-left-radius:4px; border-top-left-radius: 4px}
.input-group.form-group-select #vendorYearSpend-error,
.form-group-select #otherEntityVendor-error{position: absolute; left: 0; bottom: -26px;}
textarea{resize: none;}
.country-additional-fileds {width: 100%;background-color: var(--gray-light);padding-top: 15px;margin: 0 15px;margin-bottom: 15px;border-radius: 8px;}
input[type="submit"][disabled] { background-color: #F3F2F1; color: #A19F9D;}
/* ------------- Navtabs and Sidebar CSS ------------- */
.page_heading{font-weight: 600;}
.nav-tabs-custom{margin-top: 0px;margin-bottom: -5px; border: none; border-bottom: solid 1px var(--logo-right); background-color: var(--bg-white); display: inline-block; width: 100%;}
.nav-tabs-custom li a{margin: 0 !important; min-width: 100px; padding: 12px 24px;font-size: 14px;
    text-align: center; border: solid 1px var(--gray-light); background-color: var(--bg-white);}
.nav-tabs-custom li:nth-child(1) a{border-radius: 0;border-bottom-left-radius: 0px;
    border-top-left-radius: 0px;}
.nav-tabs-custom li:last-child a{border-top-left-radius: 0; border-bottom-left-radius: 0; border-top-right-radius: 0px; border-bottom-right-radius: 0px;}
.nav-tabs-custom>li.active>a,
.nav-tabs-custom>li.active>a:hover,
.nav-tabs-custom>li.active>a:focus{background-color: var(--primary);color: var(--bg-white);}
.navbar-static-top.navbar .navbar-collapse.navbar-coll-leftsidebar{margin-top: 0px; overflow-y: auto; max-height: 89vh;}
.navbar-static-top.navbar .navbar-collapse.navbar-coll-leftsidebar::-webkit-scrollbar {width: 3px;background-color: #F5F5F5;}
.navbar-static-top.navbar .navbar-collapse.navbar-coll-leftsidebar::-webkit-scrollbar-thumb {background-color: var(--text-black);}
.navbar-static-top.navbar .navbar-collapse.navbar-coll-leftsidebar::-webkit-scrollbar-track {-webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.3);background-color: #F5F5F5;}
.navbar-collapse.collapse.navbar-coll-leftsidebar{display: block; }
.nav-tabs-custom>li:last-child a {border-radius: 0 4px 0 0;}
.nav-tabs-custom>li:first-child a {border-radius: 4px 0px 0 0;}
.tab-content{border: solid 1px var(--body-color); padding: 15px;}
a[aria-label="My Request"]::before {content: "\e0ee";}
a[aria-label="Vendor Requests"]::before {content: "\e0ee";}
a[aria-label="Vendor Amends"]::before,a[aria-label="My Vendor Amends Request"]::before {content: "\e8d1";}
a[aria-label="Help and Support"]::before {content: "\e887";}
a[aria-label="Delegation"]::before {content: "\f23a";}
a[aria-label="Pending Process"]::before {content: "\f1bb";}
a[aria-label="Approval Requests"]::before {content: "\f1bb";}
a[aria-label="all vendor request"]::before {content: "\e9b0";}  
a[aria-label="My Application"]::before,a[aria-label="Agreement"]::before {content: "\e0ee";}
a[aria-label="My Approvals"]::before {content: "\f075";}
a[aria-label="Tax Approval"]::before {content: "\ef6e";}
a[aria-label="My Trade Approvals"]::before {content: "\e26b";}  
a[aria-label="Profile Updation"]::before {content: "\e853";}
a[aria-label="BPS Login"]::before {content: "\ea12";}  
a[aria-label="QHSE Team"]::before {content: "\f0c5";}  
a[aria-label="My Requests"]::before {content: "\f075";}
a[aria-label="All Vendor Request"]::before,a[aria-label="All Vendor Requesta"]::before {content: "\f075";}
a[aria-label="all vendor request"]::before,a[aria-label="all vendor requests"]::before {content: "\e9b0";}
a[aria-label="Procurement Category"]::before {content: "\e574";}
a[aria-label="Procurement Sub Category"]::before {content: "\e574";}
a[aria-label="Vendor Type"]::before {content: "\e1a0";}
a[aria-label="Region Owner"]::before,a[aria-label="Amends Region Owner"]::before {content: "\f02e";}
a[aria-label="Tool Configuration"]::before {content: "\f100";} 
a[aria-label="Yearly Spend"]::before {content: "\ef63";}
a[aria-label="Campaign Management"]::before {content: "\ef49";}
a[aria-label="Portal Rules"]::before {content: "\f11b";}
a[aria-label="Procurement Region Owner"]::before {content: "\eaa3";}
.gpo_menu_title{padding: 15px 25px 12px; background: var(--gray-light); font-weight: 600; color: var(--btn-primary); border-bottom: #fff solid 1px;}


.e_header_dropdown:not(.headerexpand) #menu-toggle-2 .left-icon{display: none;}
.e_header_dropdown.headerexpand #menu-toggle-2 .menu_icon {border: none;opacity: 0;visibility: hidden;display: none;}
#sidebarMenu.active {margin-left: 0px;width: 80px;transition: all 0.1s ease-in-out;height: 100%; overflow: visible;}
.sidebar.active {position: absolute;height: auto;overflow: initial;}
#sidebarMenu.active .nav-left .navbar ul.nav li a span, #sidebarMenu.active .navbar-nav li a span {display: none;}
#sidebarMenu.active .nav-left .navbar ul.nav li a span, #sidebarMenu.active .navbar-nav li a span {display: none;}
.sidebar.active .navbar .nav.navbar-nav li a{text-align: center; display: flex;}
.sidebar.active .nav-left .navbar ul.nav li.weblink:hover a span, .sidebar.active .nav li:hover a span {display: initial !important;margin-left: 10px; text-overflow: ellipsis; overflow: hidden;width: calc(100% - 60px);text-align: left;white-space: nowrap;text-align: center;}
.sidebar.active .nav-left .navbar ul.nav li a, 
.sidebar.active .nav-left .navbar ul.nav li.weblink a:is(:hover, :focus) {background: var(--bg-white);justify-content: flex-start;transition: none;}
.sidebar.active .nav-left .navbar ul.nav li.weblink:hover a, 
#sidebarMenu.active .navbar-collapse nav .nav li:hover a {width: 260px;display: flex; justify-content: flex-start;color: var(--primary); background-color: var(--bg-white);}
.sidebar.active .nav-left .navbar ul.nav li.weblink a {justify-content: flex-start !important;transition: none !important;}
.sidebar.active .nav-left .navbar ul.nav li a::before, 
#sidebarMenu.active .navbar-collapse nav .nav li a::before {width: 30px;} 
.sidebar.active .navbar-brand-left img{height: 14px !important;}
.wrapper-body.exapnaddiv .page-copy{width: calc(100% - 82px);}
.sidebar.active .navbar .nav.navbar-nav li.weblink>a::after{display: none}

.switchToggle {position: relative; display: inline-block; width: 52px; height: 26px;}
.switchToggle input { opacity: 0; width: 0; height: 0;}
.sliderToggle { position: absolute; cursor: pointer; top: 0; left: 0; right: 0; bottom: 0; background-color: #ccc; -webkit-transition: .4s; transition: .4s;}
.sliderToggle:before { position: absolute; content: ""; height: 18px; width: 18px; left: 4px; bottom: 4px; background-color: white; -webkit-transition: .4s; transition: .4s;}
.switchToggle input:checked + .sliderToggle { background-color: var(--secondary); }
.switchToggle input:focus + .sliderToggle { box-shadow: 0 0 1px var(--secondary); }
.switchToggle input:checked + .sliderToggle:before { -webkit-transform: translateX(26px); -ms-transform: translateX(26px); transform: translateX(26px); }
/* Rounded sliderToggles */
.sliderToggle.round {  border-radius: 34px;} 
.sliderToggle.round:before { border-radius: 50%;}

/* ------------- Card CSS ------------- */
.card {word-wrap: break-word;background-color: #fff;background-clip: border-box;border: 1px solid #deebfd;box-shadow: -8px 12px 18px 0 #dadeE8;border-radius: 8px; display: inline-block; width: 100%;}
.card-shadow{border: 1px solid #deebfd;  box-shadow: -8px 12px 18px 0 #dadeE8;}
.card-body {-webkit-box-flex: 1;-ms-flex: 1 1 auto;flex: 1 1 auto; padding:15px}
/* .card .card-details label{color: var(--gray-dark);} */
.card .card-details p{color: var(--text-black);}

/* ------------- Modal Css ------------- */
.modal-dialog, .modal-content{border-radius: 16px;}
.modal-dialog-centered {display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;min-height:calc(100% - (.5rem * 2));} 
.modal-body h4,.modal-body p{text-align: center}
.modal-body{padding:30px }
.modal-header{border: none}
.modal-body .modal_footer_btn{display: flex;justify-content: center;margin-top: 20px}
.btn-success{background-color: var(--success)}
.modal .btn {min-width: 150px; min-height: 40px; vertical-align: super; display: grid;grid-column-start: center; align-items: center;}
.modal-header:before, .modal-header:after{display: none;}


/* ------------- Progress Bar CSS ------------- */
.progressbar-custom {width: 100%;background-color: var(--secondary);padding: 30px;border-radius: 8px;box-shadow: 0 0 3px 0px var(--gray-medium);}
.progressbar-custom .progress { width: 50%;height: 30px;margin: 0;border-radius: 50px;/* background-color: var(--primary); */}
.progressbar-custom .progress label{line-height: 30px;}
.progress-bar{background-color: var(--success)}
.progressbar-custom .progress .progress-bar{color:  var(--bg-white); color: var(--text-black);}
.progressbar_status{display: flex;align-items: center;gap: 8px;justify-content: space-between; flex-wrap:wrap;}

/* ------------- Wizard Steps CSS ------------- */
.process-wrap {width: 100%;margin: auto;}
.process-main {width: 100%;min-width: 320px;display: flex;flex-wrap: nowrap; padding-bottom: 10px; justify-content: center;} /*overflow: hidden; overflow-x: auto;*/
.colc-3 {width: auto;flex: 0 0 13.5%;position: relative;}
.colc-3:first-child .process-step:before {content: '1';}
.colc-3:nth-child(2) .process-step:before{content: '2';}
.colc-3:nth-child(3) .process-step:before {content: '3';}
.colc-3:nth-child(4) .process-step:before{content: '4';}
.colc-3:nth-child(5) .process-step:before{content: '5';}
.colc-3:nth-child(6) .process-step:before{content: '6';}
.colc-3:nth-child(7) .process-step:before{content: '7';}
.colc-3:nth-child(8) .process-step:before{content: '8';}
.process-main .colc-3:not(:first-child):before{content: "";display: block;
    position: absolute;width: 100%;height: 4px;top: 17.5px;left: calc(-52% + 20px);
    right: 0; background: #ebebeb;border: 2px #ebebeb solid;-o-transition: .4s;
    -ms-transition: .4s;-moz-transition: .4s;-webkit-transition: .4s;transition: .4s;}
.process-step-cont {font-family: sans-serif;font-size: 16px;text-transform: uppercase;
    text-decoration: none;white-space: nowrap;display: flex;flex-wrap: wrap;
    align-items: center;justify-content: center;align-content: space-between;}
.process-step {border: 5px #ebebeb solid;border-radius: 100%;line-height: 0;
    background: #959595;text-align: center;align-items: center;justify-content: center;
    align-self: center;display: flex;color: #fff;width: 35px;height: 35px;
    font-weight: 700;margin-bottom: 7px;z-index: 4;cursor: pointer;}
.process-label {color: #959595;font-weight: 600;width: 100%;text-align: center;
    font-size: 12px;min-height: 35px;}
.active-step1 .colc-3:first-child .process-step,
.active-step1 .colc-3:first-child .process-dots:first-child,
.active-step1-mini2 .colc-3:first-child .process-step,
.active-step1-mini2 .colc-3:first-child .process-dots:nth-child(-n+2),
.active-step1-mini3 .colc-3:first-child .process-step,
.active-step1-mini3 .colc-3:first-child .process-dots:nth-child(-n+3),
.active-step1-mini4 .colc-3:first-child .process-step,
.active-step1-mini4 .colc-3:first-child .process-dots:nth-child(-n+4),
.active-step1-mini5 .colc-3:first-child .process-step,
.active-step1-mini5 .colc-3:first-child .process-dots:nth-child(-n+5),
.active-step1-mini6 .colc-3:first-child .process-step,
.active-step1-mini6 .colc-3:first-child .process-dots:nth-child(-n+6),
.active-step1-mini7 .colc-3:first-child .process-step,
.active-step1-mini7 .colc-3:first-child .process-dots:nth-child(-n+7)
{
    background-color: var(--secondary);
}
.active-step1-mini2 .colc-3:first-child .process-dots:first-child,
.active-step1-mini3 .colc-3:first-child .process-dots:nth-child(-n+2),
.active-step1-mini4 .colc-3:first-child .process-dots:nth-child(-n+3),
.active-step1-mini5 .colc-3:first-child .process-dots:nth-child(-n+4),
.active-step1-mini6 .colc-3:first-child .process-dots:nth-child(-n+6),
.active-step1-mini7 .colc-3:first-child .process-dots:nth-child(-n+7)
{
    background-color: #fbcb93;
}
.active-step1 .colc-3:first-child .process-label,
.active-step1-mini3 .colc-3:first-child .process-label,
.active-step1-mini2 .colc-3:first-child .process-label,
.active-step1-mini4 .colc-3:first-child .process-label,
.active-step1-mini5 .colc-3:first-child .process-label,
.active-step1-mini6 .colc-3:first-child .process-label,
.active-step1-mini7 .colc-3:first-child .process-label{
    color: var(--secondary);
}
.active-step2 .colc-3:first-child,
.active-step3 .colc-3:nth-child(-n+2),
.active-step4 .colc-3:nth-child(-n+3),
.active-step5 .colc-3:nth-child(-n+4),
.active-step6 .colc-3:nth-child(-n+5),
.active-step7 .colc-3:nth-child(-n+6){
    opacity: 1;
}
.active-step2 .colc-3:first-child .process-step:before,
.active-step3 .colc-3:nth-child(-n+2) .process-step:before,
.active-step4 .colc-3:nth-child(-n+3) .process-step:before,
.active-step5 .colc-3:nth-child(-n+4) .process-step:before
.active-step6 .colc-3:nth-child(-n+5) .process-step:before
.active-step7 .colc-3:nth-child(-n+6) .process-step:before{
    content: '\2713';
    padding: 7px;
}
.active-step2 .colc-3:nth-child(-n+2) .process-step,
.active-step2 .colc-3:nth-child(-n+2) .process-dots,
.active-step3 .colc-3:nth-child(-n+3) .process-step,
.active-step3 .colc-3:nth-child(-n+3) .process-dots,
.active-step4 .colc-3:nth-child(-n+4) .process-step,
.active-step4 .colc-3:nth-child(-n+4) .process-dots,
.active-step5 .colc-3:nth-child(-n+5) .process-step,
.active-step5 .colc-3:nth-child(-n+5) .process-dots,
.active-step6 .colc-3:nth-child(-n+6) .process-step,
.active-step6 .colc-3:nth-child(-n+6) .process-dots,
.active-step7 .colc-3:nth-child(-n+7) .process-step,
.active-step7 .colc-3:nth-child(-n+7) .process-dots
{
    background-color: var(--secondary);
}
.active-step2 .colc-3:nth-child(-n+2) .process-label,
.active-step3 .colc-3:nth-child(-n+3) .process-label,
.active-step4 .colc-3:nth-child(-n+4) .process-label,
.active-step5 .colc-3:nth-child(-n+5) .process-label
.active-step6 .colc-3:nth-child(-n+6) .process-label
.active-step7 .colc-3:nth-child(-n+7) .process-label{
    color: var(--secondary);
}
.active-step2 .colc-3:nth-child(-n+2):before,
.active-step3 .colc-3:nth-child(-n+3):before,
.active-step4 .colc-3:nth-child(-n+4):before,
.active-step5 .colc-3:nth-child(-n+5):before,
.active-step6 .colc-3:nth-child(-n+6):before, 
.active-step7 .colc-3:nth-child(-n+7):before{ background: var(--secondary) !important; border-color: var(--secondary) !important;}
 
.info_detail { max-width: 280px; min-width: 280px; display: inline-flex; flex-wrap: wrap; flex-direction: column; background: var(--secondary); color: #fff; padding: 5px 10px; border-radius: 5px; border: none; position: absolute;
left: 0; right: 0; margin: auto; z-index: 999; opacity: 0; visibility: hidden; transform: translate(-35px,35px); transition: all 0.3s ease;}
.comm_title_small{max-width: 100%; flex-wrap: wrap; display: inline-flex;font-size: 12px; justify-content: center; text-transform: initial; white-space: pre-line;}
.comm_title_small.emailInfo{ white-space: pre-line; word-break: break-all; text-align: center;}
.comm_title_small.emailInfo b{width: 100%;} 
.info_detail b{ font-family: 'Proxima Nova Condensed', sans-serif; width:100%} 
.process_info .process_info_icon:hover + .info_detail,.info_detail:hover{opacity: 1; visibility: visible; transform: translate(-35px,15px);} 
.process_info .process_info_icon{ color: var(--secondary); border: none; outline: none; cursor: pointer;}

.heading_banner{margin-bottom: 20px} 
.process-wrap {margin-bottom: 20px} 
.heading_section h3,.heading_section p{color: var(--bg-white)}
.day-status small {padding: 2px 4px;background: var(--secondary);border-radius: 4px ;color: var(--bg-white);}

.approvalComment .status_btn{position: absolute; right: 15px; color: #fff; border: none; box-shadow: none;}
.approvalComment .btn-approved{ background: var(--success); }
.approvalComment .btn-inprocess{background: var(--warning); }
.approvalComment .btn-reject{background: var(--third); }

.approvalComment .approvalBox {
display: inline-flex; width: calc(50% - 15px); border-radius: 0; box-shadow: none; 
border: var(--success) solid 2px; background: var(--body-color); margin-right: 15px;
padding: 20px; position: relative; flex-wrap: wrap;
}
.approvalComment .approvalBox p,.approvalComment .approvalBox label{width: 100%;}
.approvalComment .approvalBox.isprocess {border-color: var(--warning);}
.approvalComment .approvalBox.isreject {border-color: var(--third);}

/* ------------- Card Section CSS ------------- */ 
.dashboard_box .dash_iconBox {width:60px;height:60px;border-radius:7px;
    display: inline-flex;align-items: center;justify-content: center;}
.dashboard_box .dash_iconBox.bg-primary-transparent > span {background: var(--secondary);}
.dashboard_box .dash_iconBox > span { 
    width:32px;height:32px;display: inline-flex;align-items: center;
    justify-content: center;background: var(--secondary);color: var(--bg-white);
    font-size: 20px;font-weight: 400;border-radius:5px;}
.custom_loader{z-index: 12345; position: fixed; width: 100%; height: 100%; left:0; right: 0; top:0; bottom: 0; background: rgba(255, 255, 255, 0.5); display: flex; align-items: center; justify-content: center; left: 0; right: 0; -webkit-backdrop-filter: blur(3px); backdrop-filter: blur(3px);}
.tab-pane{position: relative;}

/* ------------- Card View CSS ------------- */
.card.custom-card.dashboard_box{transition: all 0.5s ease-in-out; width: 100%;}
.card.custom-card.dashboard_box:hover{background: var(--secondary);cursor: pointer;}
.card.custom-card.dashboard_box:hover .dash_iconBox.bg-primary-transparent > span{
  background: var(--bg-white);color: var(--secondary);}
.card.custom-card.dashboard_box .dash_title{font-size: 16px;}
.card.custom-card.dashboard_box:hover .dash_title{color: var(--bg-white);}

/* ------------- Checkbox Radio Buttons ------------- */

.control {display: block;position: relative;padding-left: 30px;margin-bottom: 15px;
    /* cursor: pointer; */font-size: 14px;line-height: 25px;}
.control input {position: absolute;z-index: -1;opacity: 0;}
.control__indicator {position: absolute;top: 2px;left: 0;height: 20px;
    width: 20px;background: var(--bg-white);border:1px solid var(--gray-medium);}
.control input:checked ~ .control__indicator {
    background: var(--primary);border-color: var(--primary);}
.control__indicator:after {content: '';position: absolute;display: none;}
.control--checkbox .control__indicator:after {left: 6px;top: 2px;
    width: 6px;height: 11px;border: solid var(--bg-white);border-width: 0 2px 2px 0;
    transform: rotate(45deg);}
.control input:checked ~ .control__indicator:after {display: block;}

[type="radio"]:checked,
[type="radio"]:not(:checked) { position: absolute;left: -9999px;}
[type="radio"]:checked + label,
[type="radio"]:not(:checked) + label{ position: relative;padding-left: 28px;cursor: pointer; line-height: 20px;display: inline-block;color: #666;}
[type="radio"]:checked + label:before,
[type="radio"]:not(:checked) + label:before {
    content: '';position: absolute;left: 0;top: 0;width: 18px;height: 18px;
    border: 1px solid var(--primary);border-radius: 100%;background: #fff;
}
[type="radio"]:checked + label:after,
[type="radio"]:not(:checked) + label:after { content: '';width: 10px;height: 10px;background: var(--primary);position: absolute; top: 4px;left: 4px;border-radius: 100%;-webkit-transition: all 0.2s ease;transition: all 0.2s ease;}
[type="radio"]:not(:checked) + label:after {opacity: 0;-webkit-transform: scale(0);transform: scale(0);}
[type="radio"]:checked + label:after {opacity: 1;-webkit-transform: scale(1);transform: scale(1);}

/* -------------------  Vendor CSS ------------------- */
#agreements p {font-size: 14px;line-height: 24px;color: var(--gray-medium);font-weight: lighter;}
#attachment ol.order-list{border: solid 1px var(--gray-dark);border-radius: 4px;overflow: hidden;}
#attachment ol.order-list, #attachment .un-order-list {padding: 0px 15px;}
#attachment .un-order-list{margin-left: 15px;margin-top: 5px;}
#attachment .un-order-list li{font-size: 13px; line-height: 24px;}
.doc_note{font-size: 14px;border: solid 1px;padding: 10px;border-radius: 4px;background-color: var(--gray-light); border: solid 1px var(--gray-dark);color: var(--text-black);}
#agreement ul>li{margin-bottom: 8px; color: var(--gray-dark);;}
#agreement ul>li>ul{padding-left: 16px;}
.attachment_list li{background-color:var(--gray-light)}
.attachment_list li strong, .un-order-list li{color: var(--text-black);}
.btn-inline-group button{flex: 1;}
.fom-steps .tab-content{display: inline-block;width: 100%;}
#rfcNumber-error{font-size: 12px} 
/* -------------------  Admin Css  ------------------- */
.contract-number-menu .contract-control{max-width: 300px;}
.dropdown-menu>li>a:focus, .dropdown-menu>li>a:hover,.dropdown-menu>li.nav-item.active>a,
.dropdown-menu>li>a{padding: 6px 18px; margin-left: 0 !important; border: none; margin-left: 0; background: none; color: inherit;}
.dropdown-menu>li>a:focus, .dropdown-menu>li>a:hover{background: var(--secondary); color: #fff;}
input.hasDatepicker {    background-image: url(/mdi_calendar-month.svg); background-position: bottom 12px right 13px;background-repeat: no-repeat; position: relative;background-size: 12px;cursor: pointer;}
.country-additional-fileds .form-group{position: relative;}
.country-additional-fileds .form-group .error, .country-additional-fileds .input-group .error {position: absolute;bottom: -26px;left: 0;}
.country-additional-fileds .form-group .error[for="code_document"]{bottom: 0px;line-height: normal; position: relative;}

/* ---------------- Switch Toggle --------------- */
.switch {position: relative;display: inline-block;width: 50px;height: 24px;}
.switch input { opacity: 0;width: 0;height: 0;}  
.slider {position: absolute;cursor: pointer;top: 0;left: 0;right: 0;bottom: 0;
background-color: var(--gray-medium);-webkit-transition: .4s;transition: .4s;}  
.slider:before {position: absolute;content: "";height: 16px;width: 16px;left: 4px;
bottom: 4px;background-color: var(--bg-white);-webkit-transition: .4s;transition: .4s;}  
.switch input:checked + .slider {background-color: var(--primary);}  
.switch input:focus + .slider {box-shadow: 0 0 1px --primary;}  
.switch input:checked + .slider:before {-webkit-transform: translateX(26px);-ms-transform: translateX(26px);transform: translateX(26px);}
  
/* ------------- Rounded sliders ------------- */
.slider.round {border-radius: 34px;}  
.slider.round:before {border-radius: 50%;}

/* ------------- Page Loader ------------- */
#fullLoader,#fullLoader_login{ width: 100%; position: fixed; background: var(--bg-white);  height: 100%; top: 0; left: 0; bottom: 0; right: 0; z-index: 99999;  display: none !important; align-items: center; justify-content: center;}
.page-loader {width:50px;height:50px;border-radius:50%;border:8px solid;
    border-color: var(--gray-medium);border-right-color: var(--primary);animation:s2 1s infinite linear;
}
  @keyframes s2 {to{transform: rotate(1turn)}}

/* ------------- Tost CSS ------------- */
.toast {max-width: 230px;overflow: hidden;font-size: .875rem;background-color: rgba(255, 255, 255, .85);
    background-clip: padding-box;border: 1px solid rgba(0, 0, 0, .1);box-shadow: 0 0.25rem 0.75rem rgba(0,0,0,.1);
    -webkit-backdrop-filter: blur(10px);backdrop-filter: blur(10px);opacity: 1;border-radius: 0.25rem;
    position: fixed;right: 30px;top: 100px;width: 100%; z-index: 99999;
}
.toast:not(:last-child) {margin-bottom: 0.75rem;}
.toast.show {display: block;opacity: 1;}
.toast-header {display: -ms-flexbox;display: flex;-ms-flex-align: center;align-items: center;
    padding: 1.25rem 0.75rem;color: #6c757d;background-color: rgba(255, 255, 255, .85);
    background-clip: padding-box;border-bottom: 1px solid rgba(0, 0, 0, .05);justify-content: space-between;
}
.toast.cancel{background-color: var(--third);border-bottom: solid 2px var(--third);}
.toast.cancel strong, .toast.cancel .toast-body, .toast.cancel .material-icons,.toast.cancel button span{color: var(--third);}
.toast.update{background-color: var(--primary);border-bottom: solid 2px var(--primary);}
.toast.update strong, .toast.update .toast-body, .toast.update .material-icons, .toast.update svg path, .toast.update button span{color: var(--primary); fill: var(--primary);}
.toast.warning{background-color: var(--warning);border-bottom: solid 2px var(--warning);}
.toast.warning strong, .toast.warning .toast-body, .toast.warning .material-icons, .toast.warning button span{color: var(--warning);}
.toast.success{background-color: var(--success);border-bottom: solid 2px var(--success);}
.toast.success strong, .toast.success .toast-body, .toast.success .material-icons, .toast.success svg path, .toast.success button span{color: var(--success); fill: var(--success);}
.toast .material-icons{margin-right: 10px;}
.toast button span{font-size: 20px;width: 10px;height: 13px;display: inline-block;line-height: normal;vertical-align: middle;}
/* .toast.success{background-color: var(--success);} */

table tr td[data-label="Rejected Status"] > span,table tr td[data-label="Approved Status"] > span,table tr td[data-label="New Status"] > span,table tr td[data-label="Inprogress Status"] > span { background: green; color: #fff; padding: 3px 7px; border-radius: 4px; font-size: 11px; font-weight: 600; line-height: 1.3em; display: inline-block;}
table tr td[data-label="Inprogress Status"] > span { background: #ffc107; }
table tr td[data-label="Rejected Status"] > span { background: #dc3545; } 
table tr td[data-label="New Status"] > span { background: var(--body-color); color: var(--btn-primary); }
table tr td.venreqStatus > span,table tr td.venreqStatusInactive > span{ background: var(--body-color); color: var(--btn-primary); padding: 3px; border-radius: 4px; font-size: 11px; font-weight: 600; line-height: 1.3em; display: inline-block;}
table tr td.venreqStatusInactive > span{ background: var(--portalThemeColor3); color: var(--portalThemeColor2); cursor: not-allowed;}

/* ------------- Others ------------- */ 
.duration-date {display: flex;align-items: center;gap: 10px;}
.panel {border-radius: 10px;/* min-height: 225px; */box-shadow: rgb(0 0 0 / 2%) 0 2px 10px 10px;
    background: var(--bg-white);padding: 16px;margin-bottom: 30px;}
.title_heading {color: var(--primary);font-family: var(--bold-font);font-size: 24px;}
.duration-button{min-width: 90px;}
.panel-group .panel-heading .panel-title a:before{content: "\e5cf"; font-family: 'Material Icons'; font-size: 24px; height: 22px; transition: transform .2s ease-in-out ;}
.panel-group .panel-default > .panel-heading {background-color: var(--body-color);color: var(--text-black);border-radius: 4px;border: solid 1px var(--secondary);}
.panel-group .panel-default > .panel-heading + .panel-collapse > .panel-body {border: solid 1px var(--body-color);}
.panel-group .panel-heading .panel-title a{display: flex;align-items: center;}
.panel-group .panel-heading .panel-title a:hover{color: var(--text-black);}
.panel-group .panel-heading .panel-title a:not(.collapsed)::before{transform: rotate(-180deg);}
.autocomplete-off {position: fixed !important;opacity: 0 !important;top: -1000px !important;
    left: -1000px !important;height: 0 !important;width: 0 !important;border: 0 !important;
}
:-webkit-autofill {transition: all 100000s ease-in-out 0s;}
.ui-widget-header .ui-icon {background-image: url(/ui-icons_222222_256x240.png);}
.ui-state-default, .ui-widget-content .ui-state-default, 
.ui-widget-header .ui-state-default {border: transparent;background: transparent;
    font-weight: 400;color: var(--gray-dark);width: 36px;height: 36px;padding: 4px;
    line-height: 26px;}
.ui-state-default, .ui-widget-content .ui-state-default, .ui-widget-header .ui-state-default{text-align: center;}
.ui-state-highlight, .ui-widget-content .ui-state-highlight, .ui-widget-header .ui-state-highlight{
    border: 1px solid var(--btn-primary);background: transparent;color: var(--btn-primary);
    border-radius: 20px;text-align: center;text-decoration: none !important;}
.ui-state-default, .ui-widget-content .ui-state-default:hover, .ui-widget-header .ui-state-default:hover {
    background-color: var(--primary);border-radius: 30px;color: var(--bg-white);text-decoration: none;}
.ui-datepicker th span {color: var(--gray-dark);}
.ui-datepicker .ui-datepicker-header{border: none;}
.ui-state-focus, .ui-state-hover, .ui-widget-content .ui-state-focus, 
.ui-widget-content .ui-state-hover, .ui-widget-header .ui-state-focus, 
.ui-widget-header .ui-state-hover {border: 1px solid var(--gray-light);background: var(--gray-light);font-weight: 400;color: var(--gray-dark);}
.signinpage .validation-summary-errors{background-color: #d75353c4 !important;}
#code_name_document
/*----------------- Register ----------------*/
.page1 #headerTopNav{display: none;}
.page1 form#Register {display: flex;flex-direction: column;}
.page1 .container{width: 100%; padding: 15px; margin: 0;height: 93%;}
.page1 ul.nav.nav-tabs.nav-account {display: flex;justify-content: center;background-color: var(--primary);margin-top: 0;border-radius: 8px;width: 40%;margin: 0 auto;}
.page1 .form-group label>span{color: var(--primary);}
.page1 .page-content{margin-top: 0; height: 100%; text-align: center;}
.page1 #content{height: 100%;}
.page1 .nav>li>a{padding: 20px 15px; color: var(--bg-white);}
.page1 .nav-tabs > li > a:hover, .page1 .nav-tabs > li > a:focus, .page1 .nav-tabs > li.active > a{color: var(--primary);}
.page1 #ContentContainer_MainContent_MainContent_SecureRegister {width: 100%;}
.page1 #ContentContainer_MainContent_MainContent_SecureRegister .alert-info{color: var(--text-black);font-weight: bold;border-radius: 4px}
.page1 #ContentContainer_MainContent_MainContent_SecureRegister .alert-info strong{word-wrap: break-word;}
.page1 div#ContentContainer_MainContent_MainContent_LocalLogin,
.page1 .page-content form{width: 40%;background-color: var(--bg-white);border-radius: 10px;padding: 15px;margin: 20px auto;}
.page1 .page-content form .form-horizontal .form-group{display: flex; flex-direction: column;}
.page1 .page-content form .form-horizontal .form-group label.control-label{width: 100%; text-align: left;}
.page1 .page-content form .form-horizontal .form-group .col-sm-10,
.page1 .page-content form .form-horizontal .form-group .col-sm-offset-2.col-sm-10{width: 100%;margin-left: 0;text-align: left;}
.page1 div#ContentContainer_MainContent_MainContent_LocalLogin, 
.page1 div#ContentContainer_MainContent_MainContent_LocalLogin .col-md-6,
.page1 div#ContentContainer_MainContent_MainContent_LocalLogin .col-sm-6{width: 100%;}
.page1 #ContentContainer_MainContent_MainContent_SecureRegister .row{flex-direction: column;}
.page1 #ContentContainer_MainContent_MainContent_SecureRegister .row .ContentContainer_MainContent_MainContent_LocalLogin .col-sm-6{width: 100%;}
.page1 .login-heading-section{padding-bottom: 0;}
.page1 .login-heading-section span#ContentContainer_MainContent_MainContent_RegisterLocalFormHeading span span,
.page1 .login-heading-section span span{font-size: 24px;text-align: center;width: 100%;display: block;}
.page1 label.col-sm-4.control-label.required {width: 100%;text-align: left;}
.page1 .col-sm-8 {width: 100%;}
.page1 .col-sm-offset-4.col-sm-8 {margin: 0;}
.page1 input#SubmitButton, .page1 button#submit-redeem-invitation {width: 100%; height: 44px;}
.page1 #ContentContainer_MainContent_MainContent_ExternalLogin{display: none;}
.page1 .form-horizontal .checkbox label>input{width: 18px; height: 18px;margin-top: 0px;}
.page1 div#ContentContainer_MainContent_MainContent_ShowEmail>.form-group:first-child {visibility: hidden;width: 0;height: 0;}
.page1.page3 form, .changepassword form{width: 100%;}
.changepassword .col-sm-offset-4.col-sm-8{width: 67%;}
.changepassword .col-sm-offset-4.col-sm-8 .btn{width: 100%;}
.list-group-item.active, .list-group-item.active:hover, .list-group-item.active:focus{background-color: var(--primary);}
/*------------ Change Password ---------------*/
.changepassword #headerTopNav{display: none;}

.table#durationTable tbody>tr>td:last-child, .table#durationTable thead>tr>th:last-child{text-align: left;}
#durationTable_wrapper .dt-search{display:none;}
.durationFilter{justify-content: flex-end;} 
.durationFilter label{display:flex; white-space:nowrap; margin-right:5px; margin-bottom: 0; font-weight: 600; font-size: 13px;}
.durationFilter select{width:150px; font-size: 13px; min-height: 30px;}

input[type="radio"][disabled] + label:before{border-color: #ccc;}
input[type="radio"][disabled]:checked + label:before{border-color: #ccc;}
input[type="radio"][disabled]:checked + label:after { background: #ccc;}

.global_download{display: inline-flex; margin-left: 10px; margin-right: auto;}
.global_download .btn{ display: inline-flex; align-items: center; justify-content: center; box-shadow: none;}
.global_download .btn > span{ font-size: 105%; margin-right: 2px;}

/*------------ Grid Css -------------*/
.box_style_1{ width: 100%; margin-bottom: 0px; border: #2667bd solid 1px; border-radius: 4px; padding: 10px 15px;
  display: inline-flex; min-height: 80px; flex-direction: column; min-width: 100%;
  box-shadow: rgba(0, 0, 0, 0.12) 0px 1px 3px, rgba(0, 0, 0, 0.24) 0px 1px 2px; margin-top: 20px;}

.credit_score_status{display: inline-flex; align-items: center; }
#CreditScoreBox_info h4 > span{font-size: inherit; padding-left: 4px; color: var(--btn-primary);}
.reject_stat .status_text,
#FinanceBox_info .status_red{background: #dcdc23; color: #fff; padding: 6px 15px; border-radius: 30px; margin: 0px; font-weight: 600;}
#FinanceBox_info .status_red{background: #BA0F30;} 
.approve_stat .status_text,
#FinanceBox_info .status_green{background: var(--success); color: #fff; padding: 6px 15px; border-radius: 30px; margin: 0px; font-weight: 600;}


.box_style_heading{ border-bottom: solid 1px var(--primary); padding-bottom: 9px; margin-bottom: 20px;}
/* .legalCheckDoc>div>div{margin-bottom: 10px} */
.box_style_1{ width: 100%; margin-bottom: 0px; border: var(--primary) solid 1px; border-radius: 4px; padding: 10px 15px;
  display: inline-flex; min-height: 80px; flex-direction: column; min-width: 100%;
  box-shadow: rgba(0, 0, 0, 0.12) 0px 1px 3px, rgba(0, 0, 0, 0.24) 0px 1px 2px; margin-top: 20px;}
.legalCheckDoc>div>div, .financeDocument>div>div, .CreditDocument>div>div{margin-bottom: 10px}
.legalCheckDoc label{width: 100%;}
#code_name_document tr{display: flex; flex-direction: column;}
#code_name_document tr td{border-bottom: solid 1px var(--secondary);margin-bottom: 2px;  font-size: 13px; background-color: var(--gray-light); padding: 4px 6px;}
#code_name_document tr td:last-child{border: none;}
#code_name_document tr td .btn-sm { padding: 3px 7px; font-size: 11px; margin-bottom: 3px;}
.attachment_file{width: 100%; display: inline-flex; flex-wrap: wrap}
.attachment_file > label{width: 100%}
.attachment_left{width: 50%}
.attachment_right{width: 50%; display: inline-flex; align-items: center; padding-left: 20px}
.attachment_right p{width: 200px; margin-right: 10px; display: inline-flex; font-size: 14px; align-items: center;}
.attachment_right p > span{color: #4CBB17; margin-right: 5px}
#deleteDocument{ padding: 0; font-size: 16px; width: 30px; height: 30px; display: inline-flex; align-items: center; justify-content: center; background: var(--third); color: #fff;}
#deleteDocument span{font-size: inherit}
#agree-term-condition .term-condition a{margin-right: 10px;}
.congratulation_box_section{width: 600px; max-width: 100%;}

 
@media (min-width: 576px) {
.col-sm {  flex: 1 0 0%; }
.col-sm-auto {  flex: 0 0 auto;  width: auto; }
.col-sm-1 { flex: 0 0 auto;  width: 8.33333333%; }
.col-sm-2 { flex: 0 0 auto; width: 16.66666667%; }
.col-sm-3 { flex: 0 0 auto; width: 25%; }
.col-sm-4 { flex: 0 0 auto; width: 33.33333333%; }
.col-sm-5 { flex: 0 0 auto; width: 41.66666667%; }
.col-sm-6 { flex: 0 0 auto; width: 50%; }
.col-sm-7 { flex: 0 0 auto; width: 58.33333333%; }
.col-sm-8 { flex: 0 0 auto; width: 66.66666667%; }
.col-sm-9 { flex: 0 0 auto; width: 75%; }
.col-sm-10 { flex: 0 0 auto; width: 83.33333333%; }
.col-sm-11 {
  flex: 0 0 auto;
  width: 91.66666667%;
}
.col-sm-12 {
  flex: 0 0 auto;
  width: 100%;
}
}
@media (min-width: 768px) {
.col-md {
  flex: 1 0 0%;
}
.col-md-auto {
  flex: 0 0 auto;
  width: auto;
}
.col-md-1 {
  flex: 0 0 auto;
  width: 8.33333333%;
}
.col-md-2 {
  flex: 0 0 auto;
  width: 16.66666667%;
}
.col-md-3 {
  flex: 0 0 auto;
  width: 25%;
}
.col-md-4 {
  flex: 0 0 auto;
  width: 33.33333333%;
}
.col-md-5 {
  flex: 0 0 auto;
  width: 41.66666667%;
}
.col-md-6 {
  flex: 0 0 auto;
  width: 50%;
}
.col-md-7 {
  flex: 0 0 auto;
  width: 58.33333333%;
}
.col-md-8 {
  flex: 0 0 auto;
  width: 66.66666667%;
}
.col-md-9 {
  flex: 0 0 auto;
  width: 75%;
}
.col-md-10 {
  flex: 0 0 auto;
  width: 83.33333333%;
}
.col-md-11 {
  flex: 0 0 auto;
  width: 91.66666667%;
}
.col-md-12 {
  flex: 0 0 auto;
  width: 100%;
}
}
@media (min-width: 992px) {
.col-lg {
  flex: 1 0 0%;
}
.col-lg-1 {
  flex: 0 0 auto;
  width: 8.33333333%;
}
.col-lg-2 {
  flex: 0 0 auto;
  width: 16.66666667%;
}
.col-lg-3 {
  flex: 0 0 auto;
  width: 25%;
}
.col-lg-4 {
  flex: 0 0 auto;
  width: 33.33333333%;
}
.col-lg-5 {
  flex: 0 0 auto;
  width: 41.66666667%;
}
.col-lg-6 {
  flex: 0 0 auto;
  width: 50%;
}
.col-lg-7 {
  flex: 0 0 auto;
  width: 58.33333333%;
}
.col-lg-8 {
  flex: 0 0 auto;
  width: 66.66666667%;
}
.col-lg-9 {
  flex: 0 0 auto;
  width: 75%;
}
.col-lg-10 {
  flex: 0 0 auto;
  width: 83.33333333%;
}
.col-lg-11 {
  flex: 0 0 auto;
  width: 91.66666667%;
}
.col-lg-12 {
  flex: 0 0 auto;
  width: 100%;
}
}
@media (min-width: 1200px) {
.col-xl {
  flex: 1 0 0%;
}
.col-xl-auto {
  flex: 0 0 auto;
  width: auto;
}
.col-xl-1 {
  flex: 0 0 auto;
  width: 8.33333333%;
}
.col-xl-2 {
  flex: 0 0 auto;
  width: 16.66666667%;
}
.col-xl-3 {
  flex: 0 0 auto;
  width: 25%;
}
.col-xl-4 {
  flex: 0 0 auto;
  width: 33.33333333%;
}
.col-xl-5 {
  flex: 0 0 auto;
  width: 41.66666667%;
}
.col-xl-6 {
  flex: 0 0 auto;
  width: 50%;
}
.col-xl-7 {
  flex: 0 0 auto;
  width: 58.33333333%;
}
.col-xl-8 {
  flex: 0 0 auto;
  width: 66.66666667%;
}
.col-xl-9 {
  flex: 0 0 auto;
  width: 75%;
}
.col-xl-10 {
  flex: 0 0 auto;
  width: 83.33333333%;
}
.col-xl-11 {
  flex: 0 0 auto;
  width: 91.66666667%;
}
.col-xl-12 {
  flex: 0 0 auto;
  width: 100%;
}
}
@media (min-width: 1400px) {
.col-xxl {
  flex: 1 0 0%;
}
.col-xxl-auto {
  flex: 0 0 auto;
  width: auto;
}
.col-xxl-1 {
  flex: 0 0 auto;
  width: 8.33333333%;
}
.col-xxl-2 {
  flex: 0 0 auto;
  width: 16.66666667%;
}
.col-xxl-3 {
  flex: 0 0 auto;
  width: 25%;
}
.col-xxl-4 {
  flex: 0 0 auto;
  width: 33.33333333%;
}
.col-xxl-5 {
  flex: 0 0 auto;
  width: 41.66666667%;
}
.col-xxl-6 {
  flex: 0 0 auto;
  width: 50%;
}
.col-xxl-7 {
  flex: 0 0 auto;
  width: 58.33333333%;
}
.col-xxl-8 {
  flex: 0 0 auto;
  width: 66.66666667%;
}
.col-xxl-9 {
  flex: 0 0 auto;
  width: 75%;
}
.col-xxl-10 {
  flex: 0 0 auto;
  width: 83.33333333%;
}
.col-xxl-11 {
  flex: 0 0 auto;
  width: 91.66666667%;
}
.col-xxl-12 {
  flex: 0 0 auto;
  width: 100%;
}
}
@media (max-width:1340px) {
.attachment_right p{width: 120px;}
}
  /* === Media Query === */
/* ------------- 1199 ------------- */
@media (max-width: 1198.99px){
.navbar-brand-left{display: none;}
.e_header_main{height: 100%;}    
}
@media (max-width: 1150px){
.attachment_left{width: 40%;}
.attachment_right{width: 60%;} 
}
@media (max-width: 1099px){
.attachment_left,.attachment_right{width: 100%;}
.attachment_right{ padding-left: 0; margin-top: 15px;}
}
/* ------------- 991 ------------- */
@media (max-width:991.98px) {
.sidebar{width: 0; transition: all 0.5s ease-in-out;}
.sidebar.active{width:315px}
.sidebar+.page-copy{width: calc(100% - 0px);transition: all 0.5s ease-in-out}
#sidebarMenu.active{position: fixed;left: 0;top: 0;height: 100%;z-index: 1;}
.navbar-brand.navbar-logo-mobile{display: none;}    
.top_header{width: calc(100% - 0px);}
.top_header.topheaderside {width: calc(100% - 80px);}
}
/* ------------- min 576 ------------- */
@media (min-width: 576px) {.modal-dialog-centered {min-height:calc(100% - (1.75rem * 2));}}
/* ------------- min 767 ------------- */
@media (min-width: 768px){.mandatory-comment{min-height: 46px;}}
/* ------------- min 1600 ------------- */
@media (min-width:1637px){.mandatory-comment{min-height: auto;}}

/* ------------- 767 ------------- */
@media (max-width: 767px){
.navbar-logo-mobile{display: block;}
.col-sm-4, .col-sm-3, .col-sm-6, .col-md-4{width: 100%;}
.container_default.select_role_container>.row{display: block;}
.page_heading{font-size: 20px;}
.card.custom-card.dashboard_box:hover .dash_title{text-align: center;}
.progressbar-custom .progress{width: 100%;}
.process-label{font-size: 11px;}
.progressbar-custom{padding: 20px;}
.progressbar-custom .progress{height:20px;} 
.progressbar-custom .progress #progress_bar_count{line-height:20px !important;}
.progressbar_status .heading_section p{font-size:14px}
.heading_banner { margin-bottom: 0;}
.process-wrap{margin-bottom:0}
.process-wrap .process-main{padding-bottom:0}
.page_heading{padding-bottom:10px}
.heading_section .page_heading{padding-bottom: 5px;}
.container_default .page_heading + .btn{margin-top: 10px;}
.tab-pane h4.page_heading { margin-bottom: 0 !important;}
.tab-pane h4.page_heading legend { margin-bottom: 0; padding-bottom: 10px !important;}
table.table{min-width: 1100px;}
}
@media (max-width: 667px) {
.nav-tabs-custom li a{padding: 12px 10px; font-size: 13px;}
label,p,.btn{font-size: 14px;}
.btn{padding: 8px 15px;}
}
/* ------------- 640 ------------- */
@media (max-width: 640px) {
.colc-3 { width: 50%; }
.process-label{display: none;}
#attachments table tbody#document_view,#attachment table tbody#document_view{display: flex; flex-wrap: wrap;}
#attachments table tbody#document_view tr,#attachments table tbody#document_view tr td,#attachment table tbody#document_view tr,#attachment table tbody#document_view tr td{display: flex; flex-wrap: wrap; width:100%}
#attachments table tbody#document_view tr td:last-child,#attachment table tbody#document_view tr td:last-child{border: none; padding-top: 0;}
}
@media (max-width: 600px){
.nav-tabs>li{width: 50%;}
}
/* ------------- 576 ------------- */
@media (max-width: 576px){
}