/* =====================================================
   Responsive Adjustments
   ===================================================== */
@media (max-width: 959px) {
	/* Hide leftpanelcanvas by default on mobile - UIkit offcanvas handles visibility */
	#leftpanelcanvas {
		display: none;
	}
	
	/* Show when offcanvas is active */
	#leftpanelcanvas.uk-open {
		display: block;
	}
	
	/* Remove fixed positioning when used as offcanvas */
	#leftpanelcanvas.uk-offcanvas {
		position: static;
		width: auto;
		transform: none;
	}
	
	#tm-content {
		margin-left: 0;
	}
	
	.bar-bottom {
		display: none;
	}
}

@media (max-width: 639px) {
	#top-head {
		height: auto;
	}

	#top-head .uk-navbar {
		min-height: var(--navbar-height);
		height: auto;
		padding-top: 4px;
		padding-bottom: 4px;
	}

	#top-head .tm-topbar-primary {
		display: none;
	}

	#top-head .uk-navbar-right .uk-navbar-nav > li > a,
	#top-head .uk-navbar-toggle {
		padding: 0 8px;
	}

	#leftpanelcanvas .uk-offcanvas-bar,
	#rightpanelcanvas .uk-offcanvas-bar {
		width: min(100vw, 300px);
		padding: 16px;
	}

	#top-head .uk-search-input {
		font-size: 1rem;
	}
	
	.uk-card-body:not([class*="tm-padding"]) {
		padding: 16px;
	}
	
	.uk-card-header:not([class*="tm-padding"]),
	.uk-card-footer:not([class*="tm-padding"]) {
		padding: 12px 16px;
	}
}

/* =====================================================
   Mobile Left Panel Canvas Styles
   ===================================================== */
@media (max-width: 959px) {
	/* Left panel canvas - offcanvas mode */
	#leftpanelcanvas.uk-offcanvas {
		width: var(--sidebar-width, 260px);
		position: fixed;
		left: 0;
		top: 0;
		bottom: 0;
		z-index: 1000;
		background-color: var(--sidebar-bg);
		overflow-y: auto;
		overflow-x: hidden;
		border-right: 1px solid var(--border-light);
	}
	
	/* Ensure menu items are touch-friendly on mobile */
	#leftpanelcanvas ul.uk-nav-default > li > a {
		padding: 12px 16px;
		min-height: 44px;
		display: flex;
		align-items: center;
	}
	
	/* Submenu items on mobile */
	#leftpanelcanvas ul.uk-nav-default li .uk-nav-sub {
		padding-left: 20px;
	}
	
	#leftpanelcanvas ul.uk-nav-default li .uk-nav-sub > li > a {
		padding: 10px 16px;
		min-height: 40px;
	}
	
	/* Menu icon sizing on mobile */
	#leftpanelcanvas .menu-icon {
		min-width: 24px;
		width: 24px;
	}
	
	#leftpanelcanvas .menu-icon i {
		font-size: 1.1rem;
	}
	
	/* Menu item link on mobile */
	#leftpanelcanvas .menu-item-link {
		width: 100%;
		justify-content: flex-start;
	}
	
	/* Active state styling on mobile */
	#leftpanelcanvas ul.uk-nav-default > li.uk-active > a,
	#leftpanelcanvas ul.uk-nav-default > li.uk-open > a {
		background-color: var(--sidebar-hover);
		border-left: 3px solid var(--maincolor, #3b82f6);
	}
	
	/* Dark mode support for mobile */
	@media (prefers-color-scheme: dark) {
		body:not(.tm-auth-light) #leftpanelcanvas {
			background-color: var(--sidebar-bg);
		}
		
		body:not(.tm-auth-light) #leftpanelcanvas ul.uk-nav-default > li > a {
			color: var(--text-secondary);
		}
		
		body:not(.tm-auth-light) #leftpanelcanvas ul.uk-nav-default > li > a:hover {
			color: var(--text-primary);
			background-color: var(--sidebar-hover);
		}
	}
}

/* Small mobile devices */
@media (max-width: 479px) {
	#leftpanelcanvas.uk-offcanvas {
		width: 100vw;
	}
	
	#leftpanelcanvas ul.uk-nav-default > li > a {
		padding: 14px 20px;
		font-size: 0.95rem;
	}
	
	#leftpanelcanvas ul.uk-nav-default li .uk-nav-sub > li > a {
		padding: 12px 20px;
	}
}

/* =====================================================
   Scrollbar Styling
   ===================================================== */
::-webkit-scrollbar {
	width: 8px;
	height: 8px;
}

::-webkit-scrollbar-track {
	background: var(--bg-secondary);
}

::-webkit-scrollbar-thumb {
	background: var(--border-color);
	border-radius: 4px;
}

::-webkit-scrollbar-thumb:hover {
	background: var(--text-muted);
}

/* =====================================================
   Print Styles
   ===================================================== */
@media print {
	#top-head,
	#leftpanelcanvas,
	.bar-bottom,
	#rightpanelcanvas {
		display: none !important;
	}
	
	#tm-content {
		margin: 0 !important;
	}
}

/* =====================================================
   Enhanced Dark Mode Support - WinterCMS Components
   ===================================================== */

/* =====================================================
   Form Tabs - UIkit Override (Replacing WinterCMS Default)
   ===================================================== */

/* Override WinterCMS default tab styles with UIkit */
.control-tabs {
	position: relative;
	margin-bottom: 1rem;
}

/* Make nav-tabs use UIkit tab styling */
.control-tabs .nav-tabs,
.control-tabs .nav.nav-tabs {
	/* UIkit tab base styles */
	display: flex;
	flex-wrap: wrap;
	margin-left: -20px;
	padding: 0;
	list-style: none;
	position: relative;
}

/* UIkit tab ::before border */
.control-tabs .nav-tabs::before,
.control-tabs .nav.nav-tabs::before {
	content: "";
	position: absolute;
	bottom: 0;
	left: 20px;
	right: 0;
	border-bottom: 1px solid var(--border-color);
}

/* UIkit tab items */
.control-tabs .nav-tabs > li,
.control-tabs .nav.nav-tabs > li {
	flex: none;
	padding-left: 20px;
	position: relative;
	margin: 0;
}

/* UIkit tab links */
.control-tabs .nav-tabs > li > a,
.control-tabs .nav.nav-tabs > li > a {
	/* UIkit tab link styles */
	display: flex;
	align-items: center;
	column-gap: 0.25em;
	justify-content: center;
	padding: 0px;
	color: var(--text-secondary);
	border-bottom: 1px solid transparent;
	font-size: 0.875rem;
	text-transform: uppercase;
	transition: color 0.1s ease-in-out, border-color 0.1s ease-in-out;
	text-decoration: none;
}

/* UIkit tab link title wrapper */
.control-tabs .nav-tabs > li > a .title,
.control-tabs .nav.nav-tabs > li > a .title {
	display: inline-flex;
	align-items: center;
	gap: 0.25em;
}

/* UIkit tab hover */
.control-tabs .nav-tabs > li > a:hover,
.control-tabs .nav.nav-tabs > li > a:hover {
	color: var(--text-primary);
	text-decoration: none;
}

/* UIkit tab active (both WinterCMS and UIkit classes) */
.control-tabs .nav-tabs > li.active > a,
.control-tabs .nav-tabs > li.uk-active > a,
.control-tabs .nav.nav-tabs > li.active > a,
.control-tabs .nav.nav-tabs > li.uk-active > a {
	color: var(--text-primary);
	border-color: var(--maincolor, #1e87f0);
}

/* UIkit tab disabled */
.control-tabs .nav-tabs > li.disabled > a,
.control-tabs .nav.nav-tabs > li.disabled > a {
	color: var(--text-muted);
	cursor: not-allowed;
}

/* Tab content - use UIkit switcher styling */
.control-tabs .tab-content,
.control-tabs .tab-content.uk-switcher {
	margin: 0;
	padding: 0;
	list-style: none;
	position: relative;
}

/* Tab pane - UIkit switcher item styling */
.control-tabs .tab-pane {
	display: none;
}

.control-tabs .tab-pane.active,
.control-tabs .tab-pane.uk-active {
	display: block;
}

/* Tab lazy loading indicator */
.control-tabs .tab-pane.lazy {
	min-height: 100px;
}

/* Primary tabs specific overrides */
.control-tabs.primary-tabs > ul.nav-tabs,
.control-tabs.primary-tabs > div > ul.nav-tabs,
.control-tabs.primary-tabs > div > div > ul.nav-tabs {
	margin-left: -20px;
}

.control-tabs.primary-tabs > ul.nav-tabs > li,
.control-tabs.primary-tabs > div > ul.nav-tabs > li,
.control-tabs.primary-tabs > div > div > ul.nav-tabs > li {
	padding-left: 20px;
}

/* Dark mode overrides for UIkit tabs */
.dark-mode:not(.tm-auth-light) .control-tabs .nav-tabs::before,
.dark-mode:not(.tm-auth-light) .control-tabs .nav.nav-tabs::before {
	border-bottom-color: var(--border-color);
}

.dark-mode:not(.tm-auth-light) .control-tabs .nav-tabs > li > a,
.dark-mode:not(.tm-auth-light) .control-tabs .nav.nav-tabs > li > a {
	color: var(--text-secondary);
}

.dark-mode:not(.tm-auth-light) .control-tabs .nav-tabs > li > a:hover,
.dark-mode:not(.tm-auth-light) .control-tabs .nav.nav-tabs > li > a:hover {
	color: var(--text-primary);
}

.dark-mode:not(.tm-auth-light) .control-tabs .nav-tabs > li.active > a,
.dark-mode:not(.tm-auth-light) .control-tabs .nav-tabs > li.uk-active > a,
.dark-mode:not(.tm-auth-light) .control-tabs .nav.nav-tabs > li.active > a,
.dark-mode:not(.tm-auth-light) .control-tabs .nav.nav-tabs > li.uk-active > a {
	color: var(--text-primary);
	border-color: var(--maincolor, #1e87f0);
}

.dark-mode:not(.tm-auth-light) .control-tabs .nav-tabs > li.disabled > a,
.dark-mode:not(.tm-auth-light) .control-tabs .nav.nav-tabs > li.disabled > a {
	color: var(--text-muted);
}

.control-tabs.primary-tabs>div>ul.nav-tabs>li a>span.title:before,
.control-tabs.primary-tabs>div>ul.nav-tabs>li a>span.title:after,
.control-tabs.primary-tabs>div>ul.nav-tabs>li.active a:before {
	background-color: var(--bg-primary);
	background: var(--bg-primary);
}

.control-tabs.primary-tabs>div>div>ul.nav-tabs>li a>span.title:before,
.control-tabs.primary-tabs>div>ul.nav-tabs>li a>span.title:before,
.control-tabs.primary-tabs>ul.nav-tabs>li a>span.title:before {
	border-left: 1px solid var(--border-color);
	border-top: 1px solid var(--border-color);
}

.control-tabs.primary-tabs>div>div>ul.nav-tabs>li a>span.title:after,
.control-tabs.primary-tabs>div>ul.nav-tabs>li a>span.title:after,
.control-tabs.primary-tabs>ul.nav-tabs>li a>span.title:after {
	border-right: 1px solid var(--border-color);
	border-top: 1px solid var(--border-color);
}

.control-tabs>div>div>ul.nav-tabs>li a>span.title>span,
.control-tabs>div>ul.nav-tabs>li a>span.title>span,
.control-tabs>ul.nav-tabs>li a>span.title>span {
	border-top: 1px solid var(--border-color);
}

.control-tabs.primary-tabs>div>div>ul.nav-tabs:before,
.control-tabs.primary-tabs>div>ul.nav-tabs:before,
.control-tabs.primary-tabs>ul.nav-tabs:before {
	border-bottom: none;
}

/* Primary tabs inside popups/modal content need to inherit the local surface color */
.dark-mode:not(.tm-auth-light) .uk-modal-dialog .control-tabs.primary-tabs > ul.nav-tabs > li a > span.title::before,
.dark-mode:not(.tm-auth-light) .uk-modal-dialog .control-tabs.primary-tabs > div > ul.nav-tabs > li a > span.title::before,
.dark-mode:not(.tm-auth-light) .uk-modal-dialog .control-tabs.primary-tabs > div > div > ul.nav-tabs > li a > span.title::before,
.dark-mode:not(.tm-auth-light) .uk-modal-dialog .control-tabs.primary-tabs > ul.nav-tabs > li a > span.title::after,
.dark-mode:not(.tm-auth-light) .uk-modal-dialog .control-tabs.primary-tabs > div > ul.nav-tabs > li a > span.title::after,
.dark-mode:not(.tm-auth-light) .uk-modal-dialog .control-tabs.primary-tabs > div > div > ul.nav-tabs > li a > span.title::after,
.dark-mode:not(.tm-auth-light) .uk-modal-dialog .control-tabs.primary-tabs > div > ul.nav-tabs > li.active a::before,
.dark-mode:not(.tm-auth-light) .uk-modal-dialog .control-tabs.primary-tabs > div > div > ul.nav-tabs > li.active a::before,
.dark-mode:not(.tm-auth-light) .uk-modal-dialog .control-tabs.primary-tabs > ul.nav-tabs > li.active a::before,
.dark-mode:not(.tm-auth-light) .popup .control-tabs.primary-tabs > ul.nav-tabs > li a > span.title::before,
.dark-mode:not(.tm-auth-light) .popup .control-tabs.primary-tabs > div > ul.nav-tabs > li a > span.title::before,
.dark-mode:not(.tm-auth-light) .popup .control-tabs.primary-tabs > div > div > ul.nav-tabs > li a > span.title::before,
.dark-mode:not(.tm-auth-light) .popup .control-tabs.primary-tabs > ul.nav-tabs > li a > span.title::after,
.dark-mode:not(.tm-auth-light) .popup .control-tabs.primary-tabs > div > ul.nav-tabs > li a > span.title::after,
.dark-mode:not(.tm-auth-light) .popup .control-tabs.primary-tabs > div > div > ul.nav-tabs > li a > span.title::after,
.dark-mode:not(.tm-auth-light) .popup .control-tabs.primary-tabs > div > ul.nav-tabs > li.active a::before,
.dark-mode:not(.tm-auth-light) .popup .control-tabs.primary-tabs > div > div > ul.nav-tabs > li.active a::before,
.dark-mode:not(.tm-auth-light) .popup .control-tabs.primary-tabs > ul.nav-tabs > li.active a::before {
	background-color: var(--bg-secondary) !important;
	background: var(--bg-secondary) !important;
}

.dark-mode:not(.tm-auth-light) .uk-modal-dialog .control-tabs > div > div > ul.nav-tabs > li a > span.title > span,
.dark-mode:not(.tm-auth-light) .uk-modal-dialog .control-tabs > div > ul.nav-tabs > li a > span.title > span,
.dark-mode:not(.tm-auth-light) .uk-modal-dialog .control-tabs > ul.nav-tabs > li a > span.title > span,
.dark-mode:not(.tm-auth-light) .popup .control-tabs > div > div > ul.nav-tabs > li a > span.title > span,
.dark-mode:not(.tm-auth-light) .popup .control-tabs > div > ul.nav-tabs > li a > span.title > span,
.dark-mode:not(.tm-auth-light) .popup .control-tabs > ul.nav-tabs > li a > span.title > span {
	background: var(--bg-secondary);
}

.control-tabs .nav-tabs > li.active > a,
.control-tabs .nav-tabs > li.uk-active > a,
.control-tabs .nav.nav-tabs > li.active > a,
.control-tabs .nav.nav-tabs > li.uk-active > a {
	border-color: var(--border-color);
}

/* Form Fields */
.dark-mode:not(.tm-auth-light) .form-group label,
.dark-mode:not(.tm-auth-light) .field-text label,
.dark-mode:not(.tm-auth-light) .field-number label,
.dark-mode:not(.tm-auth-light) .field-textarea label {
	color: var(--text-primary);
}

.dark-mode:not(.tm-auth-light) .help-block,
.dark-mode:not(.tm-auth-light) .field-comment {
	color: var(--text-muted) !important;
}

.field-checkboxlist:not(.is-scrollable) .field-checkboxlist-inner {
	padding: 15px 15px !important;
}

.field-checkboxlist-quickselect {
	margin-bottom: 10px;
}

.field-checkboxlist-quickselect-group {
	width: auto;
	max-width: 100%;
}

.uk-button-group:not(.tm-button-group-outline) > .field-checkboxlist-quickselect-button,
.field-checkboxlist-quickselect-group > .field-checkboxlist-quickselect-button {
	width: auto;
	min-width: 0;
	height: 34px;
	padding: 0 12px;
	gap: 6px;
	white-space: nowrap;
	line-height: 1;
}

.field-checkboxlist-quickselect-icon {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	flex: 0 0 auto;
}

.field-checkboxlist-quickselect-text {
	display: inline-block;
	line-height: 1.2;
}

.dark-mode:not(.tm-auth-light) .field-checkboxlist,
.dark-mode:not(.tm-auth-light) .field-checkboxlist-inner {
	background: transparent !important;
}

.dark-mode:not(.tm-auth-light) .field-checkboxlist .checkbox.custom-checkbox {
	margin-bottom: 0.625rem;
	padding: 0.625rem 0.875rem;
	background: var(--bg-secondary);
	border: 1px solid var(--border-color);
	border-radius: 8px;
	overflow: hidden;
}

.dark-mode:not(.tm-auth-light) .field-checkboxlist .checkbox.custom-checkbox:last-child {
	margin-bottom: 0;
}

.dark-mode:not(.tm-auth-light) .field-checkboxlist .custom-checkbox:hover {
	background: var(--bg-tertiary);
	border-color: var(--maincolor2, #2563eb);
}

.dark-mode:not(.tm-auth-light) .field-checkboxlist .custom-checkbox label {
	display: block;
	width: 100%;
	margin: 0;
	padding: 0.125rem 0 0.125rem 2rem;
	color: var(--text-primary) !important;
}

.dark-mode:not(.tm-auth-light) .field-checkboxlist .custom-checkbox label:before {
	left: 0;
	top: 50%;
	transform: translateY(-50%);
	background-color: var(--input-bg) !important;
	border-color: var(--border-color) !important;
	box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.02);
}

.dark-mode:not(.tm-auth-light) .field-checkboxlist .custom-checkbox input[type="checkbox"]:focus + label:before {
	border-color: var(--maincolor2, #2563eb) !important;
	box-shadow: 0 0 0 3px rgba(59, 130, 246, 0.22);
}

.dark-mode:not(.tm-auth-light) .field-checkboxlist .custom-checkbox input[type="checkbox"]:checked + label:after {
	left: 6px;
	top: 50%;
	transform: translateY(-58%) rotate(45deg);
}

.dark-mode:not(.tm-auth-light) .field-checkboxlist .custom-checkbox input[type="checkbox"]:checked + label {
	color: var(--text-primary) !important;
}

/* Repeater Widget */
.dark-mode:not(.tm-auth-light) .field-repeater {
	background: var(--bg-primary);
	border: 1px solid rgba(148, 163, 184, 0.12);
	border-radius: 14px;
	padding: 10px;
}

.dark-mode:not(.tm-auth-light) .field-repeater .field-repeater-items {
	background: transparent;
	margin: 0;
	padding: 0;
}

.dark-mode:not(.tm-auth-light) .field-repeater .repeater-item {
	background: var(--bg-secondary);
	border: 1px solid var(--border-light);
	border-radius: 6px;
}

.dark-mode:not(.tm-auth-light) .field-repeater .repeater-item:hover {
	background: var(--bg-tertiary);
	border-color: var(--border-color);
}

.dark-mode:not(.tm-auth-light) .field-repeater li.field-repeater-item {
	background: var(--bg-secondary);
	border: 1px solid rgba(148, 163, 184, 0.14);
	border-radius: 10px;
	box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.02);
}

.dark-mode:not(.tm-auth-light) .field-repeater li.field-repeater-item::before,
.dark-mode:not(.tm-auth-light) .field-repeater li.field-repeater-item::after {
	color: rgba(148, 163, 184, 0.55);
}

.dark-mode:not(.tm-auth-light) .field-repeater ul.field-repeater-items > li.dragged {
	background: var(--bg-secondary);
	border: 1px dashed rgba(148, 163, 184, 0.28);
	box-shadow: var(--shadow-md);
}

.dark-mode:not(.tm-auth-light) .field-repeater ul.field-repeater-items > li.placeholder::before {
	color: var(--maincolor2, #2563eb);
}

.dark-mode:not(.tm-auth-light) .field-repeater .repeater-item-header {
	background: var(--bg-tertiary);
	border-bottom: 1px solid var(--border-color);
	color: var(--text-primary);
}

.dark-mode:not(.tm-auth-light) .field-repeater .repeater-item-header:hover {
	background: var(--bg-hover);
}

.dark-mode:not(.tm-auth-light) .field-repeater .repeater-item-content {
	background: var(--bg-primary);
}

.dark-mode:not(.tm-auth-light) .field-repeater .field-repeater-add-item {
	background: var(--bg-tertiary);
	border-color: var(--border-color);
	color: var(--text-primary);
}

.dark-mode:not(.tm-auth-light) .field-repeater .field-repeater-add-item:hover {
	background: var(--maincolor, #3b82f6);
	border-color: var(--maincolor, #3b82f6);
	color: var(--text-on-primary);
}

.dark-mode:not(.tm-auth-light) .field-repeater .field-repeater-form {
	background: transparent;
}

.dark-mode:not(.tm-auth-light) .field-repeater .repeater-item-collapsed-title {
	color: var(--text-primary);
}

.dark-mode:not(.tm-auth-light) .field-repeater .repeater-item-handle {
	background: var(--bg-primary);
	color: var(--text-muted);
	border: 1px solid rgba(148, 163, 184, 0.14);
	box-shadow: 0 8px 18px rgba(3, 8, 20, 0.18);
}

.dark-mode:not(.tm-auth-light) .field-repeater .repeater-item-handle:hover {
	background: var(--bg-hover);
	color: var(--text-primary);
}

.dark-mode:not(.tm-auth-light) .field-repeater .repeater-item-collapse a,
.dark-mode:not(.tm-auth-light) .field-repeater .repeater-item-collapse button,
.dark-mode:not(.tm-auth-light) .field-repeater .repeater-item-remove .close {
	color: var(--text-muted);
}

.dark-mode:not(.tm-auth-light) .field-repeater .repeater-item-collapse a:hover,
.dark-mode:not(.tm-auth-light) .field-repeater .repeater-item-collapse a:focus,
.dark-mode:not(.tm-auth-light) .field-repeater .repeater-item-collapse button:hover,
.dark-mode:not(.tm-auth-light) .field-repeater .repeater-item-collapse button:focus,
.dark-mode:not(.tm-auth-light) .field-repeater .repeater-item-remove .close:hover,
.dark-mode:not(.tm-auth-light) .field-repeater .repeater-item-remove .close:focus {
	color: var(--text-primary);
	text-decoration: none;
}

.dark-mode:not(.tm-auth-light) .field-repeater .field-repeater-add-item {
	border: 2px dashed rgba(148, 163, 184, 0.18);
	border-radius: 10px;
	margin: 0 !important;
	min-height: 0;
}

.dark-mode:not(.tm-auth-light) .field-repeater .field-repeater-add-item::before {
	display: none;
}

.dark-mode:not(.tm-auth-light) .field-repeater .field-repeater-add-item > a {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 10px;
	padding: 18px 20px;
	color: var(--text-secondary);
	text-transform: none;
	font-size: 0.95rem;
	font-weight: 600;
	letter-spacing: 0;
}

.dark-mode:not(.tm-auth-light) .field-repeater .field-repeater-add-item > a::before {
	content: "+";
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 24px;
	height: 24px;
	border-radius: 999px;
	background: rgba(148, 163, 184, 0.12);
	color: var(--text-primary);
	font-size: 1.1rem;
	font-weight: 700;
	line-height: 1;
}

.dark-mode:not(.tm-auth-light) .field-repeater .field-repeater-add-item:hover,
.dark-mode:not(.tm-auth-light) .field-repeater .field-repeater-add-item:focus {
	background: var(--bg-hover);
	border-color: rgba(148, 163, 184, 0.24);
}

.dark-mode:not(.tm-auth-light) .field-repeater .field-repeater-add-item:hover::before,
.dark-mode:not(.tm-auth-light) .field-repeater .field-repeater-add-item:focus::before,
.dark-mode:not(.tm-auth-light) .field-repeater .field-repeater-add-item:hover > a,
.dark-mode:not(.tm-auth-light) .field-repeater .field-repeater-add-item:focus > a {
	color: var(--text-primary);
}

.dark-mode:not(.tm-auth-light) .field-repeater .field-repeater-add-item:hover > a::before,
.dark-mode:not(.tm-auth-light) .field-repeater .field-repeater-add-item:focus > a::before {
	background: rgba(148, 163, 184, 0.18);
}

.dark-mode:not(.tm-auth-light) .field-repeater .field-repeater-add-item:active {
	background: rgba(59, 130, 246, 0.16);
	border-color: rgba(59, 130, 246, 0.24);
}

.dark-mode:not(.tm-auth-light) .field-repeater .field-repeater-add-item:active > a {
	color: var(--text-primary);
}

.dark-mode:not(.tm-auth-light) .field-repeater .field-repeater-add-item.in-progress {
	border-color: rgba(148, 163, 184, 0.18) !important;
	background: transparent !important;
}

.dark-mode:not(.tm-auth-light) .control-popover {
	background: var(--bg-primary);
	border: 1px solid rgba(148, 163, 184, 0.14);
	border-radius: 14px;
	box-shadow: 0 24px 48px rgba(3, 8, 20, 0.42);
}

.dark-mode:not(.tm-auth-light) .control-popover > div {
	background: transparent;
	border-radius: inherit;
}

.dark-mode:not(.tm-auth-light) .control-popover .popover-head {
	background: var(--bg-secondary);
	border-bottom: 1px solid rgba(148, 163, 184, 0.12);
	border-radius: 14px 14px 0 0;
}

.dark-mode:not(.tm-auth-light) .control-popover .popover-head h3 {
	color: var(--text-primary);
}

.dark-mode:not(.tm-auth-light) .control-popover .popover-head .close {
	color: var(--text-muted);
	opacity: 1;
}

.dark-mode:not(.tm-auth-light) .control-popover .popover-head .close:hover {
	color: var(--text-primary);
}

.dark-mode:not(.tm-auth-light) .control-popover .repeater-group-search-container,
.dark-mode:not(.tm-auth-light) .control-popover .popover-fixed-height,
.dark-mode:not(.tm-auth-light) .control-popover .repeater-group-items-container {
	background: var(--bg-primary);
	border-top-color: rgba(148, 163, 184, 0.08);
}

.dark-mode:not(.tm-auth-light) .control-popover .repeater-group-search-container > div {
	position: relative;
}

.dark-mode:not(.tm-auth-light) .control-popover .repeater-group-search-container .icon-search,
.dark-mode:not(.tm-auth-light) .control-popover .repeater-group-search-clear,
.dark-mode:not(.tm-auth-light) .control-popover .repeater-group-search-clear i {
	color: var(--text-muted);
}

.dark-mode:not(.tm-auth-light) .control-popover .repeater-group-search {
	background: var(--input-bg) !important;
	border: 1px solid rgba(148, 163, 184, 0.16) !important;
	border-radius: 999px !important;
	color: var(--text-primary) !important;
}

.dark-mode:not(.tm-auth-light) .control-popover .repeater-group-search::placeholder {
	color: var(--text-muted) !important;
}

.dark-mode:not(.tm-auth-light) .control-popover .repeater-group-no-results {
	color: var(--text-muted);
}

.dark-mode:not(.tm-auth-light) .control-popover .repeater-group-grid {
	background: transparent;
}

.dark-mode:not(.tm-auth-light) .control-popover .repeater-group-item a {
	background: var(--bg-secondary) !important;
	border: 1px solid rgba(148, 163, 184, 0.14) !important;
	border-radius: 12px !important;
	box-shadow: none !important;
	transform: none !important;
	color: var(--text-primary) !important;
}

.dark-mode:not(.tm-auth-light) .control-popover .repeater-group-item a:hover,
.dark-mode:not(.tm-auth-light) .control-popover .repeater-group-item a:focus {
	background: var(--bg-hover) !important;
	border-color: rgba(148, 163, 184, 0.24) !important;
}

.dark-mode:not(.tm-auth-light) .control-popover .repeater-group-item i {
	color: var(--text-primary);
}

.dark-mode:not(.tm-auth-light) .control-popover .repeater-group-item .title {
	color: var(--text-primary);
}

.dark-mode:not(.tm-auth-light) .control-popover .repeater-group-item .description {
	color: var(--text-muted);
}

.dark-mode:not(.tm-auth-light) .control-popover .scrollpad-scrollbar .drag-handle {
	background: rgba(148, 163, 184, 0.22);
}

/* Relation Manager */
.dark-mode:not(.tm-auth-light) .relation-manager {
	background: var(--bg-primary);
	border: 1px solid var(--border-color);
	border-radius: 8px;
}

.dark-mode:not(.tm-auth-light) .relation-manager .relation-toolbar {
	background: var(--bg-secondary);
	border-bottom: 1px solid var(--border-color);
}

.dark-mode:not(.tm-auth-light) .control-table,
.dark-mode:not(.tm-auth-light) .control-table .table-container {
	background: var(--bg-primary);
	border: 1px solid rgba(148, 163, 184, 0.16);
	border-radius: 10px;
}

body:not(.tm-auth-light) .control-table .toolbar {
	overflow: visible;
}

body:not(.tm-auth-light) .control-table .toolbar .btn,
body:not(.tm-auth-light) .control-table .toolbar .table-icon {
	background: var(--bg-primary);
	border-color: var(--border-color);
}

body:not(.tm-auth-light) .control-table .toolbar .btn:hover,
body:not(.tm-auth-light) .control-table .toolbar .table-icon:hover {
	background: var(--bg-hover);
	border-color: var(--border-color) !important;
	color: var(--text-primary);
}

.dark-mode:not(.tm-auth-light) .control-table .toolbar {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 10px;
	padding: 12px;
	background: var(--bg-secondary);
	border-bottom: 1px solid rgba(148, 163, 184, 0.12);
	overflow: visible;
}

.dark-mode:not(.tm-auth-light) .control-table .toolbar .btn,
.dark-mode:not(.tm-auth-light) .control-table .toolbar .table-icon {
	background: var(--bg-tertiary);
	border: 1px solid rgba(148, 163, 184, 0.12);
	color: var(--text-primary);
	border-radius: 8px;
}

.dark-mode:not(.tm-auth-light) .control-table .toolbar .btn:hover,
.dark-mode:not(.tm-auth-light) .control-table .toolbar .table-icon:hover {
	background: var(--bg-hover);
	border-color: var(--maincolor2, #2563eb) !important;
	color: var(--text-primary);
}

.dark-mode:not(.tm-auth-light) .control-table .toolbar .btn.disabled,
.dark-mode:not(.tm-auth-light) .control-table .toolbar .btn[disabled],
.dark-mode:not(.tm-auth-light) .control-table .toolbar .table-icon.disabled,
.dark-mode:not(.tm-auth-light) .control-table .toolbar .table-icon[disabled] {
	opacity: 0.5;
	background: var(--bg-secondary);
	color: var(--text-muted);
}

.dark-mode:not(.tm-auth-light) .control-table .table-search {
	margin-left: auto;
}

.dark-mode:not(.tm-auth-light) .control-table .table-search-input {
	background: var(--input-bg) !important;
	border: 1px solid rgba(148, 163, 184, 0.18) !important;
	color: var(--text-primary) !important;
	border-radius: 999px !important;
	min-width: 260px;
}

.dark-mode:not(.tm-auth-light) .control-table .table-search-input::placeholder {
	color: var(--text-muted) !important;
}

.dark-mode:not(.tm-auth-light) input.form-control.icon.search,
.dark-mode:not(.tm-auth-light) .form-control.icon.search.growable {
	background-color: var(--input-bg) !important;
	background-image: none !important;
	color: var(--text-primary) !important;
}

.dark-mode:not(.tm-auth-light) .loading-indicator-container.size-input-text,
.dark-mode:not(.tm-auth-light) .loading-indicator-container.size-input-text .clear-input-text,
.dark-mode:not(.tm-auth-light) .loading-indicator-container.size-input-text .clear-input-text:hover,
.dark-mode:not(.tm-auth-light) .loading-indicator-container.size-input-text .clear-input-text:focus {
	background: transparent !important;
	box-shadow: none !important;
}

.dark-mode:not(.tm-auth-light) .loading-indicator-container.size-input-text .clear-input-text {
	border: 0 !important;
}

.dark-mode:not(.tm-auth-light) .control-table table {
	width: 100%;
	background: var(--bg-primary);
}

.dark-mode:not(.tm-auth-light) .control-table table.headers {
	background: var(--bg-secondary);
}

.dark-mode:not(.tm-auth-light) .control-table table.headers th {
	background: var(--bg-secondary);
	color: var(--text-secondary);
	border-bottom: 1px solid rgba(148, 163, 184, 0.12);
	border-right: 1px solid rgba(148, 163, 184, 0.08);
}

.dark-mode:not(.tm-auth-light) .control-table table.headers th:last-child {
	border-right: 0;
}

.dark-mode:not(.tm-auth-light) .control-table .header-language {
	color: var(--text-secondary);
}

.dark-mode:not(.tm-auth-light) .control-table .header-language i {
	color: var(--text-muted);
}

.dark-mode:not(.tm-auth-light) .control-table table.data tbody tr {
	background: var(--bg-primary);
}

.dark-mode:not(.tm-auth-light) .control-table table.data tbody tr:nth-child(even) {
	background: color-mix(in srgb, var(--bg-primary) 72%, var(--bg-secondary) 28%);
}

.dark-mode:not(.tm-auth-light) .control-table table.data tbody tr:hover {
	background: var(--bg-hover);
}

.dark-mode:not(.tm-auth-light) .control-table table.data td {
	border-top: 1px solid #25314d !important;
	border-right: 1px solid rgba(37, 49, 77, 0.55) !important;
	border-bottom: 0 !important;
	box-shadow: none !important;
	color: var(--text-primary);
}

.dark-mode:not(.tm-auth-light) .control-table table.data td:last-child {
	border-right: 0;
}

.dark-mode:not(.tm-auth-light) .control-table .content-container {
	background: transparent;
	color: var(--text-primary);
}

.dark-mode:not(.tm-auth-light) .control-table .content-container.readonly {
	background: rgba(148, 163, 184, 0.08);
	color: var(--text-secondary);
}

.dark-mode:not(.tm-auth-light) .control-table [data-view-container="data-view-container"] {
	color: inherit;
}

.dark-mode:not(.tm-auth-light) .control-table .pagination {
	background: var(--bg-secondary);
	border-top: 1px solid rgba(148, 163, 184, 0.12);
}

.dark-mode:not(.tm-auth-light) .control-table .pagination > ul > li > a,
.dark-mode:not(.tm-auth-light) .control-table .pagination > ul > li > span,
.dark-mode:not(.tm-auth-light) .control-table .pagination .pagination-link {
	background: var(--bg-primary);
	border-color: var(--border-color);
	color: var(--text-primary);
}

.dark-mode:not(.tm-auth-light) .control-table .pagination > ul > li.active > a,
.dark-mode:not(.tm-auth-light) .control-table .pagination > ul > li.active > span,
.dark-mode:not(.tm-auth-light) .control-table .pagination .active .pagination-link {
	background: var(--maincolor2, #2563eb);
	border-color: var(--maincolor2, #2563eb);
	color: var(--text-on-primary);
}

.dark-mode:not(.tm-auth-light) .relation-manager .relation-list {
	background: var(--bg-primary);
}

.dark-mode:not(.tm-auth-light) .relation-manager .relation-list-item {
	border-bottom: 1px solid var(--border-light);
}

.dark-mode:not(.tm-auth-light) .relation-manager .relation-list-item:hover {
	background: var(--bg-hover);
}

/* File Upload Widget */
.dark-mode:not(.tm-auth-light) .field-fileupload {
	background: var(--bg-primary);
	border: 1px solid var(--border-color);
	border-radius: 8px;
}

.dark-mode:not(.tm-auth-light) .field-fileupload .upload-object {
	background: var(--bg-secondary);
	border: 1px solid var(--border-light);
	border-radius: 6px;
}

.dark-mode:not(.tm-auth-light) .field-fileupload .upload-object:hover {
	background: var(--bg-tertiary);
	border-color: var(--border-color);
}

.dark-mode:not(.tm-auth-light) .field-fileupload .upload-button {
	background: var(--bg-tertiary);
	border-color: var(--border-color);
	color: var(--text-primary);
}

.dark-mode:not(.tm-auth-light) .field-fileupload .upload-button:hover {
	background: var(--maincolor, #3b82f6);
	border-color: var(--maincolor, #3b82f6);
	color: var(--text-on-primary);
}

.dark-mode:not(.tm-auth-light) .field-fileupload.style-file-multi {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 14px;
	padding: 14px;
	border-radius: 14px;
}

.dark-mode:not(.tm-auth-light) .field-fileupload.style-file-multi .upload-button {
	display: inline-flex;
	align-items: center;
	gap: 10px;
	padding: 10px 16px;
	border-radius: 12px;
	background: #27314a;
	border: 1px solid rgba(148, 163, 184, 0.16);
	box-shadow: none;
	font-size: 0.95rem;
	font-weight: 600;
}

.dark-mode:not(.tm-auth-light) .field-fileupload.style-file-multi .upload-button:hover,
.dark-mode:not(.tm-auth-light) .field-fileupload.style-file-multi .upload-button:focus {
	background: var(--bg-hover);
	border-color: rgba(148, 163, 184, 0.24);
	color: var(--text-primary);
}

.dark-mode:not(.tm-auth-light) .field-fileupload.style-file-multi .upload-files-container {
	width: 100%;
	min-height: 120px;
	padding: 18px;
	border: 1px dashed rgba(148, 163, 184, 0.18);
	border-radius: 12px;
	background: rgba(255, 255, 255, 0.015);
}

.dark-mode:not(.tm-auth-light) .field-fileupload.style-file-multi .upload-files-container:empty::before {
	content: "No files uploaded yet";
	display: block;
	color: var(--text-muted);
	font-size: 0.92rem;
}

.dark-mode:not(.tm-auth-light) .field-fileupload.style-file-multi .upload-object {
	border-radius: 10px;
}

.dark-mode:not(.tm-auth-light) .field-fileupload.style-image-multi {
	padding: 8px;
	background: transparent;
	border: 0;
	border-radius: 0;
	box-shadow: none;
}

.dark-mode:not(.tm-auth-light) .field-fileupload.style-image-multi .upload-button {
	float: left;
	width: 76px;
	height: 76px;
	border-radius: 14px;
	border: 1px dashed rgba(148, 163, 184, 0.18) !important;
	background: #21497a;
	box-shadow: none !important;
}

.dark-mode:not(.tm-auth-light) .field-fileupload.style-image-multi .upload-files-container {
	margin-left: 90px;
}

.dark-mode:not(.tm-auth-light) .field-fileupload.style-image-multi .upload-object {
	width: 260px;
	overflow: hidden;
	border-radius: 14px;
}

.dark-mode:not(.tm-auth-light) .field-fileupload.style-image-multi .upload-object .icon-container {
	float: left;
	width: 75px;
	height: 75px;
	border-right: 1px solid rgba(148, 163, 184, 0.14);
	border-radius: 14px 0 0 14px;
	overflow: hidden;
	display: flex;
	align-items: center;
	justify-content: center;
}

.dark-mode:not(.tm-auth-light) .field-fileupload.style-image-multi .upload-object .icon-container img {
	width: auto;
	height: auto;
	max-height: 100%;
	border-radius: 0;
}

.dark-mode:not(.tm-auth-light) .field-fileupload.style-image-multi .upload-object .info {
	margin-left: 90px;
	padding-right: 14px;
}

.dark-mode:not(.tm-auth-light) .field-fileupload.style-image-multi .upload-object .meta {
	position: absolute;
	bottom: 0;
	left: 0;
	right: 0;
	margin: 0 15px 0 90px;
}

.dark-mode:not(.tm-auth-light) .field-fileupload.style-image-multi .upload-object .drag-handle {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 36px;
	height: 36px;
	border-radius: 10px;
	color: var(--text-muted) !important;
}

.dark-mode:not(.tm-auth-light) .field-fileupload.style-image-single {
	display: inline-flex;
	align-items: flex-start;
	gap: 12px;
	width: auto;
	max-width: 100%;
	padding: 0;
	border: 0;
	background: transparent;
}

.dark-mode:not(.tm-auth-light) .field-fileupload.style-image-single .upload-files-container {
	display: inline-flex;
	width: auto;
	max-width: 100%;
}

.dark-mode:not(.tm-auth-light) .field-fileupload.style-image-single .upload-object {
	display: inline-flex;
	flex-direction: column;
	align-items: stretch;
	width: auto;
	max-width: 236px;
	overflow: hidden;
}

.dark-mode:not(.tm-auth-light) .field-fileupload.style-image-single .upload-object .info {
	width: 100%;
	min-width: 0;
	padding: 10px 12px 12px;
}

.dark-mode:not(.tm-auth-light) .field-fileupload.style-image-single .upload-object .filename {
	margin: 0 0 6px;
	font-size: 0.95rem;
	line-height: 1.35;
}

.dark-mode:not(.tm-auth-light) .field-fileupload.style-image-single .upload-object .filename span {
	display: block;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}

.dark-mode:not(.tm-auth-light) .field-fileupload.style-image-single .upload-object .size {
	color: var(--text-secondary);
}

/* Code Editor */
.dark-mode:not(.tm-auth-light) .field-codeeditor .CodeMirror {
	background: var(--bg-tertiary) !important;
	color: var(--text-primary) !important;
	border: 1px solid var(--border-color);
	border-radius: 8px;
}

.dark-mode:not(.tm-auth-light) .field-codeeditor .CodeMirror-gutters {
	background: var(--bg-secondary) !important;
	border-right: 1px solid var(--border-color) !important;
}

.dark-mode:not(.tm-auth-light) .field-codeeditor .CodeMirror-linenumber {
	color: var(--text-muted) !important;
}

.dark-mode:not(.tm-auth-light) .field-codeeditor .CodeMirror-cursor {
	border-left-color: var(--text-primary) !important;
}

.dark-mode:not(.tm-auth-light) .field-codeeditor .CodeMirror-selected {
	background: rgba(59, 130, 246, 0.2) !important;
}

/* Markdown Editor */
.dark-mode:not(.tm-auth-light) .field-markdowneditor {
	background: var(--bg-primary);
	border: 1px solid var(--border-color);
	border-radius: 10px;
	overflow: hidden;
}

.dark-mode:not(.tm-auth-light) .field-markdowneditor .TinyMDE {
	background: var(--bg-primary);
	border: 1px solid var(--border-color);
	border-radius: 8px;
}

.dark-mode:not(.tm-auth-light) .field-markdowneditor .editor-toolbar,
.dark-mode:not(.tm-auth-light) .field-markdowneditor .TinyMDE .editor-toolbar {
	background: var(--bg-secondary);
	border-bottom: 1px solid var(--border-color);
}

.dark-mode:not(.tm-auth-light) .field-markdowneditor .editor-toolbar .toolbar-item + .toolbar-item {
	border-left: 1px solid var(--border-color);
}

.dark-mode:not(.tm-auth-light) .field-markdowneditor .editor-toolbar .btn,
.dark-mode:not(.tm-auth-light) .field-markdowneditor .TinyMDE .editor-toolbar button {
	background: transparent;
	border-color: var(--border-color);
	color: var(--text-secondary);
}

.dark-mode:not(.tm-auth-light) .field-markdowneditor .editor-toolbar .btn:hover,
.dark-mode:not(.tm-auth-light) .field-markdowneditor .editor-toolbar .btn:focus,
.dark-mode:not(.tm-auth-light) .field-markdowneditor .editor-toolbar .btn.active,
.dark-mode:not(.tm-auth-light) .field-markdowneditor .TinyMDE .editor-toolbar button:hover,
.dark-mode:not(.tm-auth-light) .field-markdowneditor .TinyMDE .editor-toolbar button.active {
	background: var(--bg-hover);
	color: var(--text-primary);
}

.dark-mode:not(.tm-auth-light) .field-markdowneditor .dropdown-menu {
	background: var(--bg-secondary);
	border: 1px solid var(--border-color);
	box-shadow: var(--shadow-lg);
}

.dark-mode:not(.tm-auth-light) .field-markdowneditor .dropdown-menu li a,
.dark-mode:not(.tm-auth-light) .field-markdowneditor .dropdown-menu .dropdown-container > ul li a,
.dark-mode:not(.tm-auth-light) .field-markdowneditor .md-dropdown-button {
	color: var(--text-primary) !important;
}

.dark-mode:not(.tm-auth-light) .field-markdowneditor .dropdown-menu li a:hover,
.dark-mode:not(.tm-auth-light) .field-markdowneditor .dropdown-menu li a:focus,
.dark-mode:not(.tm-auth-light) .field-markdowneditor .dropdown-menu .dropdown-container > ul li a:hover,
.dark-mode:not(.tm-auth-light) .field-markdowneditor .dropdown-menu .dropdown-container > ul li a:focus,
.dark-mode:not(.tm-auth-light) .field-markdowneditor .md-dropdown-button:hover,
.dark-mode:not(.tm-auth-light) .field-markdowneditor .md-dropdown-button:focus {
	background: var(--bg-hover) !important;
	color: var(--text-primary) !important;
}

.dark-mode:not(.tm-auth-light) .field-markdowneditor .editor-write,
.dark-mode:not(.tm-auth-light) .field-markdowneditor .editor-preview,
.dark-mode:not(.tm-auth-light) .field-markdowneditor textarea {
	background: var(--bg-primary) !important;
	color: var(--text-primary) !important;
}

.dark-mode:not(.tm-auth-light) .field-markdowneditor .editor-preview {
	border-left: 1px solid var(--border-color);
}

.dark-mode:not(.tm-auth-light) .field-markdowneditor .editor-preview,
.dark-mode:not(.tm-auth-light) .field-markdowneditor .editor-preview p,
.dark-mode:not(.tm-auth-light) .field-markdowneditor .editor-preview li,
.dark-mode:not(.tm-auth-light) .field-markdowneditor .editor-preview h1,
.dark-mode:not(.tm-auth-light) .field-markdowneditor .editor-preview h2,
.dark-mode:not(.tm-auth-light) .field-markdowneditor .editor-preview h3,
.dark-mode:not(.tm-auth-light) .field-markdowneditor .editor-preview h4,
.dark-mode:not(.tm-auth-light) .field-markdowneditor .editor-preview h5,
.dark-mode:not(.tm-auth-light) .field-markdowneditor .editor-preview h6,
.dark-mode:not(.tm-auth-light) .field-markdowneditor .editor-preview blockquote,
.dark-mode:not(.tm-auth-light) .field-markdowneditor .editor-preview code,
.dark-mode:not(.tm-auth-light) .field-markdowneditor .editor-preview pre {
	color: var(--text-primary) !important;
}

.dark-mode:not(.tm-auth-light) .field-markdowneditor .ace_editor,
.dark-mode:not(.tm-auth-light) .field-markdowneditor .ace_editor.ace-github,
.dark-mode:not(.tm-auth-light) .field-markdowneditor .ace_scroller,
.dark-mode:not(.tm-auth-light) .field-markdowneditor .ace_content {
	background: var(--bg-primary) !important;
}

.dark-mode:not(.tm-auth-light) .field-markdowneditor .ace_text-layer,
.dark-mode:not(.tm-auth-light) .field-markdowneditor .ace_text-layer .ace_text,
.dark-mode:not(.tm-auth-light) .field-markdowneditor .ace_line,
.dark-mode:not(.tm-auth-light) .field-markdowneditor .ace_line span {
	color: var(--text-primary) !important;
}

.dark-mode:not(.tm-auth-light) .field-markdowneditor .ace_cursor {
	border-left-color: var(--text-primary) !important;
}

.dark-mode:not(.tm-auth-light) .field-markdowneditor .ace_marker-layer .ace_active-line {
	background: rgba(59, 130, 246, 0.08) !important;
}

.dark-mode:not(.tm-auth-light) .field-markdowneditor .ace_marker-layer .ace_selection {
	background: rgba(59, 130, 246, 0.2) !important;
}

.dark-mode:not(.tm-auth-light) .field-markdowneditor .ace_print-margin {
	background: var(--border-light) !important;
}

.dark-mode:not(.tm-auth-light) .field-markdowneditor .ace_gutter,
.dark-mode:not(.tm-auth-light) .field-markdowneditor .ace_scrollbar,
.dark-mode:not(.tm-auth-light) .field-markdowneditor .ace_scrollbar-inner {
	background: var(--bg-primary) !important;
	border-color: var(--border-color) !important;
}

.dark-mode:not(.tm-auth-light) .field-markdowneditor .TinyMDE .editor-content {
	background: var(--bg-primary);
	color: var(--text-primary);
}

.dark-mode:not(.tm-auth-light) .callout {
	background: var(--bg-primary);
	border: 1px solid var(--border-color);
	border-radius: 10px;
	overflow: hidden;
	box-shadow: var(--shadow-sm);
	outline: none;
}

.dark-mode:not(.tm-auth-light) .callout .header {
	display: flex;
	align-items: center;
	gap: 12px;
	padding: 16px 20px;
	background: var(--bg-secondary);
	border-bottom: 1px solid var(--border-color);
}

.dark-mode:not(.tm-auth-light) .callout .header i,
.dark-mode:not(.tm-auth-light) .callout .header .icon-info,
.dark-mode:not(.tm-auth-light) .callout .header .icon-warning,
.dark-mode:not(.tm-auth-light) .callout .header .icon-success,
.dark-mode:not(.tm-auth-light) .callout .header .icon-error {
	color: var(--text-primary);
	opacity: 0.9;
}

.dark-mode:not(.tm-auth-light) .callout .header h3 {
	margin: 0;
	color: var(--text-primary);
}

.dark-mode:not(.tm-auth-light) .callout .content {
	padding: 18px 20px;
	background: var(--bg-primary);
	color: var(--text-secondary);
	border: 0 !important;
	box-shadow: none !important;
}

.dark-mode:not(.tm-auth-light) .callout .content p:last-child {
	margin-bottom: 0;
}

.dark-mode:not(.tm-auth-light) .callout::before,
.dark-mode:not(.tm-auth-light) .callout::after,
.dark-mode:not(.tm-auth-light) .callout .header::before,
.dark-mode:not(.tm-auth-light) .callout .header::after,
.dark-mode:not(.tm-auth-light) .callout .content::before,
.dark-mode:not(.tm-auth-light) .callout .content::after {
	border-color: transparent !important;
	box-shadow: none !important;
}

.dark-mode:not(.tm-auth-light) .callout.callout-info {
	border-color: rgba(59, 130, 246, 0.3);
}

.dark-mode:not(.tm-auth-light) .callout.callout-info .header {
	background: rgba(59, 130, 246, 0.16);
}

.dark-mode:not(.tm-auth-light) .callout.callout-info .header i {
	color: var(--color-info-light);
}

.dark-mode:not(.tm-auth-light) .callout.callout-success {
	border-color: rgba(34, 197, 94, 0.3);
}

.dark-mode:not(.tm-auth-light) .callout.callout-success .header {
	background: rgba(34, 197, 94, 0.16);
}

.dark-mode:not(.tm-auth-light) .callout.callout-success .header i {
	color: var(--color-success-light);
}

.dark-mode:not(.tm-auth-light) .callout.callout-warning {
	border-color: rgba(245, 158, 11, 0.32);
}

.dark-mode:not(.tm-auth-light) .callout.callout-warning .header {
	background: rgba(245, 158, 11, 0.16);
}

.dark-mode:not(.tm-auth-light) .callout.callout-warning .header i {
	color: var(--color-warning-light);
}

.dark-mode:not(.tm-auth-light) .callout.callout-danger,
.dark-mode:not(.tm-auth-light) .callout.callout-error {
	border-color: rgba(239, 68, 68, 0.32);
}

.dark-mode:not(.tm-auth-light) .callout.callout-danger .header,
.dark-mode:not(.tm-auth-light) .callout.callout-error .header {
	background: rgba(239, 68, 68, 0.16);
}

.dark-mode:not(.tm-auth-light) .callout.callout-danger .header i,
.dark-mode:not(.tm-auth-light) .callout.callout-error .header i {
	color: var(--color-danger-light);
}

.dark-mode:not(.tm-auth-light) .sweet-overlay,
.dark-mode:not(.tm-auth-light) .sweet-alert-overlay,
.dark-mode:not(.tm-auth-light) .sweet-alert[data-overlay="true"] {
	background-color: rgba(7, 11, 24, 0.56) !important;
}

.dark-mode:not(.tm-auth-light) .sweet-alert {
	background: var(--bg-primary) !important;
	border: 1px solid rgba(148, 163, 184, 0.14) !important;
	border-radius: 16px !important;
	box-shadow: 0 24px 48px rgba(3, 8, 20, 0.42) !important;
	color: var(--text-primary) !important;
}

.dark-mode:not(.tm-auth-light) .sweet-alert h2 {
	color: var(--text-primary) !important;
}

.dark-mode:not(.tm-auth-light) .sweet-alert p,
.dark-mode:not(.tm-auth-light) .sweet-alert .lead,
.dark-mode:not(.tm-auth-light) .sweet-alert .text-muted {
	color: var(--text-secondary) !important;
}

.dark-mode:not(.tm-auth-light) .sweet-alert button.cancel.btn.btn-default {
	background: var(--bg-secondary) !important;
	border: 1px solid rgba(148, 163, 184, 0.16) !important;
	color: var(--text-primary) !important;
}

.dark-mode:not(.tm-auth-light) .sweet-alert button.cancel.btn.btn-default:hover,
.dark-mode:not(.tm-auth-light) .sweet-alert button.cancel.btn.btn-default:focus {
	background: var(--bg-hover) !important;
	border-color: rgba(148, 163, 184, 0.22) !important;
	color: var(--text-primary) !important;
}

.dark-mode:not(.tm-auth-light) .sweet-alert button.confirm.btn.btn-primary {
	background: var(--maincolor2, #2563eb) !important;
	border: 1px solid var(--maincolor2, #2563eb) !important;
	color: var(--text-on-primary) !important;
}

.dark-mode:not(.tm-auth-light) .sweet-alert button.confirm.btn.btn-primary:hover,
.dark-mode:not(.tm-auth-light) .sweet-alert button.confirm.btn.btn-primary:focus {
	background: var(--maincolor, #3b82f6) !important;
	border-color: var(--maincolor, #3b82f6) !important;
}

.dark-mode:not(.tm-auth-light) .sweet-alert .icon.error,
.dark-mode:not(.tm-auth-light) .sweet-alert .icon.error .x-mark .line {
	border-color: var(--color-danger) !important;
	background-color: var(--color-danger) !important;
}

.dark-mode:not(.tm-auth-light) .sweet-alert .icon.warning {
	border-color: var(--color-warning) !important;
}

.dark-mode:not(.tm-auth-light) .sweet-alert .icon.warning .body,
.dark-mode:not(.tm-auth-light) .sweet-alert .icon.warning .dot {
	background-color: var(--color-warning) !important;
}

.dark-mode:not(.tm-auth-light) .sweet-alert .icon.info {
	border-color: var(--color-info) !important;
	color: var(--color-info-light) !important;
}

.dark-mode:not(.tm-auth-light) .sweet-alert .icon.success {
	border-color: var(--color-success) !important;
}

.dark-mode:not(.tm-auth-light) .sweet-alert .icon.success .line {
	background-color: var(--color-success) !important;
}

.dark-mode:not(.tm-auth-light) .sweet-alert .icon.success .placeholder {
	border-color: rgba(34, 197, 94, 0.25) !important;
}

/* Alerts & Notifications */
.dark-mode:not(.tm-auth-light) .alert {
	background: var(--bg-primary);
	border: 1px solid var(--border-color);
	border-radius: 8px;
	color: var(--text-primary);
}

.dark-mode:not(.tm-auth-light) .alert-success {
	background: rgba(34, 197, 94, 0.15);
	border-color: rgba(34, 197, 94, 0.3);
	color: var(--color-success-light);
}

.dark-mode:not(.tm-auth-light) .alert-danger {
	background: rgba(239, 68, 68, 0.15);
	border-color: rgba(239, 68, 68, 0.3);
	color: var(--color-danger-light);
}

.dark-mode:not(.tm-auth-light) .alert-warning {
	background: rgba(245, 158, 11, 0.15);
	border-color: rgba(245, 158, 11, 0.3);
	color: var(--color-warning-light);
}

.dark-mode:not(.tm-auth-light) .alert-info {
	background: rgba(59, 130, 246, 0.15);
	border-color: rgba(59, 130, 246, 0.3);
	color: var(--color-info-light);
}

/* Flash Messages */
.dark-mode:not(.tm-auth-light) #layout-flash-messages .flash-message {
	background: var(--bg-primary);
	border: 1px solid var(--border-color);
	border-radius: 8px;
	box-shadow: var(--shadow-md);
	color: var(--text-primary);
}

.dark-mode:not(.tm-auth-light) #layout-flash-messages .flash-message.success {
	background: rgba(34, 197, 94, 0.15);
	border-color: rgba(34, 197, 94, 0.3);
	color: var(--color-success-light);
}

.dark-mode:not(.tm-auth-light) #layout-flash-messages .flash-message.error {
	background: rgba(239, 68, 68, 0.15);
	border-color: rgba(239, 68, 68, 0.3);
	color: var(--color-danger-light);
}

/* List Widget Enhancements */
.dark-mode:not(.tm-auth-light) .control-list {
	background: var(--bg-primary);
	border: 1px solid var(--border-color);
	border-radius: 8px;
}

.dark-mode:not(.tm-auth-light) .control-list table th {
	background: var(--bg-secondary);
	color: var(--text-secondary);
	border-bottom: 1px solid var(--border-color);
}

.dark-mode:not(.tm-auth-light) .control-list table td {
	border-bottom: 1px solid var(--border-light);
	color: var(--text-primary);
}

.dark-mode:not(.tm-auth-light) .control-list table tr:hover td {
	background: var(--bg-hover);
}

.dark-mode:not(.tm-auth-light) .control-list .no-data {
	color: var(--text-muted);
}

/* Pagination */
.dark-mode:not(.tm-auth-light) .pagination > li > a,
.dark-mode:not(.tm-auth-light) .pagination > li > span {
	background: var(--bg-tertiary);
	border-color: var(--border-color);
	color: var(--text-primary);
}

.dark-mode:not(.tm-auth-light) .pagination > li > a:hover,
.dark-mode:not(.tm-auth-light) .pagination > li > span:hover {
	background: var(--bg-secondary);
	border-color: var(--border-color);
	color: var(--text-primary);
}

.dark-mode:not(.tm-auth-light) .pagination > .active > a,
.dark-mode:not(.tm-auth-light) .pagination > .active > span {
	background: var(--maincolor, #3b82f6);
	border-color: var(--maincolor, #3b82f6);
	color: var(--text-on-primary);
}

/* Breadcrumb */
.dark-mode:not(.tm-auth-light) .control-breadcrumb {
	background: var(--bg-primary);
	border-bottom: 1px solid var(--border-light);
}

.dark-mode:not(.tm-auth-light) .control-breadcrumb a {
	color: var(--text-secondary);
}

.dark-mode:not(.tm-auth-light) .control-breadcrumb a:hover {
	color: var(--text-primary);
}

.dark-mode:not(.tm-auth-light) .control-breadcrumb .breadcrumb-item.active {
	color: var(--text-primary);
}

/* Loading Indicators */
.dark-mode:not(.tm-auth-light) .loading-indicator {
	background: var(--bg-primary);
	border: 1px solid var(--border-color);
	border-radius: 8px;
	box-shadow: var(--shadow-lg);
}

.dark-mode:not(.tm-auth-light) .loading-indicator .indicator {
	color: var(--maincolor, #3b82f6);
}

/* Permission Editor */
.dark-mode:not(.tm-auth-light) .permissioneditor table {
	background: var(--bg-primary);
	border: 1px solid var(--border-color);
	border-radius: 8px;
}

.dark-mode:not(.tm-auth-light) .permissioneditor table th {
	background: var(--bg-secondary);
	color: var(--text-secondary);
	border-bottom: 1px solid var(--border-color);
}

.dark-mode:not(.tm-auth-light) .permissioneditor table td {
	border-bottom: 1px solid var(--border-light);
	color: var(--text-primary);
}

/* Date/Time Picker */
.dark-mode:not(.tm-auth-light) .datepicker,
.dark-mode:not(.tm-auth-light) .pika-single,
.dark-mode:not(.tm-auth-light) .timepicker {
	background: var(--bg-primary) !important;
	border: 1px solid var(--border-color) !important;
	box-shadow: var(--shadow-lg) !important;
}

.dark-mode:not(.tm-auth-light) .datepicker table th,
.dark-mode:not(.tm-auth-light) .pika-table th,
.dark-mode:not(.tm-auth-light) .timepicker table th {
	color: var(--text-secondary);
}

.dark-mode:not(.tm-auth-light) .datepicker table td,
.dark-mode:not(.tm-auth-light) .pika-table td,
.dark-mode:not(.tm-auth-light) .timepicker table td {
	color: var(--text-primary);
}

.dark-mode:not(.tm-auth-light) .datepicker table td.day:hover,
.dark-mode:not(.tm-auth-light) .pika-button:hover,
.dark-mode:not(.tm-auth-light) .timepicker table td:hover {
	background: var(--bg-hover);
}

.dark-mode:not(.tm-auth-light) .datepicker table td.day.active,
.dark-mode:not(.tm-auth-light) .pika-table td.is-selected .pika-button,
.dark-mode:not(.tm-auth-light) .timepicker table td.active {
	background: var(--maincolor, #3b82f6);
	color: var(--text-on-primary);
}

.dark-mode:not(.tm-auth-light) .field-datepicker .input-with-icon {
	background: var(--input-bg) !important;
	border: 1px solid var(--border-color) !important;
	border-radius: 8px !important;
	box-shadow: none !important;
}

.dark-mode:not(.tm-auth-light) .field-datepicker .input-with-icon > .form-control,
.dark-mode:not(.tm-auth-light) .field-datepicker .input-with-icon > .uk-input {
	background: transparent !important;
	border: 0 !important;
	box-shadow: none !important;
	color: var(--text-primary) !important;
}

.dark-mode:not(.tm-auth-light) .field-datepicker .input-with-icon > .icon,
.dark-mode:not(.tm-auth-light) .field-datepicker .input-with-icon > i {
	color: var(--text-muted) !important;
}

.dark-mode:not(.tm-auth-light) .clockpicker-popover {
	background: var(--bg-primary) !important;
	border: 1px solid var(--border-color) !important;
	border-radius: 12px !important;
	box-shadow: var(--shadow-lg) !important;
}

.dark-mode:not(.tm-auth-light) .clockpicker-popover .popover-title {
	background: var(--bg-secondary) !important;
	border-bottom: 1px solid var(--border-light) !important;
	color: var(--text-primary) !important;
}

.dark-mode:not(.tm-auth-light) .clockpicker-popover .popover-content {
	background: var(--bg-primary) !important;
	color: var(--text-primary) !important;
}

.dark-mode:not(.tm-auth-light) .clockpicker-popover .clockpicker-plate {
	background: var(--bg-secondary) !important;
	border: 1px solid var(--border-color) !important;
}

.dark-mode:not(.tm-auth-light) .clockpicker-popover .clockpicker-tick {
	color: var(--text-primary) !important;
}

.dark-mode:not(.tm-auth-light) .clockpicker-popover .clockpicker-tick:hover,
.dark-mode:not(.tm-auth-light) .clockpicker-popover .clockpicker-tick.active {
	background: rgba(255, 255, 255, 0.08) !important;
	color: var(--text-primary) !important;
}

.dark-mode:not(.tm-auth-light) .clockpicker-popover .clockpicker-canvas line {
	stroke: #8ec5ff !important;
	stroke-width: 2px !important;
	opacity: 1 !important;
}

.dark-mode:not(.tm-auth-light) .clockpicker-popover .clockpicker-canvas-out {
	opacity: 0.78 !important;
}

.dark-mode:not(.tm-auth-light) .clockpicker-popover .clockpicker-canvas-bearing,
.dark-mode:not(.tm-auth-light) .clockpicker-popover .clockpicker-canvas-fg {
	fill: #8ec5ff !important;
}

.dark-mode:not(.tm-auth-light) .clockpicker-popover .clockpicker-canvas-bg {
	fill: rgba(59, 130, 246, 0.35) !important;
}

.dark-mode:not(.tm-auth-light) .clockpicker-popover .clockpicker-canvas-bg-trans {
	fill: rgba(59, 130, 246, 0.52) !important;
}

.dark-mode:not(.tm-auth-light) .clockpicker-popover .clockpicker-span-hours.text-primary,
.dark-mode:not(.tm-auth-light) .clockpicker-popover .clockpicker-span-minutes.text-primary,
.dark-mode:not(.tm-auth-light) .clockpicker-popover .clockpicker-tick.active {
	color: #8ec5ff !important;
}

.dark-mode:not(.tm-auth-light) .clockpicker-popover .clockpicker-button {
	background: var(--bg-secondary) !important;
	border: 1px solid var(--border-color) !important;
	color: var(--text-primary) !important;
	box-shadow: none !important;
}

.dark-mode:not(.tm-auth-light) .clockpicker-popover .clockpicker-button:hover,
.dark-mode:not(.tm-auth-light) .clockpicker-popover .clockpicker-button:focus {
	background: var(--bg-hover) !important;
	color: var(--text-primary) !important;
}

.dark-mode:not(.tm-auth-light) .clockpicker-popover.top > .arrow,
.dark-mode:not(.tm-auth-light) .clockpicker-popover.bottom > .arrow,
.dark-mode:not(.tm-auth-light) .clockpicker-popover.left > .arrow,
.dark-mode:not(.tm-auth-light) .clockpicker-popover.right > .arrow {
	border-color: transparent !important;
}

.dark-mode:not(.tm-auth-light) .clockpicker-popover.top > .arrow::after {
	border-top-color: var(--bg-primary) !important;
}

.dark-mode:not(.tm-auth-light) .clockpicker-popover.bottom > .arrow::after {
	border-bottom-color: var(--bg-primary) !important;
}

.dark-mode:not(.tm-auth-light) .clockpicker-popover.left > .arrow::after {
	border-left-color: var(--bg-primary) !important;
}

.dark-mode:not(.tm-auth-light) .clockpicker-popover.right > .arrow::after {
	border-right-color: var(--bg-primary) !important;
}

.dark-mode:not(.tm-auth-light) .pika-single {
	padding: 10px;
}

.dark-mode:not(.tm-auth-light) .pika-lendar,
.dark-mode:not(.tm-auth-light) .pika-table,
.dark-mode:not(.tm-auth-light) .pika-title {
	background: transparent;
	color: var(--text-primary);
}

.dark-mode:not(.tm-auth-light) .pika-title {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 8px;
	padding-bottom: 8px;
}

.dark-mode:not(.tm-auth-light) .pika-label {
	color: var(--text-primary);
	background: var(--bg-secondary);
	border: 1px solid var(--border-color);
	border-radius: 6px;
	padding: 6px 28px 6px 10px;
	position: relative;
}

.dark-mode:not(.tm-auth-light) .pika-select {
	background: transparent;
	border: 0;
	border-radius: 0;
	color: var(--text-primary);
	inset: 0;
	width: 100%;
	height: 100%;
}

.dark-mode:not(.tm-auth-light) .pika-label::after {
	content: "";
	position: absolute;
	top: 50%;
	right: 10px;
	transform: translateY(-35%);
	border-left: 5px solid transparent;
	border-right: 5px solid transparent;
	border-top: 6px solid var(--text-muted);
	pointer-events: none;
}

.dark-mode:not(.tm-auth-light) .pika-prev,
.dark-mode:not(.tm-auth-light) .pika-next {
	filter: invert(0.88) saturate(0) brightness(1.1);
	opacity: 0.8;
}

.dark-mode:not(.tm-auth-light) .pika-prev:hover,
.dark-mode:not(.tm-auth-light) .pika-next:hover {
	opacity: 1;
}

.dark-mode:not(.tm-auth-light) .pika-table abbr {
	color: var(--text-muted);
	text-decoration: none;
}

.dark-mode:not(.tm-auth-light) .pika-button {
	background: transparent;
	color: var(--text-primary);
	border-radius: 6px;
}

.dark-mode:not(.tm-auth-light) .pika-button:hover {
	color: var(--text-primary);
}

.dark-mode:not(.tm-auth-light) .pika-table td.is-today .pika-button {
	color: var(--color-info-light);
	border: 1px solid rgba(59, 130, 246, 0.35);
}

.dark-mode:not(.tm-auth-light) .pika-table td.is-disabled .pika-button,
.dark-mode:not(.tm-auth-light) .pika-table td.is-empty {
	color: var(--text-light);
	opacity: 0.45;
}

/* Color Picker */
.dark-mode:not(.tm-auth-light) .field-colorpicker .colorpicker {
	background: var(--bg-primary);
	border: 1px solid var(--border-color);
	border-radius: 8px;
	box-shadow: var(--shadow-lg);
}

/* Rich Text Editor (Froala) */
.dark-mode:not(.tm-auth-light) .field-richeditor {
	background: var(--bg-primary);
	border: 1px solid var(--border-color) !important;
	border-radius: 8px;
	box-shadow: none !important;
}

.dark-mode:not(.tm-auth-light) .fr-box.fr-basic {
	background: var(--bg-primary);
	border: 1px solid var(--border-color) !important;
	border-radius: 8px;
	box-shadow: none !important;
}

.dark-mode:not(.tm-auth-light) .fr-box .fr-toolbar {
	background: var(--bg-secondary);
	border-bottom: 1px solid rgba(148, 163, 184, 0.12);
	border-top: 0 !important;
}

.dark-mode:not(.tm-auth-light) .fr-box .fr-toolbar .fr-btn {
	color: var(--text-secondary);
	background: transparent;
	border: none;
}

.dark-mode:not(.tm-auth-light) .fr-box .fr-toolbar .fr-btn:hover,
.dark-mode:not(.tm-auth-light) .fr-box .fr-toolbar .fr-btn.fr-active {
	background: var(--bg-hover);
	color: var(--text-primary);
}

.dark-mode:not(.tm-auth-light) .fr-box .fr-wrapper {
	background: var(--bg-primary);
	color: var(--text-primary);
	border: 1px solid var(--border-color) !important;
	box-shadow: none !important;
}

.dark-mode:not(.tm-auth-light) .fr-box .fr-wrapper .fr-view {
	background: var(--bg-primary);
	color: var(--text-primary);
	border: 0 !important;
	box-shadow: none !important;
}

.dark-mode:not(.tm-auth-light) .fr-box .fr-wrapper .fr-view p,
.dark-mode:not(.tm-auth-light) .fr-box .fr-wrapper .fr-view div,
.dark-mode:not(.tm-auth-light) .fr-box .fr-wrapper .fr-view span,
.dark-mode:not(.tm-auth-light) .fr-box .fr-wrapper .fr-view h1,
.dark-mode:not(.tm-auth-light) .fr-box .fr-wrapper .fr-view h2,
.dark-mode:not(.tm-auth-light) .fr-box .fr-wrapper .fr-view h3,
.dark-mode:not(.tm-auth-light) .fr-box .fr-wrapper .fr-view h4,
.dark-mode:not(.tm-auth-light) .fr-box .fr-wrapper .fr-view h5,
.dark-mode:not(.tm-auth-light) .fr-box .fr-wrapper .fr-view h6,
.dark-mode:not(.tm-auth-light) .fr-box .fr-wrapper .fr-view li,
.dark-mode:not(.tm-auth-light) .fr-box .fr-wrapper .fr-view td,
.dark-mode:not(.tm-auth-light) .fr-box .fr-wrapper .fr-view th {
	color: var(--text-primary);
}

.dark-mode:not(.tm-auth-light) .fr-box .fr-element {
	background: var(--bg-primary);
	color: var(--text-primary);
	border: 0 !important;
	box-shadow: none !important;
}

.dark-mode:not(.tm-auth-light) .fr-box .fr-element:focus {
	outline: none;
}

.dark-mode:not(.tm-auth-light) .fr-box .fr-placeholder {
	color: var(--text-muted);
}

.dark-mode:not(.tm-auth-light) .fr-box .fr-toolbar .fr-separator {
	border-left-color: var(--border-color);
}

.dark-mode:not(.tm-auth-light) .fr-box .fr-toolbar .fr-command.fr-btn .fr-icon {
	color: var(--text-secondary);
}

.dark-mode:not(.tm-auth-light) .fr-box .fr-toolbar .fr-command.fr-btn:hover .fr-icon,
.dark-mode:not(.tm-auth-light) .fr-box .fr-toolbar .fr-command.fr-btn.fr-active .fr-icon {
	color: var(--text-primary);
}

/* Light mode base styles for Froala */
.field-richeditor {
	border: 1px solid var(--border-color);
	border-radius: 8px;
	background: var(--bg-primary);
}

.field-richeditor .fr-box.fr-basic {
	background: var(--bg-primary);
	border: none;
	border-radius: 8px;
}

.field-richeditor .fr-box .fr-toolbar {
	background: var(--bg-secondary);
	border-bottom: 1px solid var(--border-color);
	border-top: 1px solid var(--border-color);
}

.field-richeditor .fr-box .fr-wrapper {
	background: var(--bg-primary);
}

.field-richeditor .fr-box .fr-wrapper .fr-view {
	background: var(--bg-primary);
	color: var(--text-primary);
}

/* Sidebar Bottom Icons */
.dark-mode:not(.tm-auth-light) .bar-bottom a {
	color: var(--text-secondary);
}

.dark-mode:not(.tm-auth-light) .bar-bottom a:hover {
	color: var(--text-primary);
	background: var(--bg-hover);
}

/* Improved Contrast for Links */
.dark-mode:not(.tm-auth-light) a:not(.uk-button):not(.btn):not(.tm-button) {
	color: var(--text-primary);
}

.dark-mode:not(.tm-auth-light) a:not(.uk-button):not(.btn):not(.tm-button):hover,
.dark-mode:not(.tm-auth-light) a:not(.uk-button):not(.btn):not(.tm-button):focus,
.dark-mode:not(.tm-auth-light) a:not(.uk-button):not(.btn):not(.tm-button):active,
.dark-mode:not(.tm-auth-light) a:not(.uk-button):not(.btn):not(.tm-button):visited {
	color: var(--text-primary);
}

/* Icon Colors */
.dark-mode:not(.tm-auth-light) .uk-icon,
.dark-mode:not(.tm-auth-light) [data-uk-icon] {
	color: var(--text-secondary);
}

.dark-mode:not(.tm-auth-light) .uk-icon:hover,
.dark-mode:not(.tm-auth-light) [data-uk-icon]:hover {
	color: var(--text-primary);
}

/* Smooth Transitions for All Elements */
.dark-mode:not(.tm-auth-light) * {
	transition: background-color 0.2s ease, border-color 0.2s ease, color 0.2s ease;
}

/* Ensure Images Maintain Visibility */
.dark-mode:not(.tm-auth-light) img {
	opacity: 0.95;
}

.dark-mode:not(.tm-auth-light) img:hover {
	opacity: 1;
}