.skin-light,
.skin-light .wrapper,
.skin-light .content-wrapper,
.skin-light .right-side,
.skin-light .main-footer {
	background: var(--canvas) !important;
	color: var(--text) !important;
}

.skin-light .main-header .navbar {
	background: var(--panel) !important;
	border-bottom: 1px solid var(--line-2) !important;
	box-shadow: 0 10px 26px rgba(15, 23, 42, 0.06) !important;
}

	.skin-light a[id*="cmdview"],
	.skin-light a[id*="cmdEditBt"],
	.skin-light a[id*="cmdview"]:visited,
		.skin-light a[id*="cmdEditBt"]:visited {
		color: blue !important;
		border-color: transparent !important;
	}

.skin-light .main-header .navbar .nav>li>a,
.skin-light .main-header .navbar .sidebar-toggle {
	color: #111827 !important;
}

.skin-light .main-header .navbar .nav>li>a:hover,
.skin-light .main-header .navbar .sidebar-toggle:hover {
	background: var(--accent-soft) !important;
	color: var(--accent) !important;
}

.skin-light .main-header .logo {
	background: var(--panel) !important;
	color: var(--accent) !important;
	border-right: 1px solid var(--line-2) !important;
	border-bottom: 1px solid var(--line-2) !important;
	font-weight: 800 !important;
	letter-spacing: 0.4px !important;
}

.skin-light .main-sidebar,
.skin-light .left-side {
	background: #f6f8fc !important;
	border-right: 1px solid var(--line) !important;
	box-shadow: 6px 0 22px rgba(15, 23, 42, 0.04) !important;
}

.skin-light .user-panel {
	background: transparent !important;
	border-bottom: 1px solid #e3ebf6 !important;
}

.skin-light .user-panel>.info,
.skin-light .user-panel>.info>a {
	color: var(--text) !important;
}

.skin-light .sidebar-form {
	background: #eef4ff !important;
	border: 1px solid var(--line) !important;
	border-radius: 10px !important;
	margin: 10px 12px !important;
	box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.7) !important;
}

.skin-light .sidebar-form input[type="text"] {
	background: transparent !important;
	color: var(--text) !important;
}

.skin-light .sidebar-form input[type="text"]::placeholder {
	color: #7b8796 !important;
}

.skin-light .sidebar-menu>li.header {
	background: transparent !important;
	color: var(--accent) !important;
	font-weight: 900 !important;
	letter-spacing: 1.6px !important;
	font-size: 10px !important;
	padding: 14px 16px 8px !important;
}

.skin-light .sidebar a {
	color: #223049 !important;
}

.skin-light .sidebar-menu>li>a {
	position: relative !important;
	color: #223049 !important;
	background: transparent !important;
	border-left: 3px solid transparent !important;
	transition: all 0.25s ease !important;
}

.skin-light .sidebar-menu>li:hover>a {
	background: rgba(37, 99, 235, 0.08) !important;
	color: var(--accent) !important;
	border-left: 3px solid var(--accent) !important;
}

.skin-light .sidebar-menu>li.active>a {
	background: rgba(37, 99, 235, 0.12) !important;
	color: var(--accent) !important;
	border-left: 3px solid var(--accent) !important;
	font-weight: 800 !important;
}

.skin-light .sidebar-menu>li>a>.fa,
.skin-light .sidebar-menu>li>a>.glyphicon,
.skin-light .sidebar-menu>li>a>.ion {
	color: #6b7a8f !important;
}

.skin-light .sidebar-menu>li:hover>a>.fa,
.skin-light .sidebar-menu>li.active>a>.fa,
.skin-light .sidebar-menu>li:hover>a>.glyphicon,
.skin-light .sidebar-menu>li.active>a>.glyphicon,
.skin-light .sidebar-menu>li:hover>a>.ion,
.skin-light .sidebar-menu>li.active>a>.ion {
	color: var(--accent) !important;
	text-shadow: 0 0 6px rgba(37, 99, 235, 0.35) !important;
}

.skin-light .sidebar-menu>li>.treeview-menu {
	background: transparent !important;
	border-left: 0 !important;
}

.skin-light .treeview-menu>li>a {
	color: #334155 !important;
	background: transparent !important;
	font-size: 13px !important;
	padding: 8px 10px !important;
	border-radius: 10px !important;
	transition: background 0.18s ease, color 0.18s ease, transform 0.18s ease !important;
}

.skin-light .treeview-menu>li>a:hover {
	background: rgba(37, 99, 235, 0.10) !important;
	color: var(--accent-2) !important;
	transform: translateX(2px) !important;
}

.skin-light .treeview-menu>li.active>a {
	background: rgba(37, 99, 235, 0.14) !important;
	color: var(--accent-2) !important;
	font-weight: 800 !important;
}

.skin-light .content-header {
	background: transparent !important;
}

.skin-light .content-header>h1 {
	color: var(--text) !important;
	font-weight: 900 !important;
}

.skin-light .content-header>h1>small {
	color: var(--muted-2) !important;
	font-weight: 700 !important;
}

.skin-light .box-title,
.skin-light h1,
.skin-light h2,
.skin-light h3,
.skin-light h4,
.skin-light h5,
.skin-light h6 {
	color: var(--text) !important;
}

.skin-light .box,
.skin-light .info-box,
.skin-light .nav-tabs-custom,
.skin-light .callout {
	background: var(--card) !important;
	border: 1px solid var(--line) !important;
	border-radius: 16px !important;
	box-shadow: 0 14px 40px rgba(15, 23, 42, 0.10) !important;
}

.skin-light .box-header {
	background: rgba(37, 99, 235, 0.06) !important;
	border-bottom: 1px solid rgba(215, 225, 238, 0.9) !important;
	border-radius: 16px 16px 0 0 !important;
}

.skin-light .box-header .box-title {
	color: var(--accent-2) !important;
	font-weight: 900 !important;
	letter-spacing: 0.3px !important;
}

.skin-light .box-body,
.skin-light .box-footer {
	background: transparent !important;
	color: var(--text) !important;
	padding: 14px 16px !important;
}

.skin-light .box::before,
.skin-light .box::after,
.skin-light .info-box::before,
.skin-light .info-box::after {
	content: none !important;
	display: none !important;
}

.skin-light .table,
.skin-light table,
.skin-light .box-body .table,
.skin-light .box-body table {
	background: transparent !important;
	color: var(--text) !important;
}

.skin-light .table>thead>tr>th {
	background: rgba(37, 99, 235, 0.06) !important;
	border-bottom: 1px solid var(--line) !important;
	color: #334155 !important;
	font-weight: 900 !important;
	font-size: 11px !important;
	letter-spacing: 0.8px !important;
	text-transform: uppercase !important;
}

/*.skin-light .table>tbody>tr>td,
.skin-light .table>tbody>tr>th {
	background: transparent !important;
	border-top: 1px solid rgba(215, 225, 238, 0.85) !important;
	color: var(--text) !important;
}
*/

.skin-light .table-striped>tbody>tr:nth-of-type(odd) {
	background: rgba(15, 23, 42, 0.02) !important;
}

.skin-light .table-hover>tbody>tr:hover {
	background: rgba(37, 99, 235, 0.06) !important;
}

.skin-light .form-control,
.skin-light input:not([type="button"]):not([type="submit"]):not([type="reset"]):not([type="radio"]):not([type="checkbox"]) {
	background: #eef3fa !important;
	border: 1px solid #c6d2df !important;
	color: var(--text) !important;
	box-shadow: none !important;
}

.skin-light .form-control:focus,
.skin-light input:not([type="button"]):not([type="submit"]):not([type="reset"]):not([type="radio"]):not([type="checkbox"]):focus,
.skin-light select:focus,
.skin-light textarea:focus {
	background: var(--card) !important;
	border-color: rgba(37, 99, 235, 0.70) !important;
	box-shadow: 0 0 0 3px rgba(37, 99, 235, 0.12) !important;
}

/* Radio Button Light Theme Styling */
.skin-light input[type="radio"] {
	background-color: #ffffff !important;
	border: 2px solid #94a3b8 !important;
	accent-color: #2563eb !important;
}

.skin-light input[type="radio"]:checked {
	background-color: #2563eb !important;
	border-color: #2563eb !important;
}

.skin-light .dropdown-menu {
	background: var(--card) !important;
	border: 1px solid var(--line) !important;
	box-shadow: 0 20px 60px rgba(15, 23, 42, 0.18) !important;
	border-radius: 14px !important;
}

.skin-light .dropdown-menu>li>a {
	color: #223049 !important;
	font-weight: 800 !important;
}

.skin-light .dropdown-menu>li>a:hover {
	background: rgba(37, 99, 235, 0.10) !important;
	color: var(--accent-2) !important;
}

.skin-light .main-footer {
	background: var(--panel) !important;
	border-top: 1px solid var(--line-2) !important;
	color: #4b5b70 !important;
}

.skin-light .messages-menu i,
.skin-light .notifications-menu i {
	color: #223049 !important;
	font-size: 20px !important;
}

.skin-light .dash-tiles .info-box::before,
.skin-light .dash-tiles .info-box::after,
.skin-light .dash-tiles .info-box .shimmer {
	content: none !important;
	display: none !important;
	background: none !important;
	opacity: 0 !important;
	animation: none !important;
}

.skin-light .dash-tiles .info-box {
	position: relative !important;
	overflow: hidden !important;
	background: var(--card-2) !important;
	border: 1px solid var(--line-2) !important;
	border-radius: 18px !important;
	transform: translateY(0) !important;
	box-shadow: 0 12px 30px rgba(15, 23, 42, 0.10) !important;
	transition: transform 0.25s ease, box-shadow 0.25s ease, border-color 0.25s ease !important;
}

.skin-light .dash-tiles .info-box:hover {
	transform: translateY(-7px) !important;
	box-shadow: 0 26px 70px rgba(15, 23, 42, 0.16) !important;
	border-color: #b9c7d9 !important;
}

.skin-light .dash-tiles .info-box-text {
	color: var(--muted) !important;
	font-weight: 900 !important;
	letter-spacing: 1px !important;
	font-size: 10px !important;
}

.skin-light .dash-tiles .info-box-number {
	color: var(--text) !important;
	font-weight: 950 !important;
	font-size: 25px !important;
	-webkit-text-fill-color: initial !important;
	background: none !important;
	font-variant-numeric: tabular-nums !important;
	letter-spacing: -0.4px !important;
}

.skin-light .dash-tiles .info-box:hover .info-box-text,
.skin-light .dash-tiles .info-box:hover .info-box-number {
	color: var(--text) !important;
	-webkit-text-fill-color: initial !important;
	text-shadow: none !important;
}

.skin-blue .dash-tiles .info-box::after,
.skin-black .dash-tiles .info-box::after,
.skin-purple .dash-tiles .info-box::after,
.skin-red .dash-tiles .info-box::after,
.skin-yellow .dash-tiles .info-box::after,
.skin-green .dash-tiles .info-box::after {
	content: '';
	position: absolute;
	inset: -2px;
	background: linear-gradient(45deg, #1a1a1a, #2c2c2c, #b8860b, #d4af37, #2c2c2c, #1a1a1a);
	background-size: 400% 400%;
	border-radius: 26px;
	opacity: 0;
	z-index: -1;
	transition: opacity 0.5s ease;
	animation: gradientMove 8s ease infinite;
}

@media (min-width: 768px) {
	.skin-light.sidebar-mini.sidebar-collapse .sidebar-menu>li:hover>.treeview-menu {
		background: var(--card) !important;
		border: 1px solid var(--line) !important;
		box-shadow: 0 20px 60px rgba(15, 23, 42, 0.18) !important;
		padding: 8px 8px !important;
		z-index: 9999 !important;
	}

	.skin-light.sidebar-mini.sidebar-collapse .sidebar-menu>li:hover>a>span {
		top: 0 !important;
		background-color: transparent !important;
	}

	.skin-light.sidebar-mini.sidebar-collapse .sidebar-menu>li:hover>a>span:not(.pull-right) {
		background: var(--card) !important;
		border: 1px solid var(--line) !important;
		box-shadow: 0 14px 40px rgba(15, 23, 42, 0.14) !important;
		color: var(--accent-2) !important;
		z-index: 9999 !important;
	}

	.skin-light.sidebar-mini.sidebar-collapse .sidebar-menu>li:hover>.treeview-menu>li>a {
		background: transparent !important;
		color: #223049 !important;
		padding: 8px 10px !important;
	}

	.skin-light.sidebar-mini.sidebar-collapse .sidebar-menu>li:hover>.treeview-menu>li>a:hover {
		background: rgba(37, 99, 235, 0.10) !important;
		color: var(--accent-2) !important;
	}
}

.skin-light .dash-tiles .info-box::before,
.skin-light .dash-tiles .info-box::after {
	display: block !important;
}

.skin-light .dash-tiles .info-box::after {
	content: "" !important;
	position: absolute !important;
	inset: -2px !important;
	border-radius: 22px !important;
	background: linear-gradient(45deg, #ffffff, #e0f2fe, #bbf7d0, #ddd6fe, #ffe4e6, #ffffff) !important;
	background-size: 300% 300% !important;
	opacity: 0 !important;
	z-index: 0 !important;
	transition: opacity 0.35s ease !important;
}

.skin-light .dash-tiles .info-box::before {
	content: "" !important;
	position: absolute !important;
	inset: 1px !important;
	border-radius: 20px !important;
	background: #ffffff !important;
	z-index: 1 !important;
}

.skin-light .dash-tiles .info-box>* {
	position: relative !important;
	z-index: 2 !important;
}

.skin-light .dash-tiles a.orecs-tile-link:hover .info-box,
.skin-light .dash-tiles .orecs-tile-link:hover .info-box,
.skin-light .dash-tiles .info-box:hover {
	transform: translateY(-8px) !important;
	box-shadow: 0 22px 55px rgba(15, 23, 42, 0.16) !important;
	border-color: transparent !important;
}

.skin-light .dash-tiles a.orecs-tile-link:hover .info-box::after,
.skin-light .dash-tiles .orecs-tile-link:hover .info-box::after,
.skin-light .dash-tiles .info-box:hover::after {
	opacity: 1 !important;
	animation: lightBorderShift 3s ease infinite !important;
}

.skin-light .dash-tiles a.orecs-tile-link:hover .info-box .info-box-icon,
.skin-light .dash-tiles .orecs-tile-link:hover .info-box .info-box-icon,
.skin-light .dash-tiles .info-box:hover .info-box-icon {
	transform: scale(1.08) rotate(-4deg) !important;
	transition: transform 0.4s ease !important;
}

@keyframes lightBorderShift {
	0% {
		background-position: 0% 50%;
	}

	50% {
		background-position: 100% 50%;
	}

	100% {
		background-position: 0% 50%;
	}
}

.skin-light .navbar .nav>li>a {
	border-radius: 8px !important;
}

.skin-light .navbar .nav>li>a:hover {
	box-shadow: 0 6px 18px rgba(37, 99, 235, 0.25) !important;
	transform: translateY(-2px) !important;
}

@keyframes pageFade {
	from {
		opacity: 0;
		transform: translateY(10px);
	}

	to {
		opacity: 1;
		transform: translateY(0);
	}
}

.skin-light .content-wrapper {
	animation: pageFade 0.5s ease;
}

@media (min-width: 768px) {

	/* hover opened treeview dropdown */
	.sidebar-mini.sidebar-collapse .sidebar-menu>li:hover>.treeview-menu {
		max-height: calc(100vh - 115px) !important;
		/* adjust if your topbar height differs */
		overflow-y: auto !important;
		overflow-x: hidden !important;
		overscroll-behavior: contain !important;
	}

	/* optional: keep the hover label aligned, no layout jump */
	.sidebar-mini.sidebar-collapse .sidebar-menu>li:hover>a>span:not(.pull-right) {
		max-height: calc(100vh - 120px) !important;
		overflow: hidden !important;
	}

	/* smooth scrollbar (webkit) */
	.sidebar-mini.sidebar-collapse .sidebar-menu>li:hover>.treeview-menu::-webkit-scrollbar {
		width: 8px;
	}

	.sidebar-mini.sidebar-collapse .sidebar-menu>li:hover>.treeview-menu::-webkit-scrollbar-thumb {
		background: rgba(100, 116, 139, 0.45);
		border-radius: 10px;
	}

	.sidebar-mini.sidebar-collapse .sidebar-menu>li:hover>.treeview-menu::-webkit-scrollbar-track {
		background: rgba(148, 163, 184, 0.15);
		border-radius: 10px;
	}
}


/* ==========================================================================
   Re-Login Panel Light Theme Overrides
   ========================================================================== */
.skin-light .relogin {
	background-color: #ffffff !important;
	border: 1px solid #e2e8f0 !important;
	box-shadow: 0 10px 25px -5px rgba(0, 0, 0, 0.1), 0 8px 10px -6px rgba(0, 0, 0, 0.1) !important;
}

.skin-light .relogin-head {
	color: #ffffff !important;
	background-color: #2563eb !important;
	border-bottom: 1px solid #e2e8f0 !important;
}

.skin-light .relogin-con {
	color: #334155 !important;
}

.skin-light .relogin input[type="text"],
.skin-light .relogin input[type="password"] {
	background-color: #ffffff !important;
	border: 1px solid #cbd5e1 !important;
	color: #0f172a !important;
	border-radius: 4px !important;
	padding: 4px 8px !important;
	font-family: "Roboto", sans-serif !important;
}

.skin-light .relogin .sub-login {
	background-color: #22c55e !important;
	color: #ffffff !important;
	border: none !important;
	border-radius: 4px !important;
	padding: 4px 16px !important;
	font-weight: 500 !important;
	cursor: pointer !important;
	height: auto !important;
	margin-top: 8px !important;
	transition: background-color 0.2s !important;
}

.skin-light .relogin .sub-login:hover {
	background-color: #16a34a !important;
}

/* ==========================================================================
   Login Page (Index.aspx) Light Theme Overrides
   ========================================================================== */
.skin-light .intro {
	background-color: #f4f7fb !important;
	color: #334155 !important;
}

.skin-light .intro-body {
	background: radial-gradient(circle at top left, rgba(37, 99, 235, 0.08), transparent 40%), linear-gradient(135deg, rgba(244, 247, 251, 0.92) 0%, rgba(255, 255, 255, 0.95) 100%) !important;
}

.skin-light .top {
	background-color: rgba(255, 255, 255, 0.96) !important;
	background-image: none !important;
	border-bottom: 1px solid #e2e8f0 !important;
	box-shadow: 0 4px 20px rgba(15, 23, 42, 0.05) !important;
}

.skin-light .inq {
	background-color: #f1f5f9 !important;
	border: 1px solid #cbd5e1 !important;
	color: #0f172a !important;
	border-radius: 6px !important;
	font-size: 14px !important;
	height: 32px !important;
	padding: 4px 12px !important;
	transition: all 0.2s ease !important;
}

.skin-light .inq::placeholder {
	color: #64748b !important;
}

.skin-light .inq:focus {
	background-color: #ffffff !important;
	border-color: #2563eb !important;
	box-shadow: 0 0 0 3px rgba(37, 99, 235, 0.15) !important;
	outline: none !important;
}

.skin-light .sub-login {
	background-color: #16a34a !important;
	color: #ffffff !important;
	border: none !important;
	border-radius: 6px !important;
	height: 32px !important;
	padding: 0 16px !important;
	font-weight: bold !important;
	cursor: pointer !important;
	transition: background-color 0.2s ease, transform 0.1s ease !important;
}

.skin-light .sub-login:hover {
	background-color: #15803d !important;
}

.skin-light .sub-login:active {
	transform: scale(0.97) !important;
}

.skin-light .forget,
.skin-light .forget a {
	color: #475569 !important;
	font-weight: 600 !important;
}

.skin-light .forget:hover,
.skin-light .forget a:hover {
	color: #2563eb !important;
}

.skin-light .details h1 {
	color: #334155 !important;
}

.skin-light .details h1 span {
	color: #0f172a !important;
}

.skin-light .details h3 {
	color: #475569 !important;
}

.skin-light .feature-box h3 {
	color: #16a34a !important;
}

.skin-light .feature-box p {
	color: #475569 !important;
}

.skin-light .Features-border {
	border-color: #cbd5e1 !important;
	background-color: #ffffff !important;
	box-shadow: 0 4px 12px rgba(15, 23, 42, 0.05) !important;
}

.skin-light .feature-box:hover .Features-border {
	border-color: #16a34a !important;
	box-shadow: 0 4px 20px rgba(22, 163, 74, 0.15) !important;
}

.skin-light .Features img {
	filter: invert(0.8) !important;
}

.skin-light .copyright {
	color: #64748b !important;
}

.skin-light .copyright a {
	color: #2563eb !important;
}

.skin-light .copyright a:hover {
	color: #1d4ed8 !important;
}

/* ==========================================================================
   Forgot Password Modal Light Theme Overrides
   ========================================================================== */
.skin-light .modal-content {
	background-color: #ffffff !important;
	border: 1px solid #e2e8f0 !important;
	box-shadow: 0 20px 25px -5px rgba(0, 0, 0, 0.1), 0 10px 10px -5px rgba(0, 0, 0, 0.04) !important;
	border-radius: 12px !important;
}

.skin-light .modal-header {
	background-color: #ffffff !important;
	border-bottom: 1px solid #0080ff !important;
	border-radius: 12px 12px 0 0 !important;
	padding: 15px 20px !important;
}

.skin-light .modal-title {
	color: #0f172a !important;
	font-weight: 800 !important;
	font-size: 18px !important;
}

.skin-light .modal-header .close {
	color: #64748b !important;
	text-shadow: none !important;
	opacity: 0.7 !important;
}

.skin-light .modal-header .close:hover {
	color: #0f172a !important;
	opacity: 1 !important;
}

.skin-light .modal-body {
	background-color: #ffffff !important;
	border-radius: 0 0 12px 12px !important;
	padding: 20px !important;
	color: #334155 !important;
}

.skin-light .modal label {
	color: #475569 !important;
	font-weight: 700 !important;
}

.skin-light .modal .form-control {
	background-color: #f8fafc !important;
	border: 1px solid #cbd5e1 !important;
	color: #0f172a !important;
	border-radius: 6px !important;
	box-shadow: none !important;
	height: 36px !important;
	padding: 6px 12px !important;
}

.skin-light .modal .form-control:focus {
	background-color: #ffffff !important;
	border-color: #2563eb !important;
	box-shadow: 0 0 0 3px rgba(37, 99, 235, 0.15) !important;
}

.skin-light .modal .btn-default {
	background-color: #2563eb !important;
	color: #ffffff !important;
	border: none !important;
	border-radius: 6px !important;
	font-weight: 700 !important;
	padding: 8px 16px !important;
	height: 36px !important;
	line-height: 20px !important;
	cursor: pointer !important;
	transition: background-color 0.2s ease, transform 0.1s ease !important;
}

.skin-light .modal .btn-default:hover {
	background-color: #1d4ed8 !important;
	color: #ffffff !important;
}

.skin-light .modal .btn-default:active {
	transform: scale(0.98) !important;
}

.skin-light .modal input[id$="BtnCancel"] {
	background-color: #cbd5e1 !important;
	color: #334155 !important;
}

.skin-light .modal input[id$="BtnCancel"]:hover {
	background-color: #94a3b8 !important;
	color: #1e293b !important;
}

/* Outer Navigation Tabs */
.skin-light .item-box {
	background-color: #f1f5f9 !important;
	color: #475569 !important;
	border: 1px solid #cbd5e1 !important;
	transition: all 0.2s ease !important;
}

.skin-light .item-box:hover {
	background-color: #e2e8f0 !important;
	color: #0f172a !important;
}

.skin-light .item-box-active {
	background-color: #fcbf04 !important;
	color: #0f172a !important;
	border: 1px solid #e2a000 !important;
	box-shadow: 0 4px 10px rgba(252, 191, 4, 0.15) !important;
}

/* AJAX TabContainer Overrides (fancy-green / fancy) */
.skin-light .fancy-green .ajax__tab_header {
	background-color: #f1f5f9 !important;
	border-bottom: 2px solid #cbd5e1 !important;
}

.skin-light .fancy-green .ajax__tab_hover .ajax__tab_inner,
.skin-light .fancy-green .ajax__tab_active .ajax__tab_inner {
	background-color: #ffffff !important;
}

.skin-light .fancy .ajax__tab_header {
	color: #475569 !important;
}

.skin-light .fancy .ajax__tab_tab {
	color: #475569 !important;
	background: transparent !important;
}

.skin-light .fancy .ajax__tab_hover .ajax__tab_tab,
.skin-light .fancy .ajax__tab_active .ajax__tab_tab {
	color: #fcbf04 !important;
}

.skin-light .fancy .ajax__tab_body {
	background-color: #ffffff !important;
	color: #334155 !important;
	border: 1px solid #cbd5e1 !important;
	border-top: none !important;
	border-radius: 0 0 8px 8px !important;
	box-shadow: 0 4px 12px rgba(15, 23, 42, 0.05) !important;
}

/* AJAX Inner Tab Container Overrides (fancy-green1 / fancy1) */
.skin-light .fancy-green1 .ajax__tab_header {
	background-color: #e2e8f0 !important;
	border-bottom: 3px solid #cbd5e1 !important;
}

.skin-light .fancy-green1 .ajax__tab_hover .ajax__tab_inner,
.skin-light .fancy-green1 .ajax__tab_active .ajax__tab_inner {
	background-color: #ffffff !important;
}

.skin-light .fancy1 .ajax__tab_header {
	color: #475569 !important;
}

.skin-light .fancy1 .ajax__tab_tab {
	color: #475569 !important;
	background: transparent !important;
}

.skin-light .fancy1 .ajax__tab_hover .ajax__tab_tab,
.skin-light .fancy1 .ajax__tab_active .ajax__tab_tab {
	color: #e2a000 !important;
}

.skin-light .fancy1 .ajax__tab_body {
	background-color: #ffffff !important;
	color: #334155 !important;
	border: 1px solid #cbd5e1 !important;
	border-top: none !important;
	border-radius: 0 0 8px 8px !important;
}

/* ==========================================================================
   Clean-Up Overrides for Remaining Dark Theme Elements (skin-light)
   ========================================================================== */

/* 1. Accordion Header & Body Overrides */
.skin-light .accordionHeader,
.skin-light .accordionHeaderSelected {
	background-color: #e2e8f0 !important;
	color: #0f172a !important;
	border: 1px solid #cbd5e1 !important;
}

.skin-light .accordionContent {
	background-color: #ffffff !important;
	color: #334155 !important;
	border: 1px solid #e2e8f0 !important;
}

.skin-light .accordionLink,
.skin-light .accordionHeader a,
.skin-light .accordionHeaderSelected a {
	color: #0f172a !important;
	background: none !important;
	text-decoration: none !important;
}

.skin-light .accordionHeader a:hover,
.skin-light .accordionHeaderSelected a:hover {
	text-decoration: underline !important;
}

/* 2. Global Button & Form Dropdown Options Overrides */
.skin-light .btn-default {
	background-color: #2563eb !important;
	color: #ffffff !important;
	border-color: #1d4ed8 !important;
}

.skin-light .btn-default:hover {
	background-color: #1d4ed8 !important;
	border-color: #1e40af !important;
	color: #ffffff !important;
}

.skin-light option {
	background-color: #ffffff !important;
	color: #0f172a !important;
}

/* 3. Popup Overlay Panels & Dialogs Overrides */
.skin-light .PanelDisp {
	background-color: #ffffff !important;
	border: 1px solid #cbd5e1 !important;
	box-shadow: 0 8px 24px rgba(15, 23, 42, 0.12) !important;
	color: #0f172a !important;
	z-index: 999 !important;
}

.skin-light .notification-box {
	background-color: #ffffff !important;
	color: #334155 !important;
	border: 1px solid #cbd5e1 !important;
	box-shadow: 0 0 15px rgba(15, 23, 42, 0.1) !important;
}

.skin-light .popbox {
	background-color: #ffffff !important;
	border: 1px solid #e2e8f0 !important;
	box-shadow: 5px 0 10px rgba(15, 23, 42, 0.1) !important;
}

/* 4. Table / List Report Element Overrides */
.skin-light .tbbg {
	background-color: #2563eb !important;
	color: #ffffff !important;
}

.skin-light .mGrid th {
	background: #1e40af !important;
	color: #ffffff !important;
	border-left: solid 1px #2563eb !important;
}

.skin-light .fontstyleRptHd {
	background-color: #252525 !important;
	color: #ffffff !important;
}

.skin-light .mGrid .pgr {
	background: #1e3a8a !important;
}

.skin-light .mGrid .pgr td {
	color: #ffffff !important;
	border-left: solid 1px #2563eb !important;
}

/* 5. Custom Light Scrollbar thumb & track */
.skin-light ::-webkit-scrollbar-thumb {
	background: #94a3b8 !important;
	border-radius: 6px !important;
}

.skin-light ::-webkit-scrollbar-thumb:hover {
	background: #64748b !important;
}

.skin-light ::-webkit-scrollbar-track {
	background: rgba(226, 232, 240, 0.6) !important;
}

/* ==========================================================================
   Clean-up for Table Clipping & Font Colors in Light Theme (skin-light)
   ========================================================================== */

/* 1. Fix invisible/low-contrast labels & titles */
/*.skin-light .fontstylelabel,*/
/*.skin-light table.fontstylelabel > tbody > tr > td,*/
/*.skin-light .fontstylelabel label,
.skin-light .fontstylelabel span {
	color: revert !important;
}*/

.skin-light .LabelHeader,
.skin-light .float-label {
	color: #1d4ed8 !important;
	/* brand blue for headers instead of low-contrast yellow */
}


.skin-light .fontstyle {
	color: #0f172a !important;
}

.skin-light .btn1:hover,
.skin-light .btn1:focus {
	background-color: #2563eb !important;
	color: #ffffff !important;
}

/* Attachment and action links with ForeColor="Yellow" override for Light Theme */
.skin-light a[style*="Yellow"],
.skin-light a[style*="yellow"],
.skin-light a[style*="#FCBF04"],
.skin-light a[style*="#fcbf04"],
.skin-light a[id*="Lnkper"],
.skin-light a[id*="LnkPer"],
.skin-light a[id*="lnkper"],
.skin-light a[id*="Lnkfit"],
.skin-light a[id*="Lnklic"],
.skin-light a[id*="LnkRec"],
.skin-light a[id*="LnkCer"],
.skin-light a[id*="LnkNational"],
.skin-light a[id*="LnkState"],
.skin-light a[id*="LnkFile"],
.skin-light [id$="LnkFile"] {
	color: #dc2626 !important;
}

/* Attendance & report hint legends override for Light Theme */
.skin-light [id*="divhint"],
.skin-light [id*="divHint"],
.skin-light [id*="DivHint"] {
	color: #d97706 !important;
}

.skin-light [id*="divhint"] span,
.skin-light [id*="divHint"] span,
.skin-light [id*="DivHint"] span {
	color: #1e293b !important;
}

/* Fix small time inputs and dropdown select fields being cut off / squeezed in Light Theme */
.skin-light input[style*="width: 40px"],
.skin-light input[style*="width:40px"],
.skin-light input[style*="width: 35px"],
.skin-light input[style*="width:35px"],
.skin-light input[style*="width: 45px"],
.skin-light input[style*="width:45px"],
.skin-light input[id*="FTime"],
.skin-light input[id*="TTime"],
.skin-light input[id*="MTime"],
.skin-light input[id*="RTime"],
.skin-light input[id*="EMTime"],
.skin-light input[id*="ERTime"],
.skin-light input[id*="EFTime"],
.skin-light input[id*="ETTime"] {
	min-width: 58px !important;
	padding-left: 4px !important;
	padding-right: 4px !important;
	text-align: center !important;
}

.skin-light select[style*="width: 50px"],
.skin-light select[style*="width:50px"],
.skin-light select[style*="width: 45px"],
.skin-light select[style*="width:45px"],
.skin-light select[style*="width: 55px"],
.skin-light select[style*="width:55px"],
.skin-light select[id*="FHH"],
.skin-light select[id*="FMM"],
.skin-light select[id*="THH"],
.skin-light select[id*="TMM"],
.skin-light select[id*="LunchHH"],
.skin-light select[id*="LunchMM"],
.skin-light select[id*="BRHH"],
.skin-light select[id*="BRMM"],
.skin-light select[id*="ddlMoHour"],
.skin-light select[id*="ddlMoMin"],
.skin-light select[id*="DDJTDRHH"],
.skin-light select[id*="DDJTDRMM"],
.skin-light select[id*="DDJTStartDate"],
.skin-light select[id*="DDJTStopDate"] {
	min-width: 60px !important;
	padding-left: 4px !important;
	padding-right: 16px !important;
	text-align: center !important;
}

/* Report header and dark-background table summary header text color override for Light Theme */
.skin-light .fontstyleRptHd,
.skin-light .fontstyleRptHd td,
.skin-light .fontstyleRptHd th,
.skin-light .fontstyleRptHd .LabelHeader,
.skin-light .fontstyleRptHd span,
.skin-light .fontstyleRptHd label,
.skin-light .fontstyleRptHd a,
.skin-light .fontstyleRptHd a *,
.skin-light .fontstyleRptHd a:hover,
.skin-light .fontstyleRptHd a:hover *,
.skin-light .fontstyleRptHd a.fontstylelabel,
.skin-light td.fontstyleRptHd,
.skin-light th.fontstyleRptHd,
.skin-light [id*="TblCount"] td,
.skin-light [id*="TblCount"] th,
.skin-light [id*="TblCount"] .LabelHeader,
.skin-light [id*="TblCount"] span,
.skin-light .GVFixedHeader,
.skin-light .GVFixedHeader td,
.skin-light .GVFixedHeader th,
.skin-light th.GVFixedHeader,
.skin-light td[style*="background-color: #101010"],
.skin-light td[style*="background-color:#101010"],
.skin-light td[style*="background-color: black"],
.skin-light td[style*="background-color:black"],
.skin-light td[style*="background-color: Black"],
.skin-light td[style*="background-color:Black"],
.skin-light td[style*="background-color: #000"],
.skin-light td[style*="background-color:#000"],
.skin-light tr[style*="background-color: #101010"] td,
.skin-light tr[style*="background-color:#101010"] td,
.skin-light tr[style*="background-color: black"] td,
.skin-light tr[style*="background-color:black"] td,
.skin-light tr[style*="background-color: Black"] td,
.skin-light tr[style*="background-color:Black"] td,
.skin-light #TblSummary tr:first-child td,
.skin-light #TblSummary tr:nth-child(2) td,
.skin-light #TblSummary tr td[style*="background-color"] {
	color: #ffffff !important;
}

/* Fix disabled grid links low contrast in Light Theme */
.skin-light a.aspNetDisabled,
.skin-light a:disabled,
.skin-light .aspNetDisabled {
	color: #0f172a !important;
	opacity: 1 !important;
	text-decoration: none !important;
	cursor: default !important;
}

/* Dark panel headers in modals/accordions override for Light Theme */
.skin-light #prog .panel-heading,
.skin-light #prog .panel-heading a,
.skin-light #prog .panel-heading h4,
.skin-light #prog .panel-heading .panel-title,
.skin-light #prog .panel-heading span,
.skin-light #prog a.accordion-toggle,
.skin-light #prog a.accordion-toggle *,
.skin-light .panel-heading[style*="background-color: #595959"],
.skin-light .panel-heading[style*="background-color: #595959"] *,
.skin-light .panel-heading[style*="background-color:#595959"],
.skin-light .panel-heading[style*="background-color:#595959"] * {
	color: #ffffff !important;
}