/**
 * Innophant brand colors: blue #1e5f8b + yellow #fecc00 (https://innophant.in/)
 * Load after theme styles.css to override primary and accent for the whole app.
 */
:root,
[data-bs-theme="light"] {
  /* Primary: blue #1e5f8b */
  --bs-primary: #1e5f8b;
  --bs-primary-rgb: 30, 95, 139;
  --bs-primary-text-emphasis: #174d75;
  --bs-primary-bg-subtle: #e0f0f7;
  --bs-primary-border-subtle: #7eb8d4;
  /* Links */
  --bs-link-color: #1e5f8b;
  --bs-link-color-rgb: 30, 95, 139;
  --bs-link-hover-color: #174d75;
  --bs-link-hover-color-rgb: 23, 77, 117;
  /* Accent: yellow #fecc00 (Innophant brand) */
  --bs-warning: #fecc00;
  --bs-warning-rgb: 254, 204, 0;
  --bs-warning-text-emphasis: #b39400;
  --bs-warning-bg-subtle: #fff9e6;
  --bs-warning-border-subtle: #f5d426;
  /* Innophant custom (use for highlights) */
  --innophant-blue: #1e5f8b;
  --innophant-yellow: #fecc00;
}

/* Buttons: use CSS variables so they follow theme */
.btn-primary {
  --bs-btn-color: #fff;
  --bs-btn-bg: var(--bs-primary);
  --bs-btn-border-color: var(--bs-primary);
  --bs-btn-hover-color: #fff;
  --bs-btn-hover-bg: #174d75;
  --bs-btn-hover-border-color: #174d75;
  --bs-btn-focus-shadow-rgb: 30, 95, 139;
  --bs-btn-active-color: #fff;
  --bs-btn-active-bg: #174d75;
  --bs-btn-active-border-color: #174d75;
  --bs-btn-disabled-color: #fff;
  --bs-btn-disabled-bg: var(--bs-primary);
  --bs-btn-disabled-border-color: var(--bs-primary);
}

.btn-outline-primary {
  --bs-btn-color: var(--bs-primary);
  --bs-btn-border-color: var(--bs-primary);
  --bs-btn-hover-color: #fff;
  --bs-btn-hover-bg: var(--bs-primary);
  --bs-btn-hover-border-color: var(--bs-primary);
  --bs-btn-active-color: #fff;
  --bs-btn-active-bg: var(--bs-primary);
  --bs-btn-active-border-color: var(--bs-primary);
}

/* Nav active state */
.nav-link.active.text-primary,
.nav-link.fw-semibold.text-primary {
  color: var(--bs-primary) !important;
}

.text-primary { color: var(--bs-primary) !important; }

/* ============================================
   Breadcrumbs — consistent UI across all pages
   ============================================ */
nav[aria-label="breadcrumb"] {
  margin-top: 0.25rem;
}
nav[aria-label="breadcrumb"] .breadcrumb {
  --bs-breadcrumb-divider: "›";
  --bs-breadcrumb-item-padding-x: 0.5rem;
  --bs-breadcrumb-divider-color: #94a3b8;
  --bs-breadcrumb-item-active-color: #475569;
  padding: 0.5rem 0;
  margin-bottom: 0;
  font-size: 0.875rem;
  background: transparent;
  border-radius: 0;
}
nav[aria-label="breadcrumb"] .breadcrumb-item {
  display: inline-flex;
  align-items: center;
}
nav[aria-label="breadcrumb"] .breadcrumb-item a {
  color: var(--bs-primary);
  text-decoration: none;
  transition: color 0.15s ease;
}
nav[aria-label="breadcrumb"] .breadcrumb-item a:hover {
  color: var(--bs-primary-text-emphasis);
  text-decoration: underline;
}
nav[aria-label="breadcrumb"] .breadcrumb-item.active {
  color: var(--bs-breadcrumb-item-active-color);
  font-weight: 500;
}
nav[aria-label="breadcrumb"] .breadcrumb-item + .breadcrumb-item::before {
  content: var(--bs-breadcrumb-divider);
  color: var(--bs-breadcrumb-divider-color);
  font-weight: 600;
  padding-right: 0.5rem;
  float: none;
}
/* Admin page head: breadcrumb below title */
.app-page-head .breadcrumb {
  opacity: 1;
  font-size: 0.875rem;
}
.app-page-head .breadcrumb-item a {
  color: var(--bs-primary);
}
.app-page-head .breadcrumb-item.active {
  color: #475569;
}
/* Optional: pill-style breadcrumb container (add .breadcrumb-pill to nav for use) */
nav[aria-label="breadcrumb"].breadcrumb-pill .breadcrumb {
  background: var(--bs-primary-bg-subtle);
  padding: 0.4rem 0.85rem;
  border-radius: 9999px;
  display: inline-flex;
  flex-wrap: wrap;
  gap: 0.25rem;
}
nav[aria-label="breadcrumb"].breadcrumb-pill .breadcrumb-item + .breadcrumb-item::before {
  padding-right: 0.4rem;
}
