/*
 * legacy-helpers.css
 *
 * Selectors extracted from the old Greeva BS4 theme.css that are
 * still used by the app but missing from app.min.css (BS5 Greeva).
 *
 * Each selector was verified as live by repo-wide grep.
 * Remove entries as pages are updated to no longer need them.
 */

/* --- Profile Dropdown (Layout topbar) --- */

.notification-list .profile-dropdown .notify-item {
	padding: 7px 20px;
}

.profile-dropdown {
	width: 170px;
}

.profile-dropdown i {
	vertical-align: middle;
	margin-right: 5px;
}

.profile-dropdown span {
	vertical-align: middle;
}

/* --- Page Title (DefaultLayout.tsx) --- */

.page-title-alt-bg {
	position: absolute;
	left: 0;
	right: 0;
	height: 30px;
	background-color: #00469b !important; /* override app.min.css #343b4a */
}

/* --- Animated Dropdown (Layout topbar) --- */

.dropdown-menu-animated {
	display: block;
	visibility: hidden;
	opacity: 0;
	-webkit-transition: all 300ms ease;
	transition: all 300ms ease;
	margin-top: 20px !important;
}

.show > .dropdown-menu {
	visibility: visible;
	opacity: 1;
	margin-top: 0 !important;
}

/* --- Account / Login Pages --- */

.bg-account-pages {
	background-image: url("../images/bg-pattern.png");
	background-color: #00469b;
	background-size: cover;
	padding-bottom: 0;
	min-height: 100px;
}

.wrapper-page {
	display: table;
	height: 100vh;
	width: 100%;
}

.account-pages {
	display: table-cell;
	vertical-align: middle;
}

.account-box {
	position: relative;
	max-width: 460px;
	margin: 20px auto;
	background-color: #fff;
	border-radius: 5px;
	-webkit-box-shadow: 0 0 45px 0 rgba(0, 0, 0, 0.12);
	box-shadow: 0 0 45px 0 rgba(0, 0, 0, 0.12);
}

.account-box .account-content {
	padding: 30px;
}

.account-box .account-btn {
	position: absolute;
	left: 0;
	right: 0;
}

.account-logo-box {
	padding: 30px 30px 0 30px;
}

/* --- Datepicker --- */

.datepicker-dropdown {
	padding: 10px !important;
}

.datepicker > div {
	display: inherit;
}

.datepicker td,
.datepicker th {
	width: 30px;
	height: 30px;
}

.datepicker table tr td.active:hover,
.datepicker table tr td.active:hover:hover,
.datepicker table tr td.active.disabled:hover,
.datepicker table tr td.active.disabled:hover:hover,
.datepicker table tr td.active:active,
.datepicker table tr td.active:hover:active,
.datepicker table tr td.active.disabled:active,
.datepicker table tr td.active.disabled:hover:active,
.datepicker table tr td.active.active,
.datepicker table tr td.active:hover.active,
.datepicker table tr td.active.disabled.active,
.datepicker table tr td.active.disabled:hover.active,
.datepicker table tr td.active.disabled,
.datepicker table tr td.active:hover.disabled,
.datepicker table tr td.active.disabled.disabled,
.datepicker table tr td.active.disabled:hover.disabled,
.datepicker table tr td.active[disabled],
.datepicker table tr td.active:hover[disabled],
.datepicker table tr td.active.disabled[disabled],
.datepicker table tr td.active.disabled:hover[disabled],
.datepicker table tr td.selected,
.datepicker table tr td.selected:hover,
.datepicker table tr td.selected.disabled,
.datepicker table tr td.selected.disabled:hover {
	background-color: #188ae2 !important;
	color: #fff !important;
	background-image: none !important;
	text-shadow: none !important;
}

.datepicker table tr td.today,
.datepicker table tr td.today:hover,
.datepicker table tr td.today.disabled,
.datepicker table tr td.today.disabled:hover {
	background-color: #188ae2 !important;
	color: #fff !important;
	background-image: none !important;
}

.datepicker-inline {
	border: 2px solid #e3eaef;
	width: 100%;
}

.datepicker-inline table {
	width: 100%;
}

.datepicker .datepicker-switch:hover,
.datepicker .next:hover,
.datepicker .prev:hover,
.datepicker tfoot tr th:hover,
.datepicker table tr td.day.focused,
.datepicker table tr td.day:hover {
	background: #f3f6f8;
}

/* --- Helper Classes (no source in theme.css — defined here) --- */

.waves-effect {
	position: relative;
	overflow: hidden;
}

.w-xs {
	min-width: 80px;
}

.font-13 {
	font-size: 13px !important;
}

.m-b-30 {
	margin-bottom: 30px !important;
}

.m-t-0 {
	margin-top: 0 !important;
}

.m-b-0 {
	margin-bottom: 0 !important;
}

.m-l-5 {
	margin-left: 5px !important;
}

/* =====================================================================
   Sidebar / Navigation — extracted from old Greeva BS4 theme.css
   (lines 10158-10639). These styles drive #topnav, .navigation-menu,
   .submenu, and .navbar-custom which are NOT present in app.min.css.
   ===================================================================== */

#topnav {
	background: #00469b;
	position: fixed;
	left: 0;
	right: 0;
	z-index: 1001;
}

	#topnav .has-submenu.active a {
		color: #fff;
	}

		#topnav .has-submenu.active a i {
			color: #fff;
		}

	#topnav .has-submenu.active .submenu li.active > a {
		color: #188ae2;
	}

	#topnav .navbar-toggle {
		border: 0;
		position: relative;
		padding: 0;
		margin: 0;
		cursor: pointer;
	}

		#topnav .navbar-toggle:hover, #topnav .navbar-toggle:focus {
			background-color: transparent;
		}

			#topnav .navbar-toggle:hover span, #topnav .navbar-toggle:focus span {
				background-color: #fff;
			}

		#topnav .navbar-toggle .lines {
			width: 25px;
			display: block;
			position: relative;
			margin: 15px 10px 0 0;
			padding-top: 13px;
			height: 44px;
			-webkit-transition: all .5s ease;
			transition: all .5s ease;
		}

		#topnav .navbar-toggle span {
			height: 2px;
			width: 100%;
			background-color: rgba(255, 255, 255, 0.8);
			display: block;
			margin-bottom: 5px;
			-webkit-transition: -webkit-transform .5s ease;
			transition: -webkit-transform .5s ease;
			transition: transform .5s ease;
			transition: transform .5s ease, -webkit-transform .5s ease;
		}

		#topnav .navbar-toggle.open span {
			position: absolute;
		}

			#topnav .navbar-toggle.open span:first-child {
				top: 18px;
				-webkit-transform: rotate(45deg);
				transform: rotate(45deg);
			}

			#topnav .navbar-toggle.open span:nth-child(2) {
				visibility: hidden;
			}

			#topnav .navbar-toggle.open span:last-child {
				width: 100%;
				top: 18px;
				-webkit-transform: rotate(-45deg);
				transform: rotate(-45deg);
			}

	#topnav .navigation-menu {
		list-style: none;
		margin: 0;
		padding: 0;
	}

		#topnav .navigation-menu > li {
			float: left;
			position: relative;
		}

			#topnav .navigation-menu > li > a {
				display: block;
				color: rgba(255, 255, 255, 0.7);
				font-size: 15px;
				-webkit-transition: color .5s ease, background-color .5s ease;
				transition: color .5s ease, background-color .5s ease;
				line-height: 20px;
				padding-left: 25px;
				padding-right: 25px;
			}

				#topnav .navigation-menu > li > a i {
					font-size: 15px;
					margin-right: 8px;
					-webkit-transition: color .5s ease;
					transition: color .5s ease;
				}

				#topnav .navigation-menu > li > a:hover,
				#topnav .navigation-menu > li > a:focus {
					background-color: transparent;
				}

/* Responsive Menu — Desktop (>= 992px) */
@media (min-width: 992px) {
	#topnav .navigation-menu > li > a {
		padding-top: 20px;
		padding-bottom: 20px;
	}

		#topnav .navigation-menu > li > a:hover,
		#topnav .navigation-menu > li > a:focus,
		#topnav .navigation-menu > li > a:active {
			color: #fff;
		}

	#topnav .topbar-menu {
		padding-bottom: 10px;
	}

	#topnav .navigation-menu > li:first-of-type > a {
		padding-left: 0;
	}

	#topnav .navigation-menu > li.last-elements .submenu {
		left: auto;
		right: 0;
	}

		#topnav .navigation-menu > li.last-elements .submenu > li.has-submenu .submenu {
			left: auto;
			right: 100%;
			margin-left: 0;
			margin-right: 10px;
		}

	#topnav .navigation-menu > li:hover a {
		color: #fff;
	}

		#topnav .navigation-menu > li:hover a i {
			color: #fff;
		}

	#topnav .navigation-menu > li > ul > li.has-submenu:active > a,
	#topnav .navigation-menu > li > ul > li.has-submenu:hover > a {
		color: #188ae2;
	}

	#topnav .navigation-menu > li .submenu {
		position: absolute;
		top: 100%;
		left: 0;
		z-index: 1000;
		padding: 10px 0;
		list-style: none;
		min-width: 200px;
		text-align: left;
		visibility: hidden;
		opacity: 0;
		margin-top: 10px;
		border-radius: 4px;
		-webkit-transition: all .2s ease;
		transition: all .2s ease;
		background-color: #fff;
		-webkit-box-shadow: 0 0 45px 0 rgba(0, 0, 0, 0.12);
		box-shadow: 0 0 45px 0 rgba(0, 0, 0, 0.12);
	}

		#topnav .navigation-menu > li .submenu:before {
			left: 20px;
			top: -10px;
			content: "";
			display: block;
			position: absolute;
			background-color: transparent;
			border-left: 12px solid transparent;
			border-right: 12px solid transparent;
			border-bottom: 12px solid #fff;
			z-index: 9999;
		}

		#topnav .navigation-menu > li .submenu.megamenu {
			white-space: nowrap;
			width: auto;
		}

			#topnav .navigation-menu > li .submenu.megamenu > li {
				overflow: hidden;
				width: 200px;
				display: inline-block;
				vertical-align: top;
			}

		#topnav .navigation-menu > li .submenu > li.has-submenu > a:after {
			content: "\F142";
			font-family: "Material Design Icons";
			position: absolute;
			right: 20px;
			top: 5px;
			font-size: 18px;
		}

		#topnav .navigation-menu > li .submenu > li .submenu {
			left: 100%;
			top: 0;
			margin-left: 10px;
			margin-top: -1px;
		}

			#topnav .navigation-menu > li .submenu > li .submenu:before {
				display: none !important;
			}

		#topnav .navigation-menu > li .submenu li {
			position: relative;
		}

			#topnav .navigation-menu > li .submenu li ul {
				list-style: none;
				padding-left: 0;
				margin: 0;
			}

			#topnav .navigation-menu > li .submenu li a {
				display: block;
				padding: 9px 25px;
				clear: both;
				white-space: nowrap;
				color: #3b3e47;
				-webkit-transition: all .35s ease;
				transition: all .35s ease;
			}

				#topnav .navigation-menu > li .submenu li a:hover {
					color: #188ae2;
				}

			#topnav .navigation-menu > li .submenu li span {
				display: block;
				padding: 8px 25px;
				clear: both;
				line-height: 1.42857143;
				white-space: nowrap;
				font-size: 10px;
				text-transform: uppercase;
				letter-spacing: 2px;
				font-weight: 500;
				color: #3b3e47;
			}

	#topnav .navbar-toggle {
		display: none;
	}

	#topnav #navigation {
		display: block !important;
	}
}

/* Responsive Menu — Tablet/Mobile (<= 991px) */
@media (max-width: 991px) {
	.wrapper {
		padding-top: 70px;
	}

	.container {
		width: auto !important;
	}

	#topnav .navigation-menu {
		float: none;
		max-height: 400px;
		text-align: left;
	}

	#topnav .has-submenu.active a {
		color: #188ae2;
	}

		#topnav .has-submenu.active a i {
			color: #188ae2;
		}

	#topnav .has-submenu.active .submenu li.active > a {
		color: #188ae2;
	}

	#topnav .navigation-menu > li {
		display: block;
		float: none;
	}

		#topnav .navigation-menu > li > a {
			color: #3b3e47;
			padding: 15px;
		}

			#topnav .navigation-menu > li > a i {
				display: inline-block;
				margin-right: 10px;
				margin-bottom: 0;
				vertical-align: inherit;
			}

			#topnav .navigation-menu > li > a:after {
				position: absolute;
				right: 15px;
			}

		#topnav .navigation-menu > li .submenu {
			display: none;
			list-style: none;
			padding-left: 20px;
			margin: 0;
		}

			#topnav .navigation-menu > li .submenu li a {
				display: block;
				position: relative;
				padding: 7px 20px;
				color: #3b3e47;
			}

				#topnav .navigation-menu > li .submenu li a:hover {
					color: #188ae2;
				}

			#topnav .navigation-menu > li .submenu li.has-submenu > a:after {
				content: "\F140";
				font-family: "Material Design Icons";
				position: absolute;
				right: 30px;
			}

			#topnav .navigation-menu > li .submenu.open {
				display: block;
			}

			#topnav .navigation-menu > li .submenu .submenu {
				display: none;
				list-style: none;
			}

				#topnav .navigation-menu > li .submenu .submenu.open {
					display: block;
				}

			#topnav .navigation-menu > li .submenu.megamenu > li > ul {
				list-style: none;
				padding-left: 0;
			}

				#topnav .navigation-menu > li .submenu.megamenu > li > ul > li > span {
					display: block;
					position: relative;
					padding: 15px;
					text-transform: uppercase;
					font-size: 11px;
					letter-spacing: 2px;
					color: #3b3e47;
				}

		#topnav .navigation-menu > li.has-submenu.open > a {
			color: #188ae2;
		}

	#topnav .navbar-header {
		float: left;
	}

	#navigation {
		position: absolute;
		top: 70px;
		left: 0;
		width: 100%;
		display: none;
		height: auto;
		padding-bottom: 0;
		overflow: auto;
		border-top: 1px solid #e7e7e7;
		border-bottom: 1px solid #e7e7e7;
		background-color: #fff;
	}

		#navigation.open {
			display: block;
			overflow-y: auto;
		}

	#topnav .has-submenu.active a {
		color: #188ae2;
	}

		#topnav .has-submenu.active a:active, #topnav .has-submenu.active a:focus,
		#topnav .has-submenu.active a i {
			color: #188ae2;
		}
}

/* Submenu hover visibility (>= 768px) */
@media (min-width: 768px) {
	#topnav .navigation-menu > li.has-submenu:hover > .submenu {
		visibility: visible;
		opacity: 1;
		margin-top: 0;
	}

	#topnav .navigation-menu > li.has-submenu.last-elements:hover > .submenu:before {
		right: 20px;
		left: auto;
	}

	#topnav .navigation-menu > li.has-submenu:hover > .submenu > li.has-submenu:hover > .submenu {
		visibility: visible;
		opacity: 1;
		margin-left: 0;
		margin-right: 0;
	}

	.navbar-toggle {
		display: block;
	}
}

@media (max-height: 320px) {
	.navigation-menu {
		max-height: 240px !important;
	}
}

/* ===== Topbar ===== */
.navbar-custom {
	border-radius: 0;
	min-height: 70px;
	color: #fff;
	z-index: 2;
}

	.navbar-custom .nav-link {
		padding: 0;
		color: rgba(255, 255, 255, 0.8);
	}

	.navbar-custom .dropdown-toggle:after {
		content: initial;
	}

	.navbar-custom .menu-left {
		overflow: hidden;
	}

	.navbar-custom .topbar-right-menu li {
		float: left;
	}

	.navbar-custom .logo {
		line-height: 70px;
		margin-right: 20px;
	}

		.navbar-custom .logo .logo-sm {
			display: none;
		}

	/* BS5: .dropdown-menu-end (was .dropdown-menu-right) */
	.navbar-custom .dropdown-menu-end {
		-webkit-transform: none !important;
		transform: none !important;
		top: 100% !important;
		right: 0 !important;
		left: auto !important;
	}

/* =====================================================================
   Body & Layout overrides — custom settings from old theme.css commits
   ===================================================================== */

/* Body base styles (commits f12c39a9, f4246935) */
body {
	font-size: 12px;
	color: #01170c;
	padding-bottom: 60px;
	overflow-x: hidden;
	background-color: #f3f6f8;
}

/* Wrapper: override BS5 app.min.css max-width:1200px constraint */
.wrapper {
	max-width: none !important;
}

/* =====================================================================
   Login / Auth page centering
   .auth-bg was renamed from .account-pages during BS5 migration
   .auth-brand was renamed from .account-logo-box
   ===================================================================== */

.auth-bg {
	display: table-cell;
	vertical-align: middle;
}

.auth-brand {
	padding: 30px 30px 0 30px;
}

/* =====================================================================
   Form element text color — darkened from #495057 to #000e1b
   (commit f4246935: Invoice Feature + redesign)
   ===================================================================== */

.form-control,
.form-select,
.input-group-text,
.nav-tabs .nav-link.active,
.list-group-item-action {
	color: #000e1b;
}

.form-control:focus {
	color: #000e1b;
}

.list-group-item-action:hover,
.list-group-item-action:focus {
	color: #000e1b;
}

/* =====================================================================
   DataTables sorting icons (commit ee48b875)
   ===================================================================== */

table.dataTable thead .sorting,
table.dataTable thead .sorting_asc,
table.dataTable thead .sorting_desc,
table.dataTable thead .sorting_asc_disabled,
table.dataTable thead .sorting_desc_disabled {
	cursor: pointer;
	position: relative;
}

table.dataTable thead .sorting:before,
table.dataTable thead .sorting:after,
table.dataTable thead .sorting_asc:before,
table.dataTable thead .sorting_asc:after,
table.dataTable thead .sorting_desc:before,
table.dataTable thead .sorting_desc:after,
table.dataTable thead .sorting_asc_disabled:before,
table.dataTable thead .sorting_asc_disabled:after,
table.dataTable thead .sorting_desc_disabled:before,
table.dataTable thead .sorting_desc_disabled:after {
	position: absolute;
	bottom: 0.9em;
	display: block;
	opacity: 0.3;
}

table.dataTable thead .sorting:before,
table.dataTable thead .sorting_asc:before,
table.dataTable thead .sorting_desc:before,
table.dataTable thead .sorting_asc_disabled:before,
table.dataTable thead .sorting_desc_disabled:before {
	right: 1em;
	content: "\2191";
}

table.dataTable thead .sorting:after,
table.dataTable thead .sorting_asc:after,
table.dataTable thead .sorting_desc:after,
table.dataTable thead .sorting_asc_disabled:after,
table.dataTable thead .sorting_desc_disabled:after {
	right: 0.5em;
	content: "\2193";
}

table.dataTable thead .sorting_asc:before,
table.dataTable thead .sorting_desc:after {
	opacity: 1;
}
