/* Neurosoft pale chrome theme — header, menu, footer */
@import url("https://fonts.googleapis.com/css2?family=Manrope:wght@400;500;600;700&display=swap");

:root {
	--ns-ink: #1e293b;
	--ns-muted: #64748b;
	--ns-line: #cbd5e1;
	--ns-panel: #ffffff;
	--ns-accent: #5C3317;
	--ns-accent-deep: #3E2210;
	--ns-accent-soft: #F7F1EB;
	--ns-warm: #C4A484;
	--ns-header-bg: #ffffff;
	--ns-menu-bg: linear-gradient(90deg, #5C3317 0%, #2C180C 48%, #102a43 100%);
	--ns-page-bg: #f1f5f9;
	--ns-menu-text: rgba(255, 255, 255, 0.92);
	--ns-menu-active: #ffffff;
	--ns-btn-bg: #5C3317;
	--ns-btn-bg-hover: #7A4A2A;
	--ns-btn-text: #ffffff;
	--ns-btn-border: #5C3317;
	--ns-label: #334155;
	--ns-value: #0f172a;
}

body,
td,
th,
input,
select,
textarea,
button,
a {
	font-family: "Manrope", Verdana, Tahoma, sans-serif !important;
}

body {
	background: var(--ns-page-bg) !important;
	color: var(--ns-ink) !important;
}

/* ---------- HEADER (single line) ---------- */
.headerBg,
.logged_header,
table.logged_header {
	background: transparent !important;
	border: none !important;
}

.headerTop {
	display: none !important;
	height: 0 !important;
}

.ns-header-bar,
.headerBg > table.ns-header-bar {
	background: var(--ns-header-bg) !important;
	border-bottom: 1px solid var(--ns-line) !important;
	min-height: 54px;
}

.logged_header_left,
.logged_header_right,
.logged_header_right1,
.logged_header_center {
	background: transparent !important;
	height: auto !important;
	min-height: 0 !important;
	vertical-align: middle !important;
}

.logged_header,
.logged_logo {
	height: auto !important;
	min-height: 0 !important;
}

.logged_header_left {
	padding: 6px 10px !important;
	width: 18% !important;
	white-space: nowrap !important;
}

.logged_header_left img,
.logged_logo {
	max-height: 40px !important;
	width: auto !important;
	vertical-align: middle !important;
}

.logged_header_right {
	width: 82% !important;
	padding: 4px 8px 4px 0 !important;
}

.header_title {
	color: var(--ns-muted) !important;
	font-size: 11px !important;
	font-weight: 600 !important;
	letter-spacing: 0.03em;
	text-transform: uppercase;
	border: none !important;
	padding: 0 4px 0 10px !important;
	width: auto !important;
	white-space: nowrap !important;
	vertical-align: middle !important;
}

.header_content {
	color: var(--ns-ink) !important;
	font-size: 12px !important;
	font-weight: 600 !important;
	border: none !important;
	background: var(--ns-accent-soft) !important;
	border-radius: 6px !important;
	padding: 4px 8px !important;
	width: auto !important;
	white-space: nowrap !important;
	vertical-align: middle !important;
}

.btm_right_border,
.btm_border,
.left_border {
	border-color: transparent !important;
}

.pwd_log_width,
.pwd_before_width {
	padding: 0 4px !important;
	vertical-align: middle !important;
}

.log_bg,
.pwd_log_width a,
.pwd_log_width .logout,
.pwd_log_width a.generate_btn,
.pwd_log_width a.generate_btn.logout,
a.generate_btn.logout,
span.log_bg a {
	display: inline-block !important;
	background: #ffffff !important;
	background-image: none !important;
	border: 1px solid #cbd5e1 !important;
	border-radius: 7px !important;
	padding: 5px 10px !important;
	color: #5C3317 !important;
	font-weight: 700 !important;
	font-size: 11px !important;
	text-decoration: none !important;
	opacity: 1 !important;
	filter: none !important;
	box-shadow: none !important;
}

.pwd_log_width a:hover,
.pwd_log_width a.generate_btn:hover,
a.generate_btn.logout:hover,
span.log_bg a:hover {
	background: #EDE0D4 !important;
	background-image: none !important;
	border-color: #C4A484 !important;
	color: #3E2210 !important;
	opacity: 1 !important;
}

/* ---------- MAIN MENU TABS (login green) ---------- */
.menu_col,
td.menu_col {
	background: linear-gradient(90deg, #5C3317 0%, #2C180C 48%, #102a43 100%) !important;
	height: auto !important;
	padding: 0 !important;
	border-top: 1px solid rgba(255,255,255,0.12);
	border-bottom: 1px solid rgba(16, 42, 67, 0.25);
	box-shadow: 0 6px 14px rgba(16, 42, 67, 0.1);
}

.menu_col > table,
.menu_col > table > tbody > tr > td {
	background: transparent !important;
	background-image: none !important;
	border: none !important;
}

.tabRow {
	background: transparent !important;
	background-image: none !important;
}

.currentTabLeft,
.currentTabRight,
.otherTabLeft,
.otherTabRight,
.currentTabOffLeft,
.currentTabOffRight,
.currentTabOff {
	background: transparent !important;
	background-image: none !important;
	border: none !important;
	padding: 0 !important;
}

.otherTab {
	background: transparent !important;
	background-image: none !important;
	border: none !important;
	padding: 0 1px !important;
}

.currentTab {
	background: transparent !important;
	background-image: none !important;
	border: none !important;
	padding: 0 1px !important;
}

a.otherTabLink:link,
a.otherTabLink:visited {
	display: inline-block !important;
	padding: 9px 12px !important;
	margin: 4px 1px !important;
	border-radius: 7px !important;
	font-size: 11px !important;
	font-weight: 600 !important;
	letter-spacing: 0.04em !important;
	text-decoration: none !important;
	text-transform: uppercase !important;
	color: rgba(255, 255, 255, 0.92) !important;
	background: transparent !important;
	opacity: 1 !important;
}

a.otherTabLink:hover {
	background: #ffffff !important;
	color: #5C3317 !important;
	opacity: 1 !important;
}

a.currentTabLink:link,
a.currentTabLink:visited,
a.currentTabLink:hover {
	display: inline-block !important;
	padding: 9px 12px !important;
	margin: 4px 1px !important;
	border-radius: 7px !important;
	font-size: 11px !important;
	font-weight: 700 !important;
	letter-spacing: 0.04em !important;
	text-decoration: none !important;
	text-transform: uppercase !important;
	background: #ffffff !important;
	background-image: none !important;
	color: #5C3317 !important;
	opacity: 1 !important;
	box-shadow: 0 2px 6px rgba(16, 42, 67, 0.18);
}

/* ---------- SUB TABS ---------- */
#subtabs {
	background: #ffffff !important;
	background-image: none !important;
	border-bottom: 1px solid var(--ns-line) !important;
	padding: 6px 12px 4px !important;
	margin: 0 !important;
}

#subtabsnew {
	background: #ffffff !important;
	background-image: none !important;
	border-bottom-color: var(--ns-line) !important;
}

/* Child menu under main tabs (Payroll Center, etc.) */
ul.subTabsNav {
	padding: 2px 0 !important;
	margin: 0 !important;
	font-family: "Manrope", Verdana, Tahoma, sans-serif !important;
	font-size: 12px !important;
	line-height: 22px !important;
}

ul.subTabsNav li {
	list-style: none !important;
	display: inline !important;
	white-space: nowrap !important;
	color: #334155 !important;
	opacity: 1 !important;
}

ul.subTabsNav li a,
ul.subTabsNav li a:link,
ul.subTabsNav li a:visited,
ul.subTabsNav li a.menusublink {
	color: #5C3317 !important;
	background: transparent !important;
	padding: 4px 10px !important;
	margin: 0 !important;
	border-left: 1px solid #e2e8f0 !important;
	border-bottom: none !important;
	text-decoration: none !important;
	font-weight: 600 !important;
	opacity: 1 !important;
}

ul.subTabsNav li:first-child a {
	border-left: none !important;
}

ul.subTabsNav li a:hover,
ul.subTabsNav li a.menusublink:hover {
	color: #3E2210 !important;
	background: #F7F1EB !important;
	text-decoration: none !important;
	border-radius: 5px;
}

ul.subTabsNav li.selected {
	color: #5C3317 !important;
	font-weight: 700 !important;
	padding: 4px 10px !important;
	margin: 0 !important;
	background: #EDE0D4 !important;
	border-radius: 5px;
	border-left: 1px solid #e2e8f0 !important;
	opacity: 1 !important;
}

ul.subTabs li a,
ul.subTabsnew li a {
	border: 1px solid transparent !important;
	border-radius: 6px !important;
	padding: 5px 10px !important;
	margin-right: 3px !important;
	color: #64748b !important;
	background: transparent !important;
	font-weight: 500 !important;
	font-size: 12px !important;
	opacity: 1 !important;
}

ul.subTabs li a:hover,
ul.subTabsnew li a:hover {
	background: var(--ns-accent-soft) !important;
	color: var(--ns-accent-deep) !important;
	border-color: #EDE0D4 !important;
}

ul.subTabs li a:link,
ul.subTabs li a:visited {
	color: #64748b !important;
}

ul.subTabs li a.activeSubTab:link,
ul.subTabs li a.activeSubTab:visited,
ul.subTabs li a.activeSubTab:hover,
.activeSubTab {
	color: #5C3317 !important;
	font-weight: 700 !important;
	background: #F7F1EB !important;
	opacity: 1 !important;
}

ul.subpanelTablist {
	border-bottom-color: var(--ns-line) !important;
	padding: 6px 0 0 !important;
}

ul.subpanelTablist li a {
	background: #f8fafc !important;
	border-color: var(--ns-line) !important;
	border-radius: 7px 7px 0 0 !important;
	color: #64748b !important;
	padding: 6px 11px !important;
	font-weight: 500 !important;
	opacity: 1 !important;
}

ul.subpanelTablist li a:hover {
	background: var(--ns-accent-soft) !important;
	color: var(--ns-accent-deep) !important;
}

ul.subpanelTablist li a.current,
ul.subpanelTablist li a.current:hover {
	background: #ffffff !important;
	color: var(--ns-accent-deep) !important;
	border-color: var(--ns-line) !important;
	border-bottom-color: #ffffff !important;
	box-shadow: inset 0 2px 0 var(--ns-accent);
}

/* ---------- MODULE TITLE / CONTENT ---------- */
.moduleTitle {
	border-color: #5C3317 !important;
	color: var(--ns-ink) !important;
	font-weight: 700 !important;
}

.moduleTitle h2,
.moduleTitle h3,
h2.moduleTitle,
h3.moduleTitle {
	color: #0f172a !important;
	font-weight: 700 !important;
}

.h3Row {
	background: #ffffff !important;
	background-image: none !important;
	border-bottom: 2px solid #5C3317 !important;
	color: #0f172a !important;
}

.h3Row h3,
.h3Row td {
	color: #0f172a !important;
	font-weight: 700 !important;
}

/* ---------- BUTTONS (solid dark brown — Save / Delete / Cancel / Update) ---------- */
.button,
input.button,
button.button,
.generate_btn,
a.generate_btn,
input.generate_btn,
button.generate_btn,
a.button {
	display: inline-block !important;
	border: 1px solid var(--ns-btn-border) !important;
	background: var(--ns-btn-bg) !important;
	background-image: none !important;
	background-color: var(--ns-btn-bg) !important;
	color: var(--ns-btn-text) !important;
	border-radius: 6px !important;
	font-weight: 700 !important;
	font-size: 12px !important;
	padding: 6px 14px !important;
	box-shadow: none !important;
	text-shadow: none !important;
	filter: none !important;
	opacity: 1 !important;
	cursor: pointer !important;
	text-decoration: none !important;
	line-height: 1.35 !important;
}

.button:hover,
input.button:hover,
button.button:hover,
.generate_btn:hover,
a.generate_btn:hover,
input.generate_btn:hover,
button.generate_btn:hover,
a.button:hover,
.button:focus,
.generate_btn:focus {
	background: var(--ns-btn-bg-hover) !important;
	background-image: none !important;
	background-color: var(--ns-btn-bg-hover) !important;
	border-color: #7A4A2A !important;
	color: #ffffff !important;
	text-decoration: none !important;
	opacity: 1 !important;
	filter: none !important;
	box-shadow: 0 2px 6px rgba(15, 118, 110, 0.28) !important;
}

.button:active,
.generate_btn:active,
.button.active,
.generate_btn.active {
	background: #3E2210 !important;
	background-image: none !important;
	border-color: #3E2210 !important;
	color: #ffffff !important;
	box-shadow: inset 0 2px 4px rgba(0, 0, 0, 0.15) !important;
}

.button[disabled],
.button.disabled,
input.button[disabled],
.generate_btn[disabled] {
	background: #94a3b8 !important;
	background-image: none !important;
	border-color: #94a3b8 !important;
	color: #ffffff !important;
	opacity: 0.7 !important;
	cursor: not-allowed !important;
	box-shadow: none !important;
}

/* Secondary / cancel-style when title hints cancel — keep solid but slightly lighter slate */
input.button[value*="ancel"],
input.button[value*="Clear"],
button.button[value*="ancel"] {
	background: #334155 !important;
	background-image: none !important;
	border-color: #334155 !important;
	color: #ffffff !important;
}

input.button[value*="ancel"]:hover,
input.button[value*="Clear"]:hover,
button.button[value*="ancel"]:hover {
	background: #1e293b !important;
	border-color: #1e293b !important;
	color: #ffffff !important;
}

/* Delete / remove — solid red for clarity */
input.button[value*="elete"],
input.button[value*="ELETE"],
button.button[value*="elete"],
.button.delete {
	background: #b91c1c !important;
	background-image: none !important;
	border-color: #b91c1c !important;
	color: #ffffff !important;
}

input.button[value*="elete"]:hover,
button.button[value*="elete"]:hover,
.button.delete:hover {
	background: #991b1b !important;
	border-color: #991b1b !important;
	color: #ffffff !important;
}

/* ---------- FOOTER ---------- */
#footer {
	border-top: 1px solid var(--ns-line) !important;
	background: #ffffff !important;
	background-image: none !important;
	filter: none !important;
	box-shadow: none;
	min-height: 36px;
	padding: 8px 16px !important;
	display: flex !important;
	flex-wrap: nowrap !important;
	align-items: center !important;
	justify-content: center !important;
	gap: 0.75rem;
	white-space: nowrap !important;
	text-align: center !important;
}

#footer img.logo,
#footer #logo {
	display: none !important;
}

#footer #help {
	color: var(--ns-muted) !important;
	font-size: 11px !important;
	float: none !important;
	display: inline !important;
	border-right: none !important;
	height: auto !important;
	padding: 0 !important;
	padding-right: 0 !important;
	white-space: nowrap !important;
}

#footer .copyright,
#footer span.copyright {
	color: var(--ns-muted) !important;
	font-size: 11px !important;
	font-weight: 500 !important;
	display: inline !important;
	float: none !important;
	padding: 0 !important;
	padding-top: 0 !important;
	white-space: nowrap !important;
}

#footer .copyrighta,
#footer .copyrighta:visited,
#footer .copyrighta:hover {
	color: var(--ns-muted) !important;
	font-size: 11px !important;
	font-weight: 500 !important;
	white-space: nowrap !important;
}

#footer #buffer,
#footer .clear {
	display: none !important;
}

/* List / form / DetailView / EditView polish */
.listViewThS1,
.listViewThS1 a {
	background: #e2e8f0 !important;
	background-image: none !important;
	color: #0f172a !important;
	border-color: #cbd5e1 !important;
	font-weight: 700 !important;
}

.listViewTdS1,
.oddListRowS1,
.evenListRowS1 {
	color: #1e293b !important;
}

.tabForm {
	background: #ffffff !important;
	border: 1px solid #cbd5e1 !important;
	color: #0f172a !important;
}

.tabForm td,
table.tabForm td {
	color: #1e293b !important;
}

h4.dataLabel,
h5.dataLabel,
td.dataLabel,
.dataLabel {
	color: var(--ns-label) !important;
	font-weight: 700 !important;
	opacity: 1 !important;
}

.dataField,
td.dataField {
	color: var(--ns-value) !important;
	font-weight: 500 !important;
	opacity: 1 !important;
}

.dataField input,
.dataField select,
.dataField textarea,
input.dataField,
select.dataField,
textarea.dataField,
.tabForm input[type="text"],
.tabForm input[type="password"],
.tabForm select,
.tabForm textarea {
	border: 1px solid #94a3b8 !important;
	border-radius: 5px !important;
	color: #0f172a !important;
	background: #ffffff !important;
	padding: 4px 6px !important;
	opacity: 1 !important;
}

input:focus,
textarea:focus,
select:focus {
	border-color: #5C3317 !important;
	outline: none;
	box-shadow: 0 0 0 2px rgba(15, 118, 110, 0.22);
}

/* Detail View panels */
.tabDetailView {
	border-top-color: #94a3b8 !important;
	border-bottom-color: #94a3b8 !important;
	background-color: #e2e8f0 !important;
}

.tabDetailViewDL,
td.tabDetailViewDL,
th.tabDetailViewDL,
table.tabDetailView th.tabDetailViewDL,
h4.tabDetailViewDL {
	color: #1e293b !important;
	background-color: #f1f5f9 !important;
	border-color: #cbd5e1 !important;
	font-weight: 700 !important;
	opacity: 1 !important;
}

.tabDetailViewDF,
td.tabDetailViewDF {
	color: #0f172a !important;
	background-color: #ffffff !important;
	border-color: #cbd5e1 !important;
	font-weight: 500 !important;
	opacity: 1 !important;
}

a.tabDetailViewDFLink:link,
a.tabDetailViewDFLink:visited {
	color: #5C3317 !important;
	font-weight: 600 !important;
	text-decoration: underline !important;
}

a.tabDetailViewDFLink:hover {
	color: #3E2210 !important;
}

.tabDetailViewDL2,
td.tabDetailViewDL2 {
	color: #1e293b !important;
	background-color: #f1f5f9 !important;
	font-weight: 700 !important;
}

.tabDetailViewDF2,
td.tabDetailViewDF2 {
	color: #0f172a !important;
	background-color: #ffffff !important;
}

/* Edit view required / section headers */
.required {
	color: #b91c1c !important;
	font-weight: 700 !important;
}

.editViewHeader,
.detailViewHeader {
	color: #0f172a !important;
	font-weight: 700 !important;
}