/* ==========================================================================
   UCDREAMS TOOLS - COMPREHENSIVE DARK & LIGHT THEME STYLESHEET
   100% Precision Styled for Homepage & Global Layout
   ========================================================================== */

/* --------------------------------------------------------------------------
   0. DESIGN TOKENS & SYSTEM VARIABLES
   -------------------------------------------------------------------------- */
:root,
html[data-theme="light"] {
	--ucd-primary: #C5453E;
	--ucd-primary-hover: #B23B35;
	--ucd-primary-active: #992F2A;
	--ucd-soft-red: #FEF2F2;
	--ucd-soft-red-border: #FEE2E2;
	--ucd-soft-red-text: #C5453E;
	--ucd-bg-canvas: #F6F8FA;
	--ucd-bg-surface: #FFFFFF;
	--ucd-bg-surface-elevated: #FFFFFF;
	--ucd-bg-surface-hover: #F8FAFC;
	--ucd-border: #E3E3E4;
	--ucd-border-light: #EEF0F3;
	--ucd-border-hover: #CBD5E1;
	--ucd-text-primary: #181D20;
	--ucd-text-secondary: #525658;
	--ucd-text-muted: #828586;
	--ucd-card-shadow: 0 2px 8px rgba(0, 0, 0, 0.04);
	--ucd-card-shadow-hover: 0 12px 28px rgba(0, 0, 0, 0.08);
	color-scheme: light;
}

html[data-theme="dark"],
html.dark {
	--ucd-primary: #C5453E;
	--ucd-primary-hover: #DB544D;
	--ucd-primary-active: #F87171;
	--ucd-soft-red: rgba(197, 69, 62, 0.15);
	--ucd-soft-red-border: rgba(197, 69, 62, 0.35);
	--ucd-soft-red-text: #FF7B72;
	--ucd-bg-canvas: #0E1015;
	--ucd-bg-canvas-alt: #12151C;
	--ucd-bg-surface: #161922;
	--ucd-bg-surface-elevated: #1C202C;
	--ucd-bg-surface-hover: #222736;
	--ucd-border: rgba(255, 255, 255, 0.08);
	--ucd-border-light: rgba(255, 255, 255, 0.05);
	--ucd-border-hover: rgba(255, 255, 255, 0.18);
	--ucd-text-primary: #FFFFFF;
	--ucd-text-secondary: #CBD5E1;
	--ucd-text-muted: #94A3B8;
	--ucd-card-shadow: 0 4px 16px rgba(0, 0, 0, 0.35);
	--ucd-card-shadow-hover: 0 16px 36px rgba(0, 0, 0, 0.55);
	color-scheme: dark;
}

/* Smooth theme transition ONLY during interactive toggle */
html.ucd-theme-transitioning,
html.ucd-theme-transitioning *,
html.ucd-theme-transitioning *::before,
html.ucd-theme-transitioning *::after {
	transition: background-color 0.22s ease, color 0.22s ease, border-color 0.22s ease, box-shadow 0.22s ease !important;
}

/* --------------------------------------------------------------------------
   1. BASE & BODY STYLES
   -------------------------------------------------------------------------- */
body {
	background-color: var(--ucd-bg-canvas);
	color: var(--ucd-text-primary);
	transition: background-color 0.2s ease, color 0.2s ease;
}

html[data-theme="dark"] body {
	background-color: #0E1015 !important;
	color: #CBD5E1 !important;
}

html[data-theme="dark"] ::selection {
	background-color: #C5453E;
	color: #FFFFFF;
}

/* --------------------------------------------------------------------------
   2. GLOBAL HEADER & BRANDING
   -------------------------------------------------------------------------- */
.mobile-only-actions {
	display: none !important;
}

.ucd-theme-toggle-desktop {
	display: inline-flex !important;
	margin-left: 6px;
}

.ucd-theme-toggle-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 38px;
	height: 38px;
	min-width: 38px;
	min-height: 38px;
	border-radius: 10px;
	background: #ffffff;
	border: 1px solid #e3e3e4;
	color: #181d20;
	cursor: pointer;
	padding: 0;
	transition: all 0.2s cubic-bezier(0.16, 1, 0.3, 1);
	flex-shrink: 0;
	outline: none;
	box-shadow: 0 1px 3px rgba(0, 0, 0, 0.04);
}
.ucd-theme-toggle-btn:hover {
	background: #f8fafc;
	border-color: #cbd5e1;
	color: #C5453E;
	transform: scale(1.05);
}
.ucd-theme-toggle-btn:active {
	transform: scale(0.96);
}

html[data-theme="dark"] .site-header {
	background: rgba(14, 16, 21, 0.92) !important;
	backdrop-filter: blur(16px);
	-webkit-backdrop-filter: blur(16px);
	border-bottom: 1px solid rgba(255, 255, 255, 0.08) !important;
}

html[data-theme="dark"] .site-header.is-scrolled {
	box-shadow: 0 4px 24px rgba(0, 0, 0, 0.45) !important;
	border-bottom-color: rgba(255, 255, 255, 0.12) !important;
}

html[data-theme="dark"] .brand-badge {
	background: rgba(197, 69, 62, 0.16) !important;
	color: #FF7B72 !important;
	border: 1px solid rgba(197, 69, 62, 0.3) !important;
}

html[data-theme="dark"] .ucd-theme-toggle-btn {
	background: #161922 !important;
	border-color: rgba(255, 255, 255, 0.1) !important;
	color: #FFFFFF !important;
	box-shadow: 0 2px 8px rgba(0, 0, 0, 0.3) !important;
}
html[data-theme="dark"] .ucd-theme-toggle-btn:hover {
	background: #1C202C !important;
	border-color: rgba(255, 255, 255, 0.2) !important;
	color: #FF7B72 !important;
}

html[data-theme="dark"] .nav-toggle {
	background: #161922 !important;
	border-color: rgba(255, 255, 255, 0.1) !important;
}
html[data-theme="dark"] .nav-toggle-bar {
	background: #CBD5E1 !important;
}

/* --------------------------------------------------------------------------
   3. DESKTOP MEGA NAV & DROPDOWNS
   -------------------------------------------------------------------------- */
@media (min-width: 1025px) {
	.mega-panel {
		display: none !important;
		opacity: 0 !important;
		visibility: hidden !important;
		pointer-events: none !important;
	}
	.mega-item:hover .mega-panel {
		display: block !important;
		opacity: 1 !important;
		visibility: visible !important;
		pointer-events: auto !important;
	}
}

html[data-theme="dark"] .mega-trigger {
	color: #CBD5E1 !important;
}
html[data-theme="dark"] .mega-trigger:hover {
	background: rgba(255, 255, 255, 0.06) !important;
	color: #FFFFFF !important;
}

html[data-theme="dark"] .mega-panel {
	background: #161922 !important;
	border: 1px solid rgba(255, 255, 255, 0.1) !important;
	box-shadow: 0 16px 40px rgba(0, 0, 0, 0.6) !important;
}

html[data-theme="dark"] .mega-panel a {
	color: #CBD5E1 !important;
}
html[data-theme="dark"] .mega-panel a:hover {
	background: rgba(255, 255, 255, 0.05) !important;
}
html[data-theme="dark"] .mega-link-title {
	color: #FFFFFF !important;
}
html[data-theme="dark"] .mega-panel a small {
	color: #94A3B8 !important;
}
html[data-theme="dark"] .mega-icon {
	color: #CBD5E1 !important;
}
html[data-theme="dark"] .mega-panel a:hover .mega-icon {
	color: #FF7B72 !important;
}

/* Header Search Form */
html[data-theme="dark"] .header-search-form .wp-block-search__inside-wrapper {
	background: #161922 !important;
	border: 1px solid rgba(255, 255, 255, 0.1) !important;
}
html[data-theme="dark"] .header-search-form .wp-block-search__input {
	background: transparent !important;
	color: #FFFFFF !important;
}
html[data-theme="dark"] .header-search-form .wp-block-search__input::placeholder {
	color: #64748B !important;
}
html[data-theme="dark"] .header-search-form .wp-block-search__button {
	color: #94A3B8 !important;
}
html[data-theme="dark"] .header-search-form .wp-block-search__button:hover {
	color: #FF7B72 !important;
}

/* --------------------------------------------------------------------------
   4. MOBILE DRAWER NAVIGATION
   -------------------------------------------------------------------------- */
.mega-drawer-theme-row {
	display: none;
}

@media (max-width: 1024px) {
	.mobile-only-actions {
		display: inline-flex !important;
		align-items: center;
		gap: 8px;
	}
	.ucd-theme-toggle-desktop {
		display: none !important;
	}

	html[data-theme="dark"] .mega-nav {
		background: #12151C !important;
		border-left: 1px solid rgba(255, 255, 255, 0.08) !important;
		box-shadow: -8px 0 32px rgba(0, 0, 0, 0.5) !important;
	}

	html[data-theme="dark"] .mega-item {
		border-bottom: 1px solid rgba(255, 255, 255, 0.06) !important;
	}

	html[data-theme="dark"] .mega-trigger {
		color: #F1F5F9 !important;
	}

	html[data-theme="dark"] .mega-trigger:hover,
	html[data-theme="dark"] .mega-item.is-open .mega-trigger {
		background: rgba(255, 255, 255, 0.04) !important;
		color: #FFFFFF !important;
	}

	html[data-theme="dark"] .mega-panel {
		background: transparent !important;
		border: none !important;
		box-shadow: none !important;
	}

	.mega-drawer-theme-row {
		display: flex;
		align-items: center;
		justify-content: space-between;
		padding: 12px 14px;
		margin: 14px 0 8px 0;
		background: #FFFFFF;
		border: 1px solid #E3E3E4;
		border-radius: 12px;
		box-sizing: border-box;
	}
	html[data-theme="dark"] .mega-drawer-theme-row {
		background: #161922 !important;
		border-color: rgba(255, 255, 255, 0.08) !important;
	}

	.mega-drawer-theme-label {
		font-size: 13.5px;
		font-weight: 600;
		color: #525658;
	}
	html[data-theme="dark"] .mega-drawer-theme-label {
		color: #CBD5E1 !important;
	}

	.ucd-theme-toggle-mobile {
		display: inline-flex;
		align-items: center;
		gap: 6px;
		background: #F6F8FA;
		border: 1px solid #E3E3E4;
		border-radius: 8px;
		padding: 6px 12px;
		font-size: 13px;
		font-weight: 600;
		color: #181D20;
		cursor: pointer;
		transition: all 0.2s ease;
	}
	html[data-theme="dark"] .ucd-theme-toggle-mobile {
		background: #1C202C !important;
		border-color: rgba(255, 255, 255, 0.12) !important;
		color: #FFFFFF !important;
	}
}

/* --------------------------------------------------------------------------
   5. HERO SECTION, SECTION HEADINGS & SEARCH
   -------------------------------------------------------------------------- */
html[data-theme="dark"] .tools-hero {
	background: transparent !important;
}

html[data-theme="dark"] .hero-title {
	color: #FFFFFF !important;
}

html[data-theme="dark"] .hero-descr {
	color: #94A3B8 !important;
}

html[data-theme="dark"] .section-kicker,
html[data-theme="dark"] p.section-kicker {
	color: #FF7B72 !important;
}

html[data-theme="dark"] .section-heading,
html[data-theme="dark"] h2.section-heading,
html[data-theme="dark"] .wp-block-heading.section-heading {
	color: #FFFFFF !important;
}

html[data-theme="dark"] .hero-whats-new-pill {
	background: #161922 !important;
	border: 1px solid rgba(255, 255, 255, 0.1) !important;
	color: #CBD5E1 !important;
	box-shadow: 0 4px 16px rgba(0, 0, 0, 0.3) !important;
}
html[data-theme="dark"] .hero-whats-new-pill:hover {
	border-color: rgba(197, 69, 62, 0.4) !important;
	background: #1C202C !important;
	color: #FFFFFF !important;
}

html[data-theme="dark"] .tools-search .wp-block-search__inside-wrapper {
	background: #161922 !important;
	border: 1px solid rgba(255, 255, 255, 0.12) !important;
	box-shadow: 0 8px 32px rgba(0, 0, 0, 0.45) !important;
}
html[data-theme="dark"] .tools-search .wp-block-search__inside-wrapper:focus-within {
	border-color: #C5453E !important;
	box-shadow: 0 0 0 3px rgba(197, 69, 62, 0.25), 0 10px 36px rgba(0, 0, 0, 0.5) !important;
}

html[data-theme="dark"] .tools-search .wp-block-search__input {
	background: transparent !important;
	color: #FFFFFF !important;
}
html[data-theme="dark"] .tools-search .wp-block-search__input::placeholder {
	color: #64748B !important;
}

/* --------------------------------------------------------------------------
   6. CATEGORY FILTER TABS
   -------------------------------------------------------------------------- */
html[data-theme="dark"] .ucd-filter-tabs-wrapper {
	background: transparent !important;
}

html[data-theme="dark"] .ucd-filter-tabs {
	background: #161922 !important;
	border: 1px solid rgba(255, 255, 255, 0.08) !important;
	box-shadow: 0 4px 20px rgba(0, 0, 0, 0.4) !important;
}

html[data-theme="dark"] .ucd-cat-tab {
	color: #94A3B8 !important;
	background: transparent !important;
	border-color: transparent !important;
}

html[data-theme="dark"] .ucd-cat-tab:hover {
	background: #1C202C !important;
	border-color: rgba(255, 255, 255, 0.12) !important;
	color: #FFFFFF !important;
}

html[data-theme="dark"] .ucd-cat-tab.is-active {
	background: #C5453E !important;
	border-color: #C5453E !important;
	color: #FFFFFF !important;
	font-weight: 700 !important;
	box-shadow: 0 4px 16px rgba(197, 69, 62, 0.35) !important;
}

html[data-theme="dark"] .ucd-cat-icon svg {
	stroke: currentColor !important;
}

html[data-theme="dark"] .ucd-cat-count {
	background: rgba(255, 255, 255, 0.08) !important;
	color: #CBD5E1 !important;
}

html[data-theme="dark"] .ucd-cat-tab.is-active .ucd-cat-count {
	background: rgba(255, 255, 255, 0.22) !important;
	color: #FFFFFF !important;
}

/* --------------------------------------------------------------------------
   7. TOOLS GRID & TOOL CARDS
   -------------------------------------------------------------------------- */
html[data-theme="dark"] .tools-area {
	background: transparent !important;
}

html[data-theme="dark"] .tool-card {
	background: #161922 !important;
	border: 1px solid rgba(255, 255, 255, 0.08) !important;
	box-shadow: 0 4px 16px rgba(0, 0, 0, 0.25) !important;
	color: inherit !important;
}

html[data-theme="dark"] .tool-card:hover {
	background: #1C202C !important;
	border-color: rgba(197, 69, 62, 0.4) !important;
	box-shadow: 0 16px 36px rgba(0, 0, 0, 0.5) !important;
	transform: translateY(-3px) !important;
}

html[data-theme="dark"] .tool-card .icon-box,
html[data-theme="dark"] .tool-card .tool-icon {
	background: #12151C !important;
	border: 1px solid rgba(255, 255, 255, 0.08) !important;
	color: #FFFFFF !important;
}

html[data-theme="dark"] .tool-card:hover .icon-box,
html[data-theme="dark"] .tool-card:hover .tool-icon {
	background: rgba(197, 69, 62, 0.16) !important;
	border-color: rgba(197, 69, 62, 0.35) !important;
	color: #FF7B72 !important;
}

html[data-theme="dark"] .tool-title {
	color: #FFFFFF !important;
}

html[data-theme="dark"] .tool-descr {
	color: #94A3B8 !important;
}

html[data-theme="dark"] .tool-tag {
	background: rgba(197, 69, 62, 0.15) !important;
	color: #FF7B72 !important;
	border: 1px solid rgba(197, 69, 62, 0.3) !important;
}

html[data-theme="dark"] .tool-tag.tag-blue {
	background: rgba(59, 130, 246, 0.15) !important;
	color: #60A5FA !important;
	border: 1px solid rgba(59, 130, 246, 0.3) !important;
}

html[data-theme="dark"] .tool-tag.tag-green {
	background: rgba(16, 185, 129, 0.15) !important;
	color: #34D399 !important;
	border: 1px solid rgba(16, 185, 129, 0.3) !important;
}

/* No Tools Found */
html[data-theme="dark"] .ucd-no-tools-found {
	background: #161922 !important;
	border: 1px solid rgba(255, 255, 255, 0.08) !important;
	color: #CBD5E1 !important;
}
html[data-theme="dark"] .ucd-no-tools-title {
	color: #FFFFFF !important;
}
html[data-theme="dark"] .ucd-no-tools-btn {
	background: #C5453E !important;
	color: #FFFFFF !important;
}

/* --------------------------------------------------------------------------
   8. SEARCH SUGGESTIONS DROPDOWN
   -------------------------------------------------------------------------- */
html[data-theme="dark"] .ss-suggest {
	background: #161922 !important;
	border: 1px solid rgba(255, 255, 255, 0.1) !important;
	box-shadow: 0 16px 48px rgba(0, 0, 0, 0.6) !important;
}

html[data-theme="dark"] .ss-item {
	color: #CBD5E1 !important;
}
html[data-theme="dark"] .ss-item:hover,
html[data-theme="dark"] .ss-item.is-selected {
	background: #1C202C !important;
	color: #FFFFFF !important;
}

html[data-theme="dark"] .ss-item-title {
	color: #FFFFFF !important;
}
html[data-theme="dark"] .ss-item-desc {
	color: #94A3B8 !important;
}
html[data-theme="dark"] .ss-item-cat {
	background: rgba(255, 255, 255, 0.08) !important;
	color: #CBD5E1 !important;
}
html[data-theme="dark"] .ss-item-icon {
	background: #12151C !important;
	border: 1px solid rgba(255, 255, 255, 0.08) !important;
	color: #CBD5E1 !important;
}

/* --------------------------------------------------------------------------
   9. ON-PAGE SEO CONTENT & ACCORDIONS
   -------------------------------------------------------------------------- */
html[data-theme="dark"] .seo-content-section {
	background: #12151C !important;
	border: 1px solid rgba(255, 255, 255, 0.08) !important;
}

html[data-theme="dark"] .seo-header-block .section-kicker {
	background: rgba(197, 69, 62, 0.15) !important;
	color: #FF7B72 !important;
	border: 1px solid rgba(197, 69, 62, 0.3) !important;
}

html[data-theme="dark"] .seo-header-block h2,
html[data-theme="dark"] .seo-header-block .section-heading {
	color: #FFFFFF !important;
}

html[data-theme="dark"] .seo-section-subtitle {
	color: #94A3B8 !important;
}

html[data-theme="dark"] .seo-feature-card {
	background: #161922 !important;
	border: 1px solid rgba(255, 255, 255, 0.08) !important;
}
html[data-theme="dark"] .seo-feature-card:hover {
	border-color: rgba(197, 69, 62, 0.35) !important;
	background: #1C202C !important;
}
html[data-theme="dark"] .seo-feature-icon {
	background: #12151C !important;
	border: 1px solid rgba(255, 255, 255, 0.08) !important;
	color: #FF7B72 !important;
}
html[data-theme="dark"] .seo-feature-title {
	color: #FFFFFF !important;
}
html[data-theme="dark"] .seo-feature-desc {
	color: #94A3B8 !important;
}

html[data-theme="dark"] .seo-step-card {
	background: #161922 !important;
	border: 1px solid rgba(255, 255, 255, 0.08) !important;
}
html[data-theme="dark"] .seo-step-number {
	background: rgba(197, 69, 62, 0.15) !important;
	color: #FF7B72 !important;
	border: 1px solid rgba(197, 69, 62, 0.3) !important;
}
html[data-theme="dark"] .seo-step-title {
	color: #FFFFFF !important;
}
html[data-theme="dark"] .seo-step-desc {
	color: #94A3B8 !important;
}

html[data-theme="dark"] .seo-faq-item {
	background: #161922 !important;
	border: 1px solid rgba(255, 255, 255, 0.08) !important;
}
html[data-theme="dark"] .seo-faq-summary {
	color: #FFFFFF !important;
}
html[data-theme="dark"] .seo-faq-summary:hover {
	color: #FF7B72 !important;
}
html[data-theme="dark"] .seo-faq-body {
	color: #CBD5E1 !important;
	border-top: 1px solid rgba(255, 255, 255, 0.06) !important;
}

/* --------------------------------------------------------------------------
   10. GLOBAL FOOTER
   -------------------------------------------------------------------------- */
html[data-theme="dark"] .site-footer {
	background: #0E1015 !important;
	border-top: 1px solid rgba(255, 255, 255, 0.08) !important;
}

html[data-theme="dark"] .site-footer h4 {
	color: #FFFFFF !important;
}
html[data-theme="dark"] .site-footer p,
html[data-theme="dark"] .site-footer a {
	color: #94A3B8 !important;
}
html[data-theme="dark"] .site-footer a:hover {
	color: #FF7B72 !important;
}

html[data-theme="dark"] .footer-bottom {
	color: #64748B !important;
	border-top: 1px solid rgba(255, 255, 255, 0.06) !important;
}

/* --------------------------------------------------------------------------
   11. WHAT'S NEW MODAL & FLOATING PILL (DARK THEME COMPLETE SUITE)
   -------------------------------------------------------------------------- */
html[data-theme="dark"] .ucd-wn-floating-pill,
html.dark .ucd-wn-floating-pill {
	background: #161922 !important;
	border: 1px solid rgba(255, 255, 255, 0.12) !important;
	color: #CBD5E1 !important;
	box-shadow: 0 8px 24px rgba(0, 0, 0, 0.45) !important;
}
html[data-theme="dark"] .ucd-wn-floating-pill:hover,
html.dark .ucd-wn-floating-pill:hover {
	background: #1C202C !important;
	border-color: rgba(197, 69, 62, 0.4) !important;
	color: #FFFFFF !important;
}

html[data-theme="dark"] .ucd-wn-backdrop,
html.dark .ucd-wn-backdrop {
	background: rgba(0, 0, 0, 0.75) !important;
}

html[data-theme="dark"] .ucd-wn-dialog,
html.dark .ucd-wn-dialog {
	background: #161922 !important;
	border: 1px solid rgba(255, 255, 255, 0.12) !important;
	box-shadow: 0 25px 60px -12px rgba(0, 0, 0, 0.75), 0 0 0 1px rgba(255, 255, 255, 0.08) !important;
	color: #ffffff !important;
}

html[data-theme="dark"] .ucd-wn-header,
html.dark .ucd-wn-header {
	background: #161922 !important;
	border-bottom: 1px solid rgba(255, 255, 255, 0.08) !important;
}

html[data-theme="dark"] .ucd-wn-pill,
html.dark .ucd-wn-pill {
	background: rgba(197, 69, 62, 0.18) !important;
	border: 1px solid rgba(197, 69, 62, 0.35) !important;
	color: #FF7B72 !important;
}

html[data-theme="dark"] .ucd-wn-title,
html.dark .ucd-wn-title {
	color: #FFFFFF !important;
}

html[data-theme="dark"] .ucd-wn-subtitle,
html.dark .ucd-wn-subtitle {
	color: #94A3B8 !important;
}

html[data-theme="dark"] .ucd-wn-close-btn,
html.dark .ucd-wn-close-btn {
	background: #1C202C !important;
	border: 1px solid rgba(255, 255, 255, 0.1) !important;
	color: #94A3B8 !important;
}

html[data-theme="dark"] .ucd-wn-close-btn:hover,
html.dark .ucd-wn-close-btn:hover {
	background: #252B3B !important;
	border-color: rgba(197, 69, 62, 0.4) !important;
	color: #FFFFFF !important;
}

html[data-theme="dark"] .ucd-wn-body,
html.dark .ucd-wn-body {
	background: #161922 !important;
}

html[data-theme="dark"] .ucd-wn-item,
html.dark .ucd-wn-item {
	background: #12151C !important;
	border: 1px solid rgba(255, 255, 255, 0.08) !important;
	box-shadow: 0 4px 16px rgba(0, 0, 0, 0.3) !important;
}

html[data-theme="dark"] .ucd-wn-item:hover,
html.dark .ucd-wn-item:hover {
	border-color: rgba(197, 69, 62, 0.35) !important;
	background: #1C202C !important;
}

html[data-theme="dark"] .ucd-wn-icon-red,
html.dark .ucd-wn-icon-red {
	background: rgba(197, 69, 62, 0.2) !important;
	color: #FF7B72 !important;
	border: 1px solid rgba(197, 69, 62, 0.35) !important;
}

html[data-theme="dark"] .ucd-wn-icon-blue,
html.dark .ucd-wn-icon-blue {
	background: rgba(79, 70, 229, 0.2) !important;
	color: #818CF8 !important;
	border: 1px solid rgba(79, 70, 229, 0.35) !important;
}

html[data-theme="dark"] .ucd-wn-item-name,
html.dark .ucd-wn-item-name {
	color: #FFFFFF !important;
}

html[data-theme="dark"] .ucd-wn-item-desc,
html.dark .ucd-wn-item-desc {
	color: #94A3B8 !important;
}

html[data-theme="dark"] .ucd-wn-item-desc strong,
html.dark .ucd-wn-item-desc strong {
	color: #FFFFFF !important;
}

html[data-theme="dark"] .ucd-wn-tag,
html.dark .ucd-wn-tag {
	background: rgba(255, 255, 255, 0.06) !important;
	color: #CBD5E1 !important;
	border: 1px solid rgba(255, 255, 255, 0.08) !important;
}

html[data-theme="dark"] .ucd-wn-btn-secondary,
html.dark .ucd-wn-btn-secondary {
	background: #252B3B !important;
	color: #FFFFFF !important;
	border: 1px solid rgba(255, 255, 255, 0.12) !important;
}

html[data-theme="dark"] .ucd-wn-btn-secondary:hover,
html.dark .ucd-wn-btn-secondary:hover {
	background: #333C52 !important;
	border-color: rgba(255, 255, 255, 0.25) !important;
}

html[data-theme="dark"] .ucd-wn-footer,
html.dark .ucd-wn-footer {
	background: #12151C !important;
	border-top: 1px solid rgba(255, 255, 255, 0.08) !important;
}

html[data-theme="dark"] .ucd-wn-privacy-note,
html.dark .ucd-wn-privacy-note {
	color: #94A3B8 !important;
}

html[data-theme="dark"] .ucd-wn-dismiss-btn,
html.dark .ucd-wn-dismiss-btn {
	background: #1C202C !important;
	border: 1px solid rgba(255, 255, 255, 0.15) !important;
	color: #CBD5E1 !important;
}

html[data-theme="dark"] .ucd-wn-dismiss-btn:hover,
html.dark .ucd-wn-dismiss-btn:hover {
	background: #252B3B !important;
	border-color: rgba(197, 69, 62, 0.4) !important;
	color: #FFFFFF !important;
}
/* --------------------------------------------------------------------------
   13. VIDEO CALL (UC DREAMS MEET) - DARK & LIGHT THEME COMPLETE SUITE
   -------------------------------------------------------------------------- */

/* Light Theme Defaults & Variables for Video Call */
:root,
html[data-theme="light"] {
	--vc-surface-0: #f8fafc;
	--vc-surface-1: #ffffff;
	--vc-surface-2: #f1f5f9;
	--vc-surface-3: #e2e8f0;
	--vc-border-subtle: #e2e8f0;
	--vc-border-medium: #cbd5e1;
	--vc-text-1: #0f172a;
	--vc-text-2: #334155;
	--vc-text-3: #64748b;
	--vc-text-muted: #94a3b8;
}

/* Hide background floating triggers during active in-call meeting to keep dock clear */
body.in-vc-meeting .ucd-reporter-container,
body.in-vc-meeting .ucd-assistant-wrap,
body.in-vc-meeting .ucd-assistant-fab,
body.in-vc-meeting .ucd-wn-floating-pill,
body.in-vc-meeting #ucdAssistantContainer {
	display: none !important;
}

/* ==================== DARK MODE FOR VIDEO CALL & MEET ==================== */
html[data-theme="dark"],
html.dark {
	--vc-surface-0: #0e1015;
	--vc-surface-1: #161922;
	--vc-surface-2: #1c202c;
	--vc-surface-3: #222736;
	--vc-border-subtle: rgba(255, 255, 255, 0.08);
	--vc-border-medium: rgba(255, 255, 255, 0.14);
	--vc-border-focus: #C5453E;
	--vc-text-1: #ffffff;
	--vc-text-2: #cbd5e1;
	--vc-text-3: #94a3b8;
	--vc-text-muted: #64748b;
	--vc-danger-surface: rgba(239, 68, 68, 0.15);
	--vc-danger-border: rgba(239, 68, 68, 0.35);
	--vc-success-surface: rgba(16, 185, 129, 0.15);
	--vc-shadow-card: 0 10px 36px rgba(0, 0, 0, 0.5);
}

/* 1. Pre-Call Lobby in Dark Mode */
html[data-theme="dark"] .vc-lobby,
html.dark .vc-lobby {
	background: #161922 !important;
	border: 1px solid rgba(255, 255, 255, 0.08) !important;
	box-shadow: 0 10px 36px rgba(0, 0, 0, 0.5) !important;
}

html[data-theme="dark"] .vc-preview-container,
html.dark .vc-preview-container {
	background: #0f172a !important;
	border: 1px solid rgba(255, 255, 255, 0.1) !important;
}

html[data-theme="dark"] .vc-lobby-title,
html.dark .vc-lobby-title {
	color: #ffffff !important;
}

html[data-theme="dark"] .vc-lobby-desc,
html.dark .vc-lobby-desc {
	color: #94a3b8 !important;
}

html[data-theme="dark"] .vc-input-label,
html.dark .vc-input-label {
	color: #cbd5e1 !important;
}

html[data-theme="dark"] .vc-text-input,
html.dark .vc-text-input {
	background: #12151C !important;
	border: 1.5px solid rgba(255, 255, 255, 0.12) !important;
	color: #ffffff !important;
}

html[data-theme="dark"] .vc-text-input:focus,
html.dark .vc-text-input:focus {
	border-color: #C5453E !important;
	background: #161922 !important;
	box-shadow: 0 0 0 3px rgba(197, 69, 62, 0.25) !important;
}

html[data-theme="dark"] .vc-btn-secondary,
html.dark .vc-btn-secondary {
	background: #1c202c !important;
	border: 1.5px solid rgba(255, 255, 255, 0.12) !important;
	color: #ffffff !important;
}

html[data-theme="dark"] .vc-btn-secondary:hover,
html.dark .vc-btn-secondary:hover {
	background: #252b3b !important;
	border-color: rgba(255, 255, 255, 0.22) !important;
}

html[data-theme="dark"] .vc-divider-text,
html.dark .vc-divider-text {
	color: #64748b !important;
}

html[data-theme="dark"] .vc-divider-text::before,
html[data-theme="dark"] .vc-divider-text::after,
html.dark .vc-divider-text::before,
html.dark .vc-divider-text::after {
	border-bottom: 1px solid rgba(255, 255, 255, 0.08) !important;
}

/* 2. Active Meeting Room Stage & Header in Dark Mode */
html[data-theme="dark"] .vc-meeting-stage,
html.dark .vc-meeting-stage {
	background: #0e1015 !important;
	border: 1px solid rgba(255, 255, 255, 0.08) !important;
	box-shadow: 0 12px 40px rgba(0, 0, 0, 0.6) !important;
}

html[data-theme="dark"] .vc-stage-header,
html.dark .vc-stage-header {
	background: #161922 !important;
	border-bottom: 1px solid rgba(255, 255, 255, 0.08) !important;
}

html[data-theme="dark"] .vc-room-badge,
html.dark .vc-room-badge {
	background: #1c202c !important;
	border: 1px solid rgba(255, 255, 255, 0.1) !important;
	color: #ffffff !important;
}

html[data-theme="dark"] .vc-header-btn,
html[data-theme="dark"] .vc-layout-toggle-btn,
html.dark .vc-header-btn,
html.dark .vc-layout-toggle-btn {
	background: #1c202c !important;
	border: 1px solid rgba(255, 255, 255, 0.1) !important;
	color: #cbd5e1 !important;
}

html[data-theme="dark"] .vc-header-btn:hover,
html[data-theme="dark"] .vc-layout-toggle-btn:hover,
html.dark .vc-header-btn:hover,
html.dark .vc-layout-toggle-btn:hover {
	background: #252b3b !important;
	color: #ffffff !important;
}

html[data-theme="dark"] .vc-stage-main,
html[data-theme="dark"] .vc-grid-container,
html.dark .vc-stage-main,
html.dark .vc-grid-container {
	background: #0e1015 !important;
}

/* 3. In-Call Active Meeting Stage Footer Bar (.vc-stage-footer) */
html[data-theme="dark"] .vc-stage-footer,
html.dark .vc-stage-footer,
html[data-theme="dark"] body.in-vc-meeting .vc-stage-footer,
html.dark body.in-vc-meeting .vc-stage-footer {
	background: #161922 !important;
	border-top: 1px solid rgba(255, 255, 255, 0.08) !important;
	box-shadow: 0 -4px 20px rgba(0, 0, 0, 0.45) !important;
	color: #ffffff !important;
}

/* Left Zone: Room Pill & Timer */
html[data-theme="dark"] .vc-footer-room-pill,
html.dark .vc-footer-room-pill {
	background: #1c202c !important;
	border: 1px solid rgba(255, 255, 255, 0.1) !important;
	color: #ffffff !important;
}

html[data-theme="dark"] .vc-footer-room-pill:hover,
html.dark .vc-footer-room-pill:hover {
	background: #252b3b !important;
	border-color: rgba(197, 69, 62, 0.4) !important;
}

html[data-theme="dark"] .vc-room-label-text,
html[data-theme="dark"] #vc-footer-room-badge,
html.dark .vc-room-label-text,
html.dark #vc-footer-room-badge {
	color: #ffffff !important;
}

html[data-theme="dark"] .vc-footer-copy-btn,
html.dark .vc-footer-copy-btn {
	color: #94a3b8 !important;
}

html[data-theme="dark"] .vc-footer-copy-btn:hover,
html.dark .vc-footer-copy-btn:hover {
	color: #ffffff !important;
}

html[data-theme="dark"] .vc-footer-timer,
html.dark .vc-footer-timer {
	background: #12151C !important;
	border: 1px solid rgba(255, 255, 255, 0.08) !important;
	color: #34d399 !important;
	padding: 4px 10px;
	border-radius: 9999px;
}

/* Center & Right Zones: Dock Buttons (.vc-dock-btn) */
html[data-theme="dark"] .vc-dock-btn,
html[data-theme="dark"] .vc-stage-footer .vc-dock-btn,
html[data-theme="dark"] .vc-footer-center .vc-dock-btn,
html[data-theme="dark"] .vc-footer-right .vc-dock-btn,
html.dark .vc-dock-btn,
html.dark .vc-stage-footer .vc-dock-btn,
html.dark .vc-footer-center .vc-dock-btn,
html.dark .vc-footer-right .vc-dock-btn {
	background: #1c202c !important;
	border: 1px solid rgba(255, 255, 255, 0.1) !important;
	color: #ffffff !important;
	box-shadow: 0 2px 8px rgba(0, 0, 0, 0.25) !important;
}

html[data-theme="dark"] .vc-dock-btn:hover,
html[data-theme="dark"] .vc-stage-footer .vc-dock-btn:hover,
html.dark .vc-dock-btn:hover,
html.dark .vc-stage-footer .vc-dock-btn:hover {
	background: #252b3b !important;
	border-color: rgba(255, 255, 255, 0.22) !important;
	color: #ffffff !important;
	transform: scale(1.06);
}

html[data-theme="dark"] .vc-dock-btn.is-active,
html[data-theme="dark"] .vc-stage-footer .vc-dock-btn.is-active,
html.dark .vc-dock-btn.is-active,
html.dark .vc-stage-footer .vc-dock-btn.is-active {
	background: #2563eb !important;
	border-color: #3b82f6 !important;
	color: #ffffff !important;
	box-shadow: 0 4px 14px rgba(37, 99, 235, 0.4) !important;
}

html[data-theme="dark"] #vc-dock-raise-hand.is-active,
html.dark #vc-dock-raise-hand.is-active {
	background: #d97706 !important;
	border-color: #f59e0b !important;
	color: #ffffff !important;
	box-shadow: 0 4px 14px rgba(245, 158, 11, 0.4) !important;
}

html[data-theme="dark"] #vc-dock-share-screen.is-sharing,
html.dark #vc-dock-share-screen.is-sharing {
	background: rgba(37, 99, 235, 0.2) !important;
	border-color: #3b82f6 !important;
	color: #60a5fa !important;
	box-shadow: 0 0 0 2px rgba(59, 130, 246, 0.35) !important;
}

html[data-theme="dark"] .vc-dock-btn.is-muted,
html[data-theme="dark"] .vc-dock-btn.is-off,
html.dark .vc-dock-btn.is-muted,
html.dark .vc-dock-btn.is-off {
	background: #ef4444 !important;
	border-color: #dc2626 !important;
	color: #ffffff !important;
}

html[data-theme="dark"] .vc-dock-btn.is-leave,
html.dark .vc-dock-btn.is-leave {
	background: #dc2626 !important;
	border-color: #b91c1c !important;
	color: #ffffff !important;
	box-shadow: 0 2px 10px rgba(220, 38, 38, 0.35) !important;
}

html[data-theme="dark"] .vc-dock-btn.is-leave:hover,
html.dark .vc-dock-btn.is-leave:hover {
	background: #b91c1c !important;
	border-color: #991b1b !important;
	color: #ffffff !important;
}

html[data-theme="dark"] .vc-badge-count,
html.dark .vc-badge-count {
	background: #2563eb !important;
	color: #ffffff !important;
	border-color: #161922 !important;
}

/* 4. More Options Menu Popover in Dark Mode */
html[data-theme="dark"] .vc-more-menu-popover,
html.dark .vc-more-menu-popover {
	background: #161922 !important;
	border: 1px solid rgba(255, 255, 255, 0.12) !important;
	box-shadow: 0 16px 48px rgba(0, 0, 0, 0.65) !important;
}

html[data-theme="dark"] .vc-more-item,
html.dark .vc-more-item {
	color: #cbd5e1 !important;
}

html[data-theme="dark"] .vc-more-item:hover,
html.dark .vc-more-item:hover {
	background: #1c202c !important;
	color: #ffffff !important;
}

html[data-theme="dark"] .vc-more-item-icon,
html.dark .vc-more-item-icon {
	background: #12151C !important;
	border: 1px solid rgba(255, 255, 255, 0.08) !important;
	color: #94a3b8 !important;
}

html[data-theme="dark"] .vc-more-item:hover .vc-more-item-icon,
html.dark .vc-more-item:hover .vc-more-item-icon {
	background: #252b3b !important;
	border-color: rgba(197, 69, 62, 0.4) !important;
	color: #ffffff !important;
}

html[data-theme="dark"] .vc-more-item-title,
html.dark .vc-more-item-title {
	color: #ffffff !important;
}

html[data-theme="dark"] .vc-more-item-sub,
html.dark .vc-more-item-sub {
	color: #94a3b8 !important;
}

html[data-theme="dark"] .vc-more-badge,
html.dark .vc-more-badge {
	background: #1c202c !important;
	color: #94a3b8 !important;
	border: 1px solid rgba(255, 255, 255, 0.08) !important;
}

html[data-theme="dark"] .vc-more-badge.is-on,
html.dark .vc-more-badge.is-on {
	background: rgba(37, 99, 235, 0.2) !important;
	color: #93c5fd !important;
	border-color: rgba(37, 99, 235, 0.4) !important;
}

html[data-theme="dark"] .vc-more-badge.is-rec,
html.dark .vc-more-badge.is-rec {
	background: rgba(239, 68, 68, 0.2) !important;
	color: #f87171 !important;
	border-color: rgba(239, 68, 68, 0.4) !important;
}

html[data-theme="dark"] .vc-more-menu-header,
html.dark .vc-more-menu-header {
	color: #ffffff !important;
	border-bottom: 1px solid rgba(255, 255, 255, 0.08) !important;
}

html[data-theme="dark"] .vc-more-close-btn,
html.dark .vc-more-close-btn {
	background: #1c202c !important;
	color: #94a3b8 !important;
}

html[data-theme="dark"] .vc-more-close-btn:hover,
html.dark .vc-more-close-btn:hover {
	background: #252b3b !important;
	color: #ffffff !important;
}

/* 5. In-Call Drawers (Chat, Notes, Participants) */
html[data-theme="dark"] .vc-drawer,
html.dark .vc-drawer {
	background: #161922 !important;
	border-left: 1px solid rgba(255, 255, 255, 0.08) !important;
}

html[data-theme="dark"] .vc-drawer-header,
html.dark .vc-drawer-header {
	border-bottom: 1px solid rgba(255, 255, 255, 0.08) !important;
}

html[data-theme="dark"] .vc-drawer-title,
html.dark .vc-drawer-title {
	color: #ffffff !important;
}

html[data-theme="dark"] .vc-drawer-close,
html.dark .vc-drawer-close {
	background: #1c202c !important;
	border: 1px solid rgba(255, 255, 255, 0.1) !important;
	color: #94a3b8 !important;
}

html[data-theme="dark"] .vc-drawer-close:hover,
html.dark .vc-drawer-close:hover {
	background: #252b3b !important;
	color: #ffffff !important;
}

html[data-theme="dark"] .vc-chat-messages,
html[data-theme="dark"] .vc-part-list,
html.dark .vc-chat-messages,
html.dark .vc-part-list {
	background: #0e1015 !important;
}

html[data-theme="dark"] .vc-msg-system,
html.dark .vc-msg-system {
	background: #1c202c !important;
	border: 1px solid rgba(255, 255, 255, 0.08) !important;
	color: #94a3b8 !important;
}

html[data-theme="dark"] .vc-chat-item:not(.is-self) .vc-chat-bubble,
html[data-theme="dark"] .vc-chat-msg-other .vc-chat-bubble,
html.dark .vc-chat-item:not(.is-self) .vc-chat-bubble,
html.dark .vc-chat-msg-other .vc-chat-bubble {
	background: #1c202c !important;
	border: 1px solid rgba(255, 255, 255, 0.08) !important;
	color: #cbd5e1 !important;
}

html[data-theme="dark"] .vc-chat-meta,
html[data-theme="dark"] .vc-chat-sender,
html.dark .vc-chat-meta,
html.dark .vc-chat-sender {
	color: #94a3b8 !important;
}

html[data-theme="dark"] .vc-chat-input-wrap,
html[data-theme="dark"] .vc-chat-input-box,
html.dark .vc-chat-input-wrap,
html.dark .vc-chat-input-box {
	background: #161922 !important;
	border-top: 1px solid rgba(255, 255, 255, 0.08) !important;
}

html[data-theme="dark"] .vc-chat-input,
html[data-theme="dark"] #vc-notes-textarea,
html.dark .vc-chat-input,
html.dark #vc-notes-textarea {
	background: #12151C !important;
	border: 1.5px solid rgba(255, 255, 255, 0.12) !important;
	color: #ffffff !important;
}

html[data-theme="dark"] .vc-chat-input:focus,
html[data-theme="dark"] #vc-notes-textarea:focus,
html.dark .vc-chat-input:focus,
html.dark #vc-notes-textarea:focus {
	border-color: #C5453E !important;
	background: #161922 !important;
	box-shadow: 0 0 0 3px rgba(197, 69, 62, 0.25) !important;
}

html[data-theme="dark"] .vc-part-item,
html[data-theme="dark"] .vc-participant-card,
html.dark .vc-part-item,
html.dark .vc-participant-card {
	background: #1c202c !important;
	border: 1px solid rgba(255, 255, 255, 0.08) !important;
}

html[data-theme="dark"] .vc-part-name,
html.dark .vc-part-name {
	color: #ffffff !important;
}

/* 6. Video Grid Tiles & AV Elements */
html[data-theme="dark"] .vc-tile,
html.dark .vc-tile {
	background: #0f172a !important;
	border: 1px solid rgba(255, 255, 255, 0.08) !important;
}

html[data-theme="dark"] .vc-tile-name,
html[data-theme="dark"] .vc-tile-badge,
html.dark .vc-tile-name,
html.dark .vc-tile-badge {
	background: rgba(15, 23, 42, 0.75) !important;
	color: #ffffff !important;
	border: 1px solid rgba(255, 255, 255, 0.1) !important;
}

/* 7. Modals & Popovers in Dark Mode */
html[data-theme="dark"] .vc-modal-overlay,
html[data-theme="dark"] .vc-modal-backdrop,
html.dark .vc-modal-overlay,
html.dark .vc-modal-backdrop {
	background: rgba(0, 0, 0, 0.75) !important;
}

html[data-theme="dark"] .vc-modal-card,
html.dark .vc-modal-card {
	background: #161922 !important;
	border: 1px solid rgba(255, 255, 255, 0.1) !important;
	color: #ffffff !important;
	box-shadow: 0 24px 60px rgba(0, 0, 0, 0.7) !important;
}

html[data-theme="dark"] .vc-modal-title,
html.dark .vc-modal-title {
	color: #ffffff !important;
}

html[data-theme="dark"] .vc-modal-desc,
html.dark .vc-modal-desc {
	color: #94a3b8 !important;
}

html[data-theme="dark"] .vc-qr-box,
html[data-theme="dark"] .vc-share-box,
html.dark .vc-qr-box,
html.dark .vc-share-box {
	background: #12151C !important;
	border: 1px solid rgba(255, 255, 255, 0.1) !important;
}

html[data-theme="dark"] .vc-share-url,
html.dark .vc-share-url {
	color: #ffffff !important;
}

html[data-theme="dark"] .vc-toast,
html.dark .vc-toast {
	background: rgba(22, 25, 34, 0.95) !important;
	backdrop-filter: blur(14px);
	-webkit-backdrop-filter: blur(14px);
	border: 1px solid rgba(255, 255, 255, 0.12) !important;
	color: #ffffff !important;
	box-shadow: 0 14px 36px rgba(0,0,0,0.5) !important;
}

html[data-theme="dark"] .vc-toast-text,
html.dark .vc-toast-text {
	color: #ffffff !important;
}

/* 8. Meet Page SEO & Feature Content Sections */
html[data-theme="dark"] .entry-content h2,
html[data-theme="dark"] .entry-content h3,
html[data-theme="dark"] .entry-content h4,
html.dark .entry-content h2,
html.dark .entry-content h3,
html.dark .entry-content h4 {
	color: #ffffff !important;
}

html[data-theme="dark"] .entry-content p,
html.dark .entry-content p {
	color: #94a3b8 !important;
}

html[data-theme="dark"] div[style*="background:#ffffff"],
html[data-theme="dark"] div[style*="background: #ffffff"],
html[data-theme="dark"] div[style*="background: rgb(255, 255, 255)"],
html.dark div[style*="background:#ffffff"],
html.dark div[style*="background: #ffffff"],
html.dark div[style*="background: rgb(255, 255, 255)"] {
	background: #161922 !important;
	border-color: rgba(255, 255, 255, 0.08) !important;
	box-shadow: 0 4px 20px rgba(0, 0, 0, 0.35) !important;
}

html[data-theme="dark"] div[style*="background:#fef2f2"],
html[data-theme="dark"] div[style*="background: #fef2f2"],
html.dark div[style*="background:#fef2f2"],
html.dark div[style*="background: #fef2f2"] {
	background: rgba(197, 69, 62, 0.15) !important;
	border-color: rgba(197, 69, 62, 0.3) !important;
}

html[data-theme="dark"] div[style*="background:#f8fafc"],
html[data-theme="dark"] div[style*="background: #f8fafc"],
html.dark div[style*="background:#f8fafc"],
html.dark div[style*="background: #f8fafc"] {
	background: #12151C !important;
	border-color: rgba(255, 255, 255, 0.08) !important;
}

/* --------------------------------------------------------------------------
   14. LARGE FILE SHARE (P2P WEBRTC DIRECT TRANSFER) - DARK & LIGHT THEME COMPLETE SUITE
   -------------------------------------------------------------------------- */

/* Light Theme Variables & Defaults */
:root,
html[data-theme="light"] {
	--p2p-surface-0: #f8fafc;
	--p2p-surface-1: #ffffff;
	--p2p-surface-2: #f1f5f9;
	--p2p-surface-3: #e2e8f0;
	--p2p-border-subtle: #e2e8f0;
	--p2p-border-medium: #cbd5e1;
	--p2p-text-1: #0f172a;
	--p2p-text-2: #334155;
	--p2p-text-3: #64748b;
}

/* ==================== DARK MODE FOR P2P FILE SHARE ==================== */
html[data-theme="dark"],
html.dark {
	--p2p-surface-0: #0e1015;
	--p2p-surface-1: #161922;
	--p2p-surface-2: #1c202c;
	--p2p-surface-3: #222736;
	--p2p-border-subtle: rgba(255, 255, 255, 0.08);
	--p2p-border-medium: rgba(255, 255, 255, 0.14);
	--p2p-text-1: #ffffff;
	--p2p-text-2: #cbd5e1;
	--p2p-text-3: #94a3b8;
}

/* 1. Top Header Bar & Status Pills */
html[data-theme="dark"] .p2p-header-bar,
html.dark .p2p-header-bar {
	background: #161922 !important;
	border: 1px solid rgba(255, 255, 255, 0.08) !important;
	box-shadow: 0 4px 20px rgba(0, 0, 0, 0.35) !important;
}

html[data-theme="dark"] .p2p-device-pill,
html.dark .p2p-device-pill {
	background: #1c202c !important;
	border: 1px solid rgba(255, 255, 255, 0.1) !important;
	color: #ffffff !important;
}

html[data-theme="dark"] .p2p-device-pill strong,
html.dark .p2p-device-pill strong {
	color: #ffffff !important;
}

html[data-theme="dark"] .p2p-icon-wrap,
html.dark .p2p-icon-wrap {
	color: #94a3b8 !important;
}

html[data-theme="dark"] .p2p-status-pill.is-ready,
html.dark .p2p-status-pill.is-ready {
	background: rgba(16, 185, 129, 0.15) !important;
	border: 1px solid rgba(16, 185, 129, 0.35) !important;
	color: #34d399 !important;
}

html[data-theme="dark"] .p2p-status-pill.is-connected,
html.dark .p2p-status-pill.is-connected {
	background: rgba(37, 99, 235, 0.18) !important;
	border: 1px solid rgba(37, 99, 235, 0.4) !important;
	color: #60a5fa !important;
}

html[data-theme="dark"] .p2p-status-pill.is-busy,
html.dark .p2p-status-pill.is-busy {
	background: rgba(245, 158, 11, 0.18) !important;
	border: 1px solid rgba(245, 158, 11, 0.4) !important;
	color: #fbbf24 !important;
}

html[data-theme="dark"] .p2p-status-pill.is-error,
html[data-theme="dark"] .p2p-status-pill.is-disconnected,
html.dark .p2p-status-pill.is-error,
html.dark .p2p-status-pill.is-disconnected {
	background: rgba(239, 68, 68, 0.18) !important;
	border: 1px solid rgba(239, 68, 68, 0.4) !important;
	color: #f87171 !important;
}

/* 2. Multi-Tab Alert Banner */
html[data-theme="dark"] .p2p-multitab-banner,
html.dark .p2p-multitab-banner {
	background: rgba(245, 158, 11, 0.15) !important;
	border: 1px solid rgba(245, 158, 11, 0.35) !important;
	color: #fbbf24 !important;
}

html[data-theme="dark"] .p2p-multitab-banner strong,
html.dark .p2p-multitab-banner strong {
	color: #ffffff !important;
}

/* 3. Navigation Tabs */
html[data-theme="dark"] .p2p-tabs-nav,
html.dark .p2p-tabs-nav {
	background: #161922 !important;
	border: 1px solid rgba(255, 255, 255, 0.08) !important;
}

html[data-theme="dark"] .p2p-tab-btn,
html.dark .p2p-tab-btn {
	color: #94a3b8 !important;
}

html[data-theme="dark"] .p2p-tab-btn:hover,
html.dark .p2p-tab-btn:hover {
	color: #ffffff !important;
	background: rgba(255, 255, 255, 0.04) !important;
}

html[data-theme="dark"] .p2p-tab-btn.is-active,
html.dark .p2p-tab-btn.is-active {
	background: #1c202c !important;
	color: #FF7B72 !important;
	box-shadow: 0 2px 10px rgba(0, 0, 0, 0.35) !important;
}

/* 4. Pairing & Connect Cards */
html[data-theme="dark"] .p2p-card,
html.dark .p2p-card {
	background: #161922 !important;
	border: 1px solid rgba(255, 255, 255, 0.08) !important;
	box-shadow: 0 4px 20px rgba(0, 0, 0, 0.35) !important;
}

html[data-theme="dark"] .p2p-card-title,
html.dark .p2p-card-title {
	color: #ffffff !important;
}

html[data-theme="dark"] .p2p-card-desc,
html.dark .p2p-card-desc {
	color: #94a3b8 !important;
}

html[data-theme="dark"] .p2p-code-display-wrap,
html.dark .p2p-code-display-wrap {
	background: #12151C !important;
	border: 1px solid rgba(255, 255, 255, 0.08) !important;
}

html[data-theme="dark"] .p2p-my-code,
html.dark .p2p-my-code {
	color: #FF7B72 !important;
}

html[data-theme="dark"] .p2p-btn-sm,
html.dark .p2p-btn-sm {
	background: #1c202c !important;
	border: 1px solid rgba(255, 255, 255, 0.1) !important;
	color: #ffffff !important;
}

html[data-theme="dark"] .p2p-btn-sm:hover,
html.dark .p2p-btn-sm:hover {
	background: #252b3b !important;
	border-color: rgba(197, 69, 62, 0.4) !important;
	color: #ffffff !important;
}

html[data-theme="dark"] .p2p-qr-wrapper,
html.dark .p2p-qr-wrapper {
	background: #12151C !important;
	border: 1px solid rgba(255, 255, 255, 0.08) !important;
}

html[data-theme="dark"] .p2p-qr-canvas,
html.dark .p2p-qr-canvas {
	background: #ffffff !important;
	border: 1px solid rgba(255, 255, 255, 0.12) !important;
	padding: 8px !important;
	border-radius: 8px !important;
}

html[data-theme="dark"] .p2p-qr-hint,
html.dark .p2p-qr-hint {
	color: #94a3b8 !important;
}

html[data-theme="dark"] .p2p-qr-hint strong,
html.dark .p2p-qr-hint strong {
	color: #ffffff !important;
}

html[data-theme="dark"] .p2p-code-input,
html.dark .p2p-code-input {
	background: #12151C !important;
	border: 1.5px solid rgba(255, 255, 255, 0.14) !important;
	color: #ffffff !important;
}

html[data-theme="dark"] .p2p-code-input:focus,
html.dark .p2p-code-input:focus {
	border-color: #C5453E !important;
	background: #161922 !important;
	box-shadow: 0 0 0 3px rgba(197, 69, 62, 0.25) !important;
}

html[data-theme="dark"] .p2p-card div[style*="background:#f8fafc"],
html[data-theme="dark"] .p2p-card div[style*="background: #f8fafc"],
html.dark .p2p-card div[style*="background:#f8fafc"],
html.dark .p2p-card div[style*="background: #f8fafc"] {
	background: #12151C !important;
	border: 1px solid rgba(255, 255, 255, 0.08) !important;
}

html[data-theme="dark"] .p2p-card div[style*="color:#334155"],
html[data-theme="dark"] .p2p-card div[style*="color: #334155"],
html.dark .p2p-card div[style*="color:#334155"],
html.dark .p2p-card div[style*="color: #334155"] {
	color: #ffffff !important;
}

html[data-theme="dark"] .p2p-card div[style*="color:#64748b"],
html[data-theme="dark"] .p2p-card div[style*="color: #64748b"],
html.dark .p2p-card div[style*="color:#64748b"],
html.dark .p2p-card div[style*="color: #64748b"] {
	color: #94a3b8 !important;
}

/* 5. Radar Discovery Card */
html[data-theme="dark"] .p2p-radar-card,
html.dark .p2p-radar-card {
	background: #161922 !important;
	border: 1px solid rgba(255, 255, 255, 0.08) !important;
	box-shadow: 0 4px 20px rgba(0, 0, 0, 0.35) !important;
}

html[data-theme="dark"] .p2p-radar-canvas-wrap,
html.dark .p2p-radar-canvas-wrap {
	background: radial-gradient(circle, #1c202c 0%, #12151C 100%) !important;
	border: 2px solid rgba(255, 255, 255, 0.1) !important;
	box-shadow: inset 0 0 30px rgba(0, 0, 0, 0.6) !important;
}

html[data-theme="dark"] .p2p-radar-ring,
html.dark .p2p-radar-ring {
	border-color: rgba(255, 255, 255, 0.12) !important;
}

html[data-theme="dark"] .p2p-radar-node-icon,
html.dark .p2p-radar-node-icon {
	background: #161922 !important;
	border-color: #C5453E !important;
	box-shadow: 0 4px 14px rgba(0, 0, 0, 0.5) !important;
}

html[data-theme="dark"] .p2p-radar-node-name,
html.dark .p2p-radar-node-name {
	background: rgba(22, 25, 34, 0.95) !important;
	color: #ffffff !important;
	border: 1px solid rgba(255, 255, 255, 0.1) !important;
	box-shadow: 0 4px 12px rgba(0, 0, 0, 0.5) !important;
}

html[data-theme="dark"] .p2p-radar-empty-title,
html.dark .p2p-radar-empty-title {
	color: #ffffff !important;
}

html[data-theme="dark"] .p2p-radar-empty-desc,
html.dark .p2p-radar-empty-desc {
	color: #94a3b8 !important;
}

/* 6. Connected Devices Section */
html[data-theme="dark"] .p2p-connected-peer-card,
html.dark .p2p-connected-peer-card {
	background: #161922 !important;
	border: 2px solid rgba(16, 185, 129, 0.35) !important;
	box-shadow: 0 4px 20px rgba(0, 0, 0, 0.35) !important;
}

html[data-theme="dark"] .p2p-peer-avatar,
html.dark .p2p-peer-avatar {
	background: rgba(37, 99, 235, 0.2) !important;
	border-color: rgba(37, 99, 235, 0.4) !important;
	color: #60a5fa !important;
}

html[data-theme="dark"] .p2p-peer-name,
html.dark .p2p-peer-name {
	color: #ffffff !important;
}

html[data-theme="dark"] .p2p-peer-sub,
html.dark .p2p-peer-sub {
	color: #34d399 !important;
}

html[data-theme="dark"] .p2p-peer-action-btn,
html.dark .p2p-peer-action-btn {
	background: #1c202c !important;
	border: 1px solid rgba(255, 255, 255, 0.12) !important;
	color: #ffffff !important;
}

html[data-theme="dark"] .p2p-peer-action-btn:hover,
html.dark .p2p-peer-action-btn:hover {
	background: #252b3b !important;
	border-color: rgba(197, 69, 62, 0.4) !important;
}

html[data-theme="dark"] .p2p-btn-toggle-pair,
html.dark .p2p-btn-toggle-pair {
	background: #1c202c !important;
	color: #ffffff !important;
	border: 1px solid rgba(255, 255, 255, 0.1) !important;
}

html[data-theme="dark"] .p2p-btn-toggle-pair:hover,
html.dark .p2p-btn-toggle-pair:hover {
	background: #252b3b !important;
}

html[data-theme="dark"] .p2p-no-peers-msg,
html.dark .p2p-no-peers-msg {
	background: #12151C !important;
	border-color: rgba(255, 255, 255, 0.1) !important;
	color: #94a3b8 !important;
}

/* 7. Dropzone & File Transfer Area */
html[data-theme="dark"] .p2p-recipient-bar,
html.dark .p2p-recipient-bar {
	background: #161922 !important;
	border: 1px solid rgba(255, 255, 255, 0.08) !important;
}

html[data-theme="dark"] .p2p-recipient-label,
html.dark .p2p-recipient-label {
	color: #ffffff !important;
}

html[data-theme="dark"] .p2p-recipient-pill,
html.dark .p2p-recipient-pill {
	background: #1c202c !important;
	border: 1px solid rgba(255, 255, 255, 0.1) !important;
	color: #cbd5e1 !important;
}

html[data-theme="dark"] .p2p-recipient-pill:hover,
html.dark .p2p-recipient-pill:hover {
	background: #252b3b !important;
	border-color: #C5453E !important;
	color: #ffffff !important;
}

html[data-theme="dark"] .p2p-dropzone,
html.dark .p2p-dropzone {
	background: #161922 !important;
	border: 2px dashed rgba(255, 255, 255, 0.14) !important;
	box-shadow: 0 4px 20px rgba(0, 0, 0, 0.3) !important;
}

html[data-theme="dark"] .p2p-dropzone:hover,
html[data-theme="dark"] .p2p-dropzone.is-drag-over,
html.dark .p2p-dropzone:hover,
html.dark .p2p-dropzone.is-drag-over {
	background: rgba(197, 69, 62, 0.1) !important;
	border-color: #C5453E !important;
}

html[data-theme="dark"] .p2p-dropzone-title,
html.dark .p2p-dropzone-title {
	color: #ffffff !important;
}

html[data-theme="dark"] .p2p-dropzone-subtitle,
html.dark .p2p-dropzone-subtitle {
	color: #94a3b8 !important;
}

html[data-theme="dark"] .p2p-ft-pill,
html.dark .p2p-ft-pill {
	background: #1c202c !important;
	border: 1px solid rgba(255, 255, 255, 0.08) !important;
	color: #cbd5e1 !important;
}

/* 8. Transfer Progress & Received Files */
html[data-theme="dark"] .p2p-queue-header,
html[data-theme="dark"] .p2p-received-header,
html.dark .p2p-queue-header,
html.dark .p2p-received-header {
	color: #ffffff !important;
}

html[data-theme="dark"] .p2p-transfer-card,
html[data-theme="dark"] .p2p-received-card,
html.dark .p2p-transfer-card,
html.dark .p2p-received-card {
	background: #161922 !important;
	border: 1px solid rgba(255, 255, 255, 0.08) !important;
	box-shadow: 0 4px 16px rgba(0, 0, 0, 0.3) !important;
}

html[data-theme="dark"] .p2p-transfer-card.is-active,
html.dark .p2p-transfer-card.is-active {
	background: rgba(37, 99, 235, 0.12) !important;
	border-color: rgba(37, 99, 235, 0.4) !important;
}

html[data-theme="dark"] .p2p-file-icon,
html.dark .p2p-file-icon {
	background: #1c202c !important;
	border: 1px solid rgba(255, 255, 255, 0.08) !important;
}

html[data-theme="dark"] .p2p-file-name,
html.dark .p2p-file-name {
	color: #ffffff !important;
}

html[data-theme="dark"] .p2p-file-size,
html[data-theme="dark"] .p2p-file-sub,
html.dark .p2p-file-size,
html.dark .p2p-file-sub {
	color: #94a3b8 !important;
}

html[data-theme="dark"] .p2p-progress-bar-wrap,
html.dark .p2p-progress-bar-wrap {
	background: #12151C !important;
}

/* 9. Modals & Dialogs */
html[data-theme="dark"] .p2p-modal-overlay,
html[data-theme="dark"] .p2p-consent-modal,
html[data-theme="dark"] .p2p-connecting-modal,
html.dark .p2p-modal-overlay,
html.dark .p2p-consent-modal,
html.dark .p2p-connecting-modal {
	background: rgba(0, 0, 0, 0.78) !important;
}

html[data-theme="dark"] .p2p-modal-container,
html[data-theme="dark"] .p2p-consent-card,
html[data-theme="dark"] .p2p-connecting-card,
html.dark .p2p-modal-container,
html.dark .p2p-consent-card,
html.dark .p2p-connecting-card {
	background: #161922 !important;
	border: 1px solid rgba(255, 255, 255, 0.1) !important;
	color: #ffffff !important;
	box-shadow: 0 25px 60px rgba(0, 0, 0, 0.7) !important;
}

html[data-theme="dark"] .p2p-modal-header,
html.dark .p2p-modal-header {
	border-bottom: 1px solid rgba(255, 255, 255, 0.08) !important;
}

html[data-theme="dark"] .p2p-modal-title,
html[data-theme="dark"] .p2p-consent-title,
html[data-theme="dark"] .p2p-connecting-title,
html.dark .p2p-modal-title,
html.dark .p2p-consent-title,
html.dark .p2p-connecting-title {
	color: #ffffff !important;
}

html[data-theme="dark"] .p2p-modal-subtitle,
html[data-theme="dark"] .p2p-consent-desc,
html[data-theme="dark"] .p2p-connecting-subtitle,
html.dark .p2p-modal-subtitle,
html.dark .p2p-consent-desc,
html.dark .p2p-connecting-subtitle {
	color: #94a3b8 !important;
}

html[data-theme="dark"] .p2p-consent-desc strong,
html[data-theme="dark"] .p2p-connecting-subtitle strong,
html.dark .p2p-consent-desc strong,
html.dark .p2p-connecting-subtitle strong {
	color: #ffffff !important;
}

html[data-theme="dark"] .p2p-modal-close,
html.dark .p2p-modal-close {
	background: #1c202c !important;
	border: 1px solid rgba(255, 255, 255, 0.1) !important;
	color: #94a3b8 !important;
}

html[data-theme="dark"] .p2p-modal-close:hover,
html.dark .p2p-modal-close:hover {
	background: #252b3b !important;
	color: #ffffff !important;
}

html[data-theme="dark"] .p2p-btn-decline,
html[data-theme="dark"] .p2p-btn-connecting-cancel,
html.dark .p2p-btn-decline,
html.dark .p2p-btn-connecting-cancel {
	background: #1c202c !important;
	border: 1px solid rgba(255, 255, 255, 0.12) !important;
	color: #cbd5e1 !important;
}

html[data-theme="dark"] .p2p-btn-decline:hover,
html[data-theme="dark"] .p2p-btn-connecting-cancel:hover,
html.dark .p2p-btn-decline:hover,
html.dark .p2p-btn-connecting-cancel:hover {
	background: #fee2e2 !important;
	border-color: #fca5a5 !important;
	color: #dc2626 !important;
}

html[data-theme="dark"] .p2p-conn-dev-icon,
html.dark .p2p-conn-dev-icon {
	background: #12151C !important;
	border-color: rgba(255, 255, 255, 0.14) !important;
	color: #cbd5e1 !important;
}

html[data-theme="dark"] .p2p-conn-dev-label,
html.dark .p2p-conn-dev-label {
	color: #94a3b8 !important;
}

html[data-theme="dark"] .p2p-connecting-progress-bar-wrap,
html.dark .p2p-connecting-progress-bar-wrap {
	background: #12151C !important;
}

/* 10. Floating Toast */
html[data-theme="dark"] .p2p-toast,
html.dark .p2p-toast {
	background: rgba(22, 25, 34, 0.95) !important;
	border: 1px solid rgba(255, 255, 255, 0.12) !important;
	color: #ffffff !important;
	box-shadow: 0 10px 30px rgba(0, 0, 0, 0.6) !important;
}

/* ==================== SEARCH SUGGESTIONS DROPDOWN (.ss-suggest) ==================== */
html[data-theme="dark"] .ss-suggest,
html.dark .ss-suggest {
	background: #161922 !important;
	border: 1px solid rgba(255, 255, 255, 0.12) !important;
	box-shadow: 0 16px 48px rgba(0, 0, 0, 0.65), 0 4px 16px rgba(0, 0, 0, 0.4) !important;
}

html[data-theme="dark"] .ss-item,
html.dark .ss-item {
	color: #cbd5e1 !important;
}

html[data-theme="dark"] .ss-item:hover,
html[data-theme="dark"] .ss-item.active,
html.dark .ss-item:hover,
html.dark .ss-item.active {
	background: rgba(197, 69, 62, 0.18) !important;
	color: #ffffff !important;
}

html[data-theme="dark"] .ss-item-icon,
html.dark .ss-item-icon {
	background: #1c202c !important;
	border: 1px solid rgba(255, 255, 255, 0.08) !important;
	color: #94a3b8 !important;
}

html[data-theme="dark"] .ss-item:hover .ss-item-icon,
html[data-theme="dark"] .ss-item.active .ss-item-icon,
html.dark .ss-item:hover .ss-item-icon,
html.dark .ss-item.active .ss-item-icon {
	background: #252b3b !important;
	border-color: rgba(197, 69, 62, 0.4) !important;
	color: #FF7B72 !important;
}

html[data-theme="dark"] .ss-item .ss-tool,
html.dark .ss-item .ss-tool {
	color: #ffffff !important;
}

html[data-theme="dark"] .ss-item:hover .ss-tool,
html[data-theme="dark"] .ss-item.active .ss-tool,
html.dark .ss-item:hover .ss-tool,
html.dark .ss-item.active .ss-tool {
	color: #ffffff !important;
}

html[data-theme="dark"] .ss-item .ss-tool mark,
html.dark .ss-item .ss-tool mark {
	background: transparent !important;
	color: #FF7B72 !important;
}

html[data-theme="dark"] .ss-item-tag,
html.dark .ss-item-tag {
	background: #1c202c !important;
	color: #94a3b8 !important;
	border: 1px solid rgba(255, 255, 255, 0.06) !important;
}

html[data-theme="dark"] .ss-item:hover .ss-item-tag,
html[data-theme="dark"] .ss-item.active .ss-item-tag,
html.dark .ss-item:hover .ss-item-tag,
html.dark .ss-item.active .ss-item-tag {
	background: rgba(197, 69, 62, 0.25) !important;
	color: #FF7B72 !important;
	border-color: rgba(197, 69, 62, 0.4) !important;
}

html[data-theme="dark"] .ss-footer-hint,
html.dark .ss-footer-hint {
	color: #64748b !important;
	border-top: 1px solid rgba(255, 255, 255, 0.08) !important;
}

html[data-theme="dark"] .ss-footer-hint kbd,
html.dark .ss-footer-hint kbd {
	background: #1c202c !important;
	border: 1px solid rgba(255, 255, 255, 0.1) !important;
	color: #94a3b8 !important;
}

html[data-theme="dark"] .ss-empty,
html[data-theme="dark"] .ss-no-results,
html.dark .ss-empty,
html.dark .ss-no-results {
	color: #94a3b8 !important;
}

/* --------------------------------------------------------------------------
   15. SOCIAL MEDIA VIDEO DOWNLOADER (DARK & LIGHT THEME COMPLETE SUITE)
   -------------------------------------------------------------------------- */

/* Light Theme Variables & Defaults for SMVD */
:root,
html[data-theme="light"] {
	--smvd-surface-0: #f8fafc;
	--smvd-surface-1: #ffffff;
	--smvd-surface-2: #f1f5f9;
	--smvd-surface-3: #e2e8f0;
	--smvd-border-subtle: #e2e8f0;
	--smvd-border-medium: #cbd5e1;
	--smvd-text-1: #0f172a;
	--smvd-text-2: #334155;
	--smvd-text-3: #64748b;
}

/* ==================== DARK MODE FOR SMVD ==================== */
html[data-theme="dark"],
html.dark {
	--smvd-surface-0: #0e1015;
	--smvd-surface-1: #161922;
	--smvd-surface-2: #1c202c;
	--smvd-surface-3: #222736;
	--smvd-border-subtle: rgba(255, 255, 255, 0.08);
	--smvd-border-medium: rgba(255, 255, 255, 0.14);
	--smvd-text-1: #ffffff;
	--smvd-text-2: #cbd5e1;
	--smvd-text-3: #94a3b8;
}

/* 1. Platform Filter Chips */
html[data-theme="dark"] .smvd-pf-chip,
html.dark .smvd-pf-chip {
	background: #161922 !important;
	border: 1px solid rgba(255, 255, 255, 0.1) !important;
	color: #cbd5e1 !important;
	box-shadow: 0 2px 8px rgba(0, 0, 0, 0.3) !important;
}

html[data-theme="dark"] .smvd-pf-chip:hover,
html.dark .smvd-pf-chip:hover {
	background: #1c202c !important;
	border-color: rgba(255, 255, 255, 0.22) !important;
	color: #ffffff !important;
	transform: translateY(-1px);
	box-shadow: 0 6px 16px rgba(0, 0, 0, 0.45) !important;
}

html[data-theme="dark"] .smvd-pf-chip.is-active,
html.dark .smvd-pf-chip.is-active {
	background: rgba(197, 69, 62, 0.18) !important;
	border-color: rgba(197, 69, 62, 0.4) !important;
	color: #FF7B72 !important;
	box-shadow: 0 4px 14px rgba(197, 69, 62, 0.25) !important;
}

/* Handle SVG icon colors on platform chips in dark mode */
html[data-theme="dark"] .smvd-pf-chip[data-pf="tiktok"] svg,
html.dark .smvd-pf-chip[data-pf="tiktok"] svg {
	color: #ffffff !important;
	fill: currentColor !important;
}

html[data-theme="dark"] .smvd-pf-chip[data-pf="twitter"] svg,
html.dark .smvd-pf-chip[data-pf="twitter"] svg {
	color: #ffffff !important;
	fill: currentColor !important;
}

/* 2. Main Search / URL Box Card */
html[data-theme="dark"] .smvd-search-card,
html.dark .smvd-search-card {
	background: #161922 !important;
	border: 1px solid rgba(255, 255, 255, 0.08) !important;
	box-shadow: 0 10px 36px rgba(0, 0, 0, 0.5) !important;
}

html[data-theme="dark"] .smvd-input-wrap,
html.dark .smvd-input-wrap {
	background: #12151C !important;
	border: 1.5px solid rgba(255, 255, 255, 0.12) !important;
	box-shadow: inset 0 1px 3px rgba(0, 0, 0, 0.3) !important;
}

html[data-theme="dark"] .smvd-input-wrap:focus-within,
html.dark .smvd-input-wrap:focus-within {
	border-color: #C5453E !important;
	background: #161922 !important;
	box-shadow: 0 0 0 3.5px rgba(197, 69, 62, 0.25), inset 0 1px 3px rgba(0, 0, 0, 0.3) !important;
}

html[data-theme="dark"] .smvd-platform-badge,
html.dark .smvd-platform-badge {
	background: #1c202c !important;
	border: 1px solid rgba(255, 255, 255, 0.1) !important;
	color: #ffffff !important;
}

html[data-theme="dark"] .smvd-input,
html.dark .smvd-input {
	color: #ffffff !important;
}

html[data-theme="dark"] .smvd-input::placeholder,
html.dark .smvd-input::placeholder {
	color: #64748b !important;
}

html[data-theme="dark"] .smvd-clear-btn,
html.dark .smvd-clear-btn {
	background: #1c202c !important;
	color: #94a3b8 !important;
}

html[data-theme="dark"] .smvd-clear-btn:hover,
html.dark .smvd-clear-btn:hover {
	background: #252b3b !important;
	color: #ffffff !important;
}

html[data-theme="dark"] .smvd-paste-btn,
html.dark .smvd-paste-btn {
	background: #1c202c !important;
	border: 1px solid rgba(255, 255, 255, 0.1) !important;
	color: #cbd5e1 !important;
}

html[data-theme="dark"] .smvd-paste-btn svg,
html.dark .smvd-paste-btn svg {
	color: #94a3b8 !important;
}

html[data-theme="dark"] .smvd-paste-btn:hover,
html.dark .smvd-paste-btn:hover {
	background: #252b3b !important;
	border-color: rgba(197, 69, 62, 0.4) !important;
	color: #ffffff !important;
}

html[data-theme="dark"] .smvd-fetch-btn,
html.dark .smvd-fetch-btn {
	background: linear-gradient(135deg, #C5453E, #db3a32) !important;
	color: #ffffff !important;
	box-shadow: 0 4px 14px rgba(197, 69, 62, 0.35) !important;
}

html[data-theme="dark"] .smvd-fetch-btn:hover,
html.dark .smvd-fetch-btn:hover {
	box-shadow: 0 6px 20px rgba(197, 69, 62, 0.5) !important;
}

/* 3. Format & Quality Options Toolbar */
html[data-theme="dark"] .smvd-options-toolbar,
html.dark .smvd-options-toolbar {
	border-top: 1px solid rgba(255, 255, 255, 0.08) !important;
}

html[data-theme="dark"] .smvd-format-pill,
html.dark .smvd-format-pill {
	background: #1c202c !important;
	border: 1px solid rgba(255, 255, 255, 0.1) !important;
	color: #cbd5e1 !important;
}

html[data-theme="dark"] .smvd-select-group,
html.dark .smvd-select-group {
	color: #cbd5e1 !important;
}

html[data-theme="dark"] .smvd-select-group label,
html.dark .smvd-select-group label {
	color: #94a3b8 !important;
}

html[data-theme="dark"] .smvd-select-group select,
html[data-theme="dark"] .smvd-select-group .ve-select,
html.dark .smvd-select-group select,
html.dark .smvd-select-group .ve-select {
	background: #12151C !important;
	border: 1.5px solid rgba(255, 255, 255, 0.12) !important;
	color: #ffffff !important;
}

html[data-theme="dark"] .smvd-select-group select option,
html[data-theme="dark"] .smvd-select-group .ve-select option,
html.dark .smvd-select-group select option,
html.dark .smvd-select-group .ve-select option {
	background: #161922 !important;
	color: #ffffff !important;
}

html[data-theme="dark"] .smvd-checkbox-label,
html.dark .smvd-checkbox-label {
	color: #cbd5e1 !important;
}

/* 4. Progress & Status & Error */
html[data-theme="dark"] .smvd-progress-track,
html.dark .smvd-progress-track {
	background: #12151C !important;
	border: 1px solid rgba(255, 255, 255, 0.08) !important;
}

html[data-theme="dark"] .smvd-progress-bar,
html.dark .smvd-progress-bar {
	background: linear-gradient(90deg, #C5453E, #ff6b6b) !important;
	box-shadow: 0 0 10px rgba(197, 69, 62, 0.5) !important;
}

html[data-theme="dark"] .smvd-status-msg,
html.dark .smvd-status-msg {
	color: #FF7B72 !important;
}

html[data-theme="dark"] .smvd-error-box,
html.dark .smvd-error-box {
	background: rgba(239, 68, 68, 0.15) !important;
	border: 1px solid rgba(239, 68, 68, 0.35) !important;
	color: #f87171 !important;
}

html[data-theme="dark"] .smvd-error-icon,
html.dark .smvd-error-icon {
	color: #f87171 !important;
}

/* 5. Results Studio Card */
html[data-theme="dark"] .smvd-result-card,
html.dark .smvd-result-card {
	background: #161922 !important;
	border: 1px solid rgba(255, 255, 255, 0.08) !important;
	box-shadow: 0 12px 40px rgba(0, 0, 0, 0.6) !important;
}

html[data-theme="dark"] .smvd-thumb-wrap,
html.dark .smvd-thumb-wrap {
	background: #0f172a !important;
	border: 1px solid rgba(255, 255, 255, 0.08) !important;
	box-shadow: 0 4px 14px rgba(0, 0, 0, 0.4) !important;
}

html[data-theme="dark"] .smvd-video-title,
html.dark .smvd-video-title {
	color: #ffffff !important;
}

html[data-theme="dark"] .smvd-video-author,
html.dark .smvd-video-author {
	color: #94a3b8 !important;
}

html[data-theme="dark"] .smvd-btn-secondary,
html.dark .smvd-btn-secondary {
	background: #1c202c !important;
	border: 1px solid rgba(255, 255, 255, 0.1) !important;
	color: #ffffff !important;
}

html[data-theme="dark"] .smvd-btn-secondary:hover,
html.dark .smvd-btn-secondary:hover {
	background: #252b3b !important;
	border-color: rgba(255, 255, 255, 0.22) !important;
	color: #ffffff !important;
}

html[data-theme="dark"] .smvd-btn-outline,
html.dark .smvd-btn-outline {
	background: transparent !important;
	color: #FF7B72 !important;
	border: 1px solid rgba(197, 69, 62, 0.4) !important;
}

html[data-theme="dark"] .smvd-btn-outline:hover,
html.dark .smvd-btn-outline:hover {
	background: rgba(197, 69, 62, 0.15) !important;
	border-color: #C5453E !important;
	color: #ffffff !important;
}

html[data-theme="dark"] .smvd-btn-ghost,
html.dark .smvd-btn-ghost {
	background: #1c202c !important;
	color: #cbd5e1 !important;
	border: 1px solid rgba(255, 255, 255, 0.1) !important;
}

html[data-theme="dark"] .smvd-btn-ghost:hover,
html.dark .smvd-btn-ghost:hover {
	background: #252b3b !important;
	color: #ffffff !important;
	border-color: rgba(197, 69, 62, 0.4) !important;
}

html[data-theme="dark"] .smvd-hub-notice,
html.dark .smvd-hub-notice {
	background: rgba(197, 69, 62, 0.15) !important;
	border: 1px solid rgba(197, 69, 62, 0.3) !important;
	color: #f87171 !important;
}

html[data-theme="dark"] .smvd-hub-notice strong,
html.dark .smvd-hub-notice strong {
	color: #ffffff !important;
}

html[data-theme="dark"] .smvd-secondary-actions,
html.dark .smvd-secondary-actions {
	border-top: 1px solid rgba(255, 255, 255, 0.08) !important;
}

/* 6. Toast Notification */
html[data-theme="dark"] .smvd-toast,
html.dark .smvd-toast {
	background: rgba(22, 25, 34, 0.95) !important;
	backdrop-filter: blur(14px);
	-webkit-backdrop-filter: blur(14px);
	border: 1px solid rgba(255, 255, 255, 0.12) !important;
	color: #ffffff !important;
	box-shadow: 0 14px 36px rgba(0, 0, 0, 0.6) !important;
}

/* --------------------------------------------------------------------------
   16. IMAGE CONVERTER, COMPRESSOR & MULTI-TOOL APPS (.ic-app) - DARK & LIGHT THEME
   -------------------------------------------------------------------------- */

/* Light Theme Variables & Defaults */
:root,
html[data-theme="light"] {
	--ic-surface-0: #f8fafc;
	--ic-surface-1: #ffffff;
	--ic-surface-2: #f1f5f9;
	--ic-surface-3: #e2e8f0;
	--ic-border-subtle: #e2e8f0;
	--ic-border-medium: #cbd5e1;
	--ic-text-1: #0f172a;
	--ic-text-2: #334155;
	--ic-text-3: #64748b;
}

/* ==================== DARK MODE RULES FOR .ic-app ==================== */
html[data-theme="dark"] .ic-app,
html.dark .ic-app {
	background: #161922 !important;
	border: 1px solid rgba(255, 255, 255, 0.08) !important;
	box-shadow: 0 10px 36px rgba(0, 0, 0, 0.5) !important;
}

html[data-theme="dark"] .ic-app.is-dragging,
html.dark .ic-app.is-dragging {
	box-shadow: inset 0 0 0 3px #C5453E, 0 10px 36px rgba(0, 0, 0, 0.5) !important;
}

/* 1. Dropzone in Dark Mode */
html[data-theme="dark"] .ic-dropzone,
html.dark .ic-dropzone {
	background: rgba(197, 69, 62, 0.06) !important;
	border: 2px dashed rgba(197, 69, 62, 0.4) !important;
	border-radius: 14px !important;
}

html[data-theme="dark"] .ic-dropzone:hover,
html[data-theme="dark"] .ic-dropzone.is-dragover,
html.dark .ic-dropzone:hover,
html.dark .ic-dropzone.is-dragover {
	background: rgba(197, 69, 62, 0.14) !important;
	border-color: #C5453E !important;
	transform: scale(1.008);
}

html[data-theme="dark"] .ic-dropzone p,
html.dark .ic-dropzone p {
	color: #FFFFFF !important;
}

html[data-theme="dark"] .ic-dropzone .ic-or,
html.dark .ic-dropzone .ic-or {
	color: #94A3B8 !important;
}

html[data-theme="dark"] .ic-dropzone .ic-hint,
html.dark .ic-dropzone .ic-hint {
	color: #94A3B8 !important;
}

/* 2. Buttons in Dark Mode */
html[data-theme="dark"] .ic-btn,
html.dark .ic-btn {
	background: linear-gradient(135deg, #C5453E, #db3a32) !important;
	color: #FFFFFF !important;
	box-shadow: 0 4px 14px rgba(197, 69, 62, 0.35) !important;
}

html[data-theme="dark"] .ic-btn:hover,
html.dark .ic-btn:hover {
	background: #B23D37 !important;
	box-shadow: 0 6px 20px rgba(197, 69, 62, 0.45) !important;
}

html[data-theme="dark"] .ic-btn:disabled,
html.dark .ic-btn:disabled {
	opacity: 0.5 !important;
	cursor: not-allowed !important;
	box-shadow: none !important;
}

html[data-theme="dark"] .ic-download-all,
html[data-theme="dark"] .ic-compress-more,
html.dark .ic-download-all,
html.dark .ic-compress-more {
	background: #1C202C !important;
	border: 1px solid rgba(255, 255, 255, 0.12) !important;
	color: #FFFFFF !important;
}

html[data-theme="dark"] .ic-download-all:hover,
html[data-theme="dark"] .ic-compress-more:hover,
html.dark .ic-download-all:hover,
html.dark .ic-compress-more:hover {
	background: #252B3B !important;
	border-color: rgba(255, 255, 255, 0.25) !important;
}

/* 3. Features List in Dark Mode */
html[data-theme="dark"] .ic-features li,
html.dark .ic-features li {
	background: #12151C !important;
	border: 1px solid rgba(255, 255, 255, 0.08) !important;
	color: #CBD5E1 !important;
	box-shadow: 0 2px 8px rgba(0, 0, 0, 0.25) !important;
}

/* 4. Settings & Controls in Dark Mode */
html[data-theme="dark"] .ic-settings,
html.dark .ic-settings {
	background: #12151C !important;
	border: 1px solid rgba(255, 255, 255, 0.08) !important;
	border-radius: 14px !important;
}

html[data-theme="dark"] .ic-field label,
html.dark .ic-field label {
	color: #FFFFFF !important;
}

html[data-theme="dark"] .ic-field select,
html[data-theme="dark"] .ic-field input[type="number"],
html[data-theme="dark"] .ic-field input[type="text"],
html[data-theme="dark"] #imc-format,
html.dark .ic-field select,
html.dark .ic-field input[type="number"],
html.dark .ic-field input[type="text"],
html.dark #imc-format {
	background: #161922 !important;
	border: 1.5px solid rgba(255, 255, 255, 0.12) !important;
	color: #FFFFFF !important;
}

html[data-theme="dark"] .ic-field select option,
html[data-theme="dark"] #imc-format option,
html.dark .ic-field select option,
html.dark #imc-format option {
	background: #161922 !important;
	color: #FFFFFF !important;
}

html[data-theme="dark"] .ic-field select:focus,
html[data-theme="dark"] .ic-field input:focus,
html[data-theme="dark"] #imc-format:focus,
html.dark .ic-field select:focus,
html.dark .ic-field input:focus,
html.dark #imc-format:focus {
	border-color: #C5453E !important;
	box-shadow: 0 0 0 3px rgba(197, 69, 62, 0.25) !important;
}

html[data-theme="dark"] .pm-order-hint,
html[data-theme="dark"] .ic-empty,
html.dark .pm-order-hint,
html.dark .ic-empty {
	color: #94A3B8 !important;
}

html[data-theme="dark"] .ic-field-inline span,
html.dark .ic-field-inline span {
	color: #94A3B8 !important;
}

html[data-theme="dark"] .ic-quality-val,
html.dark .ic-quality-val {
	color: #FFFFFF !important;
}

html[data-theme="dark"] .ic-alpha-wrap,
html.dark .ic-alpha-wrap {
	color: #CBD5E1 !important;
}

/* 5. File List & Items in Dark Mode */
html[data-theme="dark"] .ic-list-head strong,
html.dark .ic-list-head strong {
	color: #FFFFFF !important;
}

html[data-theme="dark"] .ic-add-more,
html.dark .ic-add-more {
	background: rgba(197, 69, 62, 0.12) !important;
	border: 1px dashed rgba(197, 69, 62, 0.45) !important;
	color: #FF7B72 !important;
}

html[data-theme="dark"] .ic-add-more:hover,
html.dark .ic-add-more:hover {
	background: rgba(197, 69, 62, 0.22) !important;
	color: #FFA39E !important;
}

html[data-theme="dark"] .ic-row,
html.dark .ic-row {
	background: #12151C !important;
	border: 1px solid rgba(255, 255, 255, 0.08) !important;
	box-shadow: 0 2px 8px rgba(0, 0, 0, 0.2) !important;
}

html[data-theme="dark"] .ic-row:hover,
html.dark .ic-row:hover {
	border-color: rgba(255, 255, 255, 0.16) !important;
	background: #161922 !important;
}

html[data-theme="dark"] .ic-row.is-busy,
html.dark .ic-row.is-busy {
	box-shadow: 0 0 0 2px rgba(197, 69, 62, 0.35) !important;
}

html[data-theme="dark"] .ic-thumb,
html.dark .ic-thumb {
	background: #1C202C !important;
	border: 1px solid rgba(255, 255, 255, 0.08) !important;
}

html[data-theme="dark"] .ic-name,
html.dark .ic-name {
	color: #FFFFFF !important;
}

html[data-theme="dark"] .ic-size,
html[data-theme="dark"] .ic-status,
html.dark .ic-size,
html.dark .ic-status {
	color: #94A3B8 !important;
}

html[data-theme="dark"] .ic-status.is-done,
html.dark .ic-status.is-done {
	color: #34D399 !important;
}

html[data-theme="dark"] .ic-status.is-fail,
html.dark .ic-status.is-fail {
	color: #F87171 !important;
}

html[data-theme="dark"] .ic-savings.is-good,
html.dark .ic-savings.is-good {
	color: #34D399 !important;
}

html[data-theme="dark"] .ic-savings.is-bad,
html.dark .ic-savings.is-bad {
	color: #F87171 !important;
}

html[data-theme="dark"] .ic-download,
html.dark .ic-download {
	background: #C5453E !important;
	color: #FFFFFF !important;
}

html[data-theme="dark"] .ic-download:hover,
html.dark .ic-download:hover {
	background: #B23D37 !important;
}

html[data-theme="dark"] .ic-remove,
html[data-theme="dark"] .ic-move,
html.dark .ic-remove,
html.dark .ic-move {
	background: #1C202C !important;
	color: #94A3B8 !important;
	border: 1px solid rgba(255, 255, 255, 0.08) !important;
}

html[data-theme="dark"] .ic-remove:hover,
html[data-theme="dark"] .ic-move:hover,
html.dark .ic-remove:hover,
html.dark .ic-move:hover {
	background: #252B3B !important;
	color: #FFFFFF !important;
	border-color: rgba(197, 69, 62, 0.4) !important;
}

html[data-theme="dark"] .pm-grip,
html.dark .pm-grip {
	color: #64748B !important;
}

html[data-theme="dark"] .ic-summary,
html.dark .ic-summary {
	background: #12151C !important;
	border: 1px solid rgba(255, 255, 255, 0.08) !important;
	color: #FFFFFF !important;
}

html[data-theme="dark"] .pu-pass-box,
html.dark .pu-pass-box {
	background: #12151C !important;
	border: 1px solid rgba(255, 255, 255, 0.08) !important;
}

html[data-theme="dark"] .pu-pass-head label,
html.dark .pu-pass-head label {
	color: #FFFFFF !important;
}

html[data-theme="dark"] .pu-pass-icon,
html.dark .pu-pass-icon {
	background: rgba(197, 69, 62, 0.18) !important;
	color: #FF7B72 !important;
}

html[data-theme="dark"] .dc-target,
html.dark .dc-target {
	background: #161922 !important;
	border: 1px solid rgba(255, 255, 255, 0.12) !important;
	color: #FFFFFF !important;
}

html[data-theme="dark"] .ic-success,
html.dark .ic-success {
	background: repeating-linear-gradient(45deg, #2e6b4b, #2e6b4b 14px, #357a55 14px, #357a55 28px) !important;
	box-shadow: 0 4px 14px rgba(46, 107, 75, 0.45) !important;
}

/* 6. Video to Audio & Video Tools Enhancements */
html[data-theme="dark"] .vpe-toolbar,
html.dark .vpe-toolbar {
	background: #12151C !important;
	border: 1px solid rgba(255, 255, 255, 0.08) !important;
	border-radius: 12px !important;
	padding: 12px 16px !important;
}

html[data-theme="dark"] .vpe-toolbar label,
html.dark .vpe-toolbar label {
	color: #cbd5e1 !important;
}

html[data-theme="dark"] .vpe-toolbar select,
html[data-theme="dark"] .vpe-toolbar .ve-select,
html.dark .vpe-toolbar select,
html.dark .vpe-toolbar .ve-select {
	background: #161922 !important;
	border: 1.5px solid rgba(255, 255, 255, 0.12) !important;
	color: #ffffff !important;
	border-radius: 8px !important;
}

html[data-theme="dark"] .vpe-toolbar select option,
html[data-theme="dark"] .vpe-toolbar .ve-select option,
html.dark .vpe-toolbar select option,
html.dark .vpe-toolbar .ve-select option {
	background: #161922 !important;
	color: #ffffff !important;
}

html[data-theme="dark"] .vpe-toolbar span[style*="background"],
html.dark .vpe-toolbar span[style*="background"] {
	background: rgba(255, 255, 255, 0.12) !important;
}

html[data-theme="dark"] .ic-progress-wr,
html.dark .ic-progress-wr {
	margin-bottom: 12px;
}

html[data-theme="dark"] .ic-progress,
html.dark .ic-progress {
	background: #12151C !important;
	border: 1px solid rgba(255, 255, 255, 0.08) !important;
	border-radius: 99px !important;
	height: 8px !important;
	overflow: hidden !important;
}

html[data-theme="dark"] .ic-progress-bar,
html.dark .ic-progress-bar {
	background: linear-gradient(90deg, #C5453E, #ff6b6b) !important;
	box-shadow: 0 0 10px rgba(197, 69, 62, 0.5) !important;
}

html[data-theme="dark"] #va-load-txt,
html.dark #va-load-txt {
	color: #94A3B8 !important;
}

html[data-theme="dark"] #va-status,
html.dark #va-status {
	color: #34D399 !important;
}

html[data-theme="dark"] .ic-row-main,
html.dark .ic-row-main {
	display: flex;
	flex-direction: column;
	gap: 2px;
	min-width: 0;
}

html[data-theme="dark"] .ic-row-side,
html.dark .ic-row-side {
	display: flex;
	align-items: center;
	gap: 10px;
	flex-shrink: 0;
}

/* --------------------------------------------------------------------------
   17. WEBSITE TESTER & AUDITOR (.wt-app) - DARK & LIGHT THEME COMPLETE SUITE
   -------------------------------------------------------------------------- */

/* Light Theme Variables */
:root,
html[data-theme="light"] {
	--wt-surface-0: #f8fafc;
	--wt-surface-1: #ffffff;
	--wt-surface-2: #f1f5f9;
	--wt-surface-3: #e2e8f0;
	--wt-border-subtle: #e2e8f0;
	--wt-border-medium: #cbd5e1;
	--wt-text-1: #0f172a;
	--wt-text-2: #334155;
	--wt-text-3: #64748b;
}

/* ==================== DARK MODE FOR WEBSITE TESTER ==================== */
html[data-theme="dark"],
html.dark {
	--wt-surface-0: #0e1015;
	--wt-surface-1: #161922;
	--wt-surface-2: #1c202c;
	--wt-surface-3: #222736;
	--wt-border-subtle: rgba(255, 255, 255, 0.08);
	--wt-border-medium: rgba(255, 255, 255, 0.14);
	--wt-text-1: #ffffff;
	--wt-text-2: #cbd5e1;
	--wt-text-3: #94a3b8;
}

/* 1. Main Hero Search Card */
html[data-theme="dark"] .wt-hero-card,
html.dark .wt-hero-card {
	background: #161922 !important;
	border: 1px solid rgba(255, 255, 255, 0.08) !important;
	box-shadow: 0 10px 36px rgba(0, 0, 0, 0.5) !important;
}

html[data-theme="dark"] .wt-url-input,
html.dark .wt-url-input {
	background: #12151C !important;
	border: 1.5px solid rgba(255, 255, 255, 0.12) !important;
	color: #ffffff !important;
}

html[data-theme="dark"] .wt-url-input::placeholder,
html.dark .wt-url-input::placeholder {
	color: #64748b !important;
}

html[data-theme="dark"] .wt-url-input:focus,
html.dark .wt-url-input:focus {
	border-color: #C5453E !important;
	background: #161922 !important;
	box-shadow: 0 0 0 3px rgba(197, 69, 62, 0.25) !important;
}

html[data-theme="dark"] .wt-run-btn,
html.dark .wt-run-btn {
	background: linear-gradient(135deg, #C5453E, #db3a32) !important;
	color: #ffffff !important;
	box-shadow: 0 4px 14px rgba(197, 69, 62, 0.35) !important;
}

html[data-theme="dark"] .wt-run-btn:hover,
html.dark .wt-run-btn:hover {
	background: #b23b35 !important;
	box-shadow: 0 6px 20px rgba(197, 69, 62, 0.45) !important;
}

html[data-theme="dark"] .wt-presets-lbl,
html.dark .wt-presets-lbl {
	color: #94a3b8 !important;
}

html[data-theme="dark"] .wt-preset-chip,
html.dark .wt-preset-chip {
	background: #1c202c !important;
	border: 1px solid rgba(255, 255, 255, 0.1) !important;
	color: #cbd5e1 !important;
}

html[data-theme="dark"] .wt-preset-chip:hover,
html.dark .wt-preset-chip:hover {
	background: #252b3b !important;
	border-color: rgba(197, 69, 62, 0.4) !important;
	color: #FF7B72 !important;
}

html[data-theme="dark"] .wt-hero-hint,
html.dark .wt-hero-hint {
	color: #94a3b8 !important;
}

/* 2. Loading & Progress State */
html[data-theme="dark"] .wt-status-wrap,
html.dark .wt-status-wrap {
	background: #161922 !important;
	border: 1px solid rgba(255, 255, 255, 0.08) !important;
	box-shadow: 0 4px 20px rgba(0, 0, 0, 0.4) !important;
}

html[data-theme="dark"] .wt-spinner,
html.dark .wt-spinner {
	border-color: #1c202c !important;
	border-top-color: #C5453E !important;
}

html[data-theme="dark"] .wt-status-text,
html.dark .wt-status-text {
	color: #ffffff !important;
}

html[data-theme="dark"] .wt-progress-bar-wrap,
html.dark .wt-progress-bar-wrap {
	background: #12151C !important;
	border: 1px solid rgba(255, 255, 255, 0.08) !important;
}

html[data-theme="dark"] .wt-progress-bar,
html.dark .wt-progress-bar {
	background: linear-gradient(90deg, #C5453E 0%, #f97316 100%) !important;
}

/* 3. Error State Box */
html[data-theme="dark"] .wt-error-box,
html.dark .wt-error-box {
	background: rgba(239, 68, 68, 0.15) !important;
	border: 1px solid rgba(239, 68, 68, 0.35) !important;
}

html[data-theme="dark"] .wt-error-title,
html.dark .wt-error-title {
	color: #f87171 !important;
}

html[data-theme="dark"] .wt-error-msg,
html.dark .wt-error-msg {
	color: #fca5a5 !important;
}

html[data-theme="dark"] .wt-error-tips,
html.dark .wt-error-tips {
	background: #161922 !important;
	border: 1px solid rgba(255, 255, 255, 0.08) !important;
	color: #cbd5e1 !important;
}

html[data-theme="dark"] .wt-error-tips strong,
html.dark .wt-error-tips strong {
	color: #ffffff !important;
}

html[data-theme="dark"] .wt-error-tips code,
html.dark .wt-error-tips code {
	background: #1c202c !important;
	color: #FF7B72 !important;
	border: 1px solid rgba(255, 255, 255, 0.08) !important;
}

/* 4. History / Saved Projects Section */
html[data-theme="dark"] .wt-history-section,
html.dark .wt-history-section {
	background: #161922 !important;
	border: 1px solid rgba(255, 255, 255, 0.08) !important;
}

html[data-theme="dark"] .wt-history-title,
html.dark .wt-history-title {
	color: #ffffff !important;
}

html[data-theme="dark"] .wt-history-clear-btn,
html.dark .wt-history-clear-btn {
	background: #1c202c !important;
	border: 1px solid rgba(255, 255, 255, 0.1) !important;
	color: #94a3b8 !important;
}

html[data-theme="dark"] .wt-history-clear-btn:hover,
html.dark .wt-history-clear-btn:hover {
	background: rgba(239, 68, 68, 0.2) !important;
	border-color: rgba(239, 68, 68, 0.4) !important;
	color: #f87171 !important;
}

html[data-theme="dark"] .wt-history-card,
html.dark .wt-history-card {
	background: #12151C !important;
	border: 1px solid rgba(255, 255, 255, 0.08) !important;
	box-shadow: 0 2px 8px rgba(0, 0, 0, 0.25) !important;
}

html[data-theme="dark"] .wt-history-card:hover,
html.dark .wt-history-card:hover {
	background: #1c202c !important;
	border-color: rgba(255, 255, 255, 0.16) !important;
}

html[data-theme="dark"] .wt-history-card.is-active,
html.dark .wt-history-card.is-active {
	border-color: rgba(197, 69, 62, 0.4) !important;
	background: #1c202c !important;
}

html[data-theme="dark"] .wt-history-url,
html.dark .wt-history-url {
	color: #ffffff !important;
}

html[data-theme="dark"] .wt-history-meta,
html.dark .wt-history-meta {
	color: #94a3b8 !important;
}

html[data-theme="dark"] .wt-history-pill,
html.dark .wt-history-pill {
	background: #1c202c !important;
	border: 1px solid rgba(255, 255, 255, 0.08) !important;
	color: #cbd5e1 !important;
}

html[data-theme="dark"] .wt-history-btn,
html.dark .wt-history-btn {
	background: #1c202c !important;
	border: 1px solid rgba(255, 255, 255, 0.1) !important;
	color: #cbd5e1 !important;
}

html[data-theme="dark"] .wt-history-btn:hover,
html.dark .wt-history-btn:hover {
	background: #252b3b !important;
	color: #ffffff !important;
}

html[data-theme="dark"] .wt-history-btn-retest,
html.dark .wt-history-btn-retest {
	background: #C5453E !important;
	border-color: #C5453E !important;
	color: #ffffff !important;
}

html[data-theme="dark"] .wt-history-btn-retest:hover,
html.dark .wt-history-btn-retest:hover {
	background: #b23b35 !important;
	border-color: #b23b35 !important;
}

html[data-theme="dark"] .wt-history-del-btn,
html.dark .wt-history-del-btn {
	color: #94a3b8 !important;
}

html[data-theme="dark"] .wt-history-del-btn:hover,
html.dark .wt-history-del-btn:hover {
	color: #f87171 !important;
	background: rgba(239, 68, 68, 0.15) !important;
}

/* 5. Dashboard Container & Report Header */
html[data-theme="dark"] .wt-dashboard,
html.dark .wt-dashboard {
	background: #161922 !important;
	border: 1px solid rgba(255, 255, 255, 0.08) !important;
	box-shadow: 0 10px 36px rgba(0, 0, 0, 0.5) !important;
}

html[data-theme="dark"] .wt-report-header,
html.dark .wt-report-header {
	border-bottom: 1px solid rgba(255, 255, 255, 0.08) !important;
}

html[data-theme="dark"] .wt-site-title,
html.dark .wt-site-title {
	color: #ffffff !important;
}

html[data-theme="dark"] .wt-site-meta,
html.dark .wt-site-meta {
	color: #94a3b8 !important;
}

html[data-theme="dark"] .wt-action-btn,
html.dark .wt-action-btn {
	background: #1c202c !important;
	border: 1px solid rgba(255, 255, 255, 0.1) !important;
	color: #cbd5e1 !important;
}

html[data-theme="dark"] .wt-action-btn:hover,
html.dark .wt-action-btn:hover {
	background: #252b3b !important;
	border-color: rgba(197, 69, 62, 0.4) !important;
	color: #ffffff !important;
}

html[data-theme="dark"] .wt-action-btn-primary,
html.dark .wt-action-btn-primary {
	background: #C5453E !important;
	border-color: #C5453E !important;
	color: #ffffff !important;
}

html[data-theme="dark"] .wt-action-btn-primary:hover,
html.dark .wt-action-btn-primary:hover {
	background: #b23b35 !important;
	border-color: #b23b35 !important;
}

/* 6. Score Tiles Grid (5 Top Tiles) */
html[data-theme="dark"] .wt-score-tile,
html.dark .wt-score-tile {
	background: #12151C !important;
	border: 1px solid rgba(255, 255, 255, 0.08) !important;
	box-shadow: 0 2px 8px rgba(0, 0, 0, 0.25) !important;
}

html[data-theme="dark"] .wt-score-tile:hover,
html.dark .wt-score-tile:hover {
	background: #1c202c !important;
	border-color: rgba(255, 255, 255, 0.16) !important;
}

html[data-theme="dark"] .wt-score-num,
html.dark .wt-score-num {
	color: #ffffff !important;
}

html[data-theme="dark"] .wt-score-lbl,
html.dark .wt-score-lbl {
	color: #94a3b8 !important;
}

html[data-theme="dark"] .wt-score-meter,
html.dark .wt-score-meter {
	background: #1c202c !important;
}

/* 7. Segmented Tabs Navigation */
html[data-theme="dark"] .wt-tabs,
html.dark .wt-tabs {
	background: #12151C !important;
	border: 1px solid rgba(255, 255, 255, 0.08) !important;
}

html[data-theme="dark"] .wt-tab,
html.dark .wt-tab {
	color: #94a3b8 !important;
}

html[data-theme="dark"] .wt-tab:hover,
html.dark .wt-tab:hover {
	color: #ffffff !important;
	background: rgba(255, 255, 255, 0.04) !important;
}

html[data-theme="dark"] .wt-tab.is-active,
html.dark .wt-tab.is-active {
	background: #1c202c !important;
	color: #FF7B72 !important;
	box-shadow: 0 2px 8px rgba(0, 0, 0, 0.4) !important;
}

/* 8. 4-Box Metrics Grid */
html[data-theme="dark"] .wt-metric-box,
html.dark .wt-metric-box {
	background: #12151C !important;
	border: 1px solid rgba(255, 255, 255, 0.08) !important;
}

html[data-theme="dark"] .wt-metric-lbl,
html.dark .wt-metric-lbl {
	color: #94a3b8 !important;
}

html[data-theme="dark"] .wt-metric-num,
html.dark .wt-metric-num {
	color: #ffffff !important;
}

html[data-theme="dark"] .wt-metric-sub,
html.dark .wt-metric-sub {
	color: #64748b !important;
}

/* 9. Waterfall & Resource Distribution */
html[data-theme="dark"] .wt-waterfall-card,
html.dark .wt-waterfall-card {
	background: #12151C !important;
	border: 1px solid rgba(255, 255, 255, 0.08) !important;
}

html[data-theme="dark"] .wt-waterfall-title,
html.dark .wt-waterfall-title {
	color: #ffffff !important;
}

html[data-theme="dark"] .wt-waterfall-bar,
html.dark .wt-waterfall-bar {
	background: #1c202c !important;
}

html[data-theme="dark"] .wt-legend,
html.dark .wt-legend {
	color: #94a3b8 !important;
}

/* 10. SERP Snippet Preview Box */
html[data-theme="dark"] .wt-serp-card,
html.dark .wt-serp-card {
	background: #12151C !important;
	border: 1px solid rgba(255, 255, 255, 0.08) !important;
}

html[data-theme="dark"] .wt-serp-url,
html.dark .wt-serp-url {
	color: #94a3b8 !important;
}

html[data-theme="dark"] .wt-serp-title,
html.dark .wt-serp-title {
	color: #60a5fa !important;
}

html[data-theme="dark"] .wt-serp-desc,
html.dark .wt-serp-desc {
	color: #cbd5e1 !important;
}

/* 11. Audit Checklist & Diagnostics Items */
html[data-theme="dark"] .wt-audit-item,
html.dark .wt-audit-item {
	background: #12151C !important;
	border: 1px solid rgba(255, 255, 255, 0.08) !important;
	border-left: 4px solid #475569 !important;
}

html[data-theme="dark"] .wt-audit-item.is-good,
html.dark .wt-audit-item.is-good {
	border-left-color: #10b981 !important;
	background: #12151C !important;
}

html[data-theme="dark"] .wt-audit-item.is-warning,
html.dark .wt-audit-item.is-warning {
	border-left-color: #f59e0b !important;
	background: #12151C !important;
}

html[data-theme="dark"] .wt-audit-item.is-danger,
html.dark .wt-audit-item.is-danger {
	border-left-color: #ef4444 !important;
	background: #12151C !important;
}

html[data-theme="dark"] .wt-audit-item.is-info,
html.dark .wt-audit-item.is-info {
	border-left-color: #3b82f6 !important;
	background: #12151C !important;
}

html[data-theme="dark"] .wt-audit-head strong,
html[data-theme="dark"] .wt-audit-body strong,
html[data-theme="dark"] .wt-audit-item strong,
html.dark .wt-audit-head strong,
html.dark .wt-audit-body strong,
html.dark .wt-audit-item strong {
	color: #ffffff !important;
}

html[data-theme="dark"] .wt-audit-body p,
html[data-theme="dark"] .wt-audit-item p,
html.dark .wt-audit-body p,
html.dark .wt-audit-item p {
	color: #cbd5e1 !important;
}

html[data-theme="dark"] .wt-audit-val,
html.dark .wt-audit-val {
	color: #cbd5e1 !important;
}

html[data-theme="dark"] .wt-audit-rec,
html.dark .wt-audit-rec {
	color: #94a3b8 !important;
}

html[data-theme="dark"] .wt-audit-badge.is-good,
html.dark .wt-audit-badge.is-good {
	background: rgba(16, 185, 129, 0.2) !important;
	color: #34d399 !important;
	border: 1px solid rgba(16, 185, 129, 0.3) !important;
}

html[data-theme="dark"] .wt-audit-badge.is-warning,
html.dark .wt-audit-badge.is-warning {
	background: rgba(245, 158, 11, 0.2) !important;
	color: #fbbf24 !important;
	border: 1px solid rgba(245, 158, 11, 0.3) !important;
}

html[data-theme="dark"] .wt-audit-badge.is-danger,
html.dark .wt-audit-badge.is-danger {
	background: rgba(239, 68, 68, 0.2) !important;
	color: #f87171 !important;
	border: 1px solid rgba(239, 68, 68, 0.3) !important;
}

html[data-theme="dark"] .wt-audit-badge.is-info,
html.dark .wt-audit-badge.is-info {
	background: rgba(59, 130, 246, 0.2) !important;
	color: #93c5fd !important;
	border: 1px solid rgba(59, 130, 246, 0.3) !important;
}

/* Headings and body texts inside .wt-app */
html[data-theme="dark"] .wt-app h1,
html[data-theme="dark"] .wt-app h2,
html[data-theme="dark"] .wt-app h3,
html[data-theme="dark"] .wt-app h4,
html[data-theme="dark"] .wt-app h5,
html[data-theme="dark"] .wt-app h6,
html.dark .wt-app h1,
html.dark .wt-app h2,
html.dark .wt-app h3,
html.dark .wt-app h4,
html.dark .wt-app h5,
html.dark .wt-app h6 {
	color: #ffffff !important;
}

/* 12. Stress & Concurrency Controls */
html[data-theme="dark"] .wt-stress-box,
html.dark .wt-stress-box {
	background: #12151C !important;
	border: 1px solid rgba(255, 255, 255, 0.08) !important;
}

html[data-theme="dark"] .wt-stress-toolbar,
html.dark .wt-stress-toolbar {
	background: #161922 !important;
	border: 1px solid rgba(255, 255, 255, 0.08) !important;
}

html[data-theme="dark"] .wt-stress-param label,
html.dark .wt-stress-param label {
	color: #cbd5e1 !important;
}

html[data-theme="dark"] .wt-stress-select,
html.dark .wt-stress-select {
	background-color: #12151C !important;
	border: 1.5px solid rgba(255, 255, 255, 0.12) !important;
	color: #ffffff !important;
}

html[data-theme="dark"] .wt-stress-select option,
html.dark .wt-stress-select option {
	background: #161922 !important;
	color: #ffffff !important;
}

html[data-theme="dark"] .wt-btn-stress-stop,
html.dark .wt-btn-stress-stop {
	background: #1c202c !important;
	border: 1.5px solid rgba(239, 68, 68, 0.35) !important;
	color: #f87171 !important;
}

html[data-theme="dark"] .wt-btn-stress-stop:hover:not(:disabled),
html.dark .wt-btn-stress-stop:hover:not(:disabled) {
	background: rgba(239, 68, 68, 0.2) !important;
}

html[data-theme="dark"] .wt-notice-box,
html.dark .wt-notice-box {
	background: rgba(16, 185, 129, 0.12) !important;
	border: 1px solid rgba(16, 185, 129, 0.3) !important;
	color: #34d399 !important;
}

html[data-theme="dark"] .wt-notice-box.is-blue,
html.dark .wt-notice-box.is-blue {
	background: rgba(59, 130, 246, 0.12) !important;
	border-color: rgba(59, 130, 246, 0.3) !important;
	color: #93c5fd !important;
}

/* Headings inside panels */
html[data-theme="dark"] .wt-panel h3,
html.dark .wt-panel h3 {
	color: #ffffff !important;
}

/* GEO card wrapper */
html[data-theme="dark"] .wt-panel > div[style*="background:#f8fafc"],
html[data-theme="dark"] .wt-panel > div[style*="background: #f8fafc"],
html.dark .wt-panel > div[style*="background:#f8fafc"],
html.dark .wt-panel > div[style*="background: #f8fafc"] {
	background: #12151C !important;
	border-color: rgba(255, 255, 255, 0.08) !important;
}

/* --------------------------------------------------------------------------
   18. IMAGE EDITOR / CANVA STUDIO (.ie-studio, #ie-app) - DARK THEME
   -------------------------------------------------------------------------- */
html[data-theme="dark"] .ie-studio,
html[data-theme="dark"] #ie-app,
html.dark .ie-studio,
html.dark #ie-app {
	background: #161922 !important;
	border: 1px solid rgba(255, 255, 255, 0.08) !important;
	box-shadow: 0 10px 36px rgba(0, 0, 0, 0.5) !important;
	color: #CBD5E1 !important;
}

/* Fullscreen Studio Mode in Dark Mode */
html[data-theme="dark"] .ie-studio:fullscreen,
html[data-theme="dark"] .ie-studio:-webkit-full-screen,
html.dark .ie-studio:fullscreen,
html.dark .ie-studio:-webkit-full-screen {
	background: #0d0f14 !important;
	color-scheme: dark !important;
}
html[data-theme="dark"] .ie-studio:fullscreen .ie-workspace,
html[data-theme="dark"] .ie-studio:-webkit-full-screen .ie-workspace,
html.dark .ie-studio:fullscreen .ie-workspace,
html.dark .ie-studio:-webkit-full-screen .ie-workspace {
	background: #0d0f14 !important;
}
html[data-theme="dark"] .ie-studio:fullscreen .ie-topbar,
html[data-theme="dark"] .ie-studio:-webkit-full-screen .ie-topbar,
html.dark .ie-studio:fullscreen .ie-topbar,
html.dark .ie-studio:-webkit-full-screen .ie-topbar {
	background: #161922 !important;
	border-bottom-color: rgba(255, 255, 255, 0.08) !important;
	color: #FFFFFF !important;
}
html[data-theme="dark"] .ie-studio:fullscreen .ie-sidebar,
html[data-theme="dark"] .ie-studio:-webkit-full-screen .ie-sidebar,
html.dark .ie-studio:fullscreen .ie-sidebar,
html.dark .ie-studio:-webkit-full-screen .ie-sidebar {
	background: #12151C !important;
	border-right-color: rgba(255, 255, 255, 0.08) !important;
	color: #CBD5E1 !important;
}
html[data-theme="dark"] .ie-studio:fullscreen .ie-stage,
html[data-theme="dark"] .ie-studio:-webkit-full-screen .ie-stage,
html.dark .ie-studio:fullscreen .ie-stage,
html.dark .ie-studio:-webkit-full-screen .ie-stage {
	background: #0d0f14 !important;
}

/* Intro Dropzone */
html[data-theme="dark"] .ie-dropzone,
html.dark .ie-dropzone {
	background: rgba(197, 69, 62, 0.06) !important;
	border: 2px dashed rgba(197, 69, 62, 0.45) !important;
	border-radius: 16px !important;
}
html[data-theme="dark"] .ie-dropzone:hover,
html.dark .ie-dropzone:hover {
	background: rgba(197, 69, 62, 0.12) !important;
	border-color: #C5453E !important;
}
html[data-theme="dark"] .ie-dropzone h3,
html.dark .ie-dropzone h3 {
	color: #FFFFFF !important;
}
html[data-theme="dark"] .ie-or,
html.dark .ie-or {
	color: #94A3B8 !important;
}
html[data-theme="dark"] .ie-btn-primary,
html.dark .ie-btn-primary {
	background: linear-gradient(135deg, #C5453E, #db3a32) !important;
	color: #FFFFFF !important;
	box-shadow: 0 4px 14px rgba(197, 69, 62, 0.35) !important;
}
html[data-theme="dark"] .ie-btn-primary:hover,
html.dark .ie-btn-primary:hover {
	background: #b03833 !important;
	box-shadow: 0 6px 20px rgba(197, 69, 62, 0.45) !important;
}
html[data-theme="dark"] .ie-hint,
html.dark .ie-hint {
	color: #94A3B8 !important;
}

/* Features List */
html[data-theme="dark"] .ie-features-list li,
html.dark .ie-features-list li {
	color: #CBD5E1 !important;
}

/* Recent Projects Section */
html[data-theme="dark"] .ie-recent-projects,
html.dark .ie-recent-projects {
	border-top: 1px solid rgba(255, 255, 255, 0.08) !important;
}
html[data-theme="dark"] .ie-recent-title,
html.dark .ie-recent-title {
	color: #FFFFFF !important;
}
html[data-theme="dark"] .ie-recent-card,
html.dark .ie-recent-card {
	background: #12151C !important;
	border: 1px solid rgba(255, 255, 255, 0.08) !important;
	box-shadow: 0 2px 8px rgba(0, 0, 0, 0.25) !important;
}
html[data-theme="dark"] .ie-recent-card:hover,
html.dark .ie-recent-card:hover {
	background: #1c202c !important;
	border-color: rgba(197, 69, 62, 0.5) !important;
	box-shadow: 0 6px 18px rgba(197, 69, 62, 0.2) !important;
}
html[data-theme="dark"] .ie-recent-thumb,
html.dark .ie-recent-thumb {
	background: #1c202c !important;
	border: 1px solid rgba(255, 255, 255, 0.08) !important;
}
html[data-theme="dark"] .ie-recent-name,
html.dark .ie-recent-name {
	color: #FFFFFF !important;
}
html[data-theme="dark"] .ie-recent-date,
html.dark .ie-recent-date {
	color: #94A3B8 !important;
}
html[data-theme="dark"] .ie-btn-open-proj,
html.dark .ie-btn-open-proj {
	background: rgba(197, 69, 62, 0.15) !important;
	border: 1px solid rgba(197, 69, 62, 0.35) !important;
	color: #f87171 !important;
}
html[data-theme="dark"] .ie-btn-open-proj:hover,
html.dark .ie-btn-open-proj:hover {
	background: #C5453E !important;
	color: #ffffff !important;
	border-color: #C5453E !important;
}
html[data-theme="dark"] .ie-btn-del-proj,
html.dark .ie-btn-del-proj {
	color: #94A3B8 !important;
}
html[data-theme="dark"] .ie-btn-del-proj:hover,
html.dark .ie-btn-del-proj:hover {
	color: #ef4444 !important;
}

/* Workspace Studio Layout */
html[data-theme="dark"] .ie-workspace,
html.dark .ie-workspace {
	background: #161922 !important;
}
html[data-theme="dark"] .ie-topbar,
html.dark .ie-topbar {
	background: #161922 !important;
	border-bottom: 1px solid rgba(255, 255, 255, 0.08) !important;
}
html[data-theme="dark"] .ie-status,
html.dark .ie-status {
	color: #CBD5E1 !important;
}
html[data-theme="dark"] .ie-tb-btn,
html.dark .ie-tb-btn {
	background: #12151C !important;
	border: 1px solid rgba(255, 255, 255, 0.1) !important;
	color: #CBD5E1 !important;
}
html[data-theme="dark"] .ie-tb-btn:hover,
html.dark .ie-tb-btn:hover {
	background: #1c202c !important;
	border-color: rgba(255, 255, 255, 0.18) !important;
	color: #FFFFFF !important;
}
html[data-theme="dark"] .ie-btn-danger:hover,
html.dark .ie-btn-danger:hover {
	background: rgba(239, 68, 68, 0.15) !important;
	border-color: #ef4444 !important;
	color: #f87171 !important;
}
html[data-theme="dark"] .ie-divider,
html.dark .ie-divider {
	background: rgba(255, 255, 255, 0.1) !important;
}
html[data-theme="dark"] .ie-select-sm,
html.dark .ie-select-sm {
	background: #12151C !important;
	border: 1px solid rgba(255, 255, 255, 0.12) !important;
	color: #FFFFFF !important;
}
html[data-theme="dark"] .ie-select-sm option,
html.dark .ie-select-sm option {
	background: #161922 !important;
	color: #FFFFFF !important;
}
html[data-theme="dark"] .ie-btn-export,
html.dark .ie-btn-export {
	background: linear-gradient(135deg, #C5453E, #db3a32) !important;
	color: #FFFFFF !important;
	box-shadow: 0 3px 12px rgba(197, 69, 62, 0.35) !important;
}
html[data-theme="dark"] .ie-btn-export:hover,
html.dark .ie-btn-export:hover {
	background: #b03833 !important;
}
html[data-theme="dark"] .ie-close-btn,
html.dark .ie-close-btn {
	color: #94A3B8 !important;
}
html[data-theme="dark"] .ie-close-btn:hover,
html.dark .ie-close-btn:hover {
	background: #1c202c !important;
	color: #FFFFFF !important;
}

/* Sidebar & Nav */
html[data-theme="dark"] .ie-sidebar,
html.dark .ie-sidebar {
	background: #12151C !important;
	border-right: 1px solid rgba(255, 255, 255, 0.08) !important;
	border-top-color: rgba(255, 255, 255, 0.08) !important;
}
html[data-theme="dark"] .ie-sidebar-nav,
html.dark .ie-sidebar-nav {
	background: #0f1217 !important;
	border-right: 1px solid rgba(255, 255, 255, 0.08) !important;
	border-bottom-color: rgba(255, 255, 255, 0.08) !important;
}
html[data-theme="dark"] .ie-nav-tab,
html.dark .ie-nav-tab {
	color: #94A3B8 !important;
}
html[data-theme="dark"] .ie-nav-tab:hover,
html.dark .ie-nav-tab:hover {
	background: #161922 !important;
	color: #FFFFFF !important;
}
html[data-theme="dark"] .ie-nav-tab.active,
html.dark .ie-nav-tab.active {
	background: #1c202c !important;
	color: #f87171 !important;
	box-shadow: 0 2px 8px rgba(0, 0, 0, 0.3) !important;
}
html[data-theme="dark"] .ie-sidebar-panels,
html.dark .ie-sidebar-panels {
	background: #12151C !important;
}
html[data-theme="dark"] .ie-panel-title,
html.dark .ie-panel-title {
	color: #FFFFFF !important;
	border-bottom: 1px solid rgba(255, 255, 255, 0.08) !important;
}

/* Tool Blocks & Controls */
html[data-theme="dark"] .ie-tool-block,
html.dark .ie-tool-block {
	background: #161922 !important;
	border: 1px solid rgba(255, 255, 255, 0.08) !important;
	color: #CBD5E1 !important;
}
html[data-theme="dark"] .ie-tool-block:hover,
html.dark .ie-tool-block:hover {
	background: rgba(197, 69, 62, 0.12) !important;
	border-color: rgba(197, 69, 62, 0.5) !important;
	color: #f87171 !important;
}
html[data-theme="dark"] .ie-label,
html.dark .ie-label {
	color: #94A3B8 !important;
}
html[data-theme="dark"] .ie-select-full,
html.dark .ie-select-full {
	background: #161922 !important;
	border: 1px solid rgba(255, 255, 255, 0.12) !important;
	color: #FFFFFF !important;
}
html[data-theme="dark"] .ie-select-full option,
html.dark .ie-select-full option {
	background: #161922 !important;
	color: #FFFFFF !important;
}
html[data-theme="dark"] .ie-btn-action,
html.dark .ie-btn-action {
	background: #161922 !important;
	border: 1px solid rgba(255, 255, 255, 0.1) !important;
	color: #CBD5E1 !important;
}
html[data-theme="dark"] .ie-btn-action:hover,
html.dark .ie-btn-action:hover {
	background: #1c202c !important;
	color: #FFFFFF !important;
	border-color: rgba(255, 255, 255, 0.18) !important;
}
html[data-theme="dark"] .ie-btn-magic,
html.dark .ie-btn-magic {
	background: rgba(197, 69, 62, 0.15) !important;
	border-color: rgba(197, 69, 62, 0.35) !important;
	color: #f87171 !important;
}
html[data-theme="dark"] .ie-btn-magic:hover,
html.dark .ie-btn-magic:hover {
	background: #C5453E !important;
	color: #FFFFFF !important;
}
html[data-theme="dark"] .ie-btn-sm,
html.dark .ie-btn-sm {
	background: #161922 !important;
	border: 1px solid rgba(255, 255, 255, 0.1) !important;
	color: #CBD5E1 !important;
}
html[data-theme="dark"] .ie-btn-sm:hover,
html.dark .ie-btn-sm:hover {
	background: #1c202c !important;
	color: #FFFFFF !important;
}
html[data-theme="dark"] .ie-input-num,
html.dark .ie-input-num {
	background: #161922 !important;
	border: 1px solid rgba(255, 255, 255, 0.12) !important;
	color: #FFFFFF !important;
}
html[data-theme="dark"] .ie-studio input[type="range"],
html.dark .ie-studio input[type="range"] {
	accent-color: #C5453E !important;
}
html[data-theme="dark"] .ie-color input[type=color],
html[data-theme="dark"] .ie-studio input[type="color"],
html.dark .ie-color input[type=color],
html.dark .ie-studio input[type="color"] {
	background: #12151C !important;
	border: 1px solid rgba(255, 255, 255, 0.12) !important;
	border-radius: 6px !important;
}
html[data-theme="dark"] .ie-studio input[type="text"],
html[data-theme="dark"] .ie-studio input[type="number"],
html.dark .ie-studio input[type="text"],
html.dark .ie-studio input[type="number"] {
	background: #12151C !important;
	border: 1px solid rgba(255, 255, 255, 0.12) !important;
	color: #FFFFFF !important;
}

/* Canvas Stage & Bottom Bar */
html[data-theme="dark"] .ie-stage,
html.dark .ie-stage {
	background: #0d0f14 !important;
}
html[data-theme="dark"] .ie-transparent canvas,
html.dark .ie-transparent canvas {
	background-image: linear-gradient(45deg, #1e222d 25%, transparent 25%),
	                  linear-gradient(-45deg, #1e222d 25%, transparent 25%),
	                  linear-gradient(45deg, transparent 75%, #1e222d 75%),
	                  linear-gradient(-45deg, transparent 75%, #1e222d 75%) !important;
}
html[data-theme="dark"] .ie-stage-bar,
html.dark .ie-stage-bar {
	background: #161922 !important;
	border-top: 1px solid rgba(255, 255, 255, 0.08) !important;
	color: #94A3B8 !important;
}
html[data-theme="dark"] .ie-zoom-btn,
html.dark .ie-zoom-btn {
	background: #12151C !important;
	border: 1px solid rgba(255, 255, 255, 0.1) !important;
	color: #CBD5E1 !important;
}
html[data-theme="dark"] .ie-zoom-btn:hover,
html.dark .ie-zoom-btn:hover {
	background: #1c202c !important;
	color: #FFFFFF !important;
}
html[data-theme="dark"] .ie-zoom-value,
html.dark .ie-zoom-value {
	color: #FFFFFF !important;
}

/* Floating Crop Bar */
html[data-theme="dark"] .ie-crop-floating-bar,
html.dark .ie-crop-floating-bar {
	background: #161922 !important;
	border: 1px solid #C5453E !important;
	box-shadow: 0 8px 24px rgba(0, 0, 0, 0.6) !important;
}
html[data-theme="dark"] .ie-crop-hint,
html.dark .ie-crop-hint {
	color: #FFFFFF !important;
}
html[data-theme="dark"] .ie-btn-reset,
html.dark .ie-btn-reset {
	background: #1c202c !important;
	border: 1px solid rgba(255, 255, 255, 0.12) !important;
	color: #CBD5E1 !important;
}
html[data-theme="dark"] .ie-btn-reset:hover,
html.dark .ie-btn-reset:hover {
	background: #252b3b !important;
	color: #ffffff !important;
}

/* Context Menu */
html[data-theme="dark"] .ie-ctx-menu,
html.dark .ie-ctx-menu {
	background: #161922 !important;
	border: 1px solid rgba(255, 255, 255, 0.1) !important;
	box-shadow: 0 10px 30px rgba(0, 0, 0, 0.6) !important;
}
html[data-theme="dark"] .ie-ctx-item,
html.dark .ie-ctx-item {
	color: #CBD5E1 !important;
}
html[data-theme="dark"] .ie-ctx-item:hover,
html.dark .ie-ctx-item:hover {
	background: rgba(197, 69, 62, 0.15) !important;
	color: #f87171 !important;
}
html[data-theme="dark"] .ie-ctx-danger:hover,
html.dark .ie-ctx-danger:hover {
	background: rgba(239, 68, 68, 0.15) !important;
	color: #f87171 !important;
}
html[data-theme="dark"] .ie-ctx-divider,
html.dark .ie-ctx-divider {
	background: rgba(255, 255, 255, 0.08) !important;
}

/* Legacy Toolbar / Controls (if used) */
html[data-theme="dark"] .ie-toolbar,
html.dark .ie-toolbar {
	background: rgba(22, 25, 34, 0.95) !important;
	border-color: rgba(255, 255, 255, 0.08) !important;
	box-shadow: 0 6px 24px rgba(0, 0, 0, 0.4) !important;
}
html[data-theme="dark"] .ie-group,
html.dark .ie-group {
	background: #12151C !important;
	border-color: rgba(255, 255, 255, 0.08) !important;
}
html[data-theme="dark"] .ie-btn,
html.dark .ie-btn {
	color: #CBD5E1 !important;
}
html[data-theme="dark"] .ie-btn:hover,
html.dark .ie-btn:hover {
	background: #1c202c !important;
	color: #FFFFFF !important;
}
html[data-theme="dark"] .ie-select,
html.dark .ie-select {
	background: #12151C !important;
	border-color: rgba(255, 255, 255, 0.12) !important;
	color: #FFFFFF !important;
}
html[data-theme="dark"] .ie-num,
html.dark .ie-num {
	background: #12151C !important;
	border-color: rgba(255, 255, 255, 0.12) !important;
	color: #FFFFFF !important;
}
html[data-theme="dark"] .ie-zoom-label,
html.dark .ie-zoom-label {
	color: #94A3B8 !important;
}

/* --------------------------------------------------------------------------
   19. ARTBOARD & GRAPHIC DESIGN STUDIO (.ab-app, .figma-continuous-studio) - DARK THEME
   -------------------------------------------------------------------------- */
html[data-theme="dark"] .ab-app,
html[data-theme="dark"] #ab-app,
html[data-theme="dark"] .figma-continuous-studio,
html.dark .ab-app,
html.dark #ab-app,
html.dark .figma-continuous-studio {
	background: #161922 !important;
	border: 1px solid rgba(255, 255, 255, 0.08) !important;
	box-shadow: 0 10px 36px rgba(0, 0, 0, 0.5) !important;
	color: #CBD5E1 !important;
}

/* Fullscreen Artboard in Dark Mode */
html[data-theme="dark"] #ab-app:fullscreen,
html[data-theme="dark"] #ab-app:-webkit-full-screen,
html[data-theme="dark"] #ab-app.ab-is-pseudo-fullscreen,
html[data-theme="dark"] .ab-app:fullscreen,
html[data-theme="dark"] .ab-app:-webkit-full-screen,
html[data-theme="dark"] .figma-continuous-studio:fullscreen,
html[data-theme="dark"] .figma-continuous-studio:-webkit-full-screen,
html.dark #ab-app:fullscreen,
html.dark #ab-app:-webkit-full-screen,
html.dark #ab-app.ab-is-pseudo-fullscreen,
html.dark .ab-app:fullscreen,
html.dark .ab-app:-webkit-full-screen,
html.dark .figma-continuous-studio:fullscreen,
html.dark .figma-continuous-studio:-webkit-full-screen {
	background: #0d0f14 !important;
	color-scheme: dark !important;
}

/* Chrome Top Bar & Tabs */
html[data-theme="dark"] .figma-chrome-topbar,
html.dark .figma-chrome-topbar {
	background: #161922 !important;
	border-bottom: 1px solid rgba(255, 255, 255, 0.08) !important;
}
html[data-theme="dark"] .figma-brand-badge,
html.dark .figma-brand-badge {
	color: #FFFFFF !important;
}
html[data-theme="dark"] .figma-file-tab,
html.dark .figma-file-tab {
	background: #12151C !important;
	border: 1px solid rgba(255, 255, 255, 0.1) !important;
	color: #CBD5E1 !important;
}
html[data-theme="dark"] .figma-file-tab:hover,
html.dark .figma-file-tab:hover {
	background: #1c202c !important;
	border-color: rgba(255, 255, 255, 0.18) !important;
	color: #FFFFFF !important;
}
html[data-theme="dark"] .figma-file-tab.active,
html.dark .figma-file-tab.active {
	background: #1c202c !important;
	border-color: #C5453E !important;
	color: #f87171 !important;
	box-shadow: 0 2px 8px rgba(0, 0, 0, 0.3) !important;
}
html[data-theme="dark"] .figma-tab-rename-input,
html.dark .figma-tab-rename-input {
	background: #12151C !important;
	color: #FFFFFF !important;
	border-color: #C5453E !important;
}
html[data-theme="dark"] .figma-tab-close,
html.dark .figma-tab-close {
	color: #94A3B8 !important;
}
html[data-theme="dark"] .figma-tab-close:hover,
html.dark .figma-tab-close:hover {
	background: rgba(239, 68, 68, 0.2) !important;
	color: #f87171 !important;
}
html[data-theme="dark"] .figma-add-tab-btn,
html.dark .figma-add-tab-btn {
	background: #12151C !important;
	border: 1px dashed rgba(255, 255, 255, 0.18) !important;
	color: #94A3B8 !important;
}
html[data-theme="dark"] .figma-add-tab-btn:hover,
html.dark .figma-add-tab-btn:hover {
	border-color: #C5453E !important;
	color: #f87171 !important;
	background: rgba(197, 69, 62, 0.12) !important;
}
html[data-theme="dark"] .figma-top-btn,
html.dark .figma-top-btn {
	background: #12151C !important;
	border: 1px solid rgba(255, 255, 255, 0.1) !important;
	color: #CBD5E1 !important;
}
html[data-theme="dark"] .figma-top-btn:hover,
html.dark .figma-top-btn:hover {
	background: #1c202c !important;
	color: #FFFFFF !important;
}
html[data-theme="dark"] .ab-tgroup .ab-btn,
html.dark .ab-tgroup .ab-btn {
	background: #12151C !important;
	border: 1px solid rgba(255, 255, 255, 0.1) !important;
	color: #CBD5E1 !important;
}
html[data-theme="dark"] .ab-tgroup .ab-btn:hover,
html.dark .ab-tgroup .ab-btn:hover {
	background: #1c202c !important;
	color: #FFFFFF !important;
}
html[data-theme="dark"] .ab-btn.secondary,
html.dark .ab-btn.secondary {
	background: #12151C !important;
	border: 1px solid rgba(255, 255, 255, 0.1) !important;
	color: #CBD5E1 !important;
}
html[data-theme="dark"] .ab-btn.secondary:hover,
html.dark .ab-btn.secondary:hover {
	background: #1c202c !important;
	color: #FFFFFF !important;
}

/* Home / Projects Dashboard View */
html[data-theme="dark"] .figma-home-view,
html.dark .figma-home-view {
	background: #161922 !important;
}
html[data-theme="dark"] .figma-home-title-group h2,
html.dark .figma-home-title-group h2 {
	color: #FFFFFF !important;
}
html[data-theme="dark"] .figma-home-sub,
html.dark .figma-home-sub {
	color: #94A3B8 !important;
}
html[data-theme="dark"] .figma-search-wrap,
html.dark .figma-search-wrap {
	background: #12151C !important;
	border: 1px solid rgba(255, 255, 255, 0.12) !important;
}
html[data-theme="dark"] .figma-search-input,
html.dark .figma-search-input {
	background: transparent !important;
	border: none !important;
	color: #FFFFFF !important;
	box-shadow: none !important;
}
html[data-theme="dark"] .figma-search-ico,
html.dark .figma-search-ico {
	color: #94A3B8 !important;
}
html[data-theme="dark"] .figma-btn-primary,
html.dark .figma-btn-primary {
	background: linear-gradient(135deg, #C5453E, #db3a32) !important;
	color: #FFFFFF !important;
	box-shadow: 0 4px 14px rgba(197, 69, 62, 0.35) !important;
}
html[data-theme="dark"] .figma-btn-primary:hover,
html.dark .figma-btn-primary:hover {
	background: #b03833 !important;
	box-shadow: 0 6px 20px rgba(197, 69, 62, 0.45) !important;
}
html[data-theme="dark"] .figma-btn-secondary,
html.dark .figma-btn-secondary {
	background: #12151C !important;
	border: 1px solid rgba(255, 255, 255, 0.1) !important;
	color: #CBD5E1 !important;
}
html[data-theme="dark"] .figma-btn-secondary:hover,
html.dark .figma-btn-secondary:hover {
	background: #1c202c !important;
	border-color: rgba(197, 69, 62, 0.4) !important;
	color: #FFFFFF !important;
}
html[data-theme="dark"] .figma-preset-label,
html.dark .figma-preset-label {
	color: #94A3B8 !important;
}
html[data-theme="dark"] .figma-preset-chip,
html.dark .figma-preset-chip {
	background: #12151C !important;
	border: 1px solid rgba(255, 255, 255, 0.08) !important;
	color: #CBD5E1 !important;
}
html[data-theme="dark"] .figma-preset-chip:hover,
html.dark .figma-preset-chip:hover {
	background: rgba(197, 69, 62, 0.12) !important;
	border-color: rgba(197, 69, 62, 0.4) !important;
	color: #f87171 !important;
}

/* Project Cards */
html[data-theme="dark"] .ab-project-card,
html.dark .ab-project-card {
	background: #12151C !important;
	border: 1px solid rgba(255, 255, 255, 0.08) !important;
	box-shadow: 0 2px 8px rgba(0, 0, 0, 0.25) !important;
}
html[data-theme="dark"] .ab-project-card:hover,
html.dark .ab-project-card:hover {
	background: #1c202c !important;
	border-color: #0d99ff !important;
	box-shadow: 0 10px 25px rgba(13, 153, 255, 0.15) !important;
}
html[data-theme="dark"] .ab-card-thumbnail,
html.dark .ab-card-thumbnail {
	background-color: #0e1117 !important;
	background-image: 
		linear-gradient(45deg, #161922 25%, transparent 25%, transparent 75%, #161922 75%),
		linear-gradient(45deg, #161922 25%, transparent 25%, transparent 75%, #161922 75%) !important;
	border-bottom: 1px solid rgba(255, 255, 255, 0.08) !important;
}
html[data-theme="dark"] .ab-card-placeholder-art,
html.dark .ab-card-placeholder-art {
	background: #0e1117 !important;
}
html[data-theme="dark"] .ab-card-footer,
html.dark .ab-card-footer {
	background: #12151C !important;
	border-top-color: rgba(255, 255, 255, 0.06) !important;
}
html[data-theme="dark"] .ab-card-title,
html.dark .ab-card-title {
	color: #FFFFFF !important;
}
html[data-theme="dark"] .ab-card-sub,
html.dark .ab-card-sub {
	color: #94A3B8 !important;
}
html[data-theme="dark"] .ab-card-delete-btn,
html.dark .ab-card-delete-btn {
	color: #94A3B8 !important;
}
html[data-theme="dark"] .ab-card-delete-btn:hover,
html.dark .ab-card-delete-btn:hover {
	background: rgba(239, 68, 68, 0.2) !important;
	color: #f87171 !important;
}

/* Studio Editor View */
html[data-theme="dark"] .ab-editor,
html.dark .ab-editor {
	background: #161922 !important;
}
html[data-theme="dark"] .ab-main,
html.dark .ab-main {
	background: #161922 !important;
}
html[data-theme="dark"] #ab-layers,
html[data-theme="dark"] .ab-layers,
html[data-theme="dark"] #ab-props,
html[data-theme="dark"] .ab-props,
html[data-theme="dark"] #ab-props-body,
html[data-theme="dark"] .ab-props-body,
html[data-theme="dark"] .ab-layers-section,
html[data-theme="dark"] .ab-pages-section,
html.dark #ab-layers,
html.dark .ab-layers,
html.dark #ab-props,
html.dark .ab-props,
html.dark #ab-props-body,
html.dark .ab-props-body,
html.dark .ab-layers-section,
html.dark .ab-pages-section {
	background: #12151C !important;
	border-color: rgba(255, 255, 255, 0.08) !important;
}
html[data-theme="dark"] .ab-panel-head,
html.dark .ab-panel-head {
	background: #12151C !important;
	color: #94A3B8 !important;
	border-bottom: 1px solid rgba(255, 255, 255, 0.08) !important;
}
html[data-theme="dark"] .ab-btn-plus,
html.dark .ab-btn-plus {
	background: #161922 !important;
	border: 1px solid rgba(255, 255, 255, 0.1) !important;
	color: #CBD5E1 !important;
}
html[data-theme="dark"] .ab-btn-plus:hover,
html.dark .ab-btn-plus:hover {
	background: #1c202c !important;
	color: #FFFFFF !important;
}

/* Pages & Layers Lists */
html[data-theme="dark"] .ab-page-row,
html.dark .ab-page-row {
	color: #CBD5E1 !important;
}
html[data-theme="dark"] .ab-page-row:hover,
html.dark .ab-page-row:hover {
	background: #1c202c !important;
	color: #FFFFFF !important;
}
html[data-theme="dark"] .ab-page-row.active,
html.dark .ab-page-row.active {
	background: rgba(13, 153, 255, 0.15) !important;
	color: #60a5fa !important;
}
html[data-theme="dark"] .ab-page-btn,
html.dark .ab-page-btn {
	color: #94A3B8 !important;
}
html[data-theme="dark"] .ab-page-btn:hover,
html.dark .ab-page-btn:hover {
	color: #FFFFFF !important;
}
html[data-theme="dark"] .ab-layer,
html.dark .ab-layer {
	color: #CBD5E1 !important;
}
html[data-theme="dark"] .ab-layer:hover,
html.dark .ab-layer:hover {
	background: #1c202c !important;
	color: #FFFFFF !important;
}
html[data-theme="dark"] .ab-layer.active,
html[data-theme="dark"] .ab-layer.selected,
html.dark .ab-layer.active,
html.dark .ab-layer.selected {
	background: rgba(13, 153, 255, 0.15) !important;
	border-color: rgba(13, 153, 255, 0.4) !important;
	border-left: 3px solid #0d99ff !important;
}
html[data-theme="dark"] .ab-layer.active .ab-layer-name,
html[data-theme="dark"] .ab-layer.selected .ab-layer-name,
html.dark .ab-layer.active .ab-layer-name,
html.dark .ab-layer.selected .ab-layer-name {
	color: #60a5fa !important;
	font-weight: 600 !important;
}
html[data-theme="dark"] .ab-layer-name,
html.dark .ab-layer-name {
	color: #CBD5E1 !important;
}
html[data-theme="dark"] .ab-layer-ico,
html.dark .ab-layer-ico {
	color: #94A3B8 !important;
}
html[data-theme="dark"] .ab-lbtn,
html.dark .ab-lbtn {
	color: #94A3B8 !important;
}
html[data-theme="dark"] .ab-lbtn:hover,
html.dark .ab-lbtn:hover {
	color: #FFFFFF !important;
	background: #1c202c !important;
}

/* Canvas Stage */
html[data-theme="dark"] #ab-canvas-wrap,
html[data-theme="dark"] .ab-canvas-wrap,
html.dark #ab-canvas-wrap,
html.dark .ab-canvas-wrap {
	background-color: #0b0d12 !important;
	background-image:
		linear-gradient(45deg, #131720 25%, transparent 25%, transparent 75%, #131720 75%),
		linear-gradient(45deg, #131720 25%, transparent 25%, transparent 75%, #131720 75%) !important;
}

/* Floating Bottom Dock Island */
html[data-theme="dark"] .ab-bottom-dock,
html.dark .ab-bottom-dock {
	background: #161922 !important;
	border: 1px solid rgba(255, 255, 255, 0.12) !important;
	box-shadow: 0 10px 30px rgba(0, 0, 0, 0.6) !important;
}
html[data-theme="dark"] .ab-dock-btn,
html.dark .ab-dock-btn {
	color: #CBD5E1 !important;
}
html[data-theme="dark"] .ab-dock-btn:hover,
html.dark .ab-dock-btn:hover {
	background: #1c202c !important;
	color: #0d99ff !important;
}
html[data-theme="dark"] .ab-dock-btn.active,
html.dark .ab-dock-btn.active {
	background: #0d99ff !important;
	color: #FFFFFF !important;
	box-shadow: 0 2px 8px rgba(13, 153, 255, 0.4) !important;
}
html[data-theme="dark"] .ab-dock-caret-btn,
html.dark .ab-dock-caret-btn {
	color: #94A3B8 !important;
}
html[data-theme="dark"] .ab-dock-caret-btn:hover,
html.dark .ab-dock-caret-btn:hover {
	color: #0d99ff !important;
	background: #1c202c !important;
}
html[data-theme="dark"] .ab-dock-divider,
html.dark .ab-dock-divider {
	background: rgba(255, 255, 255, 0.1) !important;
}

/* Dock Popovers */
html[data-theme="dark"] .ab-pop-upwards,
html.dark .ab-pop-upwards {
	background: #161922 !important;
	border: 1px solid rgba(255, 255, 255, 0.12) !important;
	box-shadow: 0 12px 36px rgba(0, 0, 0, 0.7) !important;
	color: #CBD5E1 !important;
}
html[data-theme="dark"] .ab-pop-section-title,
html.dark .ab-pop-section-title {
	color: #94A3B8 !important;
}
html[data-theme="dark"] .ab-pop-upwards .ab-shape-opt,
html[data-theme="dark"] .ab-pop-upwards .ab-pen-opt,
html[data-theme="dark"] .ab-pop-upwards .ab-frame-preset-item,
html.dark .ab-pop-upwards .ab-shape-opt,
html.dark .ab-pop-upwards .ab-pen-opt,
html.dark .ab-pop-upwards .ab-frame-preset-item {
	color: #CBD5E1 !important;
}
html[data-theme="dark"] .ab-pop-upwards .ab-shape-opt:hover,
html[data-theme="dark"] .ab-pop-upwards .ab-pen-opt:hover,
html[data-theme="dark"] .ab-pop-upwards .ab-frame-preset-item:hover,
html.dark .ab-pop-upwards .ab-shape-opt:hover,
html.dark .ab-pop-upwards .ab-pen-opt:hover,
html.dark .ab-pop-upwards .ab-frame-preset-item:hover {
	background: #1c202c !important;
	color: #0d99ff !important;
}
html[data-theme="dark"] .ab-pop-upwards .ab-shape-opt.active,
html[data-theme="dark"] .ab-pop-upwards .ab-pen-opt.active,
html.dark .ab-pop-upwards .ab-shape-opt.active,
html.dark .ab-pop-upwards .ab-pen-opt.active {
	background: #0d99ff !important;
	color: #FFFFFF !important;
}
html[data-theme="dark"] .ab-pop-upwards .ab-pop-divider,
html.dark .ab-pop-upwards .ab-pop-divider {
	background: rgba(255, 255, 255, 0.08) !important;
}
html[data-theme="dark"] .ab-pen-thick-btn,
html.dark .ab-pen-thick-btn {
	background: #12151C !important;
	border: 1px solid rgba(255, 255, 255, 0.1) !important;
	color: #CBD5E1 !important;
}
html[data-theme="dark"] .ab-pen-thick-btn:hover,
html.dark .ab-pen-thick-btn:hover {
	background: #1c202c !important;
	color: #FFFFFF !important;
}
html[data-theme="dark"] .ab-pen-thick-btn.active,
html.dark .ab-pen-thick-btn.active {
	background: #0d99ff !important;
	color: #FFFFFF !important;
	border-color: #0d99ff !important;
}
html[data-theme="dark"] .ab-pen-thick-input,
html.dark .ab-pen-thick-input {
	background: #12151C !important;
	border: 1px solid rgba(255, 255, 255, 0.12) !important;
	color: #FFFFFF !important;
}

/* Right Properties Panel */
html[data-theme="dark"] .ab-empty,
html.dark .ab-empty {
	color: #94A3B8 !important;
}
html[data-theme="dark"] .ab-props h3,
html[data-theme="dark"] .ab-panel-head span,
html.dark .ab-props h3,
html.dark .ab-panel-head span {
	color: #FFFFFF !important;
}
html[data-theme="dark"] .ab-pgroup label,
html.dark .ab-pgroup label {
	color: #94A3B8 !important;
}
html[data-theme="dark"] .ab-pgroup input[type="text"],
html[data-theme="dark"] .ab-pgroup input[type="number"],
html[data-theme="dark"] .ab-pgroup select,
html[data-theme="dark"] #prop-canvas-bg-hex,
html.dark .ab-pgroup input[type="text"],
html.dark .ab-pgroup input[type="number"],
html.dark .ab-pgroup select,
html.dark #prop-canvas-bg-hex {
	background: #161922 !important;
	border: 1px solid rgba(255, 255, 255, 0.12) !important;
	color: #FFFFFF !important;
}
html[data-theme="dark"] .ab-pgroup input[type="color"],
html.dark .ab-pgroup input[type="color"] {
	background: #161922 !important;
	border: 1px solid rgba(255, 255, 255, 0.12) !important;
}
html[data-theme="dark"] .ab-p-num-inline,
html.dark .ab-p-num-inline {
	background: #161922 !important;
	border: 1px solid rgba(255, 255, 255, 0.12) !important;
	color: #FFFFFF !important;
}
html[data-theme="dark"] .ab-prow6,
html.dark .ab-prow6 {
	background: #12151C !important;
	border: 1px solid rgba(255, 255, 255, 0.08) !important;
}
html[data-theme="dark"] .ab-prow6 .ie-tl-btn.ab-align,
html.dark .ab-prow6 .ie-tl-btn.ab-align {
	color: #CBD5E1 !important;
}
html[data-theme="dark"] .ab-prow6 .ie-tl-btn.ab-align:hover,
html.dark .ab-prow6 .ie-tl-btn.ab-align:hover {
	background: #1c202c !important;
	color: #0d99ff !important;
}
html[data-theme="dark"] .ab-psec,
html.dark .ab-psec {
	border-top-color: rgba(255, 255, 255, 0.08) !important;
}
html[data-theme="dark"] .ab-psec-title,
html.dark .ab-psec-title {
	color: #CBD5E1 !important;
}
html[data-theme="dark"] .ab-psec-add-btn,
html.dark .ab-psec-add-btn {
	border: 1px solid rgba(255, 255, 255, 0.1) !important;
	color: #CBD5E1 !important;
}
html[data-theme="dark"] .ab-psec-add-btn:hover,
html.dark .ab-psec-add-btn:hover {
	background: #1c202c !important;
	color: #FFFFFF !important;
}
html[data-theme="dark"] .ab-export-section,
html.dark .ab-export-section {
	border-top-color: rgba(255, 255, 255, 0.08) !important;
}
html[data-theme="dark"] .ab-export-title,
html.dark .ab-export-title {
	color: #94A3B8 !important;
}
html[data-theme="dark"] .ab-export-row,
html.dark .ab-export-row {
	background: #12151C !important;
	border: 1px solid rgba(255, 255, 255, 0.08) !important;
}
html[data-theme="dark"] .ab-export-scale,
html[data-theme="dark"] .ab-export-fmt,
html[data-theme="dark"] .ab-export-suffix,
html.dark .ab-export-scale,
html.dark .ab-export-fmt,
html.dark .ab-export-suffix {
	background: #161922 !important;
	border: 1px solid rgba(255, 255, 255, 0.12) !important;
	color: #FFFFFF !important;
}
html[data-theme="dark"] .ab-export-btn,
html.dark .ab-export-btn {
	background: #0d99ff !important;
	color: #FFFFFF !important;
	box-shadow: 0 2px 8px rgba(13, 153, 255, 0.35) !important;
}
html[data-theme="dark"] .ab-export-btn:hover,
html.dark .ab-export-btn:hover {
	background: #0b87e3 !important;
}

/* Mobile Subbar */
html[data-theme="dark"] .ab-mobile-subbar,
html.dark .ab-mobile-subbar {
	background: #161922 !important;
	border-bottom: 1px solid rgba(255, 255, 255, 0.08) !important;
}
html[data-theme="dark"] .ab-mobile-subbar-btn,
html[data-theme="dark"] .ab-mobile-subbar-icon-btn,
html.dark .ab-mobile-subbar-btn,
html.dark .ab-mobile-subbar-icon-btn {
	background: #12151C !important;
	border: 1px solid rgba(255, 255, 255, 0.1) !important;
	color: #CBD5E1 !important;
}
html[data-theme="dark"] .ab-mobile-subbar-btn:hover,
html[data-theme="dark"] .ab-mobile-subbar-icon-btn:hover,
html.dark .ab-mobile-subbar-btn:hover,
html.dark .ab-mobile-subbar-icon-btn:hover {
	background: #1c202c !important;
	color: #FFFFFF !important;
}
html[data-theme="dark"] .ab-mobile-subbar-btn.active,
html.dark .ab-mobile-subbar-btn.active {
	background: #C5453E !important;
	border-color: #C5453E !important;
	color: #FFFFFF !important;
}

/* Floating Image Studio Popover & Crop Bar */
html[data-theme="dark"] .ab-figma-img-popover,
html.dark .ab-figma-img-popover {
	background: #161922 !important;
	border: 1px solid rgba(255, 255, 255, 0.12) !important;
	color: #CBD5E1 !important;
	box-shadow: 0 16px 40px rgba(0, 0, 0, 0.7) !important;
}
html[data-theme="dark"] .ab-fip-header,
html[data-theme="dark"] .ab-fip-modes-bar,
html[data-theme="dark"] .ab-fip-row,
html[data-theme="dark"] .ab-fip-adjustments,
html.dark .ab-fip-header,
html.dark .ab-fip-modes-bar,
html.dark .ab-fip-row,
html.dark .ab-fip-adjustments {
	background: #161922 !important;
	border-color: rgba(255, 255, 255, 0.08) !important;
}
html[data-theme="dark"] .ab-fip-tab,
html.dark .ab-fip-tab {
	color: #94A3B8 !important;
}
html[data-theme="dark"] .ab-fip-tab.active,
html.dark .ab-fip-tab.active {
	color: #FFFFFF !important;
}
html[data-theme="dark"] .ab-fip-mode-icons,
html.dark .ab-fip-mode-icons {
	background: #12151C !important;
	border: 1px solid rgba(255, 255, 255, 0.08) !important;
}
html[data-theme="dark"] .ab-fip-mode-btn,
html.dark .ab-fip-mode-btn {
	color: #94A3B8 !important;
}
html[data-theme="dark"] .ab-fip-mode-btn:hover,
html.dark .ab-fip-mode-btn:hover {
	background: #1c202c !important;
	color: #FFFFFF !important;
}
html[data-theme="dark"] .ab-fip-mode-btn.active,
html.dark .ab-fip-mode-btn.active {
	background: #1c202c !important;
	color: #0d99ff !important;
}
html[data-theme="dark"] .ab-fip-select,
html[data-theme="dark"] .ab-fip-icon-btn,
html.dark .ab-fip-select,
html.dark .ab-fip-icon-btn {
	background: #12151C !important;
	border: 1px solid rgba(255, 255, 255, 0.1) !important;
	color: #FFFFFF !important;
}
html[data-theme="dark"] .ab-fip-adj-name,
html.dark .ab-fip-adj-name {
	color: #94A3B8 !important;
}
html[data-theme="dark"] .ab-fip-slider,
html.dark .ab-fip-slider {
	background: #1c202c !important;
}
html[data-theme="dark"] .ab-fcb-pill,
html.dark .ab-fcb-pill {
	background: #161922 !important;
	border: 1px solid rgba(255, 255, 255, 0.12) !important;
	color: #FFFFFF !important;
	box-shadow: 0 8px 24px rgba(0, 0, 0, 0.6) !important;
}
html[data-theme="dark"] .ab-fcb-select,
html.dark .ab-fcb-select {
	color: #FFFFFF !important;
}
html[data-theme="dark"] .ab-fcb-select option,
html.dark .ab-fcb-select option {
	background: #161922 !important;
	color: #FFFFFF !important;
}
html[data-theme="dark"] .ab-fcb-divider,
html.dark .ab-fcb-divider {
	background: rgba(255, 255, 255, 0.1) !important;
}
html[data-theme="dark"] .ab-fcb-btn,
html.dark .ab-fcb-btn {
	background: #1c202c !important;
	color: #CBD5E1 !important;
}
html[data-theme="dark"] .ab-fcb-btn:hover,
html.dark .ab-fcb-btn:hover {
	background: #252b3b !important;
	color: #FFFFFF !important;
}

/* Context Menu */
html[data-theme="dark"] .ab-ctx-menu,
html.dark .ab-ctx-menu {
	background: #161922 !important;
	border: 1px solid rgba(255, 255, 255, 0.12) !important;
	box-shadow: 0 10px 30px rgba(0, 0, 0, 0.7) !important;
}
html[data-theme="dark"] .ab-ctx-item,
html.dark .ab-ctx-item {
	color: #CBD5E1 !important;
}
html[data-theme="dark"] .ab-ctx-item:hover,
html.dark .ab-ctx-item:hover {
	background: rgba(13, 153, 255, 0.15) !important;
	color: #60a5fa !important;
}
html[data-theme="dark"] .ab-ctx-divider,
html.dark .ab-ctx-divider {
	background: rgba(255, 255, 255, 0.08) !important;
}






/* --------------------------------------------------------------------------
   20. FREE QR CODE GENERATOR & BULK GENERATOR (.ucd-qr-app, #ucd-qr-app) - DARK THEME
   -------------------------------------------------------------------------- */
html[data-theme="dark"] .ic-app.ucd-qr-app,
html[data-theme="dark"] .ucd-qr-app,
html[data-theme="dark"] #ucd-qr-app,
html.dark .ic-app.ucd-qr-app,
html.dark .ucd-qr-app,
html.dark #ucd-qr-app {
	background: #161922 !important;
	border: 1px solid rgba(255, 255, 255, 0.08) !important;
	box-shadow: 0 10px 36px rgba(0, 0, 0, 0.5) !important;
	color: #CBD5E1 !important;
}

/* Top Mode Switcher Bar (Single vs Bulk) */
html[data-theme="dark"] .ucd-qr-mode-bar,
html.dark .ucd-qr-mode-bar {
	background: transparent !important;
}
html[data-theme="dark"] .ucd-qr-mode-pill,
html.dark .ucd-qr-mode-pill {
	background: #12151C !important;
	border: 1.5px solid rgba(255, 255, 255, 0.08) !important;
	color: #94A3B8 !important;
	box-shadow: 0 2px 6px rgba(0, 0, 0, 0.2) !important;
}
html[data-theme="dark"] .ucd-qr-mode-pill:hover,
html.dark .ucd-qr-mode-pill:hover {
	color: #FFFFFF !important;
	border-color: rgba(255, 255, 255, 0.2) !important;
	background: #1c202c !important;
}
html[data-theme="dark"] .ucd-qr-mode-pill.is-active,
html.dark .ucd-qr-mode-pill.is-active {
	background: #C5453E !important;
	border-color: #C5453E !important;
	color: #FFFFFF !important;
	box-shadow: 0 4px 14px rgba(197, 69, 62, 0.35) !important;
}

/* Single Generator Grid & Columns */
html[data-theme="dark"] .ucd-qr-editor-col,
html.dark .ucd-qr-editor-col {
	background: #12151C !important;
	border: 1px solid rgba(255, 255, 255, 0.08) !important;
	color: #CBD5E1 !important;
}
html[data-theme="dark"] .ucd-qr-preview-col,
html.dark .ucd-qr-preview-col {
	background: #12151C !important;
	border: 1px solid rgba(255, 255, 255, 0.08) !important;
	box-shadow: 0 4px 20px rgba(0, 0, 0, 0.3) !important;
}

/* Data Type Selector Tabs */
html[data-theme="dark"] .ucd-qr-types-bar,
html.dark .ucd-qr-types-bar {
	border-bottom: 1px solid rgba(255, 255, 255, 0.08) !important;
}
html[data-theme="dark"] .ucd-qr-type-btn,
html.dark .ucd-qr-type-btn {
	background: #161922 !important;
	border: 1px solid rgba(255, 255, 255, 0.08) !important;
	color: #94A3B8 !important;
}
html[data-theme="dark"] .ucd-qr-type-btn:hover,
html.dark .ucd-qr-type-btn:hover {
	background: #1c202c !important;
	color: #FFFFFF !important;
	border-color: rgba(255, 255, 255, 0.15) !important;
}
html[data-theme="dark"] .ucd-qr-type-btn.is-active,
html.dark .ucd-qr-type-btn.is-active {
	background: rgba(197, 69, 62, 0.15) !important;
	border-color: #C5453E !important;
	color: #f87171 !important;
}

/* Form Groups, Labels, Inputs, Textareas, Selects */
html[data-theme="dark"] .ucd-qr-form-group label,
html.dark .ucd-qr-form-group label {
	color: #CBD5E1 !important;
}
html[data-theme="dark"] .ucd-qr-input,
html[data-theme="dark"] .ucd-qr-select,
html[data-theme="dark"] .ucd-qr-textarea,
html.dark .ucd-qr-input,
html.dark .ucd-qr-select,
html.dark .ucd-qr-textarea {
	background: #161922 !important;
	border: 1.5px solid rgba(255, 255, 255, 0.12) !important;
	color: #FFFFFF !important;
}
html[data-theme="dark"] .ucd-qr-input:focus,
html[data-theme="dark"] .ucd-qr-select:focus,
html[data-theme="dark"] .ucd-qr-textarea:focus,
html.dark .ucd-qr-input:focus,
html.dark .ucd-qr-select:focus,
html.dark .ucd-qr-textarea:focus {
	border-color: #C5453E !important;
	box-shadow: 0 0 0 3px rgba(197, 69, 62, 0.25) !important;
}
html[data-theme="dark"] .ucd-qr-input::placeholder,
html[data-theme="dark"] .ucd-qr-textarea::placeholder,
html.dark .ucd-qr-input::placeholder,
html.dark .ucd-qr-textarea::placeholder {
	color: #64748B !important;
}
html[data-theme="dark"] .ucd-qr-select option,
html.dark .ucd-qr-select option {
	background: #161922 !important;
	color: #FFFFFF !important;
}
html[data-theme="dark"] label[for="ucd-qr-wifi-hidden"],
html[data-theme="dark"] label[for="ucd-qr-transparent-bg"],
html.dark label[for="ucd-qr-wifi-hidden"],
html.dark label[for="ucd-qr-transparent-bg"] {
	color: #94A3B8 !important;
}

/* Customization Section */
html[data-theme="dark"] .ucd-qr-custom-section,
html.dark .ucd-qr-custom-section {
	border-top: 1px solid rgba(255, 255, 255, 0.08) !important;
}
html[data-theme="dark"] .ucd-qr-section-heading,
html.dark .ucd-qr-section-heading {
	color: #FFFFFF !important;
}
html[data-theme="dark"] .ucd-qr-section-heading svg,
html.dark .ucd-qr-section-heading svg {
	color: #C5453E !important;
}

/* Color Pickers */
html[data-theme="dark"] .ucd-qr-color-picker-wrap,
html.dark .ucd-qr-color-picker-wrap {
	background: #161922 !important;
	border: 1.5px solid rgba(255, 255, 255, 0.12) !important;
}
html[data-theme="dark"] .ucd-qr-color-picker-wrap span,
html.dark .ucd-qr-color-picker-wrap span {
	color: #CBD5E1 !important;
}

/* Preset Icons */
html[data-theme="dark"] .ucd-qr-preset-icon,
html.dark .ucd-qr-preset-icon {
	background: #161922 !important;
	border: 1px solid rgba(255, 255, 255, 0.08) !important;
	color: #CBD5E1 !important;
}
html[data-theme="dark"] .ucd-qr-preset-icon:hover,
html.dark .ucd-qr-preset-icon:hover {
	border-color: #C5453E !important;
	background: rgba(197, 69, 62, 0.15) !important;
}
html[data-theme="dark"] .ucd-qr-preset-icon.is-active,
html.dark .ucd-qr-preset-icon.is-active {
	background: rgba(197, 69, 62, 0.2) !important;
	border-color: #C5453E !important;
	box-shadow: 0 0 0 2px rgba(197, 69, 62, 0.3) !important;
}

/* Live Preview Box & Canvas */
html[data-theme="dark"] .ucd-qr-canvas-wrap,
html.dark .ucd-qr-canvas-wrap {
	background: #161922 !important;
	border: 2px dashed rgba(255, 255, 255, 0.15) !important;
	box-shadow: 0 4px 16px rgba(0, 0, 0, 0.4) !important;
}
html[data-theme="dark"] .ucd-qr-status,
html.dark .ucd-qr-status {
	color: #94A3B8 !important;
}

/* Buttons */
html[data-theme="dark"] .ucd-qr-btn-primary,
html.dark .ucd-qr-btn-primary {
	background: #C5453E !important;
	color: #FFFFFF !important;
}
html[data-theme="dark"] .ucd-qr-btn-primary:hover,
html.dark .ucd-qr-btn-primary:hover {
	background: #b23b35 !important;
	box-shadow: 0 4px 14px rgba(197, 69, 62, 0.4) !important;
}
html[data-theme="dark"] .ucd-qr-btn-secondary,
html.dark .ucd-qr-btn-secondary {
	background: #1c202c !important;
	color: #FFFFFF !important;
	border: 1px solid rgba(255, 255, 255, 0.12) !important;
}
html[data-theme="dark"] .ucd-qr-btn-secondary:hover,
html.dark .ucd-qr-btn-secondary:hover {
	background: #252b3b !important;
	box-shadow: 0 4px 12px rgba(0, 0, 0, 0.3) !important;
}
html[data-theme="dark"] .ucd-qr-btn-outline,
html.dark .ucd-qr-btn-outline {
	background: #161922 !important;
	border: 1.5px solid rgba(255, 255, 255, 0.12) !important;
	color: #CBD5E1 !important;
}
html[data-theme="dark"] .ucd-qr-btn-outline:hover,
html.dark .ucd-qr-btn-outline:hover {
	border-color: rgba(255, 255, 255, 0.25) !important;
	background: #1c202c !important;
	color: #FFFFFF !important;
}
html[data-theme="dark"] .ucd-qr-btn-sm,
html.dark .ucd-qr-btn-sm {
	background: #161922 !important;
	border: 1px solid rgba(255, 255, 255, 0.12) !important;
	color: #CBD5E1 !important;
}
html[data-theme="dark"] .ucd-qr-btn-sm:hover,
html.dark .ucd-qr-btn-sm:hover {
	background: #C5453E !important;
	border-color: #C5453E !important;
	color: #FFFFFF !important;
}

/* Bulk Mode Card */
html[data-theme="dark"] .ucd-qr-card,
html[data-theme="dark"] #ucd-qr-bulk-panel,
html.dark .ucd-qr-card,
html.dark #ucd-qr-bulk-panel {
	background: #12151C !important;
	border: 1px solid rgba(255, 255, 255, 0.08) !important;
	color: #CBD5E1 !important;
}
html[data-theme="dark"] #ucd-qr-bulk-count,
html.dark #ucd-qr-bulk-count {
	background: rgba(197, 69, 62, 0.15) !important;
	color: #f87171 !important;
	border: 1px solid rgba(197, 69, 62, 0.3) !important;
}

/* Bulk Type Selector Tabs */
html[data-theme="dark"] .ucd-qr-bulk-type-nav,
html.dark .ucd-qr-bulk-type-nav {
	background: #161922 !important;
	border: 1px solid rgba(255, 255, 255, 0.08) !important;
}
html[data-theme="dark"] .ucd-qr-bulk-tab,
html.dark .ucd-qr-bulk-tab {
	color: #94A3B8 !important;
	background: transparent !important;
}
html[data-theme="dark"] .ucd-qr-bulk-tab:hover,
html.dark .ucd-qr-bulk-tab:hover {
	color: #FFFFFF !important;
}
html[data-theme="dark"] .ucd-qr-bulk-tab.is-active,
html.dark .ucd-qr-bulk-tab.is-active {
	background: #1c202c !important;
	color: #f87171 !important;
	border: 1px solid rgba(255, 255, 255, 0.08) !important;
	box-shadow: 0 2px 6px rgba(0, 0, 0, 0.3) !important;
}

/* Template Download Banner */
html[data-theme="dark"] .ucd-qr-template-banner,
html.dark .ucd-qr-template-banner {
	background: rgba(197, 69, 62, 0.1) !important;
	border: 1px solid rgba(197, 69, 62, 0.25) !important;
	border-left: 4px solid #C5453E !important;
}
html[data-theme="dark"] .ucd-qr-template-banner strong,
html.dark .ucd-qr-template-banner strong {
	color: #fca5a5 !important;
}
html[data-theme="dark"] .ucd-qr-template-banner p,
html.dark .ucd-qr-template-banner p {
	color: #CBD5E1 !important;
}
html[data-theme="dark"] .ucd-qr-template-banner code,
html.dark .ucd-qr-template-banner code {
	background: #161922 !important;
	color: #fca5a5 !important;
	padding: 2px 6px;
	border-radius: 4px;
	border: 1px solid rgba(255, 255, 255, 0.1);
}
html[data-theme="dark"] .ucd-qr-btn-template,
html.dark .ucd-qr-btn-template {
	background: #161922 !important;
	border: 1.5px solid #C5453E !important;
	color: #f87171 !important;
}
html[data-theme="dark"] .ucd-qr-btn-template:hover,
html.dark .ucd-qr-btn-template:hover {
	background: #C5453E !important;
	color: #FFFFFF !important;
	box-shadow: 0 4px 12px rgba(197, 69, 62, 0.3) !important;
}

/* Parsed Table */
html[data-theme="dark"] .ucd-qr-parsed-table-wrap,
html.dark .ucd-qr-parsed-table-wrap {
	background: #161922 !important;
	border: 1px solid rgba(255, 255, 255, 0.08) !important;
}
html[data-theme="dark"] .ucd-qr-parsed-table th,
html.dark .ucd-qr-parsed-table th {
	background: #12151C !important;
	color: #CBD5E1 !important;
	border-bottom: 1px solid rgba(255, 255, 255, 0.08) !important;
}
html[data-theme="dark"] .ucd-qr-parsed-table td,
html.dark .ucd-qr-parsed-table td {
	color: #94A3B8 !important;
	border-bottom: 1px solid rgba(255, 255, 255, 0.05) !important;
}
html[data-theme="dark"] .ucd-qr-parsed-table tr:hover td,
html.dark .ucd-qr-parsed-table tr:hover td {
	background: #1c202c !important;
	color: #FFFFFF !important;
}

/* Bulk Grid & Cards */
html[data-theme="dark"] .ucd-qr-bulk-card,
html.dark .ucd-qr-bulk-card {
	background: #161922 !important;
	border: 1px solid rgba(255, 255, 255, 0.08) !important;
}
html[data-theme="dark"] .ucd-qr-bulk-thumb,
html.dark .ucd-qr-bulk-thumb {
	background: #ffffff !important;
	border: 1px solid rgba(255, 255, 255, 0.12) !important;
}
html[data-theme="dark"] .ucd-qr-bulk-title,
html.dark .ucd-qr-bulk-title {
	color: #CBD5E1 !important;
}
html[data-theme="dark"] .ucd-qr-empty-msg,
html.dark .ucd-qr-empty-msg {
	color: #64748B !important;
}

/* Bulk Progress Track & Bar */
html[data-theme="dark"] .ucd-qr-progress-track,
html.dark .ucd-qr-progress-track {
	background: #161922 !important;
	border: 1px solid rgba(255, 255, 255, 0.08) !important;
}
html[data-theme="dark"] .ucd-qr-progress-text,
html.dark .ucd-qr-progress-text {
	color: #94A3B8 !important;
}

/* Toast Message */
html[data-theme="dark"] .ucd-qr-toast,
html.dark .ucd-qr-toast {
	background: #1c202c !important;
	color: #FFFFFF !important;
	border: 1px solid rgba(255, 255, 255, 0.15) !important;
	box-shadow: 0 8px 24px rgba(0, 0, 0, 0.6) !important;
}


/* ==========================================================================
   IMAGE BACKGROUND REMOVER - COMPLETE LIGHT & DARK MODE SUPPORT
   ========================================================================== */

.br-model-selector-wrap {
	margin-top: 20px;
	background: var(--ucd-bg-surface, #ffffff);
	border: 1.5px solid var(--ucd-border, #e2e8f0);
	border-radius: 14px;
	padding: 18px;
	text-align: left;
	box-shadow: 0 2px 8px rgba(0, 0, 0, 0.03);
	transition: background 0.2s ease, border-color 0.2s ease;
}

html[data-theme="dark"] .br-model-selector-wrap,
html.dark .br-model-selector-wrap {
	background: #161922 !important;
	border-color: rgba(255, 255, 255, 0.1) !important;
	box-shadow: 0 4px 16px rgba(0, 0, 0, 0.35) !important;
}

.br-model-label {
	display: flex;
	align-items: center;
	gap: 6px;
	font-size: 13.5px;
	font-weight: 700;
	color: #0f172a;
	margin-bottom: 12px;
	letter-spacing: -0.01em;
}

html[data-theme="dark"] .br-model-label,
html.dark .br-model-label {
	color: #FFFFFF !important;
}

.br-model-pills {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(210px, 1fr));
	gap: 10px;
}

.br-model-pill {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	padding: 12px 14px;
	background: #f8fafc;
	border: 1.5px solid #e2e8f0;
	border-radius: 10px;
	cursor: pointer;
	text-align: left;
	transition: all 0.2s ease;
	user-select: none;
	-webkit-tap-highlight-color: transparent;
}

html[data-theme="dark"] .br-model-pill,
html.dark .br-model-pill {
	background: #1C202C !important;
	border-color: rgba(255, 255, 255, 0.08) !important;
	color: #F1F5F9 !important;
}

.br-model-pill:hover {
	border-color: #C5453E;
	background: #fffafa;
}

html[data-theme="dark"] .br-model-pill:hover,
html.dark .br-model-pill:hover {
	background: #222736 !important;
	border-color: #C5453E !important;
}

.br-model-pill.is-active {
	border-color: #C5453E;
	background: #fef2f2;
	box-shadow: 0 0 0 2px rgba(197, 69, 62, 0.2);
}

html[data-theme="dark"] .br-model-pill.is-active,
html.dark .br-model-pill.is-active {
	background: rgba(197, 69, 62, 0.15) !important;
	border-color: #C5453E !important;
	box-shadow: 0 0 0 2px rgba(197, 69, 62, 0.3) !important;
}

.br-model-pill-top {
	display: flex;
	align-items: center;
	justify-content: space-between;
	width: 100%;
	margin-bottom: 4px;
	gap: 6px;
}

.br-model-pill-title {
	font-size: 13.5px;
	font-weight: 700;
	color: #0f172a;
	display: flex;
	align-items: center;
	gap: 6px;
}

html[data-theme="dark"] .br-model-pill-title,
html.dark .br-model-pill-title {
	color: #FFFFFF !important;
}

.br-model-pill.is-active .br-model-pill-title {
	color: #C5453E !important;
}

html[data-theme="dark"] .br-model-pill.is-active .br-model-pill-title {
	color: #FF7B72 !important;
}

.br-model-badge {
	font-size: 10.5px;
	font-weight: 700;
	padding: 2px 7px;
	border-radius: 99px;
	letter-spacing: 0.02em;
	white-space: nowrap;
}

.br-badge-rec { background: #dbeafe; color: #1e40af; }
.br-badge-hd { background: #fef3c7; color: #92400e; }
.br-badge-sig { background: #dcfce7; color: #166534; }
.br-badge-fast { background: #f3e8ff; color: #6b21a8; }
.br-badge-chroma { background: #ffedd5; color: #9a3412; }

html[data-theme="dark"] .br-badge-rec { background: rgba(59, 130, 246, 0.2) !important; color: #93C5FD !important; }
html[data-theme="dark"] .br-badge-hd { background: rgba(245, 158, 11, 0.2) !important; color: #FCD34D !important; }
html[data-theme="dark"] .br-badge-sig { background: rgba(34, 197, 94, 0.2) !important; color: #86EFAC !important; }
html[data-theme="dark"] .br-badge-fast { background: rgba(168, 85, 247, 0.2) !important; color: #D8B4FE !important; }
html[data-theme="dark"] .br-badge-chroma { background: rgba(249, 115, 22, 0.2) !important; color: #FDBA74 !important; }

.br-model-pill-sub {
	font-size: 11.5px;
	color: #64748b;
	line-height: 1.35;
}

html[data-theme="dark"] .br-model-pill-sub,
html.dark .br-model-pill-sub {
	color: #94A3B8 !important;
}

/* ============ Workspace Smart Mode Switcher ============ */
.br-ws-mode-wrap {
	background: #ffffff;
	border: 1.5px solid #e2e8f0;
	border-radius: 12px;
	padding: 12px 14px;
	margin: 0 auto 16px auto;
	width: 100%;
	max-width: 540px;
	box-sizing: border-box;
	text-align: left;
	box-shadow: 0 2px 6px rgba(0, 0, 0, 0.03);
}

html[data-theme="dark"] .br-ws-mode-wrap,
html.dark .br-ws-mode-wrap {
	background: #161922 !important;
	border-color: rgba(255, 255, 255, 0.1) !important;
	box-shadow: 0 4px 16px rgba(0, 0, 0, 0.35) !important;
}

.br-ws-mode-header {
	display: flex;
	align-items: center;
	justify-content: space-between;
	margin-bottom: 8px;
}

.br-ws-mode-title {
	font-size: 12.5px;
	font-weight: 700;
	color: #1e293b;
	display: flex;
	align-items: center;
	gap: 5px;
}

html[data-theme="dark"] .br-ws-mode-title,
html.dark .br-ws-mode-title {
	color: #FFFFFF !important;
}

.br-ws-mode-hint {
	font-size: 11px;
	color: #64748b;
}

html[data-theme="dark"] .br-ws-mode-hint,
html.dark .br-ws-mode-hint {
	color: #94A3B8 !important;
}

.br-ws-mode-pills {
	display: flex;
	flex-wrap: wrap;
	gap: 6px;
}

.br-ws-mode-pill {
	background: #f8fafc;
	border: 1px solid #cbd5e1;
	border-radius: 8px;
	padding: 6px 11px;
	font-family: inherit;
	font-size: 12px;
	font-weight: 600;
	color: #475569;
	cursor: pointer;
	transition: all 0.15s ease;
	display: inline-flex;
	align-items: center;
	gap: 5px;
	user-select: none;
}

html[data-theme="dark"] .br-ws-mode-pill,
html.dark .br-ws-mode-pill {
	background: #1C202C !important;
	border-color: rgba(255, 255, 255, 0.1) !important;
	color: #CBD5E1 !important;
}

.br-ws-mode-pill:hover {
	border-color: #C5453E;
	color: #C5453E;
	background: #fffafa;
}

html[data-theme="dark"] .br-ws-mode-pill:hover,
html.dark .br-ws-mode-pill:hover {
	background: #222736 !important;
	border-color: #C5453E !important;
	color: #FF7B72 !important;
}

.br-ws-mode-pill.is-active {
	background: #C5453E !important;
	border-color: #C5453E !important;
	color: #ffffff !important;
	box-shadow: 0 2px 6px rgba(197, 69, 62, 0.25);
}

/* ============ Signature & Document Tuning Controls ============ */
.br-sig-controls {
	background: #f0fdf4;
	border: 1px solid #bbf7d0;
	border-radius: 10px;
	padding: 10px 12px;
	margin: 10px auto;
	width: 100%;
	max-width: 540px;
	box-sizing: border-box;
	text-align: left;
}

html[data-theme="dark"] .br-sig-controls,
html.dark .br-sig-controls {
	background: rgba(22, 101, 52, 0.15) !important;
	border-color: rgba(34, 197, 94, 0.25) !important;
}

.br-sig-row {
	display: flex;
	align-items: center;
	justify-content: space-between;
	margin-bottom: 8px;
	flex-wrap: wrap;
	gap: 6px;
}

.br-sig-row:last-child {
	margin-bottom: 0;
}

.br-sig-label {
	font-size: 11.5px;
	font-weight: 700;
	color: #166534;
	display: flex;
	align-items: center;
	gap: 5px;
}

html[data-theme="dark"] .br-sig-label,
html.dark .br-sig-label {
	color: #86EFAC !important;
}

.br-sig-pills-group {
	display: flex;
	gap: 5px;
}

.br-sig-ink-pill,
.br-sig-stroke-pill {
	background: #ffffff;
	border: 1px solid #86efac;
	border-radius: 6px;
	padding: 4px 8px;
	font-size: 11px;
	font-weight: 600;
	color: #15803d;
	cursor: pointer;
	transition: all 0.15s ease;
	user-select: none;
}

html[data-theme="dark"] .br-sig-ink-pill,
html[data-theme="dark"] .br-sig-stroke-pill,
html.dark .br-sig-ink-pill,
html.dark .br-sig-stroke-pill {
	background: #161922 !important;
	border-color: rgba(34, 197, 94, 0.4) !important;
	color: #86EFAC !important;
}

.br-sig-ink-pill:hover,
.br-sig-stroke-pill:hover {
	border-color: #16a34a;
	background: #dcfce7;
}

html[data-theme="dark"] .br-sig-ink-pill:hover,
html[data-theme="dark"] .br-sig-stroke-pill:hover {
	background: rgba(34, 197, 94, 0.25) !important;
}

.br-sig-ink-pill.is-active,
.br-sig-stroke-pill.is-active {
	background: #15803d !important;
	border-color: #15803d !important;
	color: #ffffff !important;
}

/* ============ Background Customizer ============ */
.br-bg-customizer {
	background: #f8fafc;
	border: 1px solid #e2e8f0;
	border-radius: 12px;
	padding: 14px 16px;
	margin: 16px auto;
	width: 100%;
	max-width: 540px;
	box-sizing: border-box;
}

html[data-theme="dark"] .br-bg-customizer,
html.dark .br-bg-customizer {
	background: #161922 !important;
	border-color: rgba(255, 255, 255, 0.1) !important;
}

.br-bg-header {
	display: flex;
	align-items: center;
	justify-content: space-between;
	margin-bottom: 10px;
}

.br-bg-title {
	font-size: 13.5px;
	font-weight: 700;
	color: #181d20;
	letter-spacing: -0.01em;
	display: flex;
	align-items: center;
	gap: 5px;
}

html[data-theme="dark"] .br-bg-title,
html.dark .br-bg-title {
	color: #FFFFFF !important;
}

.br-bg-tabs {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 5px;
	background: #e2e8f0;
	padding: 4px;
	border-radius: 10px;
	margin-bottom: 12px;
}

html[data-theme="dark"] .br-bg-tabs,
html.dark .br-bg-tabs {
	background: #12151C !important;
}

.br-bg-tab {
	background: transparent;
	border: none;
	border-radius: 7px;
	padding: 8px 4px;
	font-family: inherit;
	font-size: 12px;
	font-weight: 600;
	color: #64748b;
	cursor: pointer;
	transition: all 0.2s ease;
	text-align: center;
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 5px;
	user-select: none;
}

html[data-theme="dark"] .br-bg-tab,
html.dark .br-bg-tab {
	color: #94A3B8 !important;
}

.br-bg-tab:hover {
	color: #181d20;
}

html[data-theme="dark"] .br-bg-tab:hover,
html.dark .br-bg-tab:hover {
	color: #FFFFFF !important;
}

.br-bg-tab.is-active {
	background: #ffffff !important;
	color: #C5453E !important;
	box-shadow: 0 2px 6px rgba(0, 0, 0, 0.08);
}

html[data-theme="dark"] .br-bg-tab.is-active,
html.dark .br-bg-tab.is-active {
	background: #1C202C !important;
	color: #FF7B72 !important;
	box-shadow: 0 2px 6px rgba(0, 0, 0, 0.35);
}

.br-swatch-label,
.br-custom-picker-label,
.br-grad-pick-item label {
	font-size: 12px;
	font-weight: 600;
	color: #475569;
	display: flex;
	align-items: center;
	gap: 5px;
}

html[data-theme="dark"] .br-swatch-label,
html[data-theme="dark"] .br-custom-picker-label,
html[data-theme="dark"] .br-grad-pick-item label,
html.dark .br-swatch-label,
html.dark .br-custom-picker-label,
html.dark .br-grad-pick-item label {
	color: #CBD5E1 !important;
}

.br-color-input-wrap {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	background: #ffffff;
	border: 1px solid #cbd5e1;
	border-radius: 8px;
	padding: 4px 8px;
}

html[data-theme="dark"] .br-color-input-wrap,
html.dark .br-color-input-wrap {
	background: #1C202C !important;
	border-color: rgba(255, 255, 255, 0.15) !important;
}

.br-color-hex {
	font-size: 12px;
	font-weight: 700;
	font-family: monospace;
	color: #1e293b;
}

html[data-theme="dark"] .br-color-hex,
html.dark .br-color-hex {
	color: #CBD5E1 !important;
}

.br-grad-select {
	background: #ffffff;
	border: 1px solid #cbd5e1;
	border-radius: 8px;
	padding: 6px 10px;
	font-size: 12px;
	color: #1e293b;
}

html[data-theme="dark"] .br-grad-select,
html.dark .br-grad-select {
	background: #1C202C !important;
	border-color: rgba(255, 255, 255, 0.15) !important;
	color: #FFFFFF !important;
}

.br-mobile-hint {
	text-align: center;
	font-size: 12.5px;
	color: #64748b;
	margin: 10px auto 0 auto;
	max-width: 360px;
	line-height: 1.4;
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 5px;
}

html[data-theme="dark"] .br-mobile-hint,
html.dark .br-mobile-hint {
	color: #94A3B8 !important;
}


/* ==========================================================================
   RESUME BUILDER & INVOICE GENERATOR - COMPREHENSIVE LIGHT & DARK THEME
   ========================================================================== */

/* 1. Editor Form Column in Dark Mode */
html[data-theme="dark"] .ucd-form-col,
html.dark .ucd-form-col {
	background: #161922 !important;
	border-color: rgba(255, 255, 255, 0.08) !important;
	box-shadow: 0 4px 20px rgba(0, 0, 0, 0.35) !important;
}

html[data-theme="dark"] .ucd-form-section,
html.dark .ucd-form-section {
	border-bottom-color: rgba(255, 255, 255, 0.06) !important;
}

html[data-theme="dark"] .ucd-form-title,
html.dark .ucd-form-title {
	color: #FFFFFF !important;
}

html[data-theme="dark"] .res-field label,
html[data-theme="dark"] .inv-field label,
html[data-theme="dark"] .res-field > span,
html[data-theme="dark"] .inv-field > span,
html.dark .res-field label,
html.dark .inv-field label,
html.dark .res-field > span,
html.dark .inv-field > span {
	color: #CBD5E1 !important;
}

html[data-theme="dark"] .res-input,
html[data-theme="dark"] .inv-input,
html[data-theme="dark"] .res-select,
html[data-theme="dark"] .inv-select,
html[data-theme="dark"] .res-textarea,
html[data-theme="dark"] .inv-textarea,
html.dark .res-input,
html.dark .inv-input,
html.dark .res-select,
html.dark .inv-select,
html.dark .res-textarea,
html.dark .inv-textarea {
	background: #1C202C !important;
	border-color: rgba(255, 255, 255, 0.1) !important;
	color: #FFFFFF !important;
}

html[data-theme="dark"] .res-input:focus,
html[data-theme="dark"] .inv-input:focus,
html[data-theme="dark"] .res-select:focus,
html[data-theme="dark"] .inv-select:focus,
html[data-theme="dark"] .res-textarea:focus,
html[data-theme="dark"] .inv-textarea:focus,
html.dark .res-input:focus,
html.dark .inv-input:focus,
html.dark .res-select:focus,
html.dark .inv-select:focus,
html.dark .res-textarea:focus,
html.dark .inv-textarea:focus {
	border-color: #C5453E !important;
	box-shadow: 0 0 0 3px rgba(197, 69, 62, 0.25) !important;
}

html[data-theme="dark"] .res-input::placeholder,
html[data-theme="dark"] .inv-input::placeholder,
html[data-theme="dark"] .res-textarea::placeholder,
html[data-theme="dark"] .inv-textarea::placeholder,
html.dark .res-input::placeholder,
html.dark .inv-input::placeholder,
html.dark .res-textarea::placeholder,
html.dark .inv-textarea::placeholder {
	color: #64748B !important;
}

/* 2. Project Toolbar & Buttons */
html[data-theme="dark"] .ucd-project-toolbar,
html.dark .ucd-project-toolbar {
	background: #1C202C !important;
	border-color: rgba(255, 255, 255, 0.08) !important;
}

html[data-theme="dark"] .ucd-project-status,
html.dark .ucd-project-status {
	color: #94A3B8 !important;
}

html[data-theme="dark"] .ucd-tool-btn,
html.dark .ucd-tool-btn {
	background: #161922 !important;
	border-color: rgba(255, 255, 255, 0.1) !important;
	color: #CBD5E1 !important;
}

html[data-theme="dark"] .ucd-tool-btn:hover,
html.dark .ucd-tool-btn:hover {
	background: #222736 !important;
	border-color: rgba(255, 255, 255, 0.2) !important;
	color: #FFFFFF !important;
}

html[data-theme="dark"] .ucd-tool-btn-danger,
html.dark .ucd-tool-btn-danger {
	border-color: rgba(239, 68, 68, 0.4) !important;
	color: #F87171 !important;
	background: rgba(239, 68, 68, 0.1) !important;
}

html[data-theme="dark"] .ucd-tool-btn-danger:hover,
html.dark .ucd-tool-btn-danger:hover {
	background: rgba(239, 68, 68, 0.2) !important;
	border-color: #EF4444 !important;
	color: #FFFFFF !important;
}

/* 3. Pills & Templates */
html[data-theme="dark"] .res-template-pill,
html[data-theme="dark"] .inv-template-pill,
html[data-theme="dark"] .res-accent-pill,
html[data-theme="dark"] .inv-accent-pill,
html.dark .res-template-pill,
html.dark .inv-template-pill,
html.dark .res-accent-pill,
html.dark .inv-accent-pill {
	background: #1C202C !important;
	border-color: rgba(255, 255, 255, 0.08) !important;
	color: #CBD5E1 !important;
}

html[data-theme="dark"] .res-template-pill:hover,
html[data-theme="dark"] .inv-template-pill:hover,
html[data-theme="dark"] .res-accent-pill:hover,
html[data-theme="dark"] .inv-accent-pill:hover,
html.dark .res-template-pill:hover,
html.dark .inv-template-pill:hover,
html.dark .res-accent-pill:hover,
html.dark .inv-accent-pill:hover {
	background: #222736 !important;
	border-color: rgba(255, 255, 255, 0.18) !important;
	color: #FFFFFF !important;
}

html[data-theme="dark"] .res-template-pill.is-active,
html[data-theme="dark"] .inv-template-pill.is-active,
html[data-theme="dark"] .res-accent-pill.is-active,
html[data-theme="dark"] .inv-accent-pill.is-active,
html.dark .res-template-pill.is-active,
html.dark .inv-template-pill.is-active,
html.dark .res-accent-pill.is-active,
html.dark .inv-accent-pill.is-active {
	background: rgba(197, 69, 62, 0.18) !important;
	border-color: #C5453E !important;
	color: #FF7B72 !important;
	box-shadow: 0 0 0 2px rgba(197, 69, 62, 0.25) !important;
}

/* 4. Entry Cards (Repeatable list items) */
html[data-theme="dark"] .res-entry-card,
html[data-theme="dark"] .inv-item-card,
html.dark .res-entry-card,
html.dark .inv-item-card {
	background: #1C202C !important;
	border-color: rgba(255, 255, 255, 0.08) !important;
}

html[data-theme="dark"] .res-entry-title,
html[data-theme="dark"] .inv-item-title,
html.dark .res-entry-title,
html.dark .inv-item-title {
	color: #FFFFFF !important;
}

html[data-theme="dark"] .ucd-btn-add,
html.dark .ucd-btn-add {
	background: #1C202C !important;
	border-color: rgba(255, 255, 255, 0.18) !important;
	color: #CBD5E1 !important;
}

html[data-theme="dark"] .ucd-btn-add:hover,
html.dark .ucd-btn-add:hover {
	background: rgba(197, 69, 62, 0.15) !important;
	border-color: #C5453E !important;
	color: #FF7B72 !important;
}

/* 5. Outline / Secondary Buttons */
html[data-theme="dark"] .ucd-btn-outline,
html.dark .ucd-btn-outline {
	background: #161922 !important;
	border-color: rgba(255, 255, 255, 0.15) !important;
	color: #CBD5E1 !important;
}

html[data-theme="dark"] .ucd-btn-outline:hover,
html.dark .ucd-btn-outline:hover {
	background: #222736 !important;
	border-color: #C5453E !important;
	color: #FF7B72 !important;
}

html[data-theme="dark"] .ucd-btn-secondary,
html.dark .ucd-btn-secondary {
	background: #1C202C !important;
	border: 1px solid rgba(255, 255, 255, 0.15) !important;
	color: #FFFFFF !important;
}

html[data-theme="dark"] .ucd-btn-secondary:hover,
html.dark .ucd-btn-secondary:hover {
	background: #272D3D !important;
}

/* 6. Mobile Tabs */
html[data-theme="dark"] .ucd-mobile-tabs,
html.dark .ucd-mobile-tabs {
	background: #12151C !important;
}

html[data-theme="dark"] .ucd-mobile-tab,
html.dark .ucd-mobile-tab {
	color: #94A3B8 !important;
}

html[data-theme="dark"] .ucd-mobile-tab.is-active,
html.dark .ucd-mobile-tab.is-active {
	background: #1C202C !important;
	color: #FF7B72 !important;
}

/* 7. Canvas Background for Paper Container */
html[data-theme="dark"] .ucd-paper-container,
html.dark .ucd-paper-container {
	background: #12151C !important;
	border-color: rgba(255, 255, 255, 0.08) !important;
	box-shadow: 0 4px 20px rgba(0, 0, 0, 0.35) !important;
}

/* 8. PAPER SHEET MUST ALWAYS REMAIN CRISP WHITE PRINT PAPER */
.res-paper-inner,
.inv-paper-inner,
#res-paper .res-paper-inner,
#inv-paper .inv-paper-inner,
html[data-theme="dark"] .res-paper-inner,
html[data-theme="dark"] .inv-paper-inner,
html[data-theme="dark"] #res-paper .res-paper-inner,
html[data-theme="dark"] #inv-paper .inv-paper-inner,
html.dark .res-paper-inner,
html.dark .inv-paper-inner,
html.dark #res-paper .res-paper-inner,
html.dark #inv-paper .inv-paper-inner {
	background: #ffffff !important;
	color: #0f172a !important;
	box-shadow: 0 4px 24px rgba(0, 0, 0, 0.45) !important;
	border-radius: 6px !important;
}

/* Preserve exact text color inside paper in dark mode */
html[data-theme="dark"] .res-paper-inner h1,
html[data-theme="dark"] .res-paper-inner h2,
html[data-theme="dark"] .res-paper-inner h3,
html[data-theme="dark"] .res-paper-inner h4,
html[data-theme="dark"] .res-paper-inner p,
html[data-theme="dark"] .res-paper-inner span,
html[data-theme="dark"] .res-paper-inner strong,
html[data-theme="dark"] .res-paper-inner div,
html[data-theme="dark"] .res-paper-inner li,
html[data-theme="dark"] .inv-paper-inner h1,
html[data-theme="dark"] .inv-paper-inner h2,
html[data-theme="dark"] .inv-paper-inner h3,
html[data-theme="dark"] .inv-paper-inner p,
html[data-theme="dark"] .inv-paper-inner span,
html[data-theme="dark"] .inv-paper-inner td,
html[data-theme="dark"] .inv-paper-inner th,
html[data-theme="dark"] .inv-paper-inner strong,
html[data-theme="dark"] .inv-paper-inner div,
html.dark .res-paper-inner h1,
html.dark .res-paper-inner h2,
html.dark .res-paper-inner h3,
html.dark .res-paper-inner h4,
html.dark .res-paper-inner p,
html.dark .res-paper-inner span,
html.dark .res-paper-inner strong,
html.dark .res-paper-inner div,
html.dark .res-paper-inner li,
html.dark .inv-paper-inner h1,
html.dark .inv-paper-inner h2,
html.dark .inv-paper-inner h3,
html.dark .inv-paper-inner p,
html.dark .inv-paper-inner span,
html.dark .inv-paper-inner td,
html.dark .inv-paper-inner th,
html.dark .inv-paper-inner strong,
html.dark .inv-paper-inner div {
	color: #0f172a;
}

html[data-theme="dark"] .res-paper-inner p,
html[data-theme="dark"] .res-paper-inner li,
html[data-theme="dark"] .res-paper-inner div[style*="color: #334155"],
html[data-theme="dark"] .res-paper-inner span[style*="color: #334155"],
html.dark .res-paper-inner p,
html.dark .res-paper-inner li,
html.dark .res-paper-inner div[style*="color: #334155"],
html.dark .res-paper-inner span[style*="color: #334155"] {
	color: #334155 !important;
}

html[data-theme="dark"] .res-paper-inner div[style*="color: #475569"],
html[data-theme="dark"] .res-paper-inner span[style*="color: #475569"],
html.dark .res-paper-inner div[style*="color: #475569"],
html.dark .res-paper-inner span[style*="color: #475569"] {
	color: #475569 !important;
}

html[data-theme="dark"] .res-paper-inner h1,
html[data-theme="dark"] .res-paper-inner strong,
html.dark .res-paper-inner h1,
html.dark .res-paper-inner strong {
	color: #0f172a !important;
}

/* ==========================================================================
   LATEX TO PDF COMPILER & EDITOR - COMPLETE DARK MODE SYSTEM
   ========================================================================== */
html[data-theme="dark"] .latex-app,
html.dark .latex-app {
	background: #161922 !important;
	border-color: #272c3d !important;
	box-shadow: 0 10px 30px rgba(0, 0, 0, 0.45) !important;
}

html[data-theme="dark"] .latex-toolbar,
html.dark .latex-toolbar {
	background: #12151c !important;
	border-bottom: 1px solid #272c3d !important;
}

html[data-theme="dark"] .latex-toolbar-label,
html.dark .latex-toolbar-label {
	color: #94a3b8 !important;
}

html[data-theme="dark"] .latex-select,
html.dark .latex-select {
	background: #1c202c !important;
	border-color: #2e3447 !important;
	color: #f1f5f9 !important;
}

html[data-theme="dark"] .latex-btn-ghost,
html[data-theme="dark"] .latex-btn-outline,
html.dark .latex-btn-ghost,
html.dark .latex-btn-outline {
	background: #1c202c !important;
	border-color: #2e3447 !important;
	color: #cbd5e1 !important;
}

html[data-theme="dark"] .latex-btn-ghost:hover,
html[data-theme="dark"] .latex-btn-outline:hover,
html.dark .latex-btn-ghost:hover,
html.dark .latex-btn-outline:hover {
	background: #252b3b !important;
	border-color: #3b4259 !important;
	color: #ffffff !important;
}

html[data-theme="dark"] .latex-view-switcher,
html.dark .latex-view-switcher {
	background: #1c202c !important;
	border: 1px solid #2e3447 !important;
}

html[data-theme="dark"] .latex-view-btn,
html.dark .latex-view-btn {
	color: #94a3b8 !important;
}

html[data-theme="dark"] .latex-view-btn.is-active,
html.dark .latex-view-btn.is-active {
	background: #252b3b !important;
	color: #ffffff !important;
	box-shadow: 0 1px 4px rgba(0,0,0,0.3) !important;
}

html[data-theme="dark"] .latex-zoom-controls,
html.dark .latex-zoom-controls {
	background: #1c202c !important;
	border: 1px solid #2e3447 !important;
}

html[data-theme="dark"] .latex-zoom-btn,
html.dark .latex-zoom-btn {
	color: #cbd5e1 !important;
}

html[data-theme="dark"] .latex-zoom-btn:hover,
html.dark .latex-zoom-btn:hover {
	background: #252b3b !important;
	color: #ffffff !important;
}

html[data-theme="dark"] .latex-zoom-val,
html.dark .latex-zoom-val {
	color: #94a3b8 !important;
}

html[data-theme="dark"] .latex-toggle-label,
html.dark .latex-toggle-label {
	color: #cbd5e1 !important;
}

html[data-theme="dark"] .latex-symbol-bar,
html.dark .latex-symbol-bar {
	background: #161922 !important;
	border-bottom: 1px solid #272c3d !important;
}

html[data-theme="dark"] .latex-symbol-label,
html.dark .latex-symbol-label {
	color: #64748b !important;
}

html[data-theme="dark"] .latex-snippet-btn,
html.dark .latex-snippet-btn {
	background: #1c202c !important;
	border-color: #2e3447 !important;
	color: #cbd5e1 !important;
}

html[data-theme="dark"] .latex-snippet-btn:hover,
html.dark .latex-snippet-btn:hover {
	background: #252b3b !important;
	border-color: #C5453E !important;
	color: #C5453E !important;
}

html[data-theme="dark"] .latex-editor-pane,
html.dark .latex-editor-pane {
	background: #161922 !important;
	border-right: 1px solid #272c3d !important;
}

html[data-theme="dark"] .latex-pane-header,
html.dark .latex-pane-header {
	background: #12151c !important;
	border-bottom: 1px solid #272c3d !important;
	color: #94a3b8 !important;
}

html[data-theme="dark"] .latex-editor-line-info,
html.dark .latex-editor-line-info {
	background: #1c202c !important;
	color: #94a3b8 !important;
}

html[data-theme="dark"] .latex-editor-body,
html.dark .latex-editor-body {
	background: #161922 !important;
}

html[data-theme="dark"] .latex-gutter,
html.dark .latex-gutter {
	background: #12151c !important;
	border-right: 1px solid #272c3d !important;
	color: #64748b !important;
}

html[data-theme="dark"] .latex-gutter-line:hover,
html[data-theme="dark"] .latex-gutter-line.is-active,
html.dark .latex-gutter-line:hover,
html.dark .latex-gutter-line.is-active {
	background: #1c202c !important;
	color: #f1f5f9 !important;
}

html[data-theme="dark"] .latex-code-textarea,
html.dark .latex-code-textarea {
	background: #161922 !important;
	color: #f8fafc !important;
}

html[data-theme="dark"] .latex-preview-pane,
html[data-theme="dark"] .latex-preview-scroll,
html.dark .latex-preview-pane,
html.dark .latex-preview-scroll {
	background: #0f1218 !important;
}

/* ==========================================================================
   LATEX DOCUMENT PAPER PREVIEW - MUST ALWAYS REMAIN CRISP WHITE PRINT PAPER
   ========================================================================== */
.latex-page,
.latex-paper .latex-page,
#latex-preview-content .latex-page,
html[data-theme="dark"] .latex-page,
html[data-theme="dark"] .latex-paper .latex-page,
html[data-theme="dark"] #latex-preview-content .latex-page,
html.dark .latex-page,
html.dark .latex-paper .latex-page,
html.dark #latex-preview-content .latex-page {
	background: #ffffff !important;
	color: #111827 !important;
	box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.4), 0 10px 25px -3px rgba(0, 0, 0, 0.5), 0 0 0 1px rgba(255, 255, 255, 0.05) !important;
	border-radius: 4px !important;
}

html[data-theme="dark"] .latex-page *,
html.dark .latex-page * {
	color: inherit;
}

html[data-theme="dark"] .latex-page h1,
html[data-theme="dark"] .latex-page h2,
html[data-theme="dark"] .latex-page h3,
html[data-theme="dark"] .latex-page h4,
html[data-theme="dark"] .latex-page p,
html[data-theme="dark"] .latex-page span,
html[data-theme="dark"] .latex-page strong,
html[data-theme="dark"] .latex-page div,
html[data-theme="dark"] .latex-page td,
html[data-theme="dark"] .latex-page th,
html[data-theme="dark"] .latex-page .katex,
html[data-theme="dark"] .latex-page .katex *,
html.dark .latex-page h1,
html.dark .latex-page h2,
html.dark .latex-page h3,
html.dark .latex-page h4,
html.dark .latex-page p,
html.dark .latex-page span,
html.dark .latex-page strong,
html.dark .latex-page div,
html.dark .latex-page td,
html.dark .latex-page th,
html.dark .latex-page .katex,
html.dark .latex-page .katex * {
	color: #111827 !important;
}

html[data-theme="dark"] .latex-page-header-tag,
html.dark .latex-page-header-tag {
	background: #f1f5f9 !important;
	color: #64748b !important;
	border: 1px solid #e2e8f0 !important;
}

html[data-theme="dark"] .latex-diagnostics-drawer,
html.dark .latex-diagnostics-drawer {
	background: #161922 !important;
	border-top: 1px solid #272c3d !important;
}

html[data-theme="dark"] .latex-diag-header,
html.dark .latex-diag-header {
	background: #12151c !important;
	border-bottom: 1px solid #272c3d !important;
}
