/**
 * FARBWELT INCON – Reisekostenabrechnung
 * Hauptfarbe: #00234F, Sekundärfarbe: #4A5154, Akzentfarbe: #009EE3
 */

:root {
  --incon-main: #00234F;
  --incon-main-80: #23426E;
  --incon-main-60: #51678f;
  --incon-main-40: #8592b3;
  --incon-main-20: #BFC5D9;
  --incon-secondary: #4A5154;
  --incon-secondary-80: #71787C;
  --incon-secondary-60: #959CA0;
  --incon-secondary-40: #B8BEC2;
  --incon-secondary-20: #DCDFE1;
  --incon-accent: #009EE3;
}

.text-incon-accent {
  color: var(--incon-accent) !important;
}

/* Sidebar: Hauptfarbe */
.incon-sidebar {
  background-color: var(--incon-main) !important;
}

.incon-sidebar .nav-link {
  color: var(--incon-main-20) !important;
}

.incon-sidebar .nav-link:hover {
  color: #fff !important;
  background-color: var(--incon-main-80) !important;
}

.incon-sidebar .nav-link.active {
  background-color: var(--incon-accent) !important;
  color: #fff !important;
}

.incon-sidebar a:not(.nav-link) {
  color: #fff;
}

.incon-sidebar hr {
  border-color: var(--incon-main-80);
  opacity: 1;
}

/* Topbar / Header */
.incon-header {
  background-color: #fff !important;
  border-bottom-color: var(--incon-secondary-20) !important;
}

.incon-header .navbar-brand {
  color: var(--incon-main) !important;
}

/* Info-Box (Dashboard etc.): heller Akzent */
.alert-incon-info {
  background-color: rgba(0, 158, 227, 0.08);
  border-color: var(--incon-accent);
  color: var(--incon-main);
}

.alert-incon-info .alert-heading {
  color: var(--incon-main);
}

/* Buttons Akzentfarbe */
.btn-incon-primary {
  background-color: var(--incon-accent);
  border-color: var(--incon-accent);
  color: #fff;
}

.btn-incon-primary:hover {
  background-color: var(--incon-main);
  border-color: var(--incon-main);
  color: #fff;
}

/* Karten / Content */
.card-incon {
  border-color: var(--incon-secondary-20);
}

.card-incon .card-header,
.card-incon .card-title {
  color: var(--incon-main);
}

.card-incon .card-title {
  font-weight: 600;
}

/* Dashboard-Kacheln: klickbar, Akzent-Linie oben */
.incon-dashboard-tile {
  border: 1px solid var(--incon-secondary-20);
  border-top: 3px solid var(--incon-accent);
  border-radius: 0.5rem;
  transition: box-shadow 0.2s, border-color 0.2s;
  height: 100%;
  text-decoration: none;
  color: inherit;
  display: block;
}

.incon-dashboard-tile:hover {
  box-shadow: 0 0.25rem 0.75rem rgba(0, 35, 79, 0.12);
  border-top-color: var(--incon-main);
  color: inherit;
}

.incon-dashboard-tile .tile-value {
  font-size: 1.75rem;
  font-weight: 700;
  color: var(--incon-main);
}

.incon-dashboard-tile .tile-label {
  font-size: 0.875rem;
  color: var(--incon-secondary-60);
}

/* Footer */
.incon-footer {
  background-color: #fff !important;
  border-top-color: var(--incon-secondary-20) !important;
  color: var(--incon-secondary-60);
}