:root {
  --erp-canvas: #f3f5f1;
  --erp-surface: #ffffff;
  --erp-surface-muted: #f7f9f6;
  --erp-border: #d9e0d7;
  --erp-border-strong: #b8c5b5;
  --erp-text: #18231a;
  --erp-muted: #5f6e61;
  --erp-green: #285724;
  --erp-green-dark: #173d20;
  --erp-green-soft: #edf5ea;
  --erp-focus: rgba(54, 113, 44, .2);
  --erp-shadow: 0 1px 2px rgba(21, 44, 21, .05), 0 5px 16px rgba(21, 44, 21, .045);
}

html, body { background: var(--erp-canvas) !important; }

body {
  color: var(--erp-text);
  font-family: Inter, "Segoe UI", Roboto, Helvetica, Arial, sans-serif !important;
  font-feature-settings: "cv02", "cv03", "cv04", "cv11";
}

/* Sachliche Geometrie statt Marketing-Karten. */
.rounded-3xl { border-radius: .625rem !important; }
.rounded-2xl { border-radius: .5rem !important; }
.rounded-xl { border-radius: .375rem !important; }
.rounded-lg { border-radius: .3rem !important; }
.shadow-soft, .shadow-lg, .shadow-xl, .shadow-2xl { box-shadow: var(--erp-shadow) !important; }

.erp-sidebar {
  background: linear-gradient(180deg, #183f20 0%, #12351a 100%) !important;
  border-right: 1px solid rgba(255,255,255,.08);
}

.erp-brand { transition: background-color .15s ease; }
.erp-brand:hover { background: rgba(255,255,255,.06); }

.erp-header {
  box-shadow: 0 1px 0 rgba(28,66,27,.03);
  backdrop-filter: blur(10px);
}

.erp-notice, .erp-alert { box-shadow: 0 1px 2px rgba(15,23,42,.035); }

.erp-content { max-width: 1680px; }
.erp-content h1 { letter-spacing: -.025em; }
.erp-content h2, .erp-content h3 { letter-spacing: -.012em; }
.erp-content h1.text-3xl {
  font-size: 1.75rem !important;
  line-height: 2.1rem !important;
}

/* Alle Steuerelemente zeigen verlässlich Interaktivität. */
a[href], button, summary, label[for], select, input[type="checkbox"], input[type="radio"] {
  cursor: pointer;
}

a[href], button {
  transition: color .14s ease, background-color .14s ease, border-color .14s ease,
              box-shadow .14s ease, opacity .14s ease, transform .14s ease, filter .14s ease !important;
}

button:disabled, input:disabled, select:disabled, textarea:disabled {
  cursor: not-allowed !important;
  opacity: .55;
}

.erp-content a[href][class*="bg-"]:hover,
.erp-content a[href][class*="border"]:hover,
.erp-content button:hover:not(:disabled),
.erp-header a[href]:hover,
.erp-header button:hover:not(:disabled) {
  filter: brightness(.975);
  box-shadow: 0 2px 6px rgba(24,63,32,.1);
}

.erp-content a:hover,
.erp-content button:hover,
.erp-content article:hover,
.erp-header a:hover,
.erp-header button:hover { transform: none !important; }

.erp-content button:active:not(:disabled),
.erp-content a[href][class*="bg-"]:active { transform: translateY(1px) !important; }

/* Farbzustände nur über vollständige Klassen-Tokens ansprechen. Eine Prüfung auf
   "bg-forest" würde auch helle Sekundäraktionen (bg-forest-50) abdunkeln und
   deren dunkelgrüne Beschriftung unlesbar machen. */
.erp-content a[href][class~="bg-forest-700"]:hover,
.erp-content button[class~="bg-forest-700"]:hover:not(:disabled) {
  background-color: #285724 !important;
  color: #fff !important;
}

.erp-content a[href][class~="bg-forest-800"]:hover,
.erp-content button[class~="bg-forest-800"]:hover:not(:disabled) {
  background-color: #1c421b !important;
  color: #fff !important;
}

/* Kontraststabile Hoverzustände für helle Aktionsflächen. */
.erp-content a[href][class~="bg-forest-50"]:hover,
.erp-content button[class~="bg-forest-50"]:hover:not(:disabled) {
  background-color: #e3f0df !important;
  color: #285724 !important;
}

.erp-content a[href][class~="bg-red-50"]:hover,
.erp-content button[class~="bg-red-50"]:hover:not(:disabled) {
  background-color: #fee2e2 !important;
  color: #991b1b !important;
}

.erp-content a[href][class~="bg-amber-50"]:hover,
.erp-content button[class~="bg-amber-50"]:hover:not(:disabled) {
  background-color: #fef3c7 !important;
  color: #92400e !important;
}

.erp-content a[href][class~="bg-slate-50"]:hover,
.erp-content button[class~="bg-slate-50"]:hover:not(:disabled) {
  background-color: #e2e8f0 !important;
  color: #334155 !important;
}

.erp-content a[href]:not([class*="bg-"]):hover { text-decoration-color: currentColor; }
.erp-content a[href].font-bold:not([class*="bg-"]):not([class*="border"]):hover,
.erp-content a[href].font-semibold:not([class*="bg-"]):not([class*="border"]):hover {
  text-decoration: underline;
  text-underline-offset: 3px;
}

/* Einheitliche Formulare der Warenwirtschaft. */
input:not([type="checkbox"]):not([type="radio"]):not([type="file"]),
select,
textarea {
  border-radius: .375rem !important;
  border-color: #cbd5c8 !important;
  box-shadow: inset 0 1px 1px rgba(15,23,42,.025) !important;
}

input:not([type="checkbox"]):not([type="radio"]):not([type="file"]):hover,
select:hover,
textarea:hover { border-color: #91a48e !important; }

input:not([type="checkbox"]):not([type="radio"]):not([type="file"]):focus,
select:focus,
textarea:focus {
  border-color: var(--erp-green) !important;
  box-shadow: 0 0 0 3px var(--erp-focus) !important;
  outline: none !important;
}

input[type="checkbox"], input[type="radio"] { accent-color: var(--erp-green); }

/* Datenraster: kompakt, klar und immer mit Hover-Zeile. */
.erp-content table { border-collapse: separate; border-spacing: 0; }
.erp-content thead { background: #f0f3ef !important; }
.erp-content thead th {
  color: #58665a !important;
  font-size: .69rem !important;
  font-weight: 700 !important;
  letter-spacing: .055em !important;
  white-space: nowrap;
}
.erp-content thead th:last-child:empty::after { content: "Aktion"; }
.erp-content thead th:last-child > .sr-only {
  position: static !important;
  width: auto !important;
  height: auto !important;
  padding: 0 !important;
  margin: 0 !important;
  overflow: visible !important;
  clip: auto !important;
  white-space: nowrap !important;
  border: 0 !important;
}
.erp-content tbody tr { transition: background-color .12s ease, box-shadow .12s ease; }
.erp-content tbody tr:hover { background-color: #f1f7ef !important; }
.erp-content tbody tr:has(a, button):hover { box-shadow: inset 3px 0 0 #6aa84f; }
.erp-content tbody td { border-color: #e7ece5 !important; }
.erp-content tbody a[aria-label],
.erp-content tbody a[title],
.erp-content tbody button[aria-label],
.erp-content tbody button[title] { border: 1px solid transparent; }
.erp-content tbody a[aria-label]:hover,
.erp-content tbody a[title]:hover,
.erp-content tbody button[aria-label]:hover,
.erp-content tbody button[title]:hover {
  border-color: #cbd5c8;
  background-color: #fff;
}

/* Karten und Listen bekommen einen sichtbaren Interaktionszustand. */
.erp-content a.rounded-2xl,
.erp-content a.rounded-xl,
.erp-content article,
.erp-content section { transition: border-color .14s ease, box-shadow .14s ease, background-color .14s ease; }
.erp-content a.rounded-2xl:hover,
.erp-content a.rounded-xl:hover {
  border-color: #9bb695 !important;
  box-shadow: var(--erp-shadow) !important;
}

.erp-content .divide-y > a:hover,
.erp-content .divide-y > div:has(a, button):hover { background: #f5f8f4; }

.erp-header nav a:hover { transform: none !important; background-color: #f7f9f6; }
.erp-header nav a:active { background-color: #edf5ea; }
.erp-shell > main a:hover,
.erp-shell > main button:hover { transform: none !important; }
.erp-shell > main button:hover:not(:disabled) { filter: brightness(.97); box-shadow: 0 2px 6px rgba(24,63,32,.1); }

/* Status-Pills bleiben kompakt; große Rundungen gelten nur für Status. */
.rounded-full { box-shadow: none !important; }

/* Modalflächen wirken wie Arbeitsdialoge, nicht wie schwebende Landingpage-Karten. */
.erp-modal { backdrop-filter: none !important; }
.erp-modal > div > section { border: 1px solid var(--erp-border); }

/* Tastaturbedienung und Bewegung. */
:focus-visible { outline: 2px solid #4f8a38 !important; outline-offset: 2px !important; }
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { scroll-behavior: auto !important; transition-duration: .01ms !important; animation-duration: .01ms !important; }
}
