/* =============================== */
/* Corporate Design: Hauptfarbe    */
/* =============================== */

/* Textfarben */
.text-blue-700, .text-blue-600, .text-blue-500, .text-blue-400, .text-blue-300, .text-blue-200 {
  color: #01a5a9 !important;
}
.text-blue-100 {
  color: #017a7d !important; /* dunkler für Text auf hellem Hintergrund */
}

/* Hintergrundfarben */
.bg-blue-700, .bg-blue-600, .bg-blue-500, .bg-blue-400, .bg-blue-300, .bg-blue-200 {
  background-color: #01a5a9 !important;
}
.bg-blue-100 {
  background-color: #e0f7f8 !important; /* sehr helles Türkis für active/hover */
}

/* Rahmenfarben */
.border-blue-700, .border-blue-600, .border-blue-500, .border-blue-400, .border-blue-300, .border-blue-200, .border-blue-100 {
  border-color: #01a5a9 !important;
}

/* Ringfarben (Fokus) */
.ring-blue-700, .ring-blue-600, .ring-blue-500, .ring-blue-400, .ring-blue-300, .ring-blue-200, .ring-blue-100 {
  --tw-ring-color: #01a5a9 !important;
}
.focus\:ring-blue-500:focus, .focus\:ring-blue-400:focus {
  --tw-ring-color: #01a5a9 !important;
}

/* =============================== */
/* Navigation: Hover/Active States */
/* =============================== */

/* Sidebar: Hover = Active (helles Türkis) */
.hover\:bg-blue-700:hover, .hover\:bg-blue-600:hover,
.hover\:bg-blue-500:hover, .hover\:bg-blue-400:hover, .hover\:bg-blue-300:hover,
.hover\:bg-blue-200:hover, .hover\:bg-blue-100:hover {
  background-color: #017a7d !important;
}
.hover\:bg-blue-500:hover, .hover\:bg-blue-400:hover, .hover\:bg-blue-300:hover, .hover\:bg-blue-200:hover, .hover\:bg-blue-100:hover {
  background-color: #e0f7f8 !important;
}
/* =============================== */
/* Buttons & Interaktive Elemente  */
/* =============================== */
.btn-ci {
  background: #01a5a9;
  color: #fff;
  border: none;
  border-radius: 0.5rem;
  padding: 0.5rem 1.2rem;
  font-weight: 600;
  box-shadow: 0 2px 8px rgba(1,165,169,0.08);
  transition: background 0.2s, box-shadow 0.2s;
}
.btn-ci:hover, .btn-ci:focus {
  background: #017a7d;
  color: #fff;
  box-shadow: 0 4px 16px rgba(1,165,169,0.15);
}

/* =============================== */
/* Links */
/* =============================== */
.a-ci {
  color: #01a5a9;
  text-decoration: none;
  font-weight: 500;
  transition: color 0.2s;
}
.a-ci:hover, .a-ci:focus {
  color: #017a7d;
  text-decoration: underline;
}

/* =============================== */
/* Cards & Panels                  */
/* =============================== */
.card-ci {
  border: 1px solid #e0f7f8;
  border-radius: 1rem;
  box-shadow: 0 2px 8px rgba(1,165,169,0.07);
  background: #fff;
  transition: box-shadow 0.2s;
}
.card-ci:hover {
  box-shadow: 0 6px 24px rgba(1,165,169,0.13);
}

/* =============================== */
/* Fokus-Styles                    */
/* =============================== */
:focus {
  outline-color: #01a5a9;
  outline-width: 2px;
}