/**
 * Weegloo-inspired light-first theme layer for CTRL AI.
 * Loaded after site-global.css; dark mode preserved via body.ctrlai-dark-mode.
 */

/* ---- Global page shell ---- */
body.ctrlai-light-mode,
body:not(.ctrlai-dark-mode) {
	background: var(--ctrlai-page-bg, #fafbfc);
	color: var(--ctrlai-text, #0f172a);
}

body.ctrlai-dark-mode {
	background: var(--ctrlai-page-bg, #141c29);
	color: var(--ctrlai-text, #ffffff);
}

/* ---- Dark mode chrome tweaks (header/footer owned by header-footer.css) ---- */
body.ctrlai-dark-mode #ctrlai-site-header.ctrlai-header-bar {
	background: color-mix(in srgb, var(--ctrlai-ds-bg-elevated, #111827) 92%, transparent);
	border-bottom-color: var(--ctrlai-ds-border, rgba(255, 255, 255, 0.08));
}

body.ctrlai-dark-mode .side-menu-panel {
	background: var(--ctrlai-ds-bg-elevated, #111827);
}

body.ctrlai-dark-mode .ctrlai-footer {
	background: var(--ctrlai-ds-bg-elevated, #111827);
}

/* ---- Legacy home hero (saas landing only) ---- */
.ctrlai-home-hero {
	margin-bottom: 36px;
	padding: 12px 0 8px;
}

.ctrlai-home-hero__badge {
	display: inline-block;
	margin: 0 0 14px;
	padding: 6px 14px;
	border-radius: 999px;
	background: rgba(99, 102, 241, 0.08);
	border: 1px solid rgba(99, 102, 241, 0.2);
	font-size: 12px;
	font-weight: 600;
	color: #6366f1;
	letter-spacing: 0.02em;
}

.ctrlai-home-hero__title {
	margin: 0 0 16px;
	font-size: clamp(28px, 4.2vw, 42px);
	line-height: 1.18;
	font-weight: 800;
	letter-spacing: -0.03em;
	color: var(--ctrlai-text, #0f172a);
}

.ctrlai-home-hero__accent {
	background: linear-gradient(135deg, #6366f1 0%, #8b5cf6 100%);
	-webkit-background-clip: text;
	background-clip: text;
	color: transparent;
}

.ctrlai-home-hero__desc {
	margin: 0 0 24px;
	font-size: 16px;
	line-height: 1.7;
	color: var(--ctrlai-text-muted, #64748b);
	max-width: 36em;
}

.ctrlai-home-hero__cta {
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
}

.ctrlai-home-hero__btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	padding: 13px 22px;
	border-radius: 12px;
	font-size: 15px;
	font-weight: 700;
	text-decoration: none !important;
	transition: transform 0.2s ease, box-shadow 0.2s ease, opacity 0.2s ease;
}

.ctrlai-home-hero__btn:hover {
	transform: translateY(-1px);
}

.ctrlai-home-hero__btn--primary {
	background: linear-gradient(135deg, #6366f1 0%, #8b5cf6 100%);
	color: #fff !important;
	box-shadow: 0 8px 24px rgba(99, 102, 241, 0.28);
}

.ctrlai-home-hero__btn--ghost {
	background: #fff;
	color: #334155 !important;
	border: 1px solid var(--ctrlai-border, #e2e8f0);
	box-shadow: 0 1px 2px rgba(15, 23, 42, 0.04);
}

/* ---- Home tool cards (light default) ---- */
body.ctrlai-light-mode .ctrlai-main-home,
body:not(.ctrlai-dark-mode) .ctrlai-main-home {
	color: var(--ctrlai-text, #0f172a);
}

body.ctrlai-light-mode .ctrlai-main-tool-card,
body:not(.ctrlai-dark-mode) .ctrlai-main-tool-card {
	background: #ffffff;
	border: 1px solid #e8ecf2;
	box-shadow: var(--ctrlai-shadow-card);
	padding: 0;
	border-radius: 20px;
	transition: transform 0.2s ease, box-shadow 0.2s ease;
}

body.ctrlai-light-mode .ctrlai-main-tool-card:hover,
body:not(.ctrlai-dark-mode) .ctrlai-main-tool-card:hover {
	transform: translateY(-2px);
	box-shadow: var(--ctrlai-shadow-card-hover);
}

body.ctrlai-light-mode .ctrlai-main-tool-card__inner,
body:not(.ctrlai-dark-mode) .ctrlai-main-tool-card__inner {
	background: #ffffff !important;
	border-radius: 20px;
}

body.ctrlai-light-mode .ctrlai-main-tool-card__title,
body:not(.ctrlai-dark-mode) .ctrlai-main-tool-card__title {
	color: #0f172a;
}

body.ctrlai-light-mode .ctrlai-main-tool-card__desc,
body:not(.ctrlai-dark-mode) .ctrlai-main-tool-card__desc {
	color: #64748b;
}

body.ctrlai-light-mode .ctrlai-main-divider--section,
body:not(.ctrlai-dark-mode) .ctrlai-main-divider--section {
	border-top-color: #e8ecf2;
}

body.ctrlai-light-mode .ctrlai-main-board-col--border,
body:not(.ctrlai-dark-mode) .ctrlai-main-board-col--border {
	border-right-color: #e8ecf2;
}

body.ctrlai-light-mode .ctrlai-main-board-col__title a,
body:not(.ctrlai-dark-mode) .ctrlai-main-board-col__title a {
	color: #0f172a;
}

body.ctrlai-light-mode .ctrlai-main-board-col__title a:hover,
body:not(.ctrlai-dark-mode) .ctrlai-main-board-col__title a:hover {
	color: #6366f1;
}

body.ctrlai-light-mode .ctrlai-main-home #kboard-default-latest .kboard-latest-title a,
body.ctrlai-light-mode .ctrlai-main-home #kboard-default-latest .kboard-latest-title a:visited,
body:not(.ctrlai-dark-mode) .ctrlai-main-home #kboard-default-latest .kboard-latest-title a,
body:not(.ctrlai-dark-mode) .ctrlai-main-home #kboard-default-latest .kboard-latest-title a:visited {
	color: #334155 !important;
}

body.ctrlai-light-mode .ctrlai-main-home #kboard-default-latest .kboard-latest-title a:hover,
body:not(.ctrlai-dark-mode) .ctrlai-main-home #kboard-default-latest .kboard-latest-title a:hover {
	color: #6366f1 !important;
}

body.ctrlai-light-mode .ctrlai-main-home #kboard-default-latest .kboard-comments-count,
body:not(.ctrlai-dark-mode) .ctrlai-main-home #kboard-default-latest .kboard-comments-count {
	color: #6366f1 !important;
}

/* ---- SaaS landing hero (light) ---- */
body.ctrlai-light-mode .ctrlai-saas-landing,
body:not(.ctrlai-dark-mode) .ctrlai-saas-landing {
	color: var(--ctrlai-text, #0f172a);
}

body.ctrlai-light-mode .ctrlai-saas-hero__badge,
body:not(.ctrlai-dark-mode) .ctrlai-saas-hero__badge {
	background: rgba(99, 102, 241, 0.08);
	border-color: rgba(99, 102, 241, 0.2);
	color: #6366f1;
}

body.ctrlai-light-mode .ctrlai-saas-hero__title,
body:not(.ctrlai-dark-mode) .ctrlai-saas-hero__title {
	color: #0f172a;
}

body.ctrlai-light-mode .ctrlai-saas-hero__accent,
body:not(.ctrlai-dark-mode) .ctrlai-saas-hero__accent {
	color: #6366f1;
}

body.ctrlai-light-mode .ctrlai-saas-hero__desc,
body:not(.ctrlai-dark-mode) .ctrlai-saas-hero__desc {
	color: #64748b;
}

body.ctrlai-light-mode .ctrlai-saas-hero__desc strong,
body:not(.ctrlai-dark-mode) .ctrlai-saas-hero__desc strong {
	color: #0f172a;
}

body.ctrlai-light-mode .ctrlai-saas-hero__btn--ghost,
body:not(.ctrlai-dark-mode) .ctrlai-saas-hero__btn--ghost {
	border-color: #e2e8f0;
	color: #334155 !important;
}

/* ---- Tool workspace (light) ---- */
body.ctrlai-light-mode .ctrlai-tool-workspace,
body:not(.ctrlai-dark-mode) .ctrlai-tool-workspace {
	color: var(--ctrlai-text, #0f172a);
}

body.ctrlai-light-mode .ctrlai-tool-panel,
body:not(.ctrlai-dark-mode) .ctrlai-tool-panel {
	background: var(--ctrlai-tool-panel-bg, #ffffff);
	border: 1px solid var(--ctrlai-border, #e2e8f0);
	box-shadow: 0 1px 3px rgba(15, 23, 42, 0.04);
}

body.ctrlai-light-mode .ctrlai-tool-workspace__quota,
body:not(.ctrlai-dark-mode) .ctrlai-tool-workspace__quota {
	background: #f8fafc;
	border-color: #e2e8f0;
}

body.ctrlai-light-mode .ctrlai-tool-field__input,
body.ctrlai-light-mode .ctrlai-tool-field__textarea,
body.ctrlai-light-mode .ctrlai-tool-field__select,
body:not(.ctrlai-dark-mode) .ctrlai-tool-field__input,
body:not(.ctrlai-dark-mode) .ctrlai-tool-field__textarea,
body:not(.ctrlai-dark-mode) .ctrlai-tool-field__select {
	background: var(--ctrlai-tool-input-bg, #f8fafc) !important;
	border-color: var(--ctrlai-border, #e2e8f0) !important;
	color: var(--ctrlai-text, #0f172a) !important;
}

body.ctrlai-light-mode .ctrlai-tool-generate-btn,
body:not(.ctrlai-dark-mode) .ctrlai-tool-generate-btn {
	background: linear-gradient(135deg, #6366f1 0%, #8b5cf6 100%);
	color: #fff;
	box-shadow: 0 4px 14px rgba(99, 102, 241, 0.25);
}

body.ctrlai-light-mode pre[class*="ctrlai-"],
body.ctrlai-light-mode .ctrlai-tool-panel pre,
body:not(.ctrlai-dark-mode) pre[class*="ctrlai-"],
body:not(.ctrlai-dark-mode) .ctrlai-tool-panel pre {
	background: var(--ctrlai-tool-code-bg, #f1f5f9) !important;
	border-color: var(--ctrlai-border, #e2e8f0) !important;
	color: var(--ctrlai-tool-code-text, #0f172a) !important;
}

body.ctrlai-light-mode .ctrlai-iac-optimizer-code,
body.ctrlai-light-mode .ctrlai-autolisp-code,
body.ctrlai-light-mode .ctrlai-dev-utility-code,
body.ctrlai-light-mode .ctrlai-webhook-mapper-code,
body.ctrlai-light-mode .ctrlai-macro-factory-code,
body:not(.ctrlai-dark-mode) .ctrlai-iac-optimizer-code,
body:not(.ctrlai-dark-mode) .ctrlai-autolisp-code,
body:not(.ctrlai-dark-mode) .ctrlai-dev-utility-code,
body:not(.ctrlai-dark-mode) .ctrlai-webhook-mapper-code,
body:not(.ctrlai-dark-mode) .ctrlai-macro-factory-code {
	background: #f1f5f9 !important;
	border-color: #e2e8f0 !important;
	color: #0f172a !important;
}

body.ctrlai-light-mode .ctrlai-mock-interview-vibe,
body:not(.ctrlai-dark-mode) .ctrlai-mock-interview-vibe {
	background: rgba(99, 102, 241, 0.06);
	border-color: rgba(99, 102, 241, 0.2);
	color: #4338ca;
}

body.ctrlai-light-mode .ctrlai-mock-interview-question,
body:not(.ctrlai-dark-mode) .ctrlai-mock-interview-question {
	background: #ffffff;
	border-color: #e8ecf2;
}

body.ctrlai-light-mode .ctrlai-mock-interview-question__text,
body:not(.ctrlai-dark-mode) .ctrlai-mock-interview-question__text {
	color: #0f172a;
}

body.ctrlai-light-mode .ctrlai-entry-output-option,
body:not(.ctrlai-dark-mode) .ctrlai-entry-output-option {
	background: #f8fafc;
	border-color: #e2e8f0;
}

body.ctrlai-light-mode .ctrlai-entry-output-option:has(input:checked),
body:not(.ctrlai-dark-mode) .ctrlai-entry-output-option:has(input:checked) {
	border-color: #6366f1;
	background: rgba(99, 102, 241, 0.06);
}

/* ---- Search results ---- */
body.ctrlai-light-mode .ctrlai-search-results__link,
body:not(.ctrlai-dark-mode) .ctrlai-search-results__link {
	color: #0f172a !important;
}

body.ctrlai-light-mode .ctrlai-search-results__link:hover,
body:not(.ctrlai-dark-mode) .ctrlai-search-results__link:hover {
	color: #6366f1 !important;
}

/* ---- Member pages ---- */
body.ctrlai-light-mode .ctrlai-member-page__title,
body:not(.ctrlai-dark-mode) .ctrlai-member-page__title {
	color: #0f172a;
}

/* ---- KBoard global (light) ---- */
body.ctrlai-light-mode .kboard-default-wrap,
body:not(.ctrlai-dark-mode) .kboard-default-wrap {
	background: transparent;
	color: #334155;
}

body.ctrlai-light-mode #kboard-default-list .kboard-list-title a,
body:not(.ctrlai-dark-mode) #kboard-default-list .kboard-list-title a {
	color: #334155 !important;
}

body.ctrlai-light-mode #kboard-default-list .kboard-list-title a:hover,
body:not(.ctrlai-dark-mode) #kboard-default-list .kboard-list-title a:hover {
	color: #6366f1 !important;
}

body.ctrlai-light-mode .kboard-default-view,
body:not(.ctrlai-dark-mode) .kboard-default-view {
	background: #ffffff;
	border: 1px solid #e2e8f0;
	border-radius: 12px;
}

body.ctrlai-light-mode .kboard-default-view .kboard-title,
body:not(.ctrlai-dark-mode) .kboard-default-view .kboard-title {
	color: #0f172a;
}

body.ctrlai-light-mode .kboard-default-view .kboard-content,
body:not(.ctrlai-dark-mode) .kboard-default-view .kboard-content {
	color: #334155;
}

/* ---- Sidebar dark restore ---- */
body.ctrlai-dark-mode .ctrlai-unified-sidebar {
	border-radius: 12px;
	box-shadow: none;
}

body.ctrlai-light-mode .ctrlai-members-page .um-profile-nav-item a,
body:not(.ctrlai-dark-mode) .ctrlai-members-page .um-profile-nav-item a {
	color: #334155 !important;
}

body.ctrlai-light-mode .ctrlai-members-page .um-profile-nav-item.active a,
body:not(.ctrlai-dark-mode) .ctrlai-members-page .um-profile-nav-item.active a {
	color: #6366f1 !important;
}

body.ctrlai-light-mode .ctrlai-profile-card,
body:not(.ctrlai-dark-mode) .ctrlai-profile-card {
	background: #ffffff;
	border: 1px solid #e2e8f0;
	box-shadow: var(--ctrlai-shadow-card);
}

body.ctrlai-light-mode .ctrlai-scrap-list__item,
body:not(.ctrlai-dark-mode) .ctrlai-scrap-list__item {
	background: #ffffff;
	border-color: #e2e8f0;
}

/* Dark mode: restore neon home tool cards (weegloo light rules don't apply) */
body.ctrlai-dark-mode .ctrlai-main-tool-card {
	background: linear-gradient(135deg, #6366f1 0%, #8b5cf6 48%, #22d3ee 100%);
	border: none;
	box-shadow: 0 10px 30px rgba(99, 102, 241, 0.12);
}

body.ctrlai-dark-mode .ctrlai-main-tool-card__inner {
	background: #1a2433 !important;
}

body.ctrlai-dark-mode .ctrlai-main-tool-card__title {
	color: #fff;
}

body.ctrlai-dark-mode .ctrlai-main-board-col__title a {
	color: #fff;
}

body.ctrlai-dark-mode .ctrlai-home-hero__title {
	color: #fff;
}

body.ctrlai-dark-mode .ctrlai-home-hero__desc {
	color: #8894a8;
}

body.ctrlai-dark-mode .ctrlai-home-hero__btn--ghost {
	background: transparent;
	border-color: #3d4a5d;
	color: #e5e7eb !important;
}