/**
 * B-ACE CRM — semantic design tokens (light defaults + dark theme).
 * Light mode: values mirror existing UI; components keep hardcoded colors until
 * they adopt var(--mk-*). Dark mode: full token set on html[data-theme="dark"].
 */

/* -------------------------------------------------------------------------- */
/* Light (default) — preserve current appearance                                */
/* -------------------------------------------------------------------------- */
:root {
	--mk-font-family: 'Inter', system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto,
		'Helvetica Neue', Arial, sans-serif;
	--mk-font-display: var(--mk-font-family);

	--mk-bg-primary: #f7f9fb;
	--mk-bg-secondary: #ffffff;
	--mk-bg-elevated: #ffffff;
	--mk-bg-hover: #f8fafc;

	--mk-card-bg: #ffffff;
	--mk-card-hover: #fafbfc;

	--mk-border-color: #e2e8f0;
	--mk-border-subtle: rgba(15, 23, 42, 0.08);

	--mk-text-primary: #0f172a;
	--mk-text-secondary: #64748b;
	--mk-text-muted: #94a3b8;

	--mk-primary: #08a045;
	--mk-primary-hover: #0b6e4f;
	--mk-secondary: #40627e;

	--mk-info: #40627e;
	--mk-success: #22c55e;
	--mk-warning: #08A045;
	--mk-danger: #ef4444;

	--mk-sidebar-bg: #ffffff;
	--mk-sidebar-text: #475569;
	--mk-sidebar-active-bg: #ecfdf3;
	--mk-sidebar-active-border: #08a045;
	--mk-sidebar-active-text: #0b6e4f;
	--mk-sidebar-hover-bg: #f8fafc;
	--mk-sidebar-icon: #475569;
	--mk-sidebar-icon-active: #08a045;

	--mk-topbar-bg: #ffffff;
	--mk-topbar-border: #e2e8f0;
	--mk-topbar-blur: none;

	--mk-input-bg: #ffffff;
	--mk-input-text: #191c1e;
	--mk-input-border: #d4c4ad;
	--mk-input-placeholder: #94a3b8;
	--mk-input-focus-border: #08a045;
	--mk-input-focus-ring: rgba(8, 160, 69, 0.2);

	--mk-btn-primary-bg: #08a045;
	--mk-btn-primary-text: #ffffff;
	--mk-btn-secondary-bg: #ffffff;
	--mk-btn-secondary-text: #40627e;

	--mk-table-bg: #ffffff;
	--mk-table-header-bg: #f2f4f6;
	--mk-table-row-hover: #fafbfc;

	--mk-shadow-card: 0 1px 3px rgba(15, 23, 42, 0.06);
	--mk-radius-card: 16px;

	--mk-chart-primary: #40627e;
	--mk-chart-secondary: #08a045;
	--mk-chart-grid: rgba(15, 23, 42, 0.08);
	--mk-chart-axis: #64748b;

	--mk-transition-theme: background-color 0.22s ease, color 0.22s ease, border-color 0.22s ease, box-shadow 0.22s ease, fill 0.22s ease, stroke 0.22s ease;
}

/* -------------------------------------------------------------------------- */
/* Dark — luxury enterprise (Linear / Attio / Vercel-inspired)                  */
/* -------------------------------------------------------------------------- */
html[data-theme="dark"] {
	color-scheme: dark;

	/* Slightly lifted surfaces — less “pitch black”, more depth */
	--mk-bg-primary: #12151c;
	--mk-bg-secondary: #161b26;
	--mk-bg-elevated: #1c2330;
	--mk-bg-hover: #252d3d;
	--mk-bg-surface: #1a2230;

	--mk-card-bg: #1c2330;
	--mk-card-hover: #252d3d;

	--mk-border-color: rgba(255, 255, 255, 0.1);
	--mk-border-subtle: rgba(255, 255, 255, 0.06);
	--mk-border-accent: rgba(8, 160, 69, 0.35);

	--mk-text-primary: #f8fafc;
	--mk-text-secondary: #cbd5e1;
	--mk-text-muted: #94a3b8;
	--mk-text-link: #5ee9ff;
	--mk-text-link-hover: #a5f3fc;

	--mk-primary: #08a045;
	--mk-primary-hover: #6bbf59;
	--mk-secondary: #334155;

	--mk-info: #16d8ff;
	--mk-success: #22c55e;
	--mk-warning: #08A045;
	--mk-danger: #ef4444;

	--mk-sidebar-bg: #111827;
	--mk-sidebar-text: #cbd5e1;
	--mk-sidebar-active-bg: rgba(8, 160, 69, 0.14);
	--mk-sidebar-active-border: #08a045;
	--mk-sidebar-active-text: #6bbf59;
	--mk-sidebar-hover-bg: #1e2430;
	--mk-sidebar-icon: #94a3b8;
	--mk-sidebar-icon-active: #6bbf59;

	--mk-topbar-bg: rgba(23, 27, 36, 0.85);
	--mk-topbar-border: rgba(255, 255, 255, 0.05);
	--mk-topbar-blur: blur(12px);

	--mk-input-bg: #1e2430;
	--mk-input-text: #f8fafc;
	--mk-input-border: rgba(255, 255, 255, 0.08);
	--mk-input-placeholder: #64748b;
	--mk-input-focus-border: #08a045;
	--mk-input-focus-ring: rgba(8, 160, 69, 0.12);

	--mk-btn-primary-bg: #08a045;
	--mk-btn-primary-text: #ffffff;
	--mk-btn-secondary-bg: #1e2430;
	--mk-btn-secondary-text: #f8fafc;

	--mk-table-bg: #171b24;
	--mk-table-header-bg: #1e2430;
	--mk-table-row-hover: rgba(8, 160, 69, 0.06);

	--mk-shadow-card: 0 4px 20px rgba(0, 0, 0, 0.35);

	--mk-chart-primary: #08a045;
	--mk-chart-secondary: #16d8ff;
	--mk-chart-grid: rgba(255, 255, 255, 0.06);
	--mk-chart-axis: #94a3b8;

	--mk-kpi-revenue: #16d8ff;
	--mk-kpi-roi: #22c55e;
	--mk-kpi-inventory: #08a045;
	--mk-kpi-costs: #08A045;

	/* Remap DashBoard.css design tokens (widgets auto-theme) */
	--mk-bg: #12151c;
	--mk-card: #1c2330;
	--mk-card-border: rgba(255, 255, 255, 0.1);
	--mk-text: #f8fafc;
	--mk-muted: #94a3b8;
	--mk-primary: #5ee9ff;
	--mk-amber: #08a045;
	--mk-amber-border: rgba(8, 160, 69, 0.45);
	--mk-shadow-sm: 0 1px 2px rgba(0, 0, 0, 0.35);
	--mk-shadow-md: 0 4px 20px rgba(0, 0, 0, 0.4);

	/* Main page (MANAGEMENT) */
	--mk-mainpage-bg: #12151c;

	--mk-badge-success-bg: rgba(34, 197, 94, 0.15);
	--mk-badge-success-text: #22c55e;
	--mk-badge-warning-bg: rgba(245, 158, 11, 0.15);
	--mk-badge-warning-text: #08A045;
	--mk-badge-info-bg: rgba(22, 216, 255, 0.15);
	--mk-badge-info-text: #16d8ff;
	--mk-badge-danger-bg: rgba(239, 68, 68, 0.15);
	--mk-badge-danger-text: #ef4444;
}

/* Smooth theme switch (class toggled by MkTheme.js) */
html.mk-theme-transition,
html.mk-theme-transition *,
html.mk-theme-transition *::before,
html.mk-theme-transition *::after {
	transition: var(--mk-transition-theme) !important;
}