:root {
	--professional-primary: #168f77;
	--professional-primary-dark: #116d60;
	--professional-bg: #f4f6f9;
	--professional-card: #ffffff;
	--professional-text: #24324a;
	--professional-muted: #6b7280;
	--professional-border: #e4e9f0;
}

body {
	background: var(--professional-bg) !important;
	color: var(--professional-text);
	font-family: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

.main,
.wrapper {
	background: var(--professional-bg) !important;
}

.sidebar {
	background: #ffffff !important;
	border-right: 1px solid var(--professional-border);
	box-shadow: 2px 0 12px rgba(36, 50, 74, .04);
}

.sidebar-content {
	background: #ffffff !important;
	display: flex;
	flex-direction: column;
	height: 100vh;
}

.sidebar-brand {
	margin: 0 18px 12px;
	padding: 20px 0;
	border-bottom: 1px solid var(--professional-border);
}

.sidebar-brand-name {
	display: block;
	margin-top: 8px;
	color: var(--professional-text);
	font-size: 13px;
	font-weight: 800;
	letter-spacing: .14em;
}

.sidebar-nav {
	flex-grow: 1;
}

.sidebar .sidebar-header {
	padding: 18px 24px 8px;
	color: #98a2b3;
	font-size: 10px;
	font-weight: 700;
	letter-spacing: .12em;
	text-transform: uppercase;
}

.sidebar a.sidebar-link {
	min-height: 44px;
	margin: 3px 12px;
	padding: 12px 14px;
	border-left: 3px solid transparent;
	border-radius: 8px;
	background: #ffffff !important;
	color: #4b5563 !important;
	font-size: 13px;
	font-weight: 500;
	text-decoration: none;
	transition: background-color .2s ease, color .2s ease;
}

.sidebar a.sidebar-link:visited,
.sidebar a.sidebar-link span,
.sidebar a.sidebar-link i,
.sidebar a.sidebar-link svg {
	color: #4b5563 !important;
}

.sidebar .sidebar-item.active > a.sidebar-link,
.sidebar a.sidebar-link:hover,
.sidebar a.sidebar-link:focus {
	border-left-color: transparent !important;
	background: #eaf7f4 !important;
	color: var(--professional-primary) !important;
}

.sidebar .sidebar-item.active > a.sidebar-link span,
.sidebar .sidebar-item.active > a.sidebar-link i,
.sidebar .sidebar-item.active > a.sidebar-link svg,
.sidebar a.sidebar-link:hover span,
.sidebar a.sidebar-link:hover i,
.sidebar a.sidebar-link:hover svg,
.sidebar a.sidebar-link:focus span,
.sidebar a.sidebar-link:focus i,
.sidebar a.sidebar-link:focus svg {
	color: var(--professional-primary) !important;
}

.sidebar-logout {
	margin-top: auto;
	padding: 18px 12px;
	border-top: 1px solid var(--professional-border);
	background: #ffffff;
}

.sidebar-logout-button {
	display: flex;
	width: 100%;
	align-items: center;
	justify-content: center;
	gap: 9px;
	padding: 11px 14px;
	border: 1px solid #dc3545;
	border-radius: 8px;
	background: #dc3545;
	color: #ffffff !important;
	font-size: 13px;
	font-weight: 700;
}

.sidebar-logout-button:hover,
.sidebar-logout-button:focus {
	border-color: #b02a37;
	background: #b02a37;
	color: #ffffff !important;
}

.navbar-bg {
	background: #ffffff !important;
	border-bottom: 1px solid var(--professional-border);
	box-shadow: 0 2px 12px rgba(36, 50, 74, .04);
}

.content {
	padding-top: 28px;
	padding-bottom: 36px;
}

.content h1,
.content h2,
.content h3,
.content h4,
.content h5 {
	color: var(--professional-text);
}

.content .card {
	border: 1px solid var(--professional-border) !important;
	border-radius: 10px !important;
	background: var(--professional-card) !important;
	box-shadow: 0 2px 12px rgba(36, 50, 74, .045) !important;
}

.content .card-header {
	border-bottom: 1px solid var(--professional-border) !important;
	background: #ffffff !important;
	border-radius: 10px 10px 0 0 !important;
}

.content .card-body {
	background: #ffffff;
}

.content .card-title {
	color: var(--professional-text);
	font-weight: 700;
}

.content label,
.content .form-control-label,
.content .text-muted {
	color: var(--professional-muted) !important;
}

.content .form-control,
.content .form-select,
.content input[type="text"],
.content input[type="number"],
.content input[type="email"],
.content input[type="password"],
.content select,
.content textarea {
	min-height: 42px;
	border: 1px solid #dbe3ec;
	border-radius: 7px;
	background: #ffffff;
	color: var(--professional-text);
	font-size: 13px;
	box-shadow: none !important;
}

.content .form-control:focus,
.content .form-select:focus,
.content input:focus,
.content select:focus,
.content textarea:focus {
	border-color: #83c9bb;
	box-shadow: 0 0 0 3px rgba(22, 143, 119, .1) !important;
}

.content .btn-primary,
.content .btn-success {
	border-color: var(--professional-primary);
	background: var(--professional-primary);
	color: #ffffff;
	font-weight: 600;
}

.content .btn-primary:hover,
.content .btn-success:hover {
	border-color: var(--professional-primary-dark);
	background: var(--professional-primary-dark);
}

.content .btn-danger {
	border-color: #dc3545;
	background: #dc3545;
}

.content .table {
	color: var(--professional-text);
	background: #ffffff;
}

.content .table thead th {
	border-bottom: 1px solid var(--professional-border);
	background: #f8fafc;
	color: #64748b;
	font-size: 11px;
	font-weight: 700;
	text-transform: uppercase;
}

.content .table tbody td {
	border-color: var(--professional-border);
	background: #ffffff;
	vertical-align: middle;
}

.content .table-responsive {
	border-radius: 9px;
	background: #ffffff;
}

.content .table-striped > tbody > tr:nth-of-type(odd) > * {
	background: #fbfcfd;
}

.content hr {
	border-color: var(--professional-border);
	opacity: 1;
}

.content .badge {
	font-weight: 600;
}

.employee-search-layout {
	display: grid;
	grid-template-columns: 280px minmax(0, 1fr);
	align-items: start;
	gap: 20px;
	width: 100%;
}

.employee-search-sidebar {
	position: sticky;
	top: 88px;
}

.employee-search-results {
	min-width: 0;
	width: 100%;
	max-width: 100%;
}

.employee-search-results > .row {
	--bs-gutter-x: 18px;
	width: 100%;
	margin-right: 0;
	margin-left: 0;
}

.employee-search-results .card,
.employee-search-results .card-body,
.employee-search-results .table-responsive,
.employee-search-results img {
	box-sizing: border-box;
	max-width: 100%;
}

.employee-search-results .card-body {
	height: auto;
	min-width: 0;
}

.employee-search-results .employee-details-main {
	width: 100%;
	flex: 0 0 100%;
	max-width: 100%;
}

.employee-report-row,
.employee-report-row > [class*="col-"] {
	width: 100%;
	max-width: 100%;
}

.employee-report-row .card-body > .row {
	margin: 0;
}

.employee-report-row .card-body > .row > [class*="col-"] {
	width: 100%;
	max-width: 100%;
}

.employee-report-row .card-body .d-flex {
	width: 100%;
	padding: 4px 0;
}

@media (max-width: 991.98px) {
	.employee-search-layout {
		grid-template-columns: 240px minmax(0, 1fr);
	}
}

@media (max-width: 767.98px) {
	.content {
		padding: 20px 16px 30px;
	}

	.employee-search-layout {
		grid-template-columns: 1fr;
	}

	.employee-search-sidebar {
		position: static;
	}

	.employee-search-results > .row > [class*="col-"] {
		width: 100%;
		max-width: 100%;
	}
}

.salary-calculator-page .card {
	border-radius: 10px;
}

.salary-calculator-page .w3-container,
.salary-calculator-page fieldset {
	border-color: var(--professional-border);
}