/* Revert to original light-mode override strategy (stable) + minimal fixes */
:root {
  color-scheme: light dark;
}

body {
  transition: background-color 0.2s ease, color 0.2s ease;
}

body[data-theme-resolved="light"] {
  background-color: #f8fafc;
  color: #0f172a;
}

body[data-theme-resolved="light"] .bg-gray-900 {
  background-color: #f8fafc !important;
  color: inherit !important;
}

body[data-theme-resolved="light"] .bg-gray-800 {
  background-color: #ffffff !important;
  color: #0f172a !important;
  border-color: #e2e8f0 !important;
}

body[data-theme-resolved="light"] .bg-gray-700 {
  background-color: #e2e8f0 !important;
  color: #0f172a !important;
}

body[data-theme-resolved="light"] .bg-gray-900\/80 {
  background-color: rgba(15, 23, 42, 0.08) !important;
}

body[data-theme-resolved="light"] .bg-gray-800\/90 {
  background-color: rgba(255, 255, 255, 0.92) !important;
  color: #0f172a !important;
  border-color: #e2e8f0 !important;
}

body[data-theme-resolved="light"] header.bg-gray-900\/80 {
  background-color: rgba(255, 255, 255, 0.92) !important;
  color: #0f172a !important;
  border-color: #e2e8f0 !important;
  box-shadow: 0 18px 40px rgba(15, 23, 42, 0.08) !important;
}

body[data-theme-resolved="light"] .text-gray-100,
body[data-theme-resolved="light"] .text-gray-200 {
  color: #0f172a !important;
}

body[data-theme-resolved="light"] .text-red-400 {
  color: #b91c1c !important;
}

body[data-theme-resolved="light"] .text-red-500 {
  color: #dc2626 !important;
}

body[data-theme-resolved="light"] .text-blue-400 {
  color: #2563eb !important;
}

body[data-theme-resolved="light"] .hover\:text-blue-400:hover {
  color: #1d4ed8 !important;
}

body[data-theme-resolved="light"] .text-gray-300 {
  color: #334155 !important;
}

body[data-theme-resolved="light"] .text-gray-400 {
  color: #475569 !important;
}

body[data-theme-resolved="light"] .text-gray-500 {
  color: #64748b !important;
}

body[data-theme-resolved="light"] .border-gray-700 {
  border-color: #cbd5f5 !important;
}

body[data-theme-resolved="light"] .border-gray-800 {
  border-color: #d6deeb !important;
}

body[data-theme-resolved="light"] .divide-gray-700 > :not([hidden]) ~ :not([hidden]) {
  border-color: #e2e8f0 !important;
}

body[data-theme-resolved="light"] .bg-gray-800.shadow,
body[data-theme-resolved="light"] .bg-gray-900.shadow {
  box-shadow: 0 20px 45px rgba(15, 23, 42, 0.08) !important;
}

body[data-theme-resolved="light"] .hover\:bg-gray-700:hover {
  background-color: #cbd5f5 !important;
}

body[data-theme-resolved="light"] .hover\:bg-gray-800:hover {
  background-color: #f1f5f9 !important;
}

body[data-theme-resolved="light"] input.bg-gray-900,
body[data-theme-resolved="light"] textarea.bg-gray-900,
body[data-theme-resolved="light"] select.bg-gray-900 {
  background-color: #f8fafc !important;
  border-color: #cbd5f5 !important;
  color: #0f172a !important;
}

body[data-theme-resolved="light"] input.bg-gray-700,
body[data-theme-resolved="light"] textarea.bg-gray-700,
body[data-theme-resolved="light"] select.bg-gray-700 {
  background-color: #ffffff !important;
  border-color: #cbd5f5 !important;
  color: #0f172a !important;
}

body[data-theme-resolved="light"] table thead.bg-gray-700,
body[data-theme-resolved="light"] table thead.bg-gray-800 {
  background-color: #e2e8f0 !important;
  color: #0f172a !important;
}

body[data-theme-resolved="light"] table tbody.divide-gray-700 tr {
  border-color: #e2e8f0 !important;
}

/* Verbesserte Tabellen-Zeilen Hover im Light Mode */
body[data-theme-resolved="light"] table tbody tr:hover {
  background-color: #f1f5f9 !important;
}

body[data-theme-resolved="light"] code {
  color: #0f172a !important;
}

body[data-theme-resolved="light"] .skeleton-box,
body[data-theme-resolved="light"] .skeleton-pill,
body[data-theme-resolved="light"] .skeleton-text {
  background-color: rgba(148, 163, 184, 0.18) !important;
}

body[data-theme-resolved="light"] .skeleton-box::after,
body[data-theme-resolved="light"] .skeleton-pill::after,
body[data-theme-resolved="light"] .skeleton-text::after {
  background: linear-gradient(
    90deg,
    rgba(148, 163, 184, 0) 0%,
    rgba(100, 116, 139, 0.35) 50%,
    rgba(148, 163, 184, 0) 100%
  ) !important;
}

/* Status Badge Kontrast Light Mode */
body[data-theme-resolved="light"] #status-badge,
body[data-theme-resolved="light"] .status-badge {
  background-color: #e2e8f0 !important;
  color: #0f172a !important;
  border: 1px solid #cbd5f5 !important;
}

/* Optionale spezifische Status-Farben (Beispiel wenn data-status vorhanden) */
body[data-theme-resolved="light"] .status-badge[data-status="AKZEPTIERT"] { background-color: #dcfce7 !important; color: #166534 !important; }
body[data-theme-resolved="light"] .status-badge[data-status="ABGELEHNT"] { background-color: #fee2e2 !important; color: #991b1b !important; }
body[data-theme-resolved="light"] .status-badge[data-status="IN ARBEIT"] { background-color: #fef9c3 !important; color: #854d0e !important; }
body[data-theme-resolved="light"] .status-badge[data-status="BEIM AUSBILDER"] { background-color: #e0e7ff !important; color: #3730a3 !important; }

/* --------------------------------------------
   PRELOAD SAFEGUARD (verhindert kurz falschen Paint)
   Falls Body-Dataset noch nicht gesetzt, aber html[data-theme="light"].
--------------------------------------------- */
html[data-theme="light"] body:not([data-theme-resolved]) {
  background-color: #f8fafc;
  color: #0f172a;
}
html[data-theme="light"] body:not([data-theme-resolved]) .bg-gray-900 { background-color: #f8fafc !important; }
html[data-theme="light"] body:not([data-theme-resolved]) .bg-gray-800 { background-color: #ffffff !important; color: #0f172a !important; }
html[data-theme="light"] body:not([data-theme-resolved]) .bg-gray-900\/80 { background-color: rgba(255,255,255,0.92) !important; color: #0f172a !important; }
html[data-theme="light"] body:not([data-theme-resolved]) header.bg-gray-900\/80 { background-color: rgba(255,255,255,0.92) !important; color: #0f172a !important; border-color: #e2e8f0 !important; }

/* ============================================
   GLOBAL LOADING OVERLAY
   --------------------------------------------- */
#app-loading-overlay {
  position: fixed;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  background: rgba(15, 23, 42, 0.85);
  backdrop-filter: blur(2px);
  z-index: 9999;
  transition: opacity .25s ease;
}
/* Light Mode sofort, auch falls body dataset noch nicht gesetzt ist */
body[data-theme-resolved="light"] #app-loading-overlay,
html[data-theme="light"] #app-loading-overlay { background: rgba(248, 250, 252, 0.85); }
#app-loading-overlay[data-hidden="true"] { opacity: 0; pointer-events: none; }

.loading-spinner {
  width: 54px;
  height: 54px;
  border-radius: 50%;
  border: 5px solid rgba(255,255,255,0.2);
  border-top-color: #3b82f6;
  animation: spin 1s linear infinite;
}
body[data-theme-resolved="light"] .loading-spinner,
html[data-theme="light"] .loading-spinner { border:5px solid rgba(0,0,0,0.12); border-top-color:#2563eb; }

@keyframes spin { to { transform: rotate(360deg); } }