/* =========================================================
   Global Brand Overrides – RFM/Devodix
   Ziel: Blau -> #5d8d93 (teal/grey)
   Wichtig: Diese Datei MUSS nach allen anderen CSS geladen werden.
   ========================================================= */

/* ---------- Basis-Farbvariablen (falls vorhanden) ---------- */
:root{
  /* App-Seiten (Login/Forgot/Admin) */
  --primary: #5d8d93;
  --primary-700: #4f787d;
  --primary-600: #57868c;
  --primary-500: #5d8d93;
  --primary-100: #e3edee;

  /* Marketing-Page (falls genutzt) */
  --brand: #5d8d93;
  /* Du hast teils einen zweiten Akzent (brand2) – belassen oder anpassen: */
  /* --brand2: #6aa0a6; */
}

/* ---------- Allgemeine Links ---------- */
a, .a {
  color: var(--primary) !important;
}
a:hover, .a:hover {
  text-decoration: underline;
  filter: brightness(1.03);
}

/* ---------- Buttons (globale Klassen im Projekt) ---------- */
.btn,
button.btn {
  border-radius: 999px;
	box-shadow: 0 10px 24px rgba(93,141,147,.28) !important;
}

.btn-primary, button.btn-primary {
  background: linear-gradient(90deg, var(--primary) 0%, var(--primary-700) 100%) !important;
  color: #fff !important;
  border: 0 !important;
  box-shadow: 0 10px 24px rgba(93,141,147,.28) !important;
}
.btn-primary:hover, button.btn-primary:hover {
  filter: brightness(1.05);
}

.btn-secondary, button.btn-secondary {
  background: #fff !important;
  color: var(--primary) !important;
  border: 1px solid rgba(2,6,23,.12) !important; /* neutral */
}
.btn-secondary:hover, button.btn-secondary:hover {
  background: #f5f8f9 !important;
  border-color: #d7e2e4 !important;
}

/* Disabled-Buttons */
button[disabled], .btn[disabled] {
  opacity: .6 !important;
  cursor: not-allowed !important;
}

/* ---------- “Pill”-Inputs / Focus-Ring ---------- */
.pill {
  background: #e8f0fe; /* vorhandener Hintergrund, wenn du ihn neutraler willst: #eef3f4; */
}
.pill:focus-within {
  border-color: var(--primary) !important;
  box-shadow: 0 0 0 6px rgba(93,141,147,.20) !important;
}

/* Normale Inputs (Fallback) */
input:focus, select:focus, textarea:focus {
  outline: none !important;
  border-color: var(--primary) !important;
  box-shadow: 0 0 0 4px rgba(93,141,147,.18) !important;
}

/* ---------- KPI / Badges / kleine Pill-Buttons ---------- */
.badge {
  background: #eef4f5 !important;
  color: var(--primary) !important;
  border: 1px solid #d7e6e8 !important;
}

.pillbtn {
  border: 1px solid #d7e6e8 !important;
  background: #f8fbfb !important;
  color: #223235 !important;
}
.pillbtn:hover {
  background: #eef4f5 !important;
  border-color: #c6dbde !important;
}

/* ---------- Pagination & Filter-Toolbar Active ---------- */
.btn-secondary.active,
a.btn-secondary.active {
  background: var(--primary) !important;
  color: #fff !important;
  border: 1px solid var(--primary) !important;
}

.box .toolbar a.active,
.box .toolbar a.active:visited {
  background: var(--primary) !important;
  color: #fff !important;
  border-color: var(--primary) !important;
}

/* ---------- Tabellen-Header/Sort-Fokus (dezent) ---------- */
table thead th:focus,
table thead th:active {
  outline: none !important;
  box-shadow: inset 0 -2px 0 var(--primary) !important;
}

/* ---------- Alerts: nur Link-/Fokus-Farbe angleichen ---------- */
.alert a {
  color: var(--primary) !important;
}

/* ---------- Lucide-Icons Standardfarbe ---------- */
i[data-lucide] {
  color: inherit;
  /* Falls du sie überall in Brand sehen willst, ent-kommentieren: */
  /* color: var(--primary) !important; */
}
svg.lucide {
  stroke: currentColor;
}

/* ---------- Admin-spezifische Elemente ---------- */
/* Filter-Select Hover/Focus */
select:hover {
  border-color: #cfe0e2 !important;
}
select:focus {
  border-color: var(--primary) !important;
  box-shadow: 0 0 0 4px rgba(93,141,147,.15) !important;
}

/* Tabellen-Action-Zeile rechts */
.actions-right .btn-primary,
.actions-right .btn-secondary {
  margin-left: 6px;
}

/* ---------- Marketing-Landing (Tailwind) – leichte Eingriffe ---------- */
/* Buttons, die die .btn/.btn-primary Klassen nutzen, sind schon überschrieben.
   Für Elemente mit festen Tailwind-Farben, ergänzen wir Utility-Overrides: */

.text-brand { color: var(--brand) !important; }
.bg-brand { background-color: var(--brand) !important; }
.border-brand { border-color: var(--brand) !important; }

/* “Announcement”-Leiste kann neutraler werden */
.bg-gradient-to-r.from-sky-500\/10.via-fuchsia-500\/10.to-sky-500\/10 {
  background: linear-gradient(90deg, rgba(93,141,147,.10) 0%, rgba(93,141,147,.06) 50%, rgba(93,141,147,.10) 100%) !important;
}

/* Kleine Badge oben rechts “Affiliate” (falls du Farbe angleichen willst) */
header .text-[10px].bg-slate-900 {
  background: var(--primary) !important;
}

/* ---------- Login/Forgot: Headline/Brand-Details neutralisieren ---------- */
.subtitle a,
.footer a {
  color: var(--primary) !important;
}

/* ---------- Fokus sichtbar auch bei Tasten ---------- */
button:focus-visible, a:focus-visible {
  outline: 3px solid rgba(93,141,147,.4) !important;
  outline-offset: 2px !important;
}

/* ---------- Optional: Deaktiviere hartes Blau-Rest (Fallback) ---------- */
/* Wenn irgendwo noch #2563eb o.ä. durchrutscht, fange es global ab: */
* {
  --tw-ring-color: rgba(93,141,147,.35); /* Tailwind focus ring fallback */
}
	
	.active{
	
		background:#5d8d93!important;
		border:1px solid #5d8d93!important;
		color:white!important;
		
	}