/**
 * Bootstrap Theme Overrides
 * Maps Bootstrap component styles to tenant-specific CSS variables
 * This allows dynamic theming without modifying Bootstrap source files
 */

/* ========================================
   BUTTONS
   ======================================== */

/* Primary Button */
.btn-primary,
.btn-primary.disabled,
.btn-primary:disabled {
  background-color: var(--color-primary) !important;
  border-color: var(--color-primary) !important;
  color: var(--color-text-on-primary) !important;
}

.btn-primary:hover,
.btn-primary:focus,
.btn-primary:active,
.btn-primary.active {
  background-color: var(--color-primary-hover) !important;
  border-color: var(--color-primary-hover) !important;
  color: var(--color-text-on-primary) !important;
}

/* Outline Primary Button */
.btn-outline-primary {
  color: var(--color-primary) !important;
  border-color: var(--color-primary) !important;
}

.btn-outline-primary:hover,
.btn-outline-primary:focus,
.btn-outline-primary:active {
  background-color: var(--color-primary) !important;
  border-color: var(--color-primary) !important;
  color: var(--color-text-on-primary) !important;
}

/* Secondary Button */
.btn-secondary {
  background-color: var(--color-secondary) !important;
  border-color: var(--color-secondary) !important;
}

.btn-secondary:hover,
.btn-secondary:focus,
.btn-secondary:active {
  background-color: var(--color-secondary-hover) !important;
  border-color: var(--color-secondary-hover) !important;
}

/* ========================================
   LINKS
   ======================================== */

a {
  color: var(--color-primary);
}

a:hover,
a:focus {
  color: var(--color-primary-hover);
}

/* ========================================
   NAVIGATION
   ======================================== */

/* Navbar */
.navbar-brand {
  color: var(--color-primary) !important;
}

.nav-link.active,
.nav-pills .nav-link.active {
  background-color: var(--color-primary) !important;
  color: var(--color-text-on-primary) !important;
}

.nav-link:hover,
.nav-link:focus {
  color: var(--color-primary-hover) !important;
}

/* ========================================
   FORMS
   ======================================== */

/* Form Controls Focus */
.form-control:focus,
.form-select:focus {
  border-color: var(--color-primary) !important;
  box-shadow: 0 0 0 0.25rem rgba(var(--color-primary-rgb, 0, 102, 204), 0.25) !important;
}

/* Form Check (Checkboxes & Radios) */
.form-check-input:checked {
  background-color: var(--color-primary) !important;
  border-color: var(--color-primary) !important;
}

.form-check-input:focus {
  border-color: var(--color-primary) !important;
  box-shadow: 0 0 0 0.25rem rgba(var(--color-primary-rgb, 0, 102, 204), 0.25) !important;
}

/* ========================================
   BADGES
   ======================================== */

.badge.bg-primary {
  background-color: var(--color-primary) !important;
}

.badge.bg-secondary {
  background-color: var(--color-secondary) !important;
}

/* ========================================
   ALERTS
   ======================================== */

.alert-primary {
  background-color: var(--color-primary-light) !important;
  border-color: var(--color-primary) !important;
  color: var(--color-primary-dark) !important;
}

/* ========================================
   PAGINATION
   ======================================== */

.page-link {
  color: var(--color-primary) !important;
}

.page-link:hover,
.page-link:focus {
  color: var(--color-primary-hover) !important;
  background-color: var(--color-primary-light) !important;
  border-color: var(--color-primary) !important;
}

.page-item.active .page-link {
  background-color: var(--color-primary) !important;
  border-color: var(--color-primary) !important;
  color: var(--color-text-on-primary) !important;
}

/* ========================================
   PROGRESS BARS
   ======================================== */

.progress-bar {
  background-color: var(--color-primary) !important;
}

/* ========================================
   TABLES
   ======================================== */

.table-primary {
  background-color: var(--color-primary-light) !important;
}

/* ========================================
   CARDS
   ======================================== */

.card-header {
  background-color: var(--color-surface) !important;
  border-bottom-color: var(--color-border) !important;
}

/* ========================================
   DROPDOWNS
   ======================================== */

.dropdown-item:hover,
.dropdown-item:focus {
  background-color: var(--color-primary-light) !important;
  color: var(--color-primary-dark) !important;
}

.dropdown-item.active {
  background-color: var(--color-primary) !important;
  color: var(--color-text-on-primary) !important;
}

/* ========================================
   MODALS
   ======================================== */

.modal-header {
  border-bottom-color: var(--color-border) !important;
}

.modal-footer {
  border-top-color: var(--color-border) !important;
}

/* ========================================
   SPINNERS & LOADERS
   ======================================== */

.spinner-border {
  color: var(--color-primary) !important;
}

.spinner-grow {
  color: var(--color-primary) !important;
}

/* ========================================
   SIDEBAR THEME INTEGRATION
   ======================================== */

/* Sidebar Active Menu Items - Using Correct Class Name */
.sidebar-menu li a.active-page,
.sidebar-menu > li > a.active-page {
  background-color: var(--color-primary-light) !important;
  color: var(--color-primary) !important;
  border-left: 3px solid var(--color-primary) !important;
  font-weight: 600;
}

/* Sidebar Menu Item Hover */
.sidebar-menu li a:hover,
.sidebar-menu > li > a:hover {
  background-color: var(--color-primary-light) !important;
  color: var(--color-primary) !important;
}

/* Sidebar Submenu Active Items - Using Correct Class Name */
.sidebar-submenu li a.active-page,
.sidebar-submenu > li > a.active-page {
  background-color: var(--color-primary-light) !important;
  color: var(--color-primary) !important;
  font-weight: 600;
  padding-left: 20px;
}

/* Sidebar Submenu Hover */
.sidebar-submenu li a:hover,
.sidebar-submenu > li > a:hover {
  background-color: var(--color-surface-hover) !important;
  color: var(--color-primary) !important;
}

/* Sidebar Menu Icons - Active State */
.sidebar-menu li a.active-page .icon,
.sidebar-menu li a.active-page .menu-icon {
  color: var(--color-primary) !important;
}

/* Sidebar Menu Text/Title - Active State */
.sidebar-menu li a.active-page span {
  color: var(--color-primary) !important;
  font-weight: 600;
}

/* Sidebar Dropdown Arrow - Active State */
.sidebar-menu li.dropdown.open > a,
.sidebar-menu li.dropdown.show > a {
  background-color: var(--color-primary-light) !important;
  color: var(--color-primary) !important;
}

/* Sidebar Group Title */
.sidebar-menu-group-title {
  color: var(--color-text-secondary) !important;
}

/* Current Page Indicator */
.sidebar-menu li[aria-current='page'] > a,
.sidebar-menu li a[aria-current='page'] {
  background-color: var(--color-primary-light) !important;
  color: var(--color-primary) !important;
  border-left: 3px solid var(--color-primary) !important;
  font-weight: 600;
}

/* Sidebar Background (Optional - uncomment if needed) */
/* 
.sidebar {
    background-color: var(--color-surface) !important;
}
*/

/* Dashboard Cards */
.dashboard-card-primary {
  background: linear-gradient(
    135deg,
    var(--color-primary) 0%,
    var(--color-primary-dark) 100%
  ) !important;
}

/* Icon Backgrounds */
.icon-bg-primary {
  background-color: var(--color-primary-light) !important;
  color: var(--color-primary) !important;
}

/* Status Indicators */
.status-active {
  color: var(--color-success) !important;
}

.status-pending {
  color: var(--color-warning) !important;
}

.status-inactive {
  color: var(--color-error) !important;
}