/* ═══════════════════════════════════════════════════════════════
   Gerege — Dark / Light Mode Toggle
   ═══════════════════════════════════════════════════════════════ */

/* ─── Toggle Button ─── */
.theme-toggle {
	display: flex;
	align-items: center;
	margin-left: 8px;
}
.theme-btn {
	background: transparent;
	border: 1px solid rgba(255,255,255,0.25);
	color: #fff;
	border-radius: 50%;
	width: 36px;
	height: 36px;
	display: flex;
	align-items: center;
	justify-content: center;
	cursor: pointer;
	transition: all 0.3s ease;
	font-size: 16px;
	padding: 0;
	line-height: 1;
}
.theme-btn:hover {
	background: rgba(123,134,252,0.15);
	border-color: #7B86FC;
	color: #7B86FC;
}
/* Show correct icon */
.theme-btn .fa-moon { display: inline-block; }
.theme-btn .fa-sun  { display: none; }
html.light-mode .theme-btn .fa-moon { display: none; }
html.light-mode .theme-btn .fa-sun  { display: inline-block; }

/* ─── Light Mode button style ─── */
html.light-mode .theme-btn {
	border-color: rgba(0,0,0,0.2);
	color: #333;
}
html.light-mode .theme-btn:hover {
	background: rgba(123,134,252,0.1);
	border-color: #7B86FC;
	color: #7B86FC;
}

/* Mobile theme toggle inside mobile-menu */
.mobile-theme-toggle {
	display: none;
	padding: 8px 24px;
}
.mobile-theme-toggle .theme-btn {
	width: 100%;
	border-radius: 8px;
	height: auto;
	padding: 10px 16px;
	font-size: 14px;
	gap: 6px;
}
@media only screen and (max-width: 1023px) {
	.mobile-theme-toggle { display: block; }
}

/* ═══════════════════════════════════════════════════════════════
   Light Mode — CSS Variable Overrides
   ═══════════════════════════════════════════════════════════════ */

html.light-mode {
	--color-three: rgb(240,240,245);
	--color-three-rgb: 240,240,245;
	--color-four: rgb(250,250,255);
	--color-four-rgb: 250,250,255;
	--white-color: rgb(17,17,17);
	--white-color-rgb: 17,17,17;
	--black-color: rgb(255,255,255);
	--black-color-rgb: 255,255,255;
}

/* ─── Body & Page Background ─── */
html.light-mode body {
	background-color: #f5f5fa !important;
	color: #222;
}

/* ─── Scrollbar ─── */
html.light-mode ::-webkit-scrollbar-track {
	background: #e8e8ee;
}

/* ─── Preloader ─── */
html.light-mode .handle-preloader {
	background-color: #f5f5fa;
}

/* ─── Header / Nav ─── */
html.light-mode .main-header {
	background: rgba(255,255,255,0.95) !important;
	backdrop-filter: blur(12px);
	border-bottom: 1px solid rgba(0,0,0,0.06);
}
html.light-mode .main-header .main-menu .navigation > li > a,
html.light-mode .main-header .main-menu .navigation > li > a .menu-text {
	color: #222 !important;
}
html.light-mode .main-header .main-menu .navigation > li > a:hover,
html.light-mode .main-header .main-menu .navigation > li > a:hover .menu-text {
	color: var(--main-color) !important;
}
html.light-mode .main-header .header-lower {
	background: transparent !important;
}
html.light-mode .header-style-one .header-lower::before {
	background: rgba(255,255,255,0.9) !important;
}

/* Nav logo — keep original colors */
html.light-mode .main-header .logo img {
	filter: none;
}

/* Login & Cart icons in light mode */
html.light-mode .main-header .header-login a,
html.light-mode .main-header .header-login .login-btn,
html.light-mode .main-header .cart-icon,
html.light-mode .main-header .cart-btn,
html.light-mode .main-header .header-login i,
html.light-mode .main-header .cart-icon i,
html.light-mode .main-header [class*="cart"] i,
html.light-mode .main-header [class*="login"] i {
	color: #222 !important;
}
html.light-mode .main-header .header-login a:hover,
html.light-mode .main-header .header-login .login-btn:hover,
html.light-mode .main-header .cart-icon:hover,
html.light-mode .main-header .cart-btn:hover,
html.light-mode .main-header .header-login a:hover i,
html.light-mode .main-header .cart-icon:hover i,
html.light-mode .main-header [class*="cart"]:hover i,
html.light-mode .main-header [class*="login"]:hover i {
	color: #7B86FC !important;
}

/* Lang toggle in light mode */
html.light-mode .lang-btn {
	border-color: rgba(0,0,0,0.2);
	color: #333;
}
html.light-mode .lang-btn:hover {
	color: #7B86FC;
	border-color: #7B86FC;
}

/* Company dropdown */
html.light-mode .company-dropdown-content {
	background: rgba(255,255,255,0.98) !important;
	border: 1px solid rgba(0,0,0,0.08);
	box-shadow: 0 8px 32px rgba(0,0,0,0.12);
}
html.light-mode .company-dropdown-content a {
	color: #222 !important;
}
html.light-mode .company-dropdown-content a:hover {
	background: rgba(123,134,252,0.08) !important;
	color: #7B86FC !important;
}

/* Mobile menu */
html.light-mode .mobile-menu .menu-box {
	background: #fff !important;
}
html.light-mode .mobile-menu .navigation li a {
	color: #222 !important;
}
html.light-mode .mobile-menu .close-btn {
	color: #222;
}
html.light-mode .mobile-nav-toggler svg {
	stroke: #222;
}

/* ─── Hero sections — keep dark in light mode (Spline iframe) ─── */

/* ─── Sections with dark bg ─── */
html.light-mode .services-one,
html.light-mode .gallery-one,
html.light-mode .journal-one,
html.light-mode .testimonial-one,
html.light-mode .counter-one,
html.light-mode .awards-one,
html.light-mode .work-one,
html.light-mode .team-one,
html.light-mode .contact-one {
	background-color: #f5f5fa !important;
}

/* Section with gradient bg → light gradient */
html.light-mode [style*="background: linear-gradient"],
html.light-mode [style*="background:linear-gradient"] {
	background: linear-gradient(180deg, #f0f0f8 0%, #e8e8f0 100%) !important;
}

/* ─── Cards / Blocks ─── */
html.light-mode .service-block_one-inner,
html.light-mode .gallery-block_one-inner,
html.light-mode .testimonial-block_one,
html.light-mode .awards-block_one-inner,
html.light-mode .journal-block_one-inner {
	background: #fff !important;
	border: 1px solid rgba(0,0,0,0.06) !important;
	box-shadow: 0 2px 12px rgba(0,0,0,0.04);
}

/* All section text → black */
html.light-mode .service-block_one-heading,
html.light-mode .service-block_one-heading a,
html.light-mode .service-block_one-title,
html.light-mode .service-block_one-text,
html.light-mode .gallery-block_one-heading,
html.light-mode .gallery-block_one-heading a,
html.light-mode .gallery-block_one-title,
html.light-mode .gallery-block_one-text,
html.light-mode .awards-block_one-title,
html.light-mode .awards-block_one-text,
html.light-mode .testimonial-block_one-name,
html.light-mode .testimonial-block_one-text,
html.light-mode .testimonial-block_one-designation,
html.light-mode .journal-block_one-title,
html.light-mode .journal-block_one-title a,
html.light-mode .journal-block_one-text,
html.light-mode .journal-block_one-date,
html.light-mode .work-block_one-title,
html.light-mode .work-block_one-title a,
html.light-mode .work-block_one-text,
html.light-mode .team-block_one-name,
html.light-mode .team-block_one-designation,
html.light-mode .contact-info_title,
html.light-mode .contact-info_text,
html.light-mode .single-work_title,
html.light-mode .single-work_text,
html.light-mode .single-work_list a {
	color: #222 !important;
}

/* All icons → brand color */
html.light-mode .sec-title_icon img,
html.light-mode .service-block_one-icon img,
html.light-mode .gallery-block_one-icon img,
html.light-mode .awards-block_one-icon img {
	filter: none;
}
/* FA icons in sections → brand color */
html.light-mode .services-one i,
html.light-mode .gallery-one i,
html.light-mode .awards-one i,
html.light-mode .counter-one i,
html.light-mode .testimonial-one i,
html.light-mode .journal-one i,
html.light-mode .work-one i,
html.light-mode .team-one i,
html.light-mode .contact-one i,
html.light-mode .medtech-cap-icon i,
html.light-mode .edtech-cap-icon i {
	color: #7B86FC !important;
}

/* ─── Buttons ─── */
html.light-mode .btn-style-one {
	background: var(--main-color);
	color: #fff !important;
}
html.light-mode .btn-style-two {
	border-color: rgba(0,0,0,0.15);
	color: #222 !important;
}
html.light-mode .btn-style-two:hover {
	background: var(--main-color);
	color: #fff !important;
}

/* ─── Counter / Stats ─── */
html.light-mode .counter-block_one-digit,
html.light-mode .counter-block_one-text {
	color: #222 !important;
}

/* ─── Sec Titles ─── */
html.light-mode .sec-title_heading,
html.light-mode .page-title_heading {
	color: #222 !important;
}
html.light-mode .sec-title_text {
	color: #555 !important;
}

/* ─── Footer — keep dark ─── */
html.light-mode .main-footer {
	--white-color: rgb(255,255,255);
	--white-color-rgb: 255,255,255;
}
html.light-mode .main-footer h2,
html.light-mode .main-footer h3,
html.light-mode .main-footer p,
html.light-mode .main-footer a,
html.light-mode .main-footer li,
html.light-mode .main-footer span {
	color: #fff !important;
}
html.light-mode .main-footer .logo img {
	filter: none !important;
}

/* ─── Page Title Section ─── */
html.light-mode .page-title {
	background: linear-gradient(180deg, #e8e8f0 0%, #f0f0f8 100%) !important;
}

/* ─── Hardcoded dark backgrounds ─── */
html.light-mode [style*="background:#0f0f0f"],
html.light-mode [style*="background: #0f0f0f"],
html.light-mode [style*="background-color:#0f0f0f"],
html.light-mode [style*="background-color: #0f0f0f"] {
	background: #f5f5fa !important;
}
html.light-mode [style*="background:#1a1a2e"],
html.light-mode [style*="background: #1a1a2e"],
html.light-mode [style*="background-color:#1a1a2e"],
html.light-mode [style*="background-color: #1a1a2e"] {
	background: #ededf5 !important;
}

/* ─── Hardcoded white text → dark ─── */
html.light-mode [style*="color:#fff"],
html.light-mode [style*="color: #fff"],
html.light-mode [style*="color:white"],
html.light-mode [style*="color: white"],
html.light-mode [style*="color: rgb(255"] {
	color: #222 !important;
}
/* Exception: keep white text inside footer */
html.light-mode .main-footer [style*="color:#fff"],
html.light-mode .main-footer [style*="color: #fff"],
html.light-mode .main-footer [style*="color:white"] {
	color: #fff !important;
}

/* ─── Border adjustments ─── */
html.light-mode [style*="border"][style*="rgba(255"] {
	border-color: rgba(0,0,0,0.08) !important;
}

/* ─── Cart Dropdown ─── */
html.light-mode .cart-dropdown {
	background: #fff !important;
	border: 1px solid rgba(0,0,0,0.08);
	box-shadow: 0 8px 32px rgba(0,0,0,0.12);
}
html.light-mode .cart-dropdown h4,
html.light-mode .cart-dropdown p,
html.light-mode .cart-dropdown span {
	color: #222 !important;
}

/* ─── Checkout Modal ─── */
html.light-mode .checkout-overlay {
	background: rgba(0,0,0,0.5) !important;
}
html.light-mode .checkout-modal {
	background: #fff !important;
	color: #222;
}

/* ─── Product Pages ─── */
html.light-mode .pdp-title,
html.light-mode .pdp-price,
html.light-mode .pdp-desc {
	color: #222 !important;
}
html.light-mode .spec-table td,
html.light-mode .spec-table th {
	color: #222 !important;
	border-color: rgba(0,0,0,0.08) !important;
}

/* ─── MedTech specific (non-hero) ─── */
html.light-mode .medtech-cap-card,
html.light-mode .medtech-bento-card,
html.light-mode .medtech-solution-card {
	background: #fff !important;
	border-color: rgba(0,0,0,0.06) !important;
}
html.light-mode .medtech-cap-title,
html.light-mode .medtech-cap-desc,
html.light-mode .medtech-cap-header-title,
html.light-mode .medtech-bento-title,
html.light-mode .medtech-bento-desc,
html.light-mode .medtech-bento-header-title,
html.light-mode .medtech-solutions-header h2,
html.light-mode .medtech-solution-name,
html.light-mode .medtech-solution-desc,
html.light-mode .medtech-solution-category,
html.light-mode .medtech-cta h2,
html.light-mode .medtech-cta p {
	color: #222 !important;
}

/* ─── EdTech specific (non-hero) ─── */
html.light-mode .edtech-cap-card,
html.light-mode .edtech-bento-card,
html.light-mode .edtech-solution-card {
	background: #fff !important;
	border-color: rgba(0,0,0,0.06) !important;
}
html.light-mode .edtech-cap-title,
html.light-mode .edtech-cap-desc,
html.light-mode .edtech-cap-header-title,
html.light-mode .edtech-bento-title,
html.light-mode .edtech-bento-desc,
html.light-mode .edtech-bento-header-title,
html.light-mode .edtech-solutions-title,
html.light-mode .edtech-cta-title,
html.light-mode .edtech-cta p,
html.light-mode .edtech-news-title,
html.light-mode .edtech-stats-title {
	color: #222 !important;
}

/* ─── Smooth transition ─── */
html.light-mode body,
html.light-mode .main-header,
html.light-mode .service-block_one-inner,
html.light-mode .gallery-block_one-inner,
html.light-mode .btn-style-one,
html.light-mode .btn-style-two {
	transition: background-color 0.3s ease, color 0.3s ease, border-color 0.3s ease;
}