@import url('https://fonts.googleapis.com/css2?family=Rubik:ital,wght@0,300..900;1,300..900&display=swap');
.layout-boxed html, .layout-boxed body { height: 100%; }
body { -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; font-weight: 400; overflow-x: hidden; overflow-y: auto; font-family: "Rubik", serif; color: #292C30;}
a { outline:none !important; text-decoration:none; font-family: "Rubik", serif; transition:all .4s ease-in-out;}
button{ outline:none !important; text-decoration:none; transition:all .4s ease-in-out;}
a:hover, a:focus, select:focus, button:focus, .btn:focus, btn.focus { outline:none; text-decoration:none; box-shadow:none;}
* { margin:0; padding:0; }
img { border:none; vertical-align:middle; max-width:100%; }
li { list-style:none; }
h1, h2, h3, h4, h5, h6 { outline:none !important;}
input, select, textarea, button { outline:none !important; font-family: "Rubik", serif; /*-moz-appearance: none; -webkit-appearance: none;*/}

.container { width:90%; max-width:1270px; margin:0 auto; padding:0; }
.container-fluid{ padding-left:24px; padding-right:24px;}

.mb-10{ margin-bottom:10px !important;}
.mb-15{ margin-bottom:15px !important;}
.mb-20{ margin-bottom:20px !important;}
.mb-30{ margin-bottom:30px !important;}
.ms-20{ margin-left:20px !important;}
.me-20{ margin-right:20px !important;}
.mx--20{ margin-left:-20px !important; margin-right:-20px !important;}
.p-20{ padding:20px;}
.pt-15{ padding-top:15px;}

.mt-10{ margin-top:10px !important;}
.mt-15{ margin-top:15px !important;}
.mt-20{ margin-top:20px !important;}
.mt-30{ margin-top:30px !important;}


h1{ font-size: 24px; color: #292C30;}
h2{ font-size: 20px; color: #292C30;}
h3{ font-size: 18px; color: #292C30;}
h4{ font-size: 16px; color: #7A7C80;}
h5{ font-size: 14px; color: #292C30;}
h6{ font-size: 12px; color: #292C30;}

.dark-txt{ color: #292C30 !important;}
.primary-txt{ color: #43BD8D !important;}
.danger-txt { 
    color: #DB0722 !important; 
}
.border-theme{ border-color: #F5F5F5 !important;}
.bg-gray-theme{ background: #F3F5F7 !important;}

.filter-white{ filter: brightness(0) invert(1);}

p{ font-size: 14px; color: #292C30;}

.page-title{ margin-bottom: 24px; font-weight: 700;}
.page-title small{ font-size: 12px; font-weight: 500;}
.sec-title{ margin-bottom: 18px; font-weight: 600;}

.simple-link{ font-size: 12px; color: #43BD8D; font-weight: 500; text-decoration: underline; display: inline-flex;}
.simple-link:hover{ color: #50e4a9;}

/* All Button Components */
.btn_group{ display: flex; gap: 10px; flex-wrap: wrap;}

.btn{ margin: 0; border-radius: 50px; padding: 8px 15px; gap: 4px; background: #FFFFFF; font-weight: 500; font-size: 12px; color: #292C30; display: -webkit-inline-box; display: inline-flex; align-items: center; justify-content: center; text-align: center; border: none !important; box-shadow: none; outline: none;}
.btn i{ display:inline-flex;}
.btn.bordered{ border: 1px solid #292C30 !important; background: transparent;}
.btn:hover{ border-color: #E9EAEC !important; background: #E9EAEC; color: #292C30;}
.btn.primary{ background: #43BD8D; border-color: #43BD8D !important; color: #fff;}
.btn.primary.bordered{ background: transparent; color: #43BD8D; background: transparent;}
.btn.primary.bordered.txt-dark{ color: #292C30;}
.btn.primary.bordered.txt-dark.btn-bg-white{ background: #fff !important;}
.btn.primary:hover{ background: #69D5AA; border-color: #69D5AA !important; color: #fff;}
.btn.primary.bordered.txt-dark:hover{ color: #fff;}
.btn.primary.bordered.txt-dark.btn-bg-white:hover{ background: #69D5AA !important;}
.btn.light{ background: #F3F5F7; border-color: #F3F5F7 !important; color: #292C30;}
.btn.light:hover{ background: #E9EAEC; border-color: #E9EAEC !important; color: #292C30;}
.btn.dark{ background: #292C30; border-color: #292C30 !important; color: #fff;}
.btn.dark:hover{ background: #000; border-color: #000 !important; color: #fff;}
.btn.gray{ background: #E1E5EB; border-color: #E1E5EB !important; color: #292C30;}
.btn.gray:hover{ background: #D8DBE1; border-color: #D8DBE1 !important; color: #292C30;}
.btn.xl{ padding: 9px 20px;}
.btn.xxl{ padding: 11px 20px;}

.btn-black{ margin: 0; padding: 7px 23px; font-size: 12px; font-weight: 500; color: #fff; background: #292C30; border-radius: 60px; display: inline-flex; align-items: center; justify-content: center; gap: 5px;}
.btn-black.brd{ border: 1px solid #F1F1F1; background: transparent; color: #292C30;}
.btn-black:hover{ border-color: #000; background: #000; color: #fff;}
.btn-black.disabled{ pointer-events: none; background: rgba(41,44,48,0.6);}
.btn-black.brd.disabled{ pointer-events: none; background: transparent; color: rgba(41,44,48,0.6);}

/* Upload button */
.upload-foto-btn{ margin: 0; padding: 5px 20px; font-size: 12px; font-weight: 400; color: #292C30; background: #fff; border: 1px solid #E1E1E1; border-radius: 50px; display: -webkit-inline-box; display: inline-flex; align-items: center; justify-content: center; text-align: center; gap: 4px; position: relative;}
.upload-foto-btn.xl{ padding: 10px 20px;}
.upload-foto-btn.style2{ background: #F3F5F7; border-color: #E1E1E1;}
.upload-foto-btn input[type="file"]{ position: absolute; left: 0; top: 0; width: 100%; height: 100%; opacity: 0;}
.upload-foto-btn:hover{ background: #E1E1E1; border-color: #E1E1E1; color: #292C30;}
.upload-foto-btn.primary{ background: #fff; border-color: #43BD8D; color: #43BD8D;}
.upload-foto-btn.primary:hover{ background: #E2F2ED; border-color: #E2F2ED; color: #43BD8D;}
.upload-foto-btn.secondary{ background: #fff; border-color: #292C30; color: #292C30;}
.upload-foto-btn.secondary:hover{ background: #E1E1E1; border-color: #E1E1E1; color: #292C30;}
.upload-foto-btn.danger{ background: #DB0722; border-color: #DB0722; color: #fff;}
.upload-foto-btn.danger:hover{ background: #F03048; border-color: #F03048; color: #fff;}

.gx-15{ --bs-gutter-x: 15px;}
.gx-15 .white_block{ margin-bottom: 15px; height: calc(100% - 15px);}
.gx-8{ --bs-gutter-x: 8px;}
.gx-8 > div > div{ margin-bottom: 8px;}

.fw-500{ font-weight: 500 !important;}

.theme-btn-drop{ margin: 0; display: flex; justify-content: center; position: relative; z-index: 55;}
.theme-btn-drop .dropdown{ display: flex;}
.theme-btn-drop .dropdown .link{ padding: 9px 13px 9px 18px; font-size: 12px; font-weight: 500; color: #fff; background: #43BD8D; border-radius: 60px 0 0 60px; display: inline-flex; flex: 1 0 0; align-items: center; gap: 4px; position: relative; z-index: 2; border: none;}
.theme-btn-drop .dropdown .link i{ display: inline-flex; filter: brightness(0) invert(1); align-items: center;}
.theme-btn-drop .dropdown .link:hover{ background: #69D5AA; color: #fff;}
.theme-btn-drop .dropdown .dropdown-toggle{ width: 34px; min-width: 34px; border: none; border-left: 1px solid rgba(255, 255, 255, 0.3); display: flex; justify-content: center; align-items: center; background: #43BD8D; border-radius: 0 60px 60px 0; padding: 0 4px 0 0; position: relative; z-index: 2;}
.theme-btn-drop .dropdown .dropdown-toggle:hover{ background: #69D5AA; color: #fff; border-color: #69D5AA;}
.theme-btn-drop .dropdown .dropdown-toggle:after{ content:"\f107"; border:none; font-family:'FontAwesome'; margin:0; color:#fff; font-size:12px;}
.theme-btn-drop .dropdown .dropdown-toggle.show:after{ content:"\f106"; color:#fff;}
.theme-btn-drop .dropdown .dropdown-menu{ left: 50% !important; bottom: 0 !important; top: auto !important; transform: translateX(-50%) !important; border: none !important; box-shadow: 0px 6px 15px 0px #0000001A; padding: 16px 15px 49px 15px; margin: 0 !important; border-radius: 18px; z-index: 0; min-width: 100%;}
.theme-btn-drop .dropdown .dropdown-menu.open-bottom{ bottom: auto !important; top: 0 !important; padding: 49px 15px 16px 15px;}
.theme-btn-drop .dropdown .dropdown-menu > li:not(:last-child){ margin-bottom: 11px;}
.theme-btn-drop .dropdown .dropdown-item{ padding: 0; margin:0; font-size: 12px; font-weight: 500; color: #292C30; background: none !important; display: flex; gap: 4px; align-items: center;}
.theme-btn-drop .dropdown .dropdown-item i { display: flex;}
.theme-btn-drop .dropdown .dropdown-item:hover, .theme-btn-drop .dropdown .dropdown-item:focus, .theme-btn-drop .dropdown .dropdown-item.active{ color: #43BD8D;}

.white_block{ padding: 20px 20px 12px; border-radius: 10px; background: #fff;}
.white_block h5{ margin: 0 0 10px; font-weight: 600;}

.mCustomScrollbar .mCSB_scrollTools{ width: 5px;}
.mCustomScrollbar .mCSB_inside > .mCSB_container { margin-right: 0;}
.mCustomScrollbar #mCSB_1_scrollbar_vertical{ opacity:1; width:3px;}
.mCustomScrollbar:hover #mCSB_1_scrollbar_vertical{ opacity:1;}
.mCustomScrollbar .mCSB_scrollTools .mCSB_draggerRail{ background: none;}
.mCustomScrollbar .mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar{ background:#161D30; width: 3px;}

/* Layout */
.wrapper { min-height:100vh; position: relative; overflow: hidden; background: #F3F5F7;}
.wrapper:before, .wrapper:after { content: " "; display: table; }
.wrapper:after { clear: both; }

.content-wrapper, .right-side, .main-footer { padding:60px 0 0; -webkit-transition: -webkit-transform 0.3s ease-in-out, margin 0.3s ease-in-out; -moz-transition: -moz-transform 0.3s ease-in-out, margin 0.3s ease-in-out; -o-transition: -o-transform 0.3s ease-in-out, margin 0.3s ease-in-out; transition: transform 0.3s ease-in-out, margin 0.3s ease-in-out; margin-left: 250px; z-index: 820; }
@media (max-width: 1279px) {
.content-wrapper, .right-side, .main-footer { margin-left: 0;}
}
@media (min-width: 1280px) {
.sidebar-collapse .content-wrapper, .sidebar-collapse .right-side, .sidebar-collapse .main-footer { margin-left: 0;}
}
/* @media (max-width: 1279px) {
.sidebar-open .content-wrapper, .sidebar-open .right-side, .sidebar-open .main-footer { -webkit-transform: translate(250px, 0); -ms-transform: translate(250px, 0); -o-transform: translate(250px, 0); transform: translate(250px, 0);}
} */
.content-wrapper, .right-side { min-height: calc(100vh - 40px); z-index: 800; }
.main-footer{ background: #EBEEF1; padding: 9px 15px; color: #63666A;}
.main-footer p{ margin: 0; padding: 0; font-size: 12px; color: #63666A; display: flex; align-items: center;}
.main-footer p img{ margin-right: 10px;}

/* Fixed layout */
.fixed .main-header, .fixed .main-sidebar, .fixed .left-side { position: fixed; }
.fixed .main-header { top: 0; right: 0; left: 0; }
.fixed .content-wrapper, .fixed .right-side { padding-top: 50px; }

@media (max-width: 1279px) {
.fixed .content-wrapper, .fixed .right-side { padding-top: 100px;}
}
.fixed.layout-boxed .wrapper { max-width: 100%; }
/* Content */
.content { min-height: calc(100vh - 100px); padding: 24px; margin-right: auto; margin-left: auto;}
/** Component: Main Header * */
.main-header { width: 100%; position: fixed; top: 0; max-height: 60px; z-index: 1030; }
.main-header > .navbar { -webkit-transition: margin-left 0.3s ease-in-out; -o-transition: margin-left 0.3s ease-in-out; transition: margin-left 0.3s ease-in-out; margin-bottom: 0; margin-left: 250px; border: none; min-height: 60px; border-radius: 0; padding:10px 24px 10px 24px; background:#fff;}

.main-header .sidebar-toggle { background: none !important; padding:0; margin:0 40px 0 -56px;}
.sidebar-collapse .main-header .sidebar-toggle { margin:0 30px 0 0; transform: scale(-1); filter: brightness(0) invert(0);}

.main-header .logo { -webkit-transition: width 0.3s ease-in-out; -o-transition: width 0.3s ease-in-out; transition: width 0.3s ease-in-out; float: left; height: 60px; width: 132px; padding:20px 20px 20px 20px; overflow: hidden; display: flex;}
.main-header .logo .logo-lg { display: flex;}
.main-header .logo .logo-lg.dark{ display: none;}

.main-header .logo .logo-mini { display: none; }
.main-header .navbar-brand { color: #fff;}
.navbar-toggle { color: #fff; border: 0; margin: 0; padding: 15px 15px; }

/** Component: Sidebar **/
.main-sidebar, .left-side { position: fixed; top: 0; left: 0; padding-top: 60px; min-height: 100%; width: 250px; z-index: 810; transition: transform 0.3s ease-in-out, width 0.3s ease-in-out; }
@media (max-width: 1279px) {
	.main-sidebar, .left-side { padding-top: 60px; -webkit-transform: translate(-250px, 0); -ms-transform: translate(-250px, 0); -o-transform: translate(-250px, 0); transform: translate(-250px, 0);}
	.main-header .navbar { margin: 0;}
}
@media (min-width: 1280px) {
.sidebar-collapse .main-sidebar, .sidebar-collapse .left-side { -webkit-transform: translate(-250px, 0); -ms-transform: translate(-250px, 0); -o-transform: translate(-250px, 0); transform: translate(-250px, 0);}
}
@media (max-width: 1279px) {
.sidebar-mini.sidebar-collapse .main-sidebar{  -webkit-transform: translate(0, 0); -ms-transform: translate(0, 0); -o-transform: translate(0, 0); transform: translate(0, 0);}
.sidebar-open .main-sidebar, .sidebar-open .left-side {  -webkit-transform: translate(0, 0); -ms-transform: translate(0, 0); -o-transform: translate(0, 0); transform: translate(0, 0);}
}

.sidebar { padding-bottom: 10px; }

.sidebar-menu { list-style: none; margin: 0; padding: 16px 10px; border-top: 1px solid #20273A;}
.sidebar-menu > li { position: relative; margin: 0 2px 0 0; padding: 0; }
.sidebar-menu > li > a { padding:13px 20px; border-radius: 10px; display: flex; align-items: center; font-size:14px; font-weight:500; color:#B3B5BA; -webkit-transition: all .2s ease-in-out; -moz-transition: all .2s ease-in-out; -o-transition: all .2s ease-in-out; -ms-transition: all .2s ease-in-out; transition:all .2s ease-in-out; position:relative;}
.sidebar-menu > li > a > img{ margin-right:12px; transition:all .2s ease-in-out;}
.sidebar-menu > li .label, .sidebar-menu > li .badge { margin-top: 3px; margin-right: 5px;}

.sidebar-menu li > a > .fa-angle-down { position:absolute; right:20px; top:17px; -webkit-transition: all .2s ease-in-out; -moz-transition: all .2s ease-in-out; -o-transition: all .2s ease-in-out; -ms-transition: all .2s ease-in-out; transition:all .2s ease-in-out;}
.sidebar-menu li.active > a > .fa-angle-down, .sidebar-menu li > a.active > .fa-angle-down { -webkit-transform: rotate(-90deg); -ms-transform: rotate(-90deg); -o-transform: rotate(-90deg); transform: rotate(-90deg); }
.sidebar-menu li.active > .submenu-drop, .sidebar-menu li > a.active ~ .submenu-drop{ display: block !important;}
.sidebar-menu .submenu-drop { display: none; list-style: none; padding: 0; margin: 0; background-color: #161D30;}
.sidebar-menu .submenu-drop .submenu-drop { padding-left: 20px; }
.sidebar-menu .submenu-drop > li { margin: 0; }
.sidebar-menu .submenu-drop > li > a { padding:8px 20px 8px 30px; display: flex; gap: 10px; font-size: 14px; font-weight:500; color:#B3B5BA !important; position: relative;}
/* .sidebar-menu .submenu-drop > li > a::before{ content: "-"; position: absolute; top: 8px; left: 18px; color:#B3B5BA; font-size: 14px;} */
.sidebar-menu-stocktake .submenu-drop > li > a::before{ content: "-"; position: absolute; top: 8px; left: 18px; color:#B3B5BA; font-size: 14px;}
.sidebar-menu .submenu-drop > li > a > span{ align-self: center; white-space: normal; display: inline; line-height: normal;}
.sidebar-menu .submenu-drop > li > a > i.nav-icon{ margin-top: 1px;}
.sidebar-menu .submenu-drop > li > a > .fa-angle-left, .sidebar-menu .submenu-drop > li > a > .fa-angle-down { width: auto; }
/*
* Component: Sidebar Mini
*/
@media (min-width: 1280px) {
.sidebar-mini.sidebar-collapse .content-wrapper, .sidebar-mini.sidebar-collapse .right-side, .sidebar-mini.sidebar-collapse .main-footer{ margin-left: 80px !important; z-index: 840;}
.sidebar-mini.sidebar-collapse .main-sidebar { -webkit-transform: translate(0, 0); -ms-transform: translate(0, 0); -o-transform: translate(0, 0); transform: translate(0, 0); width: 80px !important; z-index: 850;}
.sidebar-mini.sidebar-collapse .main-sidebar #mCSB_1_scrollbar_vertical{ pointer-events: none;}
.sidebar-mini.sidebar-collapse .sidebar-menu > li { position: relative; }
.sidebar-mini.sidebar-collapse .sidebar-menu > li > a { margin-right: 0; padding:13px 18px;}
.sidebar-mini.sidebar-collapse .sidebar-menu > li > a > span { border-top-right-radius: 10px;}
.sidebar-mini.sidebar-collapse .sidebar-menu > li:not(.treeview) > a > span { border-bottom-right-radius: 10px;}
.sidebar-mini.sidebar-collapse .sidebar-menu > li > .submenu-drop { padding-top: 5px; padding-bottom: 5px; border-bottom-right-radius: 10px;}
.sidebar-mini.sidebar-collapse .sidebar-menu > li:hover > a > span:not(.pull-right), .sidebar-mini.sidebar-collapse .sidebar-menu > li:hover > .submenu-drop { display: block !important; position: absolute; width: 220px; left: 100%;}
.sidebar-mini.sidebar-collapse .sidebar-menu > li:hover > a > span { top: 0; margin-left:0; padding: 12px 5px 12px 20px; background-color: #161D30; font-weight:500;}
.sidebar-mini.sidebar-collapse .sidebar-menu > li:hover > .submenu-drop { top: 36px; margin-left: 0;}
.sidebar-mini.sidebar-collapse .main-sidebar .user-panel > .info, .sidebar-mini.sidebar-collapse .sidebar-form, .sidebar-mini.sidebar-collapse .sidebar-menu > li > a > span, .sidebar-mini.sidebar-collapse .sidebar-menu > li > .submenu-drop, .sidebar-mini.sidebar-collapse .sidebar-menu > li > a > .fa, .sidebar-mini.sidebar-collapse .sidebar-menu li.header { display: none !important; -webkit-transform: translateZ(0); transform: translateZ(0);}
.sidebar-mini.sidebar-collapse .main-header .logo { width: 80px; padding:15px 20px 13px 20px;}
.sidebar-mini.sidebar-collapse .main-header .logo > .logo-mini { display: block; text-align: center;}
.sidebar-mini.sidebar-collapse .main-header .logo > .logo-lg { display: none;}
.sidebar-mini.sidebar-collapse .main-header .navbar { margin-left: 80px;}
.sidebar-mini.sidebar-collapse .sidebar-menu .submenu-drop > li > a{ padding-left:20px;}
}
.sidebar-menu, .main-sidebar .user-panel, .sidebar-menu > li.header { white-space: nowrap; overflow: hidden; }
.sidebar-menu:hover { overflow: visible; }
.sidebar-form, .sidebar-menu > li.header { overflow: hidden; text-overflow: clip; }
.sidebar-menu li > a { position: relative; }
.sidebar-menu li > a > .pull-right { position: absolute; right: 10px; top: 50%; margin-top: -7px; }

.control-sidebar-bg { position: fixed; z-index: 1000; bottom: 0; }
.control-sidebar-bg, .control-sidebar { top: 0; right: -250px; width: 250px; -webkit-transition: right 0.3s ease-in-out; -o-transition: right 0.3s ease-in-out; transition: right 0.3s ease-in-out; }

@media (max-width: 1280px) {
.control-sidebar { padding-top: 60px;}
}

/* Dropdowns */
.dropdown-menu { box-shadow: none; border-color: #eee; }
.dropdown-menu > li > a { color: #777; }
.dropdown-menu > li > a > .fa{ margin-right: 10px; }
.dropdown-menu > li > a:hover { background-color: #FAFAFA; color: #292C30; }
.dropdown-menu > .divider { background-color: #eee; }

/*========== Sidebar Theme ===========*/
.main-sidebar, .left-side { background-color: #161D30;}
.sidebar-menu > li:hover > a, .sidebar-menu > li.active > a, .sidebar-menu > li > a.active { color: #fff; background:rgba(255,255,255,0.05);}
.sidebar-menu > li > a.active > img, .sidebar-menu > li.active > a > img, .sidebar-menu > li > a:hover > img{ filter: brightness(0) invert(1);}
.sidebar-menu > li > .submenu-drop { margin:0; }
.sidebar{ height:calc(100vh - 60px) !important;}
.sidebar a { color: #B3B5BA;}
.sidebar a:hover { text-decoration: none; }
.submenu-drop > li > a { color: #B3B5BA; }
.submenu-drop > li > a.active, .submenu-drop > li.active > a, .submenu-drop > li > a:hover { color: #fff !important; }

.main-sidebar .mCSB_scrollTools .mCSB_draggerRail{ background: none;}
.main-sidebar .mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar{ background: #fff; width:3px;}
.main-sidebar .mCSB_inside > .mCSB_container{ margin-right:0;}
.sidebar-collapse .main-sidebar .mCSB_container, .sidebar-collapse .main-sidebar .mCustomScrollBox{ overflow:visible!important;}
.main-sidebar #mCSB_1_scrollbar_vertical{ opacity:0; width:6px;}
.main-sidebar .mCSB_scrollTools{ width: 5px;}
.main-sidebar:hover #mCSB_1_scrollbar_vertical{ opacity:1;}

.open:not(.dropup) > .animated-dropdown-menu { backface-visibility: visible !important; -webkit-animation: flipInX 0.7s both; -o-animation: flipInX 0.7s both; animation: flipInX 0.7s both;}
@keyframes flipInX { 
	0% {
		transform: perspective(400px) rotate3d(1, 0, 0, 90deg);
		transition-timing-function: ease-in;
		opacity: 0;
	}
	40% {
		transform: perspective(400px) rotate3d(1, 0, 0, -20deg);
		transition-timing-function: ease-in;
	}
	60% {
		transform: perspective(400px) rotate3d(1, 0, 0, 10deg);
		opacity: 1;
	}
	80% {
		transform: perspective(400px) rotate3d(1, 0, 0, -5deg);
	}
	100% {
		transform: perspective(400px);
	}
}
@-webkit-keyframes flipInX { 
	0% {
		-webkit-transform: perspective(400px) rotate3d(1, 0, 0, 90deg);
		-webkit-transition-timing-function: ease-in;
		opacity: 0;
	}
	40% {
		-webkit-transform: perspective(400px) rotate3d(1, 0, 0, -20deg);
		-webkit-transition-timing-function: ease-in;
	}
	60% {
		-webkit-transform: perspective(400px) rotate3d(1, 0, 0, 10deg);
		opacity: 1;
	}
	80% {
		-webkit-transform: perspective(400px) rotate3d(1, 0, 0, -5deg);
	}
	100% {
		-webkit-transform: perspective(400px);
	}
}

/* loader css */
#loader {
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background-color: rgba(255, 255, 255, 0.8); /* Light overlay effect */
	z-index: 9999; /* Ensure it's on top of other elements */
	display: flex;
	justify-content: center;
	align-items: center;
	}
	
	/* Spinner styling */
	.spinner-loader-import {
			position: relative;
			border: 16px solid transparent;
			border-top: 16px solid;
			border-radius: 50%;
			width: 80px;
			height: 80px;
			mask-image: linear-gradient(260.02deg, #517aa6, #62c29b, #517aa6, #62c29b);
			-webkit-mask-image: linear-gradient(
					260.02deg,
					#517aa6,
					#62c29b,
					#517aa6,
					#62c29b
			);
			animation: spin_import 0.5s linear infinite,
					gradient_import 4s ease infinite;
	}
	
	/* Spinner animation */
	@keyframes spin_import {
			0% {
					transform: rotate(0deg);
			}
			100% {
					transform: rotate(360deg);
			}
	}
	
	/* Gradient animation */
	@keyframes gradient_import {
			0% {
					background-position: 0% 50%;
			}
			50% {
					background-position: 100% 50%;
			}
			100% {
					background-position: 0% 50%;
			}
	}

/*====================
				Header
====================*/
.nav_right { margin:0 0 0 auto; padding:0; }
.nav_right .top_links { margin:0; padding:0; display:flex; -ms-flex-align: center; align-items: center; justify-content:center; }
.nav_right .top_links > li { margin:0 0 0 6px; padding:0; color:#292C30; }
.nav_right .top_links > li > a{ padding: 5px 6px; border-radius: 36px; border: 1px solid #F3F5F7; display: flex; gap: 5px; align-items: center; justify-content: center; position:relative; min-height: 36px; min-width: 36px; font-size:12px; color:#292C30; font-weight:500;}
.nav_right .top_links > li.dark > a{ background: #292C30; color: #fff; border-color: #292C30;}
.nav_right .top_links > li.btnspace > a{ padding: 5px 16px; min-width: 73px;}
.nav_right .top_links > li.btnspace > a span{ padding-right: 0;}
.nav_right .top_links > li > a span{ display: inline-block; padding-right: 8px;}
.nav_right .top_links > li:not(.askhelp) > a > img{ transition: all .4s; filter: brightness(0) invert(0); opacity: 0.8;}
.nav_right .top_links > li > .dropdown-toggle:after { content:"\f107"; border:none; font-family:'FontAwesome'; margin:0 0 13px; color:#43BD8D; font-size:12px;}
.nav_right .top_links > li.acount-menu > a{ margin:0; padding:0; border: none;}
.nav_right .top_links li.acount-menu figure { width:36px; height:36px; background:#f0f0f0; display: flex; float:left; margin:0; padding:0; border-radius:50%; }
.nav_right .top_links li.acount-menu figure img { width:100%; border-radius:50%; object-fit: cover;}
.nav_right .top_links li.acount-menu span { margin:0; padding:0 7px 0 7px; overflow:hidden; display:inline-block; line-height:normal;}
.nav_right .top_links li.acount-menu span small{ display:block; font-size: 10px; color: #292C30; font-weight:400; opacity: 0.7;}
.nav_right .top_links > li > a:hover, .nav_right .top_links > li > a:focus { color:#43BD8D; border-color: #E1E1E1;}
.nav_right .top_links > li.dark > a:hover, .nav_right .top_links > li.dark > a:focus { color:#43BD8D; border-color: #000; background: #000;}
.nav_right .top_links > li:not(.askhelp) > a:hover > img{ filter: none; opacity: 1;}
.nav_right .dropdown-menu { margin:0; padding:10px 0; border:none; border-radius:0px; box-shadow:2px 10px 10px rgba(0, 0, 0, 0.07); left:auto; right:0; min-width:100%;}
.nav_right .dropdown-item { margin:0; padding:8px 20px; font-size:15px; font-weight:400; color:#0F111D;}
.nav_right .dropdown-item i { margin:0 5px 0 0;}
.nav_right .dropdown-item:hover, .nav_right .dropdown-item:focus { background:#F6FDFF; color:#43BD8D; border-color:#F6FDFF; }

.btnspace.dropdown > .dropdown-toggle::after { margin: 0 0 0 20px !important;}
.accotool-dropdown > .dropdown-menu{ min-width: 440px; padding: 40px 30px 30px; border-radius: 8px;}
.accotool-dropdown ul{ margin: 0; padding: 0;}
.accotool-dropdown ul li{ margin: 0 0 10px; padding: 0; font-size: 14px; list-style: none;}
.accotool-dropdown ul li a{ color: #7A7C80;}
.accotool-dropdown ul li a:hover{ color: #43BD8D;}

.btnspace.dropdown > .dropdown-toggle.show{ border-radius: 18px 18px 0 0;}
.btnspace.dropdown .dropdown-menu{ padding: 0; border-radius: 0 0 18px 18px; overflow: hidden;}
.btnspace.dropdown .dropdown-menu .dropdown-item{ font-size: 12px;}

.dropdown.plusnew-dropdown .dropdown-menu{ min-width: 500px; border: 1px solid #EBEEF0; border-radius: 10px; padding: 0; right: auto; left: 50%; transform: translateX(-50%); margin-top: 12px; padding: 19px 19px 1px; overflow: inherit;}
.dropdown.plusnew-dropdown .dropdown-menu:after, .dropdown.plusnew-dropdown .dropdown-menu:before { bottom: 100%; left: 50%; border: solid transparent; content: ""; height: 0; width: 0; position: absolute; pointer-events: none;}
.dropdown.plusnew-dropdown .dropdown-menu:after { border-color: rgba(255, 255, 255, 0); border-bottom-color: #fff; border-width: 8px; margin-left: -8px;}
.dropdown.plusnew-dropdown .dropdown-menu:before { border-color: rgba(235, 238, 240, 0); border-bottom-color: #EBEEF0; border-width: 9px; margin-left: -9px;}
.dropdown.plusnew-dropdown ul{ margin: 0 0 20px; padding: 0;}
.dropdown.plusnew-dropdown ul li{ margin: 0 0 10px; padding: 0; font-size: 12px; color: #292C30; font-weight: 400; display: flex;}
.dropdown.plusnew-dropdown ul li a{ color: #292C30; display: inline-flex; gap: 4px; align-items: center;}
.dropdown.plusnew-dropdown ul li a img{ filter: brightness(0) invert(0); transition: all .4s ease-in-out;}
.dropdown.plusnew-dropdown ul li a:hover{ color: #43BD8D;}
.dropdown.plusnew-dropdown ul li a:hover img{ filter: inherit;}

.burger_btn{ padding: 5px 6px; margin-left: 4px; border-radius: 36px; border: 1px solid #F3F5F7; display: flex; gap: 5px; align-items: center; justify-content: center; position:relative; min-height: 36px; min-width: 36px; font-size:12px; color:#292C30; font-weight:500;}
.burger_btn img{ transition: all .4s; filter: brightness(0) invert(0); opacity: 0.8;}
.burger_btn:hover img{ filter: none; opacity: 1;}
.burger_btn:hover{ color:#43BD8D; border-color: #E1E1E1;}

.info-msg{ margin: 0; font-size: 14px; color: #292C30; font-weight: 500;}
.info-msg .ic{ margin: 0 5px 0 0;}

.apphub-dropdown .dropdown-menu{ min-width: 280px; height: 500px !important; border: 1px solid #EBEEF0; border-radius: 10px; padding: 0; right: auto; left: 50%; transform: translateX(-50%); margin-top: 12px;}
.apphub-dropdown .dropdown-menu:after, .apphub-dropdown .dropdown-menu:before { bottom: 100%; left: 50%; border: solid transparent; content: ""; height: 0; width: 0; position: absolute; pointer-events: none;}
.apphub-dropdown .dropdown-menu:after { border-color: rgba(255, 255, 255, 0); border-bottom-color: #fff; border-width: 8px; margin-left: -8px;}
.apphub-dropdown .dropdown-menu:before { border-color: rgba(235, 238, 240, 0); border-bottom-color: #EBEEF0; border-width: 9px; margin-left: -9px;}
.solutionhub_items{ display: grid; grid-template-columns: repeat(2,1fr); text-align: center;}
.solutionhub_items .item{ border-bottom: 1px solid #EBEEF0;}
.solutionhub_items .item:nth-child(even){ border-left: 1px solid #EBEEF0;}
.solutionhub_items .item a{ padding: 16px 14px 12px; display: block;}
.solutionhub_items .item figure{ margin: 0 0 7px; width: 55px; height: 55px; background: #FAFAFA; border-radius: 50%; display: inline-flex; align-items: center; justify-content: center; transition: all .4s;}
.solutionhub_items .item figure img{ width: 38px;}
.solutionhub_items .item h6{ margin: 0; line-height: 16px; font-weight: 400; min-height: 32px; color: #292C30; transition: all .4s;}
.solutionhub_items .item a:hover{ background: #F3F5F7;}
.solutionhub_items .item a:hover figure{ background: #fff;}
.solutionhub_items .item a:hover h6{ color: #43BD8D;}
.dropdown-divider_title{ margin: 0; font-weight: 600; padding: 9px; text-align: center;}
.externaltool_items{ display: grid; grid-template-columns: repeat(3,1fr); text-align: center;}
.externaltool_items .item{ padding: 0; border-top: 1px solid #EBEEF0; text-align: center;}
.externaltool_items .item:nth-child(3n+2){ border-left: 1px solid #EBEEF0; border-right: 1px solid #EBEEF0;}
.externaltool_items .item a{ padding: 18px 5px 17px; display: block;}
.externaltool_items .item figure{ margin: 0 0 10px;}
.externaltool_items .item figure img{ width: 40px; height: 40px; object-fit: cover; border-radius: 50%;}
.externaltool_items .item h6{ margin: 0; font-weight: 400; color: #292C30;}

/* Burger Menu offcanvas */
.burger-offcanvas.offcanvas{ border: none; width: 270px;}
.burger-offcanvas .offcanvas-body{ padding: 60px 20px 20px 20px; margin: 0;}
.burger-offcanvas .btn-close{ position: absolute; top: 7px; right: 7px;}

/* Account Menu Sidebar */
#offcanvasAccount ~ .offcanvas-backdrop{ background: transparent;}
.account-offcanvas.offcanvas{ top: 60px; border: none; width: 270px;}
.account-offcanvas.show{ box-shadow: 0 0 30px rgba(0,0,0,0.05);}
.account-offcanvas .offcanvas-body, .account-offcanvas .offcanvas-body .mCSB_container{ padding: 20px 0; margin: 0;}
.account-offcanvas .offcanvas-body.mCustomScrollbar{ padding: 0;}
.account-offcanvas .btn-close{ position: absolute; top: 7px; right: 7px;}

.account-info{ display: flex; gap: 8px; padding: 0 20px 20px;}
.account-info figure{ width:36px; height:36px; min-width: 36px; background:#f0f0f0; display: flex; margin:0; padding:0; border-radius:50%; }
.account-info figure img { width:100%; border-radius:50%; object-fit: cover;}
.account-info span { margin:0; padding:0; display:block; font-size:12px; color:#292C30; font-weight:500;}
.account-info small{ display:block; font-size: 10px; color: #292C30; font-weight:400; margin-top: 5px;}
.account-info small.mailid{ opacity: 0.7; margin-top: 0;}
.twinlinks{ display: flex; gap: 1px;}
.twinlinks a{ display: block; padding: 14px 10px; font-size: 12px; font-weight: 500; color: #43BD8D; width: 100%; max-width: 100%; flex: 1 0 0%; text-align: center; background: #F3F5F7;}
.twinlinks a.danger{ color: #F46969;}
.twinlinks a:hover{ background: #43BD8D; color: #fff;}
.twinlinks a.danger:hover{ background: #F46969; color: #fff;}
.ve_blocks{ display: flex; gap: 45px; padding: 25px 20px 23px; border-bottom: 1px solid #E7ECF1; text-align: center;}
.ve_blocks figure{ margin: 0 auto 11px; width: 55px; height: 55px; background: #FAFAFA; display: flex; align-items: center; justify-content: center; border-radius: 50%;}
.ve_blocks h6{ margin: 0; font-weight: 500;}
.assistance_info{ padding: 22px 20px 10px; border-bottom: 1px solid #E7ECF1;}
.assistance_info h6{ margin: 0 0 15px; font-weight: 500;}
.assistance_info ul{ margin: 0; padding: 0 0 0 16px;}
.assistance_info ul li{ margin: 0 0 12px; padding: 0 0 0 3px; font-size: 12px; color: #292C30; list-style: disc;}
.assistance_info ul li .chvrn_link{ margin-left: 2px;}
.assistance_info ul li::marker{ font-size: 9px;}
.whatsnew{ background: #F3F5F7; padding: 12px 15px; display: flex; gap: 8px; align-items: center; border-bottom: 1px solid #E7ECF1;}
.whatsnew figure{ margin: 0; width: 40px; height: 40px; min-width: 40px; background: #FFFFFF; display: flex; justify-content: center; align-items: center; border-radius: 50%;}
.whatsnew h6{ margin: 0 0 4px; font-weight: 500;}
.whatsnew p{ margin: 0; font-size: 9px;}
.download-info{ padding: 25px 20px 10px; text-align: center;}
.download-info .qrcode{ padding: 17px; border-radius: 10px; border: 1px solid #E7ECF1; width: 120px; margin: 0 auto 16px; display: block;}
.download-info h6{ margin: 0 0 4px; font-weight: 500;}
.download-info p{ margin: 0 0 15px; font-size: 9px;}
.download-info .btn-group{ gap: 10px;}
.download-info .btn-black{ padding: 9px 13px;}

/*====================
			Dashboard
====================*/
html,body{ min-height:100vh;}

/* Block Auto grid - Component */
.autogrid{ display: grid; grid-template-columns: repeat(auto-fit, minmax(360px, 1fr)); gap: 24px; margin-bottom: 30px;}
.autogrid > .column{ display: flex;}

.solution-card{ width: 100%; padding: 0; position: relative; text-align: center; display: flex;}
.solution-card .info{ display: inline-flex; position: absolute; top: 10px; right: 10px;}
.solution-card > a:not(.info){ display: block; padding: 28px 18px 22px; border: 2px solid transparent; background: #fff; border-radius: 10px; width: 100%;}
.solution-card > a:not(.info):hover, .solution-card > a:not(.info).active{ border-color: #43BD8D; box-shadow: 0 0 20px #D6E1EC;}
.solution-card figure{ margin: 0 auto 16px; width: 72px; height: 72px; border-radius: 50%; display: flex; align-items: center; justify-content: center; background: #FAFAFA;}
.solution-card h4{ margin: 0 0 4px;}
.solution-card:not(.disabled) h4{ color: #292C30;}

.solution-card.disabled > a:not(.info){ pointer-events: none; background: #E9EBED;}
.solution-card.disabled:before{ content: ""; width: 24px; height: 24px; background: url(../../admin_assets/images/lock.svg) no-repeat center center; position: absolute; top: 10px; right: 10px;}
.solution-card.disabled .simple-link{ color: #292C30; /*cursor: pointer; pointer-events: all;*/}
.solution-card.disabled .simple-link:hover{ color: #000;}
.solution-card.disabled figure{ background: #F0F1F2;}
.solution-card.disabled figure img{ filter: url("data:image/svg+xml;utf8,<svg xmlns=\'http://www.w3.org/2000/svg\'><filter id=\'grayscale\'><feColorMatrix type=\'matrix\' values=\'0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0 0 0 1 0\'/></filter></svg>#grayscale"); filter: gray; -webkit-filter: grayscale(100%); -webkit-backface-visibility: hidden; backface-visibility: hidden;}

.app-search{ padding: 0 70px 0 0; margin: 0 0 24px;}
.app-search .form-control{ width: 100%; max-width: 200px; border: none; background: #fff; height: 40px; border-radius: 40px; padding: 0 16px; font-size: 14px; font-weight: 500; color: #292C30; box-shadow: none; outline: none;}

.app-item{ width: 100%; min-height: 158px; padding: 19px 15px 10px; background: #fff; border-radius: 10px; text-align: center;}
.app-item .app-icon{ display: inline-flex; margin: 0 0 18px; width: 40px; height: 40px; border-radius: 50%; background: #F0F1F2;}
.app-item .app-icon img{ width: 100%; height: 100%; border-radius: 50%; object-fit: cover;}
.app-item h4{ margin: 0 0 10px; color: #292C30; font-weight: 500;}
.app-item .app-rating{ margin: 0 0 15px; display: flex; gap: 5px; align-items: center; justify-content: center; color: #505358; font-size: 12px;}
.app-item .app-rating i{ color: #43BD8D;}

.external-tools-carousel .owl-nav{ position: absolute; top: -52px; right: 0; display: inline-flex; gap: 12px;}
.external-tools-carousel .owl-nav button{ width:20px; height:20px; font-size:0; display:block; border-radius:50%; position:relative; top:0; background:url(../../admin_assets/images/slider-arrow.svg) no-repeat center center !important; z-index:555; transition:all .6s ease-in-out;}
.external-tools-carousel .owl-nav button span{ display: none !important;}
.external-tools-carousel .owl-nav button.owl-prev{ left:0; transform: scale(-1);}
.external-tools-carousel .owl-nav button.owl-next{ right:0;}
.external-tools-carousel .owl-nav button:hover{ opacity: 0.5;}

/*----------- Stock Management & Recipe Control */
.stock-dash-tabs{ border: none; margin: 0 0 15px; padding: 0; gap: 30px;}
.stock-dash-tabs .nav-link{ border: none; margin: 0; padding: 0 2px 10px; font-size: 14px; font-weight: 600; color: #787B7C; background: none; position: relative;}
.stock-dash-tabs .nav-link::after{ content: ""; width: 0; height: 3px; background: #43BD8D; border-radius: 5px; transition: all .3s; position: absolute; bottom: 0; left: 0; right: 0; margin: auto;}
.stock-dash-tabs .nav-link.active::after{ width: 100%;}
.stock-dash-tabs .nav-link:hover, .stock-dash-tabs .nav-link.active{ color: #292C30; background: none;}

.select_top .select2-container{ width: 175px !important;}

/* Select2 */

.select2-container{ width: auto !important; /*z-index: 1056;*/ min-width: 150px;} /*for(min-width) is prodcut quick edit store-location dropdown */  
.form-group .select2-container{ width: 100% !important; z-index: inherit; box-shadow: none;}
.select2-container .select2-selection--single{ padding: 10px 45px 10px 20px; border-color: #E1E1E1; border-radius: 20px; font-size: 12px; color: #292C30; box-shadow: none; height: auto; background: #fff;}
.select2-container .select2-selection--single .select2-selection__rendered{ line-height: normal; padding:0; color: #292C30; flex-grow: 1;}
.select2-container--default .select2-selection--single .select2-selection__arrow{ right: 20px; top: 50%; transform: translateY(-50%); width: auto; height: auto;}
.select2-container--default .select2-selection--single .select2-selection__arrow:after{ content:""; width: 9px; height: 6px; background: url(../../admin_assets/images/select_arrow.svg) no-repeat center center; transition:all .3s ease-in-out; display: block;}
.select2-container--default .select2-selection--single .select2-selection__arrow b{ display: none;}
.select2-container--open .select2-selection--single .select2-selection__arrow:after{ transform:rotate(-180deg);}
.select2-container--default.select2-container--open.select2-container--below .select2-selection--single, .select2-container--default.select2-container--open.select2-container--below .select2-selection--multiple { border-top-left-radius: 10px; border-top-right-radius: 10px;}
.select2-dropdown{ border-color: #E1E1E1; border-bottom-left-radius: 10px; border-bottom-right-radius: 10px; overflow: hidden; box-shadow: 0 5px 24px rgba(0,0,0,0.1);}
.select2-container--open .select2-dropdown--above { border-top-left-radius: 10px; border-top-right-radius: 10px; border-bottom-left-radius: 0; border-bottom-right-radius: 0;}
.select2-search--dropdown{ padding: 7px;}
.select2-container--default .select2-search--dropdown .select2-search__field{ border-color: #E1E1E1;}
.select2-search--dropdown .select2-search__field{ padding: 6px 10px; font-size: 14px; color: #292C30;}
.select2-container--default .select2-results > .select2-results__options{ scrollbar-width: thin; -ms-overflow-style: none; scrollbar-color: #292C30 #f0f0f0;}
.select2-results__option{ font-size: 14px; color: #292C30; line-height: normal; padding: 7px 10px;}
.select2-results__option > span{ padding: 0 !important;}
.select2-container--default .select2-results__option--selected{ background:#F5F5F5; color:#43BD8D; border-color:#F5F5F5;}
.select2-container--default .select2-results__option--highlighted.select2-results__option--selectable{ background:#fff; color:#43BD8D; border-color:#F5F5F5;}
.select2-results__option:hover{ background: #fff !important; color: #43BD8D;}

#replacement_ingredient_id + .select2-container {
    width: 500px !important; /* or any width you want */
}

.productgroupSRselect2 + .select2-container {
    width: 100% !important; 
	min-width: auto !important;/* or any width you want */
}


.stockdash_filter{ display: inline-flex; gap: 6px; align-items: center; margin-bottom: 15px; flex-wrap: wrap;}
.date-start-end{ display: inline-flex; align-items: center; gap: 13px; background: #fff; padding: 3px 3px 3px 17px; border-radius: 50px;}
.date-start-end .divider{ min-width: 15px; width: 15px;}
.date-start-end span{ width: 100%; max-width: 70px; margin: 0; padding: 0; font-size: 12px; color: #292C30; display: inline-block;}
.date-start-end ::placeholder{ color: #292C30; opacity: 0.5;}
.date-start-end button{ background: #F3F5F7; width: 26px; min-width: 26px; height: 26px; border-radius: 50%; display: flex; align-items: center; justify-content: center; border: none;}
.date-start-end button:hover{ background: #50e4a9;}

.week_to_date .select2-container .select2-selection--single{ padding:7px 40px 7px 14px; border-color: #fff;}
.week_to_date .select2-container--default .select2-selection--single .select2-selection__arrow{ right: 14px;}

.report_cost_item{ border: 1px solid #F3F5F7; border-radius: 10px; padding: 10px 12px; position: relative;}
.report_cost_item span{ margin-bottom: 1px; font-size: 10px; color: #292C30; font-weight: 500; opacity: 0.5; display: block; line-height: 10px; min-height: 20px;}
.report_cost_item p{ margin: 0; font-weight: 600; line-height: normal;}
.report_cost_item p small{ font-weight: 400; font-size: 10px;}
.report_cost_item .iinfo_satk{ display: inline-flex; position: absolute; right: 9px; bottom: 9px;}
.report_cost_item .iinfo_satk.top{ right: 11px; top: 11px; bottom: auto;}

.stock-account-tabs{ border: none; margin: 0; padding: 0; gap: 3px;}
.stock-account-tabs .nav-link{ border: none; margin: 0; padding: 0 10px 5px; font-size: 10px; font-weight: 600; color: #A9ABAC; background: none; position: relative;}
.stock-account-tabs .nav-link::after{ content: ""; width: 0; height: 1px; background: #43BD8D; border-radius: 5px; transition: all .3s; position: absolute; bottom: 0; left: 0; right: 0; margin: auto;}
.stock-account-tabs .nav-link.active::after{ width: 100%;}
.stock-account-tabs .nav-link:hover, .stock-account-tabs .nav-link.active{ color: #292C30; background: none;}

.task_bill_item{ margin-bottom: 8px; border: 1px solid #F3F5F7; border-radius: 10px; padding: 14px 74px 14px 14px; position: relative; display: flex; gap: 8px;}
.task_bill_item i{ width: 38px; min-width: 38px; height: 38px; display: flex; align-items: center; justify-content: center; border-radius: 6px; background: #F9FAFB;}
.task_bill_item h6{ margin: 0 0 5px; font-weight: 500; display: flex; gap: 5px; flex-wrap: wrap;}
.task_bill_item h6 span{ font-size: 10px; color: #349E74; display: inline-flex; align-items: center; gap: 5px;}
.task_bill_item h6 span::before{ content: ""; width: 2px; height: 2px; border-radius: 5px; background: #349E74;}
.task_bill_item p{ margin: 0; font-size: 10px; color: #292C30; font-weight: 500; opacity: 0.5; line-height: 10px;}
.task_bill_item .view_btn{ position: absolute; right: 14px; top: 50%; transform: translateY(-50%);}
.view_btn{ margin: 0; padding: 3px 10px; border-radius: 50px; background: #F5F4F4; font-size: 12px; font-weight: 500; color: #292C30; border: 1px solid transparent; display: inline-block; min-width: 48px; text-align: center; justify-content: center;}
.view_btn.brd{ border-color: #292C30; background: transparent; color: #292C30;}
.view_btn:hover{ border-color: #292C30; background: #292C30; color: #fff;}

.task_bill_item.disabled{ pointer-events: none;}
.task_bill_item.disabled i img{ opacity: 0.7;}
.task_bill_item.disabled .view_btn{ opacity: 0.5;}

/* Dropdown - Component */
.theme-dropdown{ z-index: 60;}
.theme-dropdown > button{ padding: 9px 51px 9px 15px; font-size: 12px; color: #FFFFFF; background: #43BD8D; border-radius: 100px; border: none; position: relative; z-index: 2;}
.theme-dropdown > .dropdown-toggle:after { content: "\f107"; border: none; font-family: "FontAwesome"; margin: 0; font-size: 10px; position: absolute; right: 18px; top: 50%; transform: translateY(-50%); line-height: 16px;}
.theme-dropdown > .dropdown-toggle.show:after{ content: "\f106";}
.theme-dropdown .dropdown-menu{ border: none !important; box-shadow: 0px 6px 15px 0px #0000001A; padding: 49px 15px 16px 15px; margin: -38px 0 0 0 !important; border-radius: 18px; z-index: 0; min-width: 100%;}
.theme-dropdown .dropdown-menu > li:not(:last-child){ margin-bottom: 11px;}
.theme-dropdown .dropdown-item{ padding: 0; margin:0; font-size: 12px; font-weight: 500; color: #292C30; background: none !important;}
.theme-dropdown .dropdown-item:hover, .theme-dropdown .dropdown-item:focus, .theme-dropdown .dropdown-item.active{ color: #43BD8D;}

/* Pills Menu List - Component */
.po-nav-pills{  margin: 0; padding: 0; gap: 10px;}
.po-nav-pills .nav-item{ margin: 0; padding: 0;}
.po-nav-pills .nav-item .nav-link{ margin: 0; padding: 9px 20px; font-size: 12px; background: #E1E5EB; color: #292C30; font-weight: 600; border-radius: 50px;}
.po-nav-pills .nav-item .nav-link:hover{ background: #43BD8D; color: #fff;}
.po-nav-pills .nav-item .nav-link.active{ background: #D3EAE1; color: #43BD8D;}

/* Vertical Dots Dropdown - Component */
.vdots-dropdown > button{ padding:0; font-size: 0; background: none; border-radius: 0; border: none; position: relative;}
.vdots-dropdown .dropdown-menu{ box-shadow: none; border: 1px solid #DDE2ED !important; padding: 4px 0; margin: -4px 0 0 0 !important; border-radius: 6px 0 6px 6px; z-index: 3; min-width: 122px;}
.vdots-dropdown .dropdown-menu:after, .vdots-dropdown .dropdown-menu:before { bottom: 100%; right: 0; border: solid transparent; content: ""; height: 0; width: 0; position: absolute; pointer-events: none;}
.vdots-dropdown .dropdown-menu:after { border-color: rgba(255, 255, 255, 0); border-bottom-color: #fff; border-width: 8px; margin-left: 0;}
.vdots-dropdown .dropdown-menu:before { border-color: rgba(221, 226, 237, 0); border-bottom-color: #DDE2ED; border-width: 9px; margin-left: 0;}
.vdots-dropdown .dropdown-item{ padding: 4px 12px; margin:0; font-size: 13px; font-weight: 400; color: #292C30; background: none;}
.vdots-dropdown .dropdown-item:hover, .vdots-dropdown .dropdown-item:focus, .vdots-dropdown .dropdown-item.active{ background: #F3F5F7; color: #43BD8D;}

/* Data Table - Datatable */
.theme-datatable{ background: #FFFFFF; border-radius: 10px; padding: 10px 20px 13px; position: relative;}
.theme-datatable div.dt-container div.dt-layout-row{ margin: 0 !important;}
.theme-datatable .dt-layout-cell{ margin-bottom: 10px;}
.theme-datatable .dt-layout-table ~ .dt-layout-row .dt-layout-cell{ margin-bottom: 0; margin-top: 15px;}
.theme-datatable div.dt-container select.dt-input{ border: 1px solid #E1E1E1; background: #fff; height: 23px; border-radius: 5px; font-size: 10px; color: #8E9193; margin-right: 5px;}
.theme-datatable div.dt-container .dt-length label{ font-size: 12px; color: #8E9193;}
.theme-datatable div.dt-container .dt-search{ position: relative; display: flex; align-items: center;}
.theme-datatable div.dt-container .dt-search label{ font-size: 12px; color: #292C30;}
.theme-datatable div.dt-container .dt-search > .dt-input{ font-size: 12px; padding: 0 10px; font-weight: 500; border: 1px solid #E1E1E1; background: #fff; height: 27px; border-radius: 50px; box-shadow: none; outline: none; position: relative; z-index: 46; min-width: 300px;}
.recipe-quick-edit-table-container .theme-datatable div.dt-container .dt-search {
    margin-right: 36px !important;
    width: 30% !important;
    margin-left: 77% !important;
    padding-bottom: 10px !important;
}
.special-datatable div.dt-container .top{
	display: flex;
}
.special-datatable div.dt-container .dt-search > .dt-input {
    width: 100% !important;
}
.special-datatable div.dt-container .dt-search label{ font-size: 12px; color: #292C30;}

.special-datatable div.dt-container .dt-search{
	padding-bottom: 10px !important;
	    margin-left: auto !important;
}

.recipe-quick-edit-table-container .theme-datatable div.dt-container .dt-length label{ font-size: 12px; color: #8E9193;}
.recipe-quick-edit-table-container .theme-datatable{ background: #FFFFFF; border-radius: 10px; padding: 10px 20px 13px; position: relative;}
.recipe-quick-edit-table-container .theme-datatable div.dt-container div.dt-layout-row{ margin: 0 !important;}
.recipe-quick-edit-table-container .theme-datatable .dt-layout-cell{ margin-bottom: 10px;}
.recipe-quick-edit-table-container .theme-datatable .dt-layout-table ~ .dt-layout-row .dt-layout-cell{ margin-bottom: 0; margin-top: 15px;}
.recipe-quick-edit-table-container .theme-datatable div.dt-container select.dt-input{ border: 1px solid #E1E1E1; background: #fff; height: 23px; border-radius: 5px; font-size: 10px; color: #8E9193; margin-right: 5px;}
.recipe-quick-edit-table-container .theme-datatable div.dt-container .dt-search{ position: relative; display: flex; align-items: center;}
.recipe-quick-edit-table-container .theme-datatable div.dt-container .dt-search label{ font-size: 12px; color: #292C30;}
.recipe-quick-edit-table-container .theme-datatable div.dt-container .dt-search > .dt-input{ font-size: 12px; padding: 0 10px; font-weight: 500; border: 1px solid #E1E1E1; background: #fff; height: 27px; border-radius: 50px; box-shadow: none; outline: none; position: relative; z-index: 46; min-width: 300px;}


.datatable-filter-btn{ position: absolute; right: 11px; top: 5px; display: flex; z-index: 47;}
.filter-popup{ position: absolute; top: 0; right: 0; width: 300px; min-width: 300px; background: #fff; z-index: 45; border-radius: 14px; box-shadow: 0px 6px 15px 0px #0000001A; padding: 39px 15px 15px;}
.filter-popup1{ position: absolute; top: 100%; right: 0; width: 300px; min-width: 300px; background: #fff; z-index: 45; border-radius: 14px; box-shadow: 0px 6px 15px 0px #0000001A; padding: 15px 15px;}
.filter-popup:not(.collapsed){ display: none !important;}
/* .filter-popup1:not(.collapsed){ display: none !important;} */
.filter-popup.collapsed{ display: block !important;}
.filter-popup1.collapsed{ display: block !important;}
.filter-popup .filter_block{ display: grid; grid-template-columns: 64px 1fr; gap: 10px; align-items: center;}
.filter-popup1 .filter_block{ display: grid; grid-template-columns: 64px 1fr; gap: 10px; align-items: center;}
.filter-popup .filter_block + .filter_block{ margin-top: 10px;}
.filter-popup1 .filter_block + .filter_block{ margin-top: 10px;}
.filter-popup .filter_block label{ margin: 0 0 2px; font-size: 12px; font-weight: 400; color: #292C30; text-align: left;}
.filter-popup1 .filter_block label{ margin: 0 0 2px; font-size: 12px; font-weight: 400; color: #292C30; text-align: left;}
.filter-popup .filter_block .form-group{ margin: 0; padding: 0;}
.filter-popup1 .filter_block .form-group{ margin: 0; padding: 0;}
.filter-popup .filter_block .form-group .form-control{ height: 25px; padding: 0 10px; font-size: 10px; color: #292C30; font-weight: 400; border-radius: 50px; border: 1px solid #E1E1E1;background-color: #FFFFFF; margin: 0;}
.filter-popup1 .filter_block .form-group .form-control{ height: 25px; padding: 0 10px; font-size: 10px; color: #292C30; font-weight: 400; border-radius: 50px; border: 1px solid #E1E1E1;background-color: #FFFFFF; margin: 0;}
.filter-popup .filter_block .form-group .form-control[type="date"]{ padding: 0 6px; letter-spacing: -0.4px;}
.filter-popup1 .filter_block .form-group .form-control[type="date"]{ padding: 0 6px; letter-spacing: -0.4px;}
.filter-popup .filter_block .form-group select.form-control { background-position: center right 8px; background-size: 8px;}
.filter-popup1 .filter_block .form-group select.form-control { background-position: center right 8px; background-size: 8px;}
.filter-popup .filter_block .to{ font-size: 10px; color: #8E9193;}
.filter-popup1 .filter_block .to{ font-size: 10px; color: #8E9193;}

.theme-datatable div.dt-container .dt-info{ font-size: 12px; font-weight: 400; color: #8E9193;}
.theme-datatable div.dt-container .dt-paging > nav{ display: inline-flex; align-items: center; gap: 10px;}
.theme-datatable div.dt-container .dt-paging .dt-paging-button{ width: 20px; height: 20px; border-radius: 3px; background: #fff; margin: 0; font-size: 12px; color: #8E9193 !important;padding: 0; border: none !important; box-shadow: none !important;}
.theme-datatable div.dt-container .dt-paging .dt-paging-button.disabled, .theme-datatable div.dt-container .dt-paging .dt-paging-button.disabled:hover, .theme-datatable div.dt-container .dt-paging .dt-paging-button.disabled:active{ background: #fff !important; color: #8E9193 !important;}
.theme-datatable div.dt-container .dt-paging .dt-paging-button.current{ background: #F3F5F7 !important; color: #292C30 !important;}
.theme-datatable div.dt-container .dt-paging .dt-paging-button:not(.current, .disabled):hover{ color: #292C30 !important;}
.split_select{ margin: 0; position: absolute; right: 20px; top: 10px; z-index: 55;}
.split_select > a{ width: 27px; height: 27px; border-radius: 50%; background: #F3F5F7; display: flex; align-items: center; justify-content: center;}
.split_select > a:hover{ background: #E9EAEC;}
.split_select ~ div.dt-container .dt-search{ margin-right: 36px;};

.theme-datatable .dt-layout-table .dt-layout-cell{ margin-bottom: 0;}
.theme-datatable table.dataTable > thead > tr > th, .theme-datatable table.dataTable > thead > tr > td{ padding: 9px 15px; font-size: 10px; font-weight: 500; background: #F3F5F7; color: #8E9193; border: none; outline:none !important; box-shadow: none;}
.theme-datatable table.dataTable > thead > tr > th:first-child{ border-radius: 10px 0 0 10px;}
.theme-datatable table.dataTable > thead > tr > th:last-child{ border-radius: 0 10px 10px 0;}
.theme-datatable table.dataTable > tbody > tr > td{ padding: 9px 15px; font-size: 12px; font-weight: 400; background: #fff; color: #292C30; border: none; border-bottom: 1px solid #F5F5F5 !important; vertical-align: middle; outline:none; box-shadow: none;}
.theme-datatable table.dataTable .form-control{ box-shadow: none; outline: none; width: 100%; min-width: 60px; height: 26px; border-color: #E1E1E1; color: #292C30; padding: 0 8px; border-radius: 5px; font-size: 12px; font-weight: 400; color: #292C30;}
/* .theme-datatable table.dataTable input.form-control[type="text"]{ width: 100%; max-width: 55px; } */
.stocktake-theme-table table.dataTable input.form-control[type="text"]{ width: 100%; max-width: 55px; }
.theme-datatable table.dataTable input.form-control[type="number"]{ width: 100%; max-width: 80px; min-width: 70px;}
.theme-datatable table.dataTable input.product_sku, .theme-datatable table.dataTable input.pack_size, .theme-datatable table.dataTable input.tax, .theme-datatable table.dataTable input.alc_tax, .theme-datatable table.dataTable input.alc_net, .theme-datatable table.dataTable input.total, .theme-datatable table.dataTable input.uom_name, .theme-datatable table.dataTable input.cost_total{ padding: 0; height: auto; font-size: 12px; font-weight: 400; color: #292C30; border: none; cursor: default; display: inline-block; pointer-events: none; box-shadow: none; outline: none; -webkit-appearance: textfield; -moz-appearance: textfield; appearance: textfield; min-width: 48px; max-width: 50px;}
.theme-datatable table.dataTable input.price[type="number"]{ min-width: 100px !important;}
.theme-datatable table.dataTable input.uom_name{ min-width: 80px !important;}
.theme-datatable table.dataTable input.comment{ height:auto; border:none; color: #292C30; padding:0; border-radius:0; font-size: 12px; font-weight: 400; color: #292C30; width: 100%; max-width: 60px; min-width: 60px;}
.theme-datatable table.dataTable .action_btns{ display: flex; gap: 5px;}
.theme-datatable table.dataTable th.dt-type-numeric, .theme-datatable table.dataTable th.dt-type-date, .theme-datatable table.dataTable td.dt-type-numeric, .theme-datatable table.dataTable td.dt-type-date { text-align: left;}

/* Row Hover */
.theme-datatable table.dataTable.table-hover > tbody > tr:hover > td{ background: #F3F5F7;}
/* Col Hover TXT */
.theme-datatable table.dataTable.second-col-hover-txt > tbody > tr:hover > td:nth-child(2){ color: #43BD8D;}

/* Icon badge - Component */
.icon-badge{ width: 27px; height: 27px; border-radius: 50%; background: #F3F5F7; display: flex; align-items: center; justify-content: center; border: none;}
.icon-badge.flag:not(.active) img{ filter: brightness(0) invert(0); opacity: 0.6;}

.light-wd-b{ background: #FFFFFF; border: 1px solid #E1E1E1;}

/* Yes - No badge - Component */
.yes-badge{ padding: 4px 10px; font-size: 10px; line-height: normal; font-weight: 500; border-radius: 50px; display: inline-flex; background: #E2F9F0; color: #43BD8D;}
.no-badge{ padding: 4px 10px; font-size: 10px; line-height: normal; font-weight: 500; border-radius: 50px; display: inline-flex; background: #FFE4E8; color: #DB0722;}

/* Tag badge - Component */
.theme-badge{ padding: 4px 10px; font-size: 10px; line-height: normal; font-weight: 400; border-radius: 50px; display: inline-flex; align-items: center; gap: 4px; white-space: nowrap;}
.theme-badge::before{ content: ""; width: 5px; min-width: 5px; height: 5px; border-radius: 50%; display: inline-block;}
.badge-draft{ color: #8E7126; background: #FFF4CA;}
.badge-draft::before{ background: #8E7126;}
.badge-draft-dark{ color: #fff; background: #8E7126;}
.badge-draft-dark::before{ background: #fff;}
.badge-closed{ color: #2C5F5B; background: #CEEDF0;}
.badge-closed::before{ background: #2C5F5B;}
.badge-approval{ color: #0D3B72; background: #C9E5FC;}
.badge-approval::before{ background: #0D3B72;}
.badge-delivery{ color: #404243; background: #E4E7E9;}
.badge-delivery::before{ background: #404243;}
.badge-invoice{ color: #D48310; background: #F8E8D1;}
.badge-invoice::before{ background: #D48310;}
.badge-cng{ color: #1A502B; background: #D3EDD9;}
.badge-cng::before{ background: #1A502B;}
.badge-cwcn{ color: #71323A; background: #F8D8D8;}
.badge-cwcn::before{ background: #71323A;}
.badge-insufficient{ color: #DB0722; background: #FFE4E8;}
.badge-insufficient::before{ background: #DB0722;}
.badge-received{ color: #109C5B; background: #C9FCE4;}
.badge-received::before{ background: #109C5B;}
.badge-priced{ color: #1A502B; background: #D3EDD9;}
.badge-priced::before{ background: #1A502B;}
.badge-overpriced{ color: #BB1E1E; background: #FBDCDC;}
.badge-overpriced::before{ background: #BB1E1E;}
.badge-underpriced{ color: #DB990A; background: #F9EACB;}
.badge-underpriced::before{ background: #DB990A;}
.badge-draftinvoice{ color: #2367C1; background: #CFE0F6;}
.badge-draftinvoice::before{ background: #2367C1;}
.badge-unverified{ color: #7E7E7E; background: #EEEEEE;}
.badge-unverified::before{ background: #7E7E7E;}

/* Breadcrumb - Component*/
.breadcrumb{ margin: 7px 0 10px 0;}
.breadcrumb-item{ font-size: 12px; color: #292C30;}
.breadcrumb-item + .breadcrumb-item::before { color: #C3C6C8;}
.breadcrumb-item a{ color: #8E9193;}
.breadcrumb-item a:hover{ color: #43BD8D;}

.refresh-ic-btn{ width: 27px; height: 27px; background: #292C30; display: inline-flex; align-items: center; justify-content: center; border-radius: 50%;}
.refresh-ic-btn:hover{ background: #43BD8D;}

/* PO Accordian - Component*/
.po-accordion{ background: none; border: none;}
.po-accordion .accordion-item{ margin: 0 0 20px; background: #FFFFFF; border-radius: 10px; border: none; overflow: hidden;}
.po-accordion .accordion-header{ position: relative;}
.po-accordion.bordered .accordion-item{ border: 1px solid #E1E1E1;}
.po-accordion .accordion-button{ padding: 14px 20px; font-size: 16px; font-weight: 600; color: #292C30; background: none; border: none; box-shadow: none; position: relative;}
.po-accordion .accordion-button:not(.collapsed){ color: #292C30;}
.po-accordion .accordion-button.accordion-button-themecolor:not(.collapsed){ background: rgba(67, 189, 141, 0.15); border-radius: 10px 10px 0 0;}
.po-accordion .accordion-button.accordion-button-themecolor:not(.collapsed)::before{ content: ""; width: 100%; position: absolute; top: 0; bottom: -1px; left: 0; border: 1px solid #FFFFFF; border-radius: 10px 10px 0 0;}
.po-accordion .accordion-button.justify-content-between::after{ margin-left: 10px;}
.po-accordion .accordion-header .upload-img-prew{ width: 35px; height: 35px; position: absolute; top: 50%; right: 50px; z-index: 12;transform: translateY(-50%);}
.po-accordion .accordion-header .upload-img-prew + .accordion-button{ justify-content: space-between;}
.po-accordion .accordion-header .upload-img-prew + .accordion-button::after{ margin-left: 55px;}
.po-accordion .accordion-body{ padding: 20px; border-top:1px solid #E1E1E1;}

/* Form - Component*/
.form-group{ margin: 0;}
.form-group > label{ font-size: 12px; color: #292C30; font-weight: 400;}
.form-group + .form-group{ margin-top: 10px;}
.form-group .form-control{ padding: 0 20px; height: 40px; font-size: 12px; color: #292C30; font-weight: 400; border-radius: 50px; border: 1px solid #E1E1E1;background-color: #FFFFFF; box-shadow: none; outline: none;}
.form-group textarea.form-control{ height: 85px; border-radius: 10px; padding: 10px 20px;}
.form-group select.form-control{ padding-right: 34px; background-image: url(../images/select_arrow.svg); background-position: center right 20px; background-repeat: no-repeat;}
.form-group input.form-control[type="date"]{ direction: rtl; text-align: left;}
.form-control.error{ border-color: #DB0722 !important;}
label.error{ font-size: 11px; font-weight: 400; color: #DB0722;}
#error-msg{ font-size: 11px; font-weight: 400; color: #DB0722;}

.form-group.with-ic{ position: relative;}
.form-group.with-ic .form-control{ padding-left: 41px;}
.form-group.with-ic .ic{ position: absolute; top: 11px; left: 20px;}

.form-slct-with-btn.form-group{ position: relative;}
.form-slct-with-btn.form-group .select2-container--default .select2-selection--multiple{ padding-right: 90px;}
.form-slct-with-btn.form-group > .btn{ padding-top: 7px; padding-bottom: 7px; position: absolute; right: 4px; top: 4px; z-index: 5;}

.form-floating{ margin: 5px 0 0;}
.form-floating.calender-icon{ position: relative;}
.form-floating.calender-icon::before{ content: ""; position: absolute; top: 50%; left: 20px; transform: translate(0, -50%); background: url(../images/calendar.svg) center center no-repeat; background-size: 100% 100%; height: 16px; width: 16px;}
.form-floating.calender-icon .form-control{ padding-left: 40px !important;}
.product-item-page p{ font-size: 12px;}

.form-floating + .form-floating{ margin-top: 10px;}
.form-floating .form-control{ padding: 0 20px !important; height: 40px; font-size: 12px; color: #292C30; font-weight: 400; border-radius: 50px; border: 1px solid #E1E1E1;background-color: #FFFFFF; box-shadow: none; outline: none; min-height: auto;}
.form-floating textarea.form-control{ height: 85px; border-radius: 10px; padding: 15px 20px !important;}
.form-floating select.form-control{ padding-right: 34px !important; background-image: url(../images/select_arrow.svg); background-position: center right 20px; background-repeat: no-repeat;}
.form-floating input.form-control[type="date"]{ direction: rtl; text-align: left;}
.form-floating > label:not(.error){ padding: 10px; font-size: 12px; color: #292C30; left: 12px; height: auto;}
.form-floating > label.error{ position: absolute; top: auto; bottom: -9px; left: 10px; z-index: 2; height: auto; padding:0 10px;background: #fff;  transform:inherit !important; color: #DB0722 !important;}
.form-floating > .form-control-plaintext ~ label, .form-floating > .form-control:focus ~ label, .form-floating > .form-control:not(:placeholder-shown) ~ label, .form-floating > .form-select ~ label { color: #292C30; transform: scale(.85) translateY(-20px) translateX(0);}
.form-floating > .form-control:disabled ~ label, .form-floating > :disabled ~ label{ color: #6c757d !important;}
.form-floating > .form-control:disabled , .form-floating > :disabled{ color: rgba(41,44,48,0.6);}
.form-floating > .form-control-plaintext ~ label::after, .form-floating > .form-control:focus ~ label::after, .form-floating > .form-control:not(:placeholder-shown) ~ label::after, .form-floating > .form-select ~ label::after {	inset: 9px 0;}
/* .form-floating > .form-control-plaintext ~ label.error, .form-floating > .form-control:focus ~ label.error, .form-floating > .form-control:not(:placeholder-shown) ~ label.error, .form-floating > .form-select ~ label.error{ } */

/* Gray Card */
.gray_card{ padding: 17px 20px 20px; background: #F3F5F7; border-radius: 10px; height: 100%;}
.gray_card.mb-24{ height: calc(100% - 24px); margin-bottom: 24px;}
.gray_card-title{ margin: 0 0 16px; font-weight: 600;}

/* Checkbox & Radio All Type - Component*/
.theme-form-check{ padding: 0; margin-left: 0; margin-right: 0; position: relative; min-height: 18px; min-width: 18px; display: flex;}
.theme-form-check .form-check-label{ margin: 0; padding: 0 0 0 23px; font-size: 12px; font-weight: 400; color: #292C30;}
.theme-form-check .form-check-input[type="checkbox"]{ border: 1px solid #E1E1E1; background-color: #fff; width: 18px; height: 18px; margin: 0; position: absolute; top: 0; left: 0; box-shadow: none;}
.theme-form-check .form-check-input:checked[type="checkbox"]{ background-color: #43BD8D; border-color: #43BD8D;}
.theme-form-check.dark .form-check-input:checked[type="checkbox"]{ background-color: #161D30 !important; border-color: #161D30 !important;}
.form-check-style2 .form-check-label{ font-size: 14px !important; color: #787B7C !important;}
.form-check-style2 .form-check-label.fs-12 {font-size: 12px !important;}
div:not(.radio_btn_group) > .form-check:not(.form-switch){ padding: 0; margin-left: 0; margin-right: 0; position: relative; min-height: auto; display: flex;}
div:not(.radio_btn_group) > .form-check:not(.form-switch) .form-check-label{ margin: 0; padding: 0 0 0 23px; font-size: 12px; font-weight: 400; color: #292C30;}
div:not(.radio_btn_group) > .form-check:not(.form-switch) .form-check-input[type="checkbox"]:not([role="switch"]){ border: 1px solid #E1E1E1; background-color: #fff; width: 18px; height: 18px; margin: 0; position: absolute; top: 0; left: 0; box-shadow: none;}
div:not(.radio_btn_group) > .form-check:not(.form-switch) .form-check-input:checked[type="checkbox"]{ background-color: #43BD8D; border-color: #43BD8D;}
.form-group + .form-group.form-check{ margin-top: 20px;}
.form-group.form-check + .form-group{ margin-top: 20px;}
/* Radio switch btn - Component*/
.radio_btn_group{ display: inline-flex; background: #FFFFFF; border-radius: 50px; margin-bottom: 10px;}
.radio_btn_group .form-check{ margin: 0; padding: 0; border-radius: 50px; position: relative;}
.radio_btn_group .form-check-label{ padding: 10px 20px; font-size: 12px; font-weight: 400; color: #787B7C; border-radius: 50px; border: 1px solid transparent; transition: all .15s;}
.radio_btn_group .form-check-input[type="radio"]{ position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: none; border: none; opacity: 0; margin: 0;}
.radio_btn_group .form-check-input:checked[type="radio"] ~ .form-check-label{ border-color:#43BD8D; box-shadow: 0px 0px 14px 0px #0000000D; color: #292C30; background: #fff;}

/* Nav Tab Step - Component */
.nav-steps{ margin: 0 0 16px; padding: 0; border: none; list-style: none; counter-reset: my-awesome-counter; justify-content: space-between; position: relative; overflow: auto; flex-wrap: nowrap; white-space: nowrap; scrollbar-width: thin; -ms-overflow-style: none; gap: 30px;}
.nav-steps::before{ content: ""; width: 100%; height: 2px; background: #E1E1E1; position: absolute; top: 50%; left: 0; transform: translateY(-50%);}
.nav-steps .nav-item{ margin: 0; padding: 0; border: none; counter-increment: my-awesome-counter; /*flex: 1 0 auto;*/}
.nav-steps .nav-item > a{ padding: 0 10px; font-size: 14px; font-weight: 600; color: #787B7C; margin: 0; border: none; background: #fff; display: flex; align-items: center; gap: 7px; position: relative; z-index: 2;}
.nav-steps .nav-item > a:before{ content: counter(my-awesome-counter) ""; width: 25px; height: 25px; border: 1px solid #E1E1E1; border-radius: 50%; font-size: 13px; font-weight: 500; color: #787B7C; display: flex; align-items: center; justify-content: center;}
.nav-steps .nav-item > a:after{ content: ""; width: 100vh; height: 2px; background: #43BD8D; position: absolute; top: 50%; right: 100%; transform: translateY(-50%); opacity: 0; z-index: -1;cursor: none;pointer-events: none;}
.nav-steps .nav-item:first-child > a{ padding-left: 0;}
.nav-steps .nav-item:last-child > a{ padding-right: 0;}
.nav-steps .nav-item:first-child > a:after{ display: none;}
.nav-steps .nav-item > a.active{ color: #292C30;}
.nav-steps .nav-item > a.active:before{ border-color: #43BD8D; background: #43BD8D; color: #fff;}
.nav-steps .nav-item > a.active:after{ opacity: 1;}
.nav-steps .nav-item > a.activeted{ color: #292C30; z-index: 3;}
.nav-steps .nav-item > a.activeted:before{ border-color: #43BD8D; background: #43BD8D; color: #fff;}
.nav-steps .nav-item > a.activeted:after{ opacity: 1;}
.nav-steps .nav-item:nth-child(1) > a.activeted{ z-index: 15;}
.nav-steps .nav-item:nth-child(2) > a.activeted{ z-index: 14;}
.nav-steps .nav-item:nth-child(3) > a.activeted{ z-index: 13;}
.nav-steps .nav-item:nth-child(4) > a.activeted{ z-index: 12;}
.nav-steps .nav-item:nth-child(5) > a.activeted{ z-index: 11;}
.nav-steps .nav-item:nth-child(6) > a.activeted{ z-index: 10;}
.nav-steps .nav-item:nth-child(7) > a.activeted{ z-index: 9;}
.nav-steps .nav-item:nth-child(8) > a.activeted{ z-index: 8;}
.nav-steps .nav-item:nth-child(9) > a.activeted{ z-index: 7;}
.nav-steps .nav-item:nth-child(10) > a.activeted{ z-index: 6;}
.steps-content{ border-top: 1px solid #F5F5F5; padding-top: 20px;}

/* Table - Theme Table */
.table-responsive > .theme-table{ margin-bottom: 0;}
.theme-table > tfoot > tr > th, .theme-table > tfoot > tr > td{ padding: 9px 7px; font-size: 12px; font-weight: 400; background: #fff; color: #292C30; vertical-align: middle; outline:none; box-shadow: none; line-height: normal;}
.theme-table > tfoot > tr > th{ font-weight: 600;}
.theme-table > thead > tr > th, .theme-table > thead > tr > td{ padding: 9px 7px; font-size: 10px; font-weight: 500; background: #F3F5F7; color: #8E9193; border: none; outline:none !important; box-shadow: none; vertical-align: top; line-height: normal;}
.theme-table > thead > tr > th:first-child{ border-radius: 10px 0 0 10px; padding-left: 15px;}
.theme-table > thead > tr > th:last-child{ border-radius: 0 10px 10px 0; padding-right: 15px;}
.theme-table > tbody > tr > td{ padding: 9px 7px; font-size: 12px; font-weight: 400; background: #fff; color: #292C30; border: none; border-bottom: 1px solid #F5F5F5 !important; vertical-align: middle; outline:none; box-shadow: none; line-height: normal;}
.theme-table > tbody > tr > td:first-child{ padding-left: 15px;}
.theme-table > tbody > tr > td:last-child{ padding-right: 15px;}
.theme-table > tbody > tr > td.fw-600{ font-weight: 600;}
.theme-table .form-control{ box-shadow: none; outline: none; width: 100%; min-width: 160px; height: 26px; border-color: #E1E1E1; color: #292C30; padding: 0 8px; border-radius: 5px; font-size: 12px; font-weight: 400; color: #292C30;}
/* .theme-table input.form-control[type="text"]{ width: 100%; max-width: 55px; } */
.stocktake-theme-table input.form-control[type="text"]{ width: 100%; max-width: 55px; }
.theme-table input.form-control[type="number"]{ width: 100%; max-width: 80px; min-width: 70px;}
.theme-table input.product_sku, .theme-table input.pack_size, .theme-table input.tax, .theme-table input.alc_tax, .theme-table input.alc_net, .theme-table input.total, .theme-table input.uom_name, .theme-table input.cost_total{ padding: 0; height: auto; font-size: 12px; font-weight: 400; color: #292C30; border: none; cursor: default; display: inline-block; pointer-events: none; box-shadow: none; outline: none; -webkit-appearance: textfield; -moz-appearance: textfield; appearance: textfield; min-width: 48px; max-width: 50px;}
.theme-table input.price[type="number"]{ min-width: 100px !important;}
.theme-table input.uom_name{ min-width: 80px !important;}
.theme-table input.comment{ height:auto; border:none; color: #292C30; padding:0; border-radius:0; font-size: 12px; font-weight: 400; color: #292C30; width: 100%; max-width: 60px; min-width: 60px;}
.theme-table .action_btns{ display: flex; gap: 5px;}

/* .theme-table input.form-control[readonly]{ width: 100%; min-width:auto;background: none!important;border: none!important; } */
.theme-table input.form-control[readonly]{ width: 100%;background: none!important;border: none!important; }
.theme-table input.form-control:disabled{ width: 100%; min-width:auto;background: none!important;border: none!important; }

/* max-width:100% removed */
/* .theme-table input.form-control[readonly]{ width: 100%; max-width:100%; min-width:auto;background: none!important;border: none!important; }
.theme-table input.form-control:disabled{ width: 100%; max-width:100%; min-width:auto;background: none!important;border: none!important; } */

.theme-table input.form-control.mw-125,
.theme-table input.form-control[readonly].mw-125,
.theme-table input.form-control:disabled.mw-125 {
    max-width: 125px !important;
}

.theme-table input.form-control.mw-320,
.theme-table input.form-control[readonly].mw-320,
.theme-table input.form-control:disabled.mw-320 {
    width: 320px;
}


.theme-table input.form-control.mw-95,
.theme-table input.form-control[readonly].mw-95,
.theme-table input.form-control:disabled.mw-95 {
    max-width: 95px !important;
}


.theme-table input.form-control.minw-125,
.theme-table input.form-control[readonly].minw-125,
.theme-table input.form-control:disabled.minw-125 {
    min-width: 100px !important;
	max-width: 125px !important;

}

.table-ic-btn{ width: 22px; height: 22px; background: #F3F5F7; color: #66686C; font-size: 10px; display: inline-flex; align-items: center; justify-content: center; border-radius: 50%; border: none;}
.table-ic-btn img{ transition: all .3s ease-in-out;}
.table-ic-btn:hover{ background: #DB0722; color: #fff;}
.table-ic-btn:hover img{ filter: brightness(0) invert(1);}
.edit-ic-btn:hover{ background: #43BD8D; color: #fff;}
.plus-ic-btn{ background: #161D30; color: #fff;}
.plus-ic-btn:hover{ background: #43BD8D; color: #fff;}

.th_prod_search{ width: 100%; display: block; position: relative;}
.th_prod_search input{ width: 100%; height: 20px; padding: 0 30px 0 12px; font-size: 9px; color: #292C30; border-radius: 50px; border: 1px solid #E1E1E1; background: #fff; box-shadow: none; outline: none;}
.th_prod_search ::placeholder{ opacity: 1; color: #8E9193;}
.th_prod_search button{ display: inline-block; font-size: 10px; color: #8E9193; position: absolute; right: 10px; top: 50%; transform: translateY(-50%); border: none; background: none;}
.th_prod_search button:hover{ color: #43BD8D;}

.theme-total-table > thead > tr > th, .theme-total-table > thead > tr > td{ padding: 9px 15px; font-size: 10px; font-weight: 500; background: #F3F5F7; color: #8E9193; border: none; outline:none !important; box-shadow: none; vertical-align: top; line-height: normal;}
.theme-total-table > thead > tr > th:first-child{ border-radius: 10px 0 0 0;}
.theme-total-table > thead > tr > th:last-child{ border-radius: 0 10px 0 0;}
.theme-total-table > tbody > tr > td{ padding: 15px 15px; font-size: 12px; font-weight: 400; background: #fff; color: #292C30; border: none; border-bottom: 1px solid #F5F5F5 !important; vertical-align: middle; outline:none; box-shadow: none; line-height: normal;}
.theme-total-table > tbody > tr.total-tr > td{ background: #E3F5EE; font-weight: 500;}
.theme-total-table > tbody > tr.total-tr > td:first-child{ border-radius: 0 0 0 10px;}
.theme-total-table > tbody > tr.total-tr > td:last-child{ border-radius: 0 0 10px 0;}

.theme-table-border{ border: 1px solid #E1E1E1; border-radius: 10px;}
.theme-table-border .table{ border: none; margin: 0;}
.theme-table-border .table > thead > tr > th{ border: none !important;}
.theme-table-border .table > thead > tr > th:first-child{ border-radius: 10px 0 0 0;}
.theme-table-border .table > thead > tr > th:last-child{ border-radius: 0 10px 0 0;}
.theme-table-border .table > tbody > tr > td{ border: none !important; border-top: 1px solid #E1E1E1 !important;}
.theme-table-border .table > tbody > tr:last-child > td:first-child{ border-radius: 0 0 0 10px;}
.theme-table-border .table > tbody > tr:last-child > td:last-child{ border-radius: 0 0 10px 0;}

/* nav-tabs-style1 - Tab Component */
.nav-tabs-style1{ margin: 0; padding: 0; border: none;}
.nav-tabs-style1 li{ margin: 0; padding: 0; border: none;}
.nav-tabs-style1 li a{ margin: 0; padding: 9px 20px; border: none; background: none; font-size: 14px; font-weight: 600; color: #292C30; border-radius: 10px 10px 0 0; border: none !important;}
.nav-tabs-style1 li a:hover, .nav-tabs-style1 li a:focus{ color: #43BD8D;}
.nav-tabs-style1 li a.active{ background: #fff; color: #43BD8D;}
.nav-tabs-style1 .nav-item.show .nav-link, .nav-tabs-style1 .nav-link.active{ background: #fff; color: #43BD8D;}
div:not(.responsive-tabs) > .tab-content-style1{ padding: 20px 20px 30px; background: #fff; border-radius: 0 10px 10px 10px;}
.responsive-tabs > .tab-content-style1 .card-body{ padding: 20px 20px 30px; background: #fff; border-radius: 10px;}
.responsive-tabs > .tab-content-style1 .card-body.recipe_save_div{ margin-top: -12px;}
.responsive-tabs > .tab-content-style1 > .card.tab-pane:first-child .card-body{ border-radius: 0 10px 10px 10px;}

.tab-content-style1.bg-white{ border-radius: 0 10px 10px 10px; padding-bottom: 30px;}
.tab-content-style1 .card-body.bg-transparent{ padding-bottom: 0;}

/* Nav tab Responsive CSS */
.responsive-tabs .nav-tabs-style1 { display: none;}
.responsive-tabs .nav-steps { display: none;}
@media (min-width: 768px) {
.responsive-tabs .nav-steps { display: flex;}
.responsive-tabs .nav-tabs-style1 { display: flex;}
.responsive-tabs .card { border: none;}
.responsive-tabs .card .card-header { display: none;}
.responsive-tabs .card .collapse { display: block;}
.accordion.po-accordion .accordion-collapse.collapse:not(.show){ display: none;}
}
@media (max-width: 767px) {
.responsive-tabs > .tab-content > .tab-pane { display: block !important; opacity: 1;	}
.responsive-tabs .tab-content-style1{ background: none; padding: 0;}
.tab-content-style1 > .card.tab-pane{ background: none; margin-bottom: 10px; border-color: #E1E1E1; border-radius: 10px;}
.tab-content-style1 > .card.tab-pane .card-header{ border: none; padding: 0; background: none;}
.tab-content-style1 > .card.tab-pane .card-header a{ padding: 10px 15px; background: #fff; font-size:16px;  color: #43BD8D; border-radius: 10px 10px 0 0; display: flex; width: 100%;}
.tab-content-style1 > .card.tab-pane .card-header a.collapsed{ background: #fff; color: #292C30; border-radius: 10px;}
.tab-content-style1 > .card.tab-pane .card-body{ padding: 10px 15px; background: #fff; border-radius: 0 0 10px 10px; border-top:1px solid #E1E1E1;}
.tab-content-style1 > .card.tab-pane .card-body.mobile-rounded-none{ border-radius: 0; padding-bottom: 20px;}
.tab-content-style1 > .card.tab-pane .card-body + .card-body{ border: none; border-top: 6px solid #F3F5F7; margin-top: 0; padding-top: 20px;}

.responsive-tabs .nav-steps + .tab-content > .card.tab-pane{ background: none; margin-bottom: 10px; border-color: #E1E1E1; border-radius: 10px;}
.responsive-tabs .nav-steps + .tab-content > .card.tab-pane .card-header{ border: none; padding: 0; background: none;}
.responsive-tabs .nav-steps + .tab-content > .card.tab-pane .card-header a{ padding: 10px 25px 10px 15px; background: #fff; font-size:16px;  color: #43BD8D; border-radius: 10px 10px 0 0; display: flex; width: 100%; position: relative;}
.responsive-tabs .nav-steps + .tab-content > .card.tab-pane .card-header a:after{ content: ""; width: 12px; height: 12px; background: url(../images/select_arrow.svg) no-repeat center center; background-size: 100% 100%; position: absolute; right: 10px; top: 50%; transform: translateY(-50%) rotateX(0);}
.responsive-tabs .nav-steps + .tab-content > .card.tab-pane .card-header a:not(.collapsed):after{ transform: translateY(-50%) rotateX(180deg);}
.responsive-tabs .nav-steps + .tab-content > .card.tab-pane .card-header a.collapsed{ background: #fff; color: #292C30; border-radius: 10px;}
.responsive-tabs .nav-steps + .tab-content > .card.tab-pane .card-body{ padding: 10px 15px; background: #fff; border-radius: 0 0 10px 10px; border-top:1px solid #E1E1E1;}
.responsive-tabs .nav-steps + .tab-content > .card.tab-pane .card-body.mobile-rounded-none{ border-radius: 0; padding-bottom: 20px;}
.responsive-tabs .nav-steps + .tab-content > .card.tab-pane .card-body + .card-body{ border: none; border-top: 6px solid #F3F5F7; margin-top: 0; padding-top: 20px;}

.responsive-tabs > .tab-content-style1.bg-white{ background: transparent !important;}
.responsive-tabs > .tab-content-style1.bg-white	> .bg-transparent.card{ background: #fff !important; }
.responsive-tabs > .tab-content-style1.bg-white .card-body.bg-transparent{ background: #fff !important; border-top-right-radius: 0 !important;}
}

/* Nav Tabs Style 2 - Tab Component */
.nav-tabs-style2{ margin: 0; padding: 0 15px; gap: 30px; border: none; border-radius: 0; border-bottom: 1px solid #E1E1E1;}
.nav-tabs-style2 li{ margin: 0 0 -1.5px; padding: 0;}
.nav-tabs-style2 li .nav-link{ margin: 0; padding: 0 5px 11px; font-size: 14px; font-weight: 500; color: #787B7C; position: relative; border: none; border-radius: 0; background: none;}
.nav-tabs-style2 li .nav-link::after{ content: ""; width: 0; height: 3px; background: #43BD8D; border-radius: 5px; opacity: 0; position: absolute; bottom: 0; left: 0; right: 0; margin: 0 auto; transition: all .15s ease-in-out;}
.nav-tabs-style2 .nav-item.show .nav-link::after, .nav-tabs-style2 .nav-link.active::after{ width: 100%; opacity: 1;}
.nav-tabs-style2 .nav-item.show .nav-link, .nav-tabs-style2 .nav-link.active{ color: #292C30;}
.nav-tabs-style2 .nav-link:focus, .nav-tabs-style2 .nav-link:hover{ color: #292C30;}
.card-body.px-0 > .tab-content-style2{ padding: 20px 20px 0 20px;}

.tab-content .card-body ~ .card-body{ margin-top: 10px;}

/* Removebel - Component */
.removebel-block{ padding: 0; border: 1px solid #E1E1E1; background: #FFFFFF; border-radius: 10px;}
.removebel-block .block-head{ padding: 10px 45px 10px 20px; background: #F3F5F7; border-radius: 10px 10px 0 0;	display: flex; justify-content: space-between; gap: 10px; flex-wrap: wrap; align-items: center; position: relative;}
.removebel-block .block-head h5{ margin: 0; font-size: 15px; font-weight: 500;}
.removebel-block .block-head .btn-close{ padding: 0; width: 15px; height: 15px; opacity: 1; background-size: 100% 100%; top: 50%; transform: translateY(-50%); right: 10px;}
.removebel-block .block-body{ padding: 20px;}
.removebel-block .block-body p{ margin-bottom: 20px;}
.removebel-block .block-body p:last-child{ margin-bottom: 0;}

.upload-img-grid{ display: grid; grid-template-columns: repeat(auto-fit, minmax(174px, 174px)); gap: 20px;}
.upload-img-grid .image{ margin: 0; padding: 0; border-radius: 10px; position: relative;}
.upload-img-grid .image > img{ width: 100%; object-fit: cover; border-radius: 10px;}
.upload-img-grid .image.selected{ border: 4px solid #E1E1E1;}
.upload-img-grid .image.selected > img{ border-radius: 7px;}
.upload-img-grid .image .img-action-btn{ position: absolute; top: -8px; right: -8px; box-shadow: 0px 2px 9px 0px #00000040; background: #fff; border-radius: 50%; display: inline-flex; align-items: center; justify-content: center; width: 22px; height: 22px; color: #292C30;}
.upload-img-grid .image .img-action-btn i{ font-size: 13px;}
.upload-img-grid .image .img-action-btn i.fa-pencil{ font-size: 11px;}

/* Added Tag List */
.added-tag-list{ display: flex; flex-wrap: wrap; gap: 5px; margin: 0; padding: 0;}
.added-tag-list li{ margin: 0; padding: 2px 7px; font-size: 12px; font-weight: 400; color: #787B7C; border: 1px solid #E1E1E1; background: #fff; border-radius: 5px; display: inline-flex; align-items: center; gap: 4px; transition: all .15s;}
.added-tag-list li .btn-close{ width: 10px; height: 10px; background-size: 100% 100%; padding: 0; transition: all .15s;}
.added-tag-list li.disabled{ background: #E1E1E1; border-color: #E1E1E1; color: #292C30;}
.added-tag-list li.disabled .btn-close{ opacity: 1;}

.input-group.form-group{ margin-bottom: 6px;border-radius: 50px;overflow: hidden;}

.adjustable-container{ display: flex;}
.divider{ width: 20px; cursor: ew-resize;}
.panel-left{ width: 0%; padding: 0; background: #fff; box-shadow: 0px -2px 30px 0px #0000000D; border-radius: 10px; overflow: auto;}
.panel-head{ padding: 12px 20px; border-bottom: 1px solid #E1E1E1;}
.panel-bdy{ padding: 15px 20px;}
.panel-right { overflow: auto; width: 100%; overflow-x: auto; -webkit-overflow-scrolling: touch;}
.panel-left.partition{ scrollbar-width: thin; -ms-overflow-style: none; scrollbar-color: transparent transparent; overflow: hidden;}
.partition { display: none;}
.zoom-controls{ display: flex; flex-wrap: wrap; gap: 8px; justify-content: center; margin-bottom: 15px;}
.custom-file-upload{ font-size: 14px; border: 1px dashed #00000026; background: #F3F5F7; padding: 50px 20px; text-align: center; border-radius: 10px; margin-bottom: 20px; width: 100%;}
.custom-file-upload .po-split-file-upload{ opacity: 0;}
.custom-file-upload img{ margin-bottom: 15px;}
.custom-file-upload .simple-link{ font-size: 14px;}
.main-div-image-po{ background: #F3F5F7; padding: 15px; width: 100%;}

#accordionPanelsStayOpenExample .accordion-item:last-child{ margin-bottom: 0;}

.upload-img-prew{ width: 40px; height: 40px; display: inline-flex; border-radius: 5px; background: #D9D9D9; position: relative;}
.upload-img-prew img{ width: 100%; height: 100%; object-fit: cover; border-radius: 5px;}
.upld-qty-tag{ width: 18px; height: 18px; background: #F3F5F7; color: #66686C; font-size: 9px; display: inline-flex; align-items: center; justify-content: center; border-radius: 50%; border: 1px solid #E1E1E1; position: absolute; top: -4px; right: -6px;}
.upload-info{ font-size: 9px; color: #8E9193; font-weight: 400; margin-top: 2px;}

/* Modal - Component */
.theme-modal .modal-content{ border: none; box-shadow: 0px 5px 25px 0px #0000000F; border-radius: 10px;}
.theme-modal .modal-header{ border: none; border-bottom: 1px solid #E1E1E1; border-radius: 10px 10px 0 0; padding: 12px 20px;}
.theme-modal .btn-close{ padding: 0; opacity: 1;}
.theme-modal .modal-body{ padding:20px;}
.modal-danger.theme-modal .modal-header{ background: #FBDCDC; border-color: #BB1E1E;}
.modal-danger.theme-modal .modal-header .modal-title{color: #BB1E1E;}

.theme-modal-transfer .theme-table > tbody > tr > td:last-child{ display: flex; gap: 5px;}
.theme-modal-transfer .theme-table > tbody > tr > td:last-child .form-control{ width: 22px; min-width: 22px; height: 22px; border-radius: 25px; padding: 0; display: flex; align-items: center; justify-content: center;}

/* Nav Tabs Style 3 - Tab Component */
.nav-tabs-style3{ padding: 0; gap: 0; border: none; display: inline-flex; background: #F0F2F4; border-radius: 50px; margin:0 0 20px;}
.nav-tabs-style3 li{ margin: 0; padding: 0;}
.nav-tabs-style3 li .nav-link{ margin: 0; padding: 10px 20px; font-size: 12px; font-weight: 400; color: #787B7C; border-radius: 50px; border: 1px solid transparent; background: none;}
.nav-tabs-style3 .nav-item.show .nav-link, .nav-tabs-style3 .nav-link.active{ border-color:#43BD8D; box-shadow: 0px 0px 14px 0px #0000000D; color: #292C30;}
.nav-tabs-style3 .nav-link:focus, .nav-tabs-style3 .nav-link:hover{ color: #292C30;}

/* Stock table group */
.stock_table_group h4{ background: #F3F5F7; margin: 0; padding: 10px; border-bottom: 1px solid #0000001A;}
.stock_table_group .first-table h4{ border-radius:10px 0 0 0;}
.stock_table_group .last-table h4{ border-radius:0 10px 0 0;}
.stock_table_group .first-table .theme-table > thead > tr > th:first-child{ border-radius:0 0 0 10px;}
.stock_table_group .first-table .theme-table > thead > tr > th:last-child{ border-radius:0;}
.stock_table_group .middle-table{ border-left: 1px solid #0000001A; border-right: 1px solid #0000001A;}
.stock_table_group .middle-table .theme-table > thead > tr > th{ border-radius:0;}
.stock_table_group .last-table .theme-table > thead > tr > th:first-child{ border-radius:0;}
.stock_table_group .last-table .theme-table > thead > tr > th:last-child{ border-radius:0 0 10px 0;}

.theme-form-switch{ padding-left: 53px;}
.theme-form-switch .form-check-label{ font-size: 12px; font-weight: 400; color: #292C30;}
.theme-form-switch .form-check-input{ width: 43px; height: 20px; border-radius: 20px; box-shadow: none !important; margin-left: -53px; border-color: #8E9193 !important; background-color: #8E9193; --bs-form-switch-bg: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3e%3ccircle r='3' fill='%23fff'/%3e%3c/svg%3e") !important;}
.theme-form-switch .form-check-input:not(:checked):focus{ -bs-form-switch-bg: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3e%3ccircle r='3' fill='rgba%280, 0, 0, 0.25%29'/%3e%3c/svg%3e");}
.theme-form-switch .form-check-input:checked{ border-color: #109C5B !important; background-color: #109C5B;}
.theme-form-switch .form-check-input:focus, .theme-form-switch .form-check-input:active{ border-color: var(--bs-border-color);}
.theme-form-switch.reverse{ padding-left: 0; padding-right: 53px;}
.theme-form-switch.reverse .form-check-input{ margin-left: 0; margin-right: -53px; float: right;}

/* Krish */
.checkbox .tgl{ display: none;}
.checkbox .tgl + .tgl-btn{ outline: 0; display: block; width: 65px; height: 20px; position: relative; cursor: pointer; user-select: none; font-size: 10px; font-weight: 400; color: #fff;} 
.checkbox .tgl + .tgl-btn:after{ position: relative; display: block; content: ""; width: 16px; height: 16px;}
.checkbox .tgl + .tgl-btn:after{ left: 2px; top: 50%; transform: translateY(-50%);}
.checkbox .tgl + .tgl-btn:before{ display: inline; position: absolute; top: 50%; transform: translateY(-50%);}
.checkbox .tgl:checked + .tgl-btn:after{ left: calc(100% - 18px);}
.checkbox .tgl + .tgl-btn{ background: #DB0722; border-radius: 20px; transition: all 0.4s ease;}
.checkbox .tgl + .tgl-btn:after { border-radius: 20px; background: #fff; transition: left 0.3s cubic-bezier(0.175, 0.885, 0.32, 1.275), padding 0.3s ease, margin 0.3s ease;}
.checkbox .tgl + .tgl-btn:before{ content: "Reduce"; left: 21px; color: #fff; transition: left 0.3s cubic-bezier(0.175,  0.885, 0.32, 1.275);}
.checkbox .tgl + .tgl-btn:active:after{ padding-right: 0.4em;}
.checkbox .tgl:checked + .tgl-btn{ background: #43BD8D;}
.checkbox .tgl:checked + .tgl-btn:active{ box-shadow: inset 0 0 0 30px rgba(0, 0, 0, 0.1);}
.checkbox .tgl:checked + .tgl-btn:before{ content: "Increase"; left: 3px; color: #fff;}
.mb-65{ margin-bottom: 65px;}

.search-group{ width: 100%; display: block; position: relative;}
.search-group > input{ width: 100%; height: 40px; padding: 0 20px 0 41px; font-size: 12px; color: #292C30; border-radius: 50px; border: 1px solid #E1E1E1; background: #fff; box-shadow: none; outline: none;}
.search-group .form-control:focus{ border: 1px solid #E1E1E1; background: #fff; box-shadow: none; outline: none; color: #292C30;}
.search-group ::placeholder{ opacity: 1; color: #292C30;}
.search-group button{ display: inline-block; font-size: 16px; color: #292C30; position: absolute; left: 20px; top: 50%; transform: translateY(-50%); border: none; background: none;}
.search-group button:hover{ color: #43BD8D;}

.search-group.sm input{ height: 27px; font-size: 10px; padding: 0 37px 0 29px;}
.search-group.sm button{ font-size: 12px; left: 11px;} 

.table-cap-search{ min-width: 257px;}

.theme-table input.form-control.mw-144{ 
	max-width: 144px;
	min-width: 144px;
}

.email-container{ display: flex; border: 1px solid #E1E1E1; border-radius: 50px; padding: 0; height: 40px;}
.email-container .email-list { display: flex; align-items: center; flex-wrap: wrap; gap: 5px; padding: 5px 5px 5px 20px; flex-grow: 1;}
.email-list{ margin-bottom: 10px;}
.email-container .email-item { background-color: #E1E1E1; padding: 2px 7px; border-radius: 5px; display: flex; align-items: center; font-size: 12px; color: #292C30;}
.email-container .email-item button { background: none; border: none; margin-left: 4px; cursor: pointer; color: #292C30; font-size: 20px;line-height: 10px;position: relative;top: -1px;}
.email-container .btn { border: none; border-radius: 0 50px 50px 0; cursor: pointer;}

.form-group .select2-container--default .select2-selection--multiple{ padding: 3px 20px 7px 20px; border: 1px solid #E1E1E1; border-radius: 50px;}
.form-group .select2-container--default .select2-selection--multiple .select2-selection__choice{ border: none; background: #E1E1E1; display: inline-flex; padding: 2px 3px; flex-direction: row-reverse;}
.form-group .select2-container--default .select2-selection--multiple .select2-selection__choice__remove{ font-weight: 400; color: #292C30; border: none; line-height: normal; position: relative;}
.form-group .select2-container--default .select2-selection--multiple .select2-selection__choice__display{ font-size: 12px; padding-right: 0;}

.progress_info{ margin: 0 0 6px; display: flex; flex-direction: column;}
.progress_info span{ font-size: 10px; font-weight: 400; color: #292C30; line-height: normal;}
.progress_info span b{ font-weight: 500;}
.progress_info .progress_in{ display: grid; grid-template-columns: 1fr 45px; gap: 10px; align-items: center;}
.progress, .progress-stacked{ background-color: #F1F1F1;}
.progress-bar{ background-color: #43BD8D;}

.ic-radio_btn_group.radio_btn_group .form-check-label{ padding: 3px 6px; border-radius: 13px;}
.stock_chart_info{ margin: 0; display: flex;}

.exp_right{ position: absolute; top: 12px; right: 20px; display: inline-flex; gap: 10px;}
.exp_right .search-group{ width: 100%; max-width: 257px;}
.exp_right .search-group .form-control{ height: 28px; font-size: 10px; padding: 0 50px 0 30px;}
.exp_right .search-group button{ font-size: 11px; left: 15px; color: #8E9193;}
.exp_right .btn{ padding: 5px 15px;}

.dot{ width: 8px; height: 8px; border-radius: 8px; display: inline-block;}
.dot.primary{ background: #27A950;}
.dot.secondary{ background: #D9A92F;}

/* data table css */
.dt-search .dt-input {
    padding-left: 30px !important; /* Space for the icon */
    background: url("../../admin_assets/images/search.svg") no-repeat left 10px center !important;
    background-size: 16px !important;
	min-width: 210px !important;
}


/*========================
				Login Page
========================*/
.login_page {
	background: #F3F5F7;
}
html,
body {
	min-height: 100vh;
}

.login_page .wrapper {
	min-height: 100vh;
	display: flex;
	padding: 0;
}

.login_form {
	width: 100%;
	margin: 0;
	padding: 0;
	display: flex;
	flex-direction: column;
}
.login_form figure {
	margin: 0;
	padding: 40px 30px;
	display: flex;
	align-items: center;
	justify-content: center;
	text-align: center;
	background: #fff url(../images/login_image.jpg) no-repeat center center;
	background-size: cover;
	height: 100%;
}

.login_in {
	margin: 0 auto;
	padding: 30px;
	width: 100%;
	max-width: 460px;
}
.login_form h2 {
	margin: 0 0 30px 0;
	padding: 0;
	font-weight: 600;
	font-size: 40px;
	color: #292C30;
	letter-spacing: 5%;
}
.login_form form {
	margin: 0;
	padding: 0;
}
.form-group-ic i {
	position: absolute;
	top: 17px;
	left: 20px;
}

/* Custom Checkbox */
.lr-checkbox {
	margin: 0 0 15px 0;
	padding: 0 0 0 25px;
}
.lr-checkbox .form-check-label {
	color: #0f111d;
	font-weight: 300;
	font-size: 16px;
}
.lr-checkbox .form-check-input {
	border-radius: 0;
	border-color: #0f111d;
	left: 0;
	box-shadow: none !important;
}
.lr-checkbox .form-check-input:checked {
	background-color: #00aced;
	border-color: #00aced;
}

.forgot_link {
	margin: -5px 0 7px;
	padding: 0;
	font-weight: 400;
	font-size: 11px;
	color: #62c29b;
	float: right;
	text-decoration-line: underline;
}

.forgot_link:hover {
	color: #69D5AA;
}

.button-group {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 10px;
}

.signup_btn {
	width: 100%;
	margin: 0;
	padding: 0 20px;
	height: 60px;
	background: linear-gradient(260.02deg, #517aa6, #62c29b, #517aa6, #62c29b);
	border-radius: 5px;
	font-weight: 600;
	font-size: 18px;
	line-height: 22px;
	text-align: center;
	letter-spacing: 0.02em;
	color: #ffffff;
	border: none;
	background-size: 300% 100%;
}
.signup_btn:hover {
	background-position: 50% 100%;
	color: #fff;
}

.login_form .btn svg{ width: 18px; height: 18px;}
.login_form .form-floating > .form-control-plaintext ~ label::after, .login_form .form-floating > .form-control:focus ~ label::after, .login_form .form-floating > .form-control:not(:placeholder-shown) ~ label::after, .login_form .form-floating > .form-select ~ label::after{ background: #F3F5F7;}

.form-floating.with-ic{ position: relative;}
.form-floating.with-ic:not(.ic-rtl) .form-control{ padding-left: 41px !important;}
.form-floating.with-ic .ic{ position: absolute; top: 12px; left: 20px;}
.form-floating.with-ic.ic-rtl .form-control{ padding-right: 41px !important;}
.form-floating.with-ic.ic-rtl .ic{ left: auto; right: 20px;}
.po_tbody{
	height:100px;
}

.error-msg-recipe-td{
	display:flex !important;flex-direction: column-reverse!important;text-align: center !important;
}

/*----------------------- 24-April-25  */
.theme-badge.no-dot::before{ display: none;}
.inline-badge{ margin-right: 10px;}
.white_block_body{ padding: 0 20px 4px;}
.body_title{ padding: 13px 20px 16px;}

.blog_item{ margin: 0 0 20px; display: flex; padding: 20px; background: #fff; border-radius: 10px; gap: 20px;}
.blog_item figure{ width: 140px; min-width: 140px; margin: 0; border-radius: 10px; display: flex; position: relative; overflow: hidden;}
.blog_item figure a{ display: flex; width: 100%;}
.blog_item figure img{ width: 100%; border-radius: 10px; object-fit: cover; transition: all .9s;}
.blog_item:hover figure img{ transform: scale(1.1);}
.blog_item figure .play_link{ height: 100%; position: absolute; top: 0; left: 0; border-radius: 10px; background: rgba(0, 0, 0, 0.3); align-items: center; justify-content: center;}
.blog_item figure .play_link i{ width: 35px; height: 35px; border-radius: 50%; background: #fff; display: flex; align-items: center; justify-content: center; padding-left: 3px;}
.blog_item .detail{ align-self: center; flex-grow: 1; display: flex; align-items: center; justify-content: space-between; gap: 10px; flex-wrap: wrap;}
.blog_item .left_part{ flex-grow: 1;}
.blog_item .date{ margin: 0; display: inline-flex; align-items: center; gap: 5px; font-size: 12px;}
.blog_item h5{ margin: 9px 0 0; }
.blog_item h5 a{ color: #292C30;}
.blog_item:hover h5 a{ color: #43BD8D;}
.blog_item p{ margin: 4px 0 0; color: #787B7C;}

.step_updates{ margin: 0; padding: 0;}
.step_updates li{ margin: 0; padding: 0 0 30px 50px; display: block; position: relative;}
.step_updates li:not(:last-child):before{ content: ""; width: 1px; height: 100%; background: #E1E1E1; position: absolute; top: 33px; left: 17px;}
.step_updates li::after{ content: ""; width: 35px; height: 35px; background: #fff url(../images/announce-ic.svg) no-repeat center center; border: 1px solid #E1E1E1; position: absolute; top: 0; left: 0; border-radius: 50%;}
.step_updates li .time{ margin: 0; display: inline-flex; align-items: center; gap: 5px; font-size: 12px;}
.step_updates li .author{ margin: 0; font-size: 12px; color: #787B7C;}
.step_updates li h5{ margin: 11px 0 0;}
.step_updates li p{ margin: 4px 0 0; line-height: 20px; color: #787B7C;}

.dashboard-table-res{
	height: 250px;
	overflow-y: auto;
	width: 100%;
}

.dashboard-table-res thead{
	position: sticky;
	top:0;
}

.report-table-res{
	height: auto;
	max-height: 65vh;
	overflow-y: auto;
	width: 100%;
}

.report-table-res thead{
	position: sticky;
	top:0;
}

.report-table-res tfoot {
    position: sticky;
    bottom: 0;
    background: #fff;   /* to avoid overlapping rows text */
    z-index: 2;         /* keep it above table body rows */
}

.progress-mscroll{
	height: 250px;
}

/* Loader */
#loading_loader {
position: fixed;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
font-family: sans-serif;
font-size: 30px;
font-weight: bold;
color: #333;
text-align: center;
/* display: none; */
white-space: nowrap;
z-index: 10;
}

#loading_loader span {
animation: blink 1.4s infinite;
display: inline-block;
}

#loading_loader span:nth-child(2) {
animation-delay: 0.2s;
}
#loading_loader span:nth-child(3) {
animation-delay: 0.4s;
}

@keyframes blink {
0%   { opacity: 0; }
20%  { opacity: 1; }
100% { opacity: 0; }
}

/* bulk import product/quick edit style(datatable column) */
.dt-button-collection {
    padding: 10px;
    background: #fff;
    border: 1px solid #ccc;
    width: auto;
    min-width: 200px;
	position: 'absolute';
	right: 0;
	margin-top: 0 !important;
	z-index: 1000 !important;
}

.dt-button-collection .dt-button {
    display: flex;
    align-items: center;
    padding: 6px 10px;
    width: 100%;
    border: none;
    background: transparent;
    text-align: left;
    font-size: 14px;
    white-space: normal;
}

.dt-button-collection .dt-button span {
    margin-left: 6px;
    white-space: normal;
}
.table.dataTable.productquickedit thead>tr>th.dt-ordering-asc span.dt-column-order{
	display: none !important; /* for checkbox not proper show,that's why we hide on first column(productquickedit) */
}

/* Show tick only when checkbox is checked */

/* Highlight active column buttons with blue background */
.dt-button-collection .dt-button.active {
    background-color: #007bff !important;  /* Bootstrap primary blue */
    color: white !important;
    font-weight: bold;
    border-radius: 5px;
}

/* Optional: change checkbox appearance inside */
.dt-button-collection .dt-button input[type="checkbox"] {
    accent-color: #43BD8D;  /* Blue tick */
    cursor: pointer;
    width: 16px;
    height: 16px;
    margin-right: 8px;
}

.dt-button-collection .dt-button.dt-button-active {
    /* background-color: #007bff !important; */
    color: black !important;
    font-weight: bold;
    border-radius: 5px;
}

/* Checked state styling */
.dt-button-collection .dt-button.active input[type="checkbox"] {
    accent-color: #007bff; /* blue tick inside checkbox */
}


.dt-colvis-checkbox:checked::before {
    /* content: '✓'; */
    display: inline-block;
    width: 20px;
    color: green;
    font-weight: bold;
    position: relative;
    left: -20px; /* Move it into view */
}


th.no-sort::after {
    display: none !important;
}

.form-check-input:checked {
    background-color: #43BD8D;
    border-color: #43BD8D;
}

.checkbox-50{
	width: 56px !important;
	height: 25px;
}

#transactionsTable {
	table-layout: auto; /* Allow dynamic sizing with min-width */
}


th.no-sort::after,
th.no-sort::before {
    display: none !important;
    content: none !important;
}

/* Hide DataTables column visibility toggle elements */
.dt-hidden-colvis { display: none !important;}
	

/* Hidden column styling */
.hidden-column {
	display: none;
}	

#columnToggleButton::after {
	display: none;
}

/* Column resizing styles */
.resize-table-container {
	position: relative;
	overflow-x: auto;
}

.resize-table-container table th {
	position: relative;
	overflow: hidden;
	white-space: nowrap;
}

.resize-table-container .resize-handle {
	position: absolute;
	top: 0;
	right: 0;
	width: 8px;
	height: 100%;   
	cursor: col-resize;
	z-index: 1;
}

.resize-table-container .resize-handle:hover,
.resize-table-container .resize-handle.active {
	background-color: #dee2e6;
}

.resize-table-container .resize-handle::after {
	content: "";
	position: absolute;
	top: 0;
	right: 3px;
	height: 100%;
	border-right: 1px solid #adb5bd;
}


.form-check-input:checked {
    background-color: #43BD8D;
    border-color: #43BD8D;
}

.checkbox-50{
	width: 56px !important;
	height: 25px;
}

#product_bulk_update_modal .select2-container {
	z-index: 9999 !important; /* higher than modal */
}

.dt-hidden-colvis {
    display: none !important;
}
/* transfer IN/OUT  */
#transfer_tbody > tr > td > select.select-w150 {
    width: 150px;
}


/* 9-Mon */
.btn.bordered.white{ background: #fff; border-color: #E1E1E1 !important;}
.btn.bordered.white:hover, .btn.bordered.white.active{ background: #fff; border-color: #43BD8D !important; color: #43BD8D;}
.btn.bordered.white .count{ width: 20px; height: 20px; background: #F3F5F7; border-radius: 50%; display: inline-flex; justify-content: center; align-items: center;}

.btn.danger.bordered{ background: transparent; border-color: #DB0722 !important; color: #DB0722;}
.btn.danger.bordered:hover{ background: #DB0722; border-color: #DB0722 !important; color: #fff;}

.btn.success.bordered {
    background: transparent;
    border-color: #1dcf2a !important;
    color: #1dcf2a;
}

.btn.success.bordered:hover {
    background: #1dcf2a;
    border-color: #1dcf2a !important;
    color: #fff;
}

.users-offcanvas.offcanvas{ width: 530px; border: none !important;}
.users-offcanvas .btn-close{ padding: 0; margin: 0; position: absolute; top: 10px; right: 10px;}
.users-offcanvas .offcanvas-body{ padding: 0;}
.cnvs-usrinfo{ padding: 25px 50px 20px 20px; display: flex; gap: 20px; justify-content: space-between;}
.cnvs-usrinfo label{ display: block; margin-bottom: 4px; font-weight: 500; font-size: 14px; color: #787B7C;}
.cnvs-usrinfo span{ display: block; font-weight: 400; font-size: 14px; color: #292C30;}
.siteapp-tabs{ margin: 0; padding: 14px 20px 0; border-top: 1px solid #E1E1E1; border-bottom: 1px solid #E1E1E1; gap: 30px;}
.siteapp-tabs .nav-link{ padding: 0 0 6px; font-size: 14px; font-weight: 600; color: #292C30; border: none; border-radius: 0; border-bottom: 2px solid transparent; margin-bottom: -1px;}
.siteapp-tabs .nav-link.active{ border-color: #43BD8D;}
.siteapp-content{ padding: 26px 20px 20px;}
.site-accordion .accordion-item:first-child{ padding-top: 0;}
.site-accordion .accordion-item{ border: none; border-bottom: 1px solid #E1E1E1; border-radius: 0; padding: 20px 0;}
.site-accordion .accordion-header{ display: flex; gap: 8px; align-items: center;}
.site-accordion .accordion-button{ flex-grow: 1; padding: 0; background: none; border: none; box-shadow: none; font-size: 14px; font-weight: 500; color: #292C30;}
.site-accordion .accordion-button::after{ width: 14px; height: 10px; background-size: 100% auto;}
.site-accordion .accordion-header .theme-form-check{ margin-bottom: 0;}
.site-accordion .accordion-body{ padding: 0;}
.site-accordion ul{ margin: 0; padding: 0 0 0 26px;}
.site-accordion ul li{ margin: 15px 0 0; padding: 0;}
.site-accordion ul li .form-check-label{ color: #787B7C; font-size: 14px; font-weight: 500;} 
.site-accordion ul li ul li{ margin: 12px 0 0;}
.site-accordion ul li ul li .form-check-label{ color: #292C30; font-weight: 400;}
.siteapp-content .btn_group{ margin-top: 60px; justify-content: center;}
.siteapp-content .btn_group.flex .btn{ flex: 1 0 0;}
.siteapp-content .theme-table > thead > tr > th, .siteapp-content .theme-table > thead > tr > td{ font-size: 13px; font-weight: 500; color: #787B7C; vertical-align: middle; padding-top: 6px; padding-bottom: 6px;}
.siteapp-content .theme-table > tbody > tr > td{ font-size: 14px;}
.siteapp-content .theme-table .form-group select.form-control{ padding-right: 20px; background-position: center right 7px; min-width: 140px;}
.siteapp-content .theme-table .primary-txt{ white-space: nowrap;}
.siteapp-content .btn{ min-width: 150px;}

.offcanvas.sub-opened{ transform: translateX(-460px); visibility: visible;}
.offcanvas-backdrop { pointer-events: auto !important;}

.shwdtldd-offcanvas.offcanvas{ width: 460px; background: #F3F5F7; border: none !important;}
.shwdtldd-offcanvas .offcanvas-header{ padding: 49px 20px 23px; position: relative; border-bottom: 1px solid #E1E1E1;}
.shwdtldd-offcanvas .offcanvas-header .btn-close{ padding: 0; margin: 0; position: absolute; top: 10px; right: 10px;}
.shwdtldd-offcanvas .offcanvas-body{ padding: 15px 20px;}

.approle-accordion .accordion-item{ border: 1px solid #E1E1E1; background: white; border-radius: 10px; padding: 0; margin-bottom: 10px;}
.approle-accordion .accordion-button{ flex-grow: 1; padding: 10px 15px; background: none; border: none; box-shadow: none; font-size: 14px; font-weight: 500; color: #292C30;}
.approle-accordion .accordion-button span{ width: 25px; height: 25px; border-radius: 50%; display: inline-flex; align-items: center; justify-content: center; background: #43BD8D; font-size: 12px; color: #FFFFFF; font-weight: 500; margin-left: 5px;}
.approle-accordion .accordion-button:not(.collapsed){ color: #43BD8D;}
.approle-accordion .accordion-button::after{ width: 14px; height: 10px; background-size: 100% auto;}
.approle-accordion .accordion-body{ padding: 0 15px 7px;}
.approle-accordion .form-check{ margin-bottom: 10px;}
.approle-accordion .form-check-label{ font-size: 14px !important;}

@media (max-width: 599px) {
	.cnvs-usrinfo { padding: 40px 15px 20px 15px;}
	.siteapp-content .btn_group{ margin-top: 30px;}
	.shwdtldd-offcanvas .offcanvas-header{ padding: 30px 20px 20px;}
}

.form-check-input:checked {
    background-color: #43BD8D;
    border-color: #43BD8D;
}

.checkbox-50{
	width: 56px !important;
	height: 25px;
}

#product_bulk_update_modal .select2-container {
	z-index: 9999 !important; /* higher than modal */
}

.dt-hidden-colvis {
    display: none !important;
}


/* Hidden column styling */
.hidden-column {
	display: none;
}	

#columnToggleButton::after {
	display: none;
}

/* Column resizing styles */
.resize-table-container {
	position: relative;
	overflow-x: auto;
}

.resize-table-container table th {
	position: relative;
	overflow: hidden;
	white-space: nowrap;
}

.resize-table-container .resize-handle {
	position: absolute;
	top: 0;
	right: 0;
	width: 8px;
	height: 100%;   
	cursor: col-resize;
	z-index: 1;
}

.resize-table-container .resize-handle:hover,
.resize-table-container .resize-handle.active {
	background-color: #dee2e6;
}

.resize-table-container .resize-handle::after {
	content: "";
	position: absolute;
	top: 0;
	right: 3px;
	height: 100%;
	border-right: 1px solid #adb5bd;
}

/* 26-7-25 */
.report_accordion .accordion-item{ margin-bottom: 15px; border: 1px solid #E1E1E1; border-radius: 10px;}
.report_accordion .accordion-item.favorite-item{ background: #E3F5EE;}
.report_accordion .accordion-button{ background: none; border: none; padding: 15px 20px; font-size: 16px; font-weight: 600; color: #292C30; box-shadow: none !important;}
.report_accordion .accordion-button::after { background-size: 17px; filter: brightness(0) invert(0);}
.report_accordion .accordion-body{ padding: 10px 10px 20px; border-top: 1px solid #E1E1E1; background: #fff; border-radius: 0 0 10px 10px;}
.report_lists{ margin: 0; padding: 0; display: grid; grid-template-columns: repeat(2, 1fr); gap:0 50px;}
.report_lists li{ margin: 0; padding: 10px; border-bottom: 1px solid #F5F5F5; font-size: 12px; color: #292C30; font-weight: 400; display: flex; gap: 10px; align-items: center; justify-content: space-between;}
.report_lists li a{ color: #292C30;}
.report_lists li .star-btn{ width: 14px; height: 14px; min-width: 14px; display: flex; cursor: pointer;}
.report_lists li a:hover{ color: #43BD8D;}

.star-btn .star_fill{ display: none;}
.star-btn.active .star_fill{ display: block;}
.star-btn.active .star_stroke{ display: none;}

/* 08-08-25 */
.beta-dot {
    width: 10px;
    height: 10px;
    background-color: red;
    border-radius: 50%;
    display: inline-block;
    animation: pulse 1.5s infinite;
}

@keyframes pulse {
    0% { transform: scale(1); opacity: 1; }
    50% { transform: scale(1.4); opacity: 0.5; }
    100% { transform: scale(1); opacity: 1; }
}

@keyframes fadeIn {
    from { opacity: 0; transform: translateY(-5px); }
    to { opacity: 1; transform: translateY(0); }
}
/* 12-08-25 */
.theme-table td .select2-container{ width: 100% !important;}
.select2-container .select2-selection--single{ display: flex; align-items: center; padding-right: 35px; flex-direction: row-reverse; justify-content: space-between;}
.select2-container--default .select2-selection--single .select2-selection__clear{ font-weight: 300; height: auto; margin: 0 0 0 auto; padding: 0 0 0 5px; font-size: 18px; line-height: 14px;}
.select2-container .select2-selection--single .select2-selection__rendered{ text-align: left;}

.search-container{ position: relative;}
.search-container .datatable-filter-btn{ position: absolute; right: 10px; top: 50%; transform: translateY(-50%);}
.search-container .form-control{ font-size: 12px; padding: 0 40px 0 30px; font-weight: 500; border: 1px solid #E1E1E1; background: #fff; height: 27px; border-radius: 50px; box-shadow: none; outline: none; width: 100%;}
.search-container button{ position: absolute; left: 10px; top: 50%; transform: translateY(-50%); background: none; border: none;}
.col-auto .split_select{ margin: 0; position: relative; right: 0; top: 0; z-index: 55;}
.pomain-datatable{ height: calc(100vh - 206px); display: flex; flex-direction: column;}


/* Selected date background just color change */
.daterangepicker td.active, 
.daterangepicker td.active:hover {
    background-color: #43bd8d !important; /* Green */
    border-color: #28a745 !important;
    color: #fff !important;
}

/* Range highlight */
.daterangepicker td.in-range {
    background-color: #d4edda !important; /* Light green */
    color: #000 !important;
}

/* Hover on dates */
.daterangepicker td.available:hover {
    background-color: #c3e6cb !important;
    color: #000 !important;
}

/* Preset ranges highlight (left menu) */
.daterangepicker .ranges li.active {
    background-color: #43bd8d !important; /* Green */
    border-color: #28a745 !important;
    color: #fff !important;
}

.daterangepicker .cancelBtn {
    border-radius: 25px !important;
	background: #292C30; border-color: #292C30 !important; color: #fff;
}

.daterangepicker .applyBtn {
    border-radius: 25px !important;
    background: #43BD8D; border-color: #43BD8D !important; color: #fff;
}


/* Rounded corners for daterangepicker popup just ui change	 */
.daterangepicker {
    border-radius: 10px !important;
    overflow: hidden; /* keep inner parts aligned */
}

/* Rounded edges for range menu items */
.daterangepicker .ranges li {
    border-radius: 6px !important;
    margin: 2px 0;
    padding: 6px 10px;
}


.vdots-dropdown .dropdown-menu{ position:fixed !important; top:unset; right:unset; bottom:unset; left:unset; z-index:55; margin-left:-100px !important;}
/* 25-08-2025 */

.dot-loader {
    display: flex;
    gap: 10px;
}
.dot-loader span {
    display: block;
    width: 18px;
    height: 18px;
    background: #43BD8D;
    border-radius: 50%;
    opacity: 0.7;
    animation: dotFlashing 1s infinite linear alternate;
}
.dot-loader span:nth-child(2) {
    animation-delay: 0.3s;
}
.dot-loader span:nth-child(3) {
    animation-delay: 0.6s;
}
@keyframes dotFlashing {
    0% { opacity: 0.2; }
    50%,
    100% { opacity: 1; }
}

/* #invoice_delivery_table_div table tbody {
    max-height: 500px;
    overflow-y: auto;
} */
.theme-table > tbody > tr.new-row > td{
	background: rgba(67, 189, 141, 0.15);
}

.table-fixed-header {
  width: 100%;
  border-collapse: collapse;
}
 
.table-fixed-header thead,
.table-fixed-header tbody tr {
  display: table;
  width: 100%;
  table-layout: fixed; /* ensures alignment */
}
 
.table-fixed-header thead {
  width: calc(100% - 0.9em); /* compensate for scrollbar width */
}
 
.table-fixed-header tbody {
  display: block;
  max-height: 400px;  /* 👈 scroll area */
  overflow-y: auto;
}
 
#invoice_delivery_table_div {
    max-height: 400px;
    overflow-y: auto;
}
.table-purchase-order thead.table-head-fixed {
    position: sticky;
    top: 0;
}
.product-input {
    width: 160px !important;
    min-width: 160px !important;
}