/* DK-LAN Light Theme (einheitlich) */
body.light-theme {
  --bg-body: #f8fafc;
  --bg-menu: linear-gradient(180deg, #ffffff 0%, #f1f5f9 100%);
  --bg-panel: rgba(255, 255, 255, 0.90);
  --bg-panel-strong: rgba(255, 255, 255, 1);

  --text-primary: #0f172a;
  --text-secondary: #1e293b;
  --text-muted: #475569;

  --border: rgba(0, 0, 0, 0.10);
  --border-strong: rgba(0, 0, 0, 0.14);

  --accent: rgba(37, 99, 235, 0.90);          /* blau */
  --danger: rgba(220, 38, 38, 0.90);
  --success: rgba(5, 150, 105, 0.90);

	/* Buttons */
	--btn-primary: var(--accent);
	--btn-primary-hover: rgba(29, 78, 216, 0.95);

	--btn-danger: rgba(220, 38, 38, 0.95);
	--btn-danger-hover: rgba(185, 28, 28, 0.95);

  --menu-hover: rgba(0, 0, 0, 0.06);
  --menu-active: rgba(37, 99, 235, 0.18);
	
	/* Success Buttons */
  --btn-success: var(--success);
  --btn-success-hover: color-mix(in srgb, var(--success) 80%, black);
}

/* Body */
body.light-theme {
  background: var(--bg-body) !important;
  color: var(--text-primary) !important;
}

/* Menüflächen (Topbar + Sidebar) */
body.light-theme .dkMenuSurface {
  background: var(--bg-menu) !important;
}
body.light-theme #dkSidebar {
  border-right: 1px solid var(--border) !important;
}

/* Typische Panels/Boxen (deine häufig genutzten Tailwind-Flächen) */
body.light-theme .bg-white\/10,
body.light-theme .bg-gray-800\/30,
body.light-theme .bg-gray-800\/40,
body.light-theme .bg-gray-800\/50,
body.light-theme .bg-gray-900\/60,
body.light-theme .bg-gray-900\/95 {
  background: var(--bg-panel) !important;
  border-color: var(--border) !important;
}

/* Textfarben (damit Light nicht “weiß auf weiß” wird) */
body.light-theme .text-white,
body.light-theme .text-gray-200,
body.light-theme .text-gray-300,
body.light-theme .text-white\/70,
body.light-theme .text-white\/80 {
  color: var(--text-primary) !important;
}
body.light-theme .text-white\/60 {
  color: var(--text-muted) !important;
}

/* Inputs */
body.light-theme input,
body.light-theme select,
body.light-theme textarea {
  background: rgba(255, 255, 255, 0.75) !important;
  color: var(--text-primary) !important;
  border-color: var(--border) !important;
}
body.light-theme input:focus,
body.light-theme select:focus,
body.light-theme textarea:focus {
  outline: none !important;
  box-shadow: 0 0 0 3px rgba(37, 99, 235, 0.20) !important;
}

/* Menü: Hover/Active */
body.light-theme .hover\:bg-\[var\(--menu-hover\)\]:hover {
  background: var(--menu-hover) !important;
}
body.light-theme .bg-\[var\(--menu-active\)\] {
  background: var(--menu-active) !important;
}