/* DK-LAN Retro Theme (einheitlich, Gradient-Menü) */
body.retro-theme {
  --bg-body: #2b1d0f;
  --bg-menu: linear-gradient(180deg, #3b2a1a 0%, #2b1d0f 100%);
  --bg-panel: rgba(75, 54, 33, 0.75);
  --bg-panel-strong: rgba(75, 54, 33, 0.90);

  --text-primary: #f5deb3;
  --text-secondary: #e8cfaa;
  --text-muted: rgba(245, 222, 179, 0.70);

  --border: rgba(250, 204, 21, 0.38);
  --border-strong: rgba(250, 204, 21, 0.55);

  --accent: rgba(250, 204, 21, 0.55);         /* gold */
  --danger: rgba(255, 102, 102, 0.90);
  --success: rgba(255, 204, 0, 0.85);

	/* Buttons (Retro) */
	--btn-primary: rgba(250, 204, 21, 0.65);
	--btn-primary-hover: rgba(250, 204, 21, 0.78);

	--btn-danger: #b45309;          /* orange-braun */
	--btn-danger-hover: #92400e;

  --menu-hover: rgba(250, 204, 21, 0.14);
  --menu-active: rgba(250, 204, 21, 0.24);
	
	--btn-success: #16a34a;
	--btn-success-hover: #15803d;

  font-family: "Courier New", monospace !important;
}

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

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

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

/* Inputs */
body.retro-theme input,
body.retro-theme select,
body.retro-theme textarea {
  background: rgba(107, 86, 49, 0.80) !important;
  color: var(--text-primary) !important;
  border: 2px solid var(--border-strong) !important;
}
body.retro-theme input:focus,
body.retro-theme select:focus,
body.retro-theme textarea:focus {
  outline: none !important;
  box-shadow: 0 0 0 3px rgba(250, 204, 21, 0.20) !important;
}

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

/* Retro Flair */
body.retro-theme a:hover,
body.retro-theme button:hover {
  text-shadow: 1px 1px 2px #000;
}