/* ==============================================
   Bootstrap 5 Container width override
   ============================================== */

@media (min-width: 1400px) {
  .container, .container-lg, .container-xl, .container-xxl {
    max-width: 1240px !important;
  }
}

/* ==============================================
   Bootstrap 5 Color Consistency Fixes – Complete
   NO rgb / rgba / color-mix – only HEX + CSS variables
   Define your --bs-* colors in :root
   ============================================== */

/* ========== 1. TEXT, LINK, BACKGROUND, BORDER (all colors) ========== */

/* Primary */
.text-primary { color: var(--bs-primary) !important; }
.link-primary { color: var(--bs-primary) !important; text-decoration-color: var(--bs-primary) !important; }
.link-primary:hover { filter: brightness(0.85); }
.bg-primary { background-color: var(--bs-primary) !important; }
.border-primary { border-color: var(--bs-primary) !important; }

/* Secondary */
.text-secondary { color: var(--bs-secondary) !important; }
.link-secondary { color: var(--bs-secondary) !important; text-decoration-color: var(--bs-secondary) !important; }
.link-secondary:hover { filter: brightness(0.85); }
.bg-secondary { background-color: var(--bs-secondary) !important; }
.border-secondary { border-color: var(--bs-secondary) !important; }

/* Success */
.text-success { color: var(--bs-success) !important; }
.link-success { color: var(--bs-success) !important; text-decoration-color: var(--bs-success) !important; }
.link-success:hover { filter: brightness(0.85); }
.bg-success { background-color: var(--bs-success) !important; }
.border-success { border-color: var(--bs-success) !important; }

/* Danger */
.text-danger { color: var(--bs-danger) !important; }
.link-danger { color: var(--bs-danger) !important; text-decoration-color: var(--bs-danger) !important; }
.link-danger:hover { filter: brightness(0.85); }
.bg-danger { background-color: var(--bs-danger) !important; }
.border-danger { border-color: var(--bs-danger) !important; }

/* Warning */
.text-warning { color: var(--bs-warning) !important; }
.link-warning { color: var(--bs-warning) !important; text-decoration-color: var(--bs-warning) !important; }
.link-warning:hover { filter: brightness(0.85); }
.bg-warning { background-color: var(--bs-warning) !important; }
.border-warning { border-color: var(--bs-warning) !important; }

/* Info */
.text-info { color: var(--bs-info) !important; }
.link-info { color: var(--bs-info) !important; text-decoration-color: var(--bs-info) !important; }
.link-info:hover { filter: brightness(0.85); }
.bg-info { background-color: var(--bs-info) !important; }
.border-info { border-color: var(--bs-info) !important; }

/* Light */
.text-light { color: var(--bs-light) !important; }
.link-light { color: var(--bs-light) !important; text-decoration-color: var(--bs-light) !important; }
.link-light:hover { filter: brightness(0.85); }
.bg-light { background-color: var(--bs-light) !important; }
.border-light { border-color: var(--bs-light) !important; }

/* Dark */
.text-dark { color: var(--bs-dark) !important; }
.link-dark { color: var(--bs-dark) !important; text-decoration-color: var(--bs-dark) !important; }
.link-dark:hover { filter: brightness(1.2); }
.bg-dark { background-color: var(--bs-dark) !important; }
.border-dark { border-color: var(--bs-dark) !important; }

/* ========== 2. BUTTONS (solid and outline for all colors) ========== */

/* Primary */
.btn-primary {
  --bs-btn-bg: var(--bs-primary);
  --bs-btn-border-color: var(--bs-primary);
  --bs-btn-hover-bg: var(--bs-primary);
  --bs-btn-hover-border-color: var(--bs-primary);
  --bs-btn-active-bg: var(--bs-primary);
  --bs-btn-active-border-color: var(--bs-primary);
  --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-bg: var(--bs-primary);
  --bs-btn-hover-border-color: var(--bs-primary);
  --bs-btn-active-bg: var(--bs-primary);
  --bs-btn-active-border-color: var(--bs-primary);
}

/* Secondary */
.btn-secondary {
  --bs-btn-bg: var(--bs-secondary);
  --bs-btn-border-color: var(--bs-secondary);
  --bs-btn-hover-bg: var(--bs-secondary);
  --bs-btn-hover-border-color: var(--bs-secondary);
  --bs-btn-active-bg: var(--bs-secondary);
  --bs-btn-active-border-color: var(--bs-secondary);
  --bs-btn-disabled-bg: var(--bs-secondary);
  --bs-btn-disabled-border-color: var(--bs-secondary);
}
.btn-outline-secondary {
  --bs-btn-color: var(--bs-secondary);
  --bs-btn-border-color: var(--bs-secondary);
  --bs-btn-hover-bg: var(--bs-secondary);
  --bs-btn-hover-border-color: var(--bs-secondary);
  --bs-btn-active-bg: var(--bs-secondary);
  --bs-btn-active-border-color: var(--bs-secondary);
}

/* Success */
.btn-success {
  --bs-btn-bg: var(--bs-success);
  --bs-btn-border-color: var(--bs-success);
  --bs-btn-hover-bg: var(--bs-success);
  --bs-btn-hover-border-color: var(--bs-success);
  --bs-btn-active-bg: var(--bs-success);
  --bs-btn-active-border-color: var(--bs-success);
  --bs-btn-disabled-bg: var(--bs-success);
  --bs-btn-disabled-border-color: var(--bs-success);
}
.btn-outline-success {
  --bs-btn-color: var(--bs-success);
  --bs-btn-border-color: var(--bs-success);
  --bs-btn-hover-bg: var(--bs-success);
  --bs-btn-hover-border-color: var(--bs-success);
  --bs-btn-active-bg: var(--bs-success);
  --bs-btn-active-border-color: var(--bs-success);
}

/* Danger */
.btn-danger {
  --bs-btn-bg: var(--bs-danger);
  --bs-btn-border-color: var(--bs-danger);
  --bs-btn-hover-bg: var(--bs-danger);
  --bs-btn-hover-border-color: var(--bs-danger);
  --bs-btn-active-bg: var(--bs-danger);
  --bs-btn-active-border-color: var(--bs-danger);
  --bs-btn-disabled-bg: var(--bs-danger);
  --bs-btn-disabled-border-color: var(--bs-danger);
}
.btn-outline-danger {
  --bs-btn-color: var(--bs-danger);
  --bs-btn-border-color: var(--bs-danger);
  --bs-btn-hover-bg: var(--bs-danger);
  --bs-btn-hover-border-color: var(--bs-danger);
  --bs-btn-active-bg: var(--bs-danger);
  --bs-btn-active-border-color: var(--bs-danger);
}

/* Warning */
.btn-warning {
  --bs-btn-bg: var(--bs-warning);
  --bs-btn-border-color: var(--bs-warning);
  --bs-btn-hover-bg: var(--bs-warning);
  --bs-btn-hover-border-color: var(--bs-warning);
  --bs-btn-active-bg: var(--bs-warning);
  --bs-btn-active-border-color: var(--bs-warning);
  --bs-btn-disabled-bg: var(--bs-warning);
  --bs-btn-disabled-border-color: var(--bs-warning);
}
.btn-outline-warning {
  --bs-btn-color: var(--bs-warning);
  --bs-btn-border-color: var(--bs-warning);
  --bs-btn-hover-bg: var(--bs-warning);
  --bs-btn-hover-border-color: var(--bs-warning);
  --bs-btn-active-bg: var(--bs-warning);
  --bs-btn-active-border-color: var(--bs-warning);
}

/* Info */
.btn-info {
  --bs-btn-bg: var(--bs-info);
  --bs-btn-border-color: var(--bs-info);
  --bs-btn-hover-bg: var(--bs-info);
  --bs-btn-hover-border-color: var(--bs-info);
  --bs-btn-active-bg: var(--bs-info);
  --bs-btn-active-border-color: var(--bs-info);
  --bs-btn-disabled-bg: var(--bs-info);
  --bs-btn-disabled-border-color: var(--bs-info);
}
.btn-outline-info {
  --bs-btn-color: var(--bs-info);
  --bs-btn-border-color: var(--bs-info);
  --bs-btn-hover-bg: var(--bs-info);
  --bs-btn-hover-border-color: var(--bs-info);
  --bs-btn-active-bg: var(--bs-info);
  --bs-btn-active-border-color: var(--bs-info);
}

/* Light */
.btn-light {
  --bs-btn-bg: var(--bs-light);
  --bs-btn-border-color: var(--bs-light);
  --bs-btn-hover-bg: var(--bs-light);
  --bs-btn-hover-border-color: var(--bs-light);
  --bs-btn-active-bg: var(--bs-light);
  --bs-btn-active-border-color: var(--bs-light);
  --bs-btn-disabled-bg: var(--bs-light);
  --bs-btn-disabled-border-color: var(--bs-light);
}
.btn-outline-light {
  --bs-btn-color: var(--bs-light);
  --bs-btn-border-color: var(--bs-light);
  --bs-btn-hover-bg: var(--bs-light);
  --bs-btn-hover-border-color: var(--bs-light);
  --bs-btn-active-bg: var(--bs-light);
  --bs-btn-active-border-color: var(--bs-light);
}

/* Dark */
.btn-dark {
  --bs-btn-bg: var(--bs-dark);
  --bs-btn-border-color: var(--bs-dark);
  --bs-btn-hover-bg: var(--bs-dark);
  --bs-btn-hover-border-color: var(--bs-dark);
  --bs-btn-active-bg: var(--bs-dark);
  --bs-btn-active-border-color: var(--bs-dark);
  --bs-btn-disabled-bg: var(--bs-dark);
  --bs-btn-disabled-border-color: var(--bs-dark);
}
.btn-outline-dark {
  --bs-btn-color: var(--bs-dark);
  --bs-btn-border-color: var(--bs-dark);
  --bs-btn-hover-bg: var(--bs-dark);
  --bs-btn-hover-border-color: var(--bs-dark);
  --bs-btn-active-bg: var(--bs-dark);
  --bs-btn-active-border-color: var(--bs-dark);
}

/* ========== 3. FOCUS RING (solid outline) ========== */
:focus-visible {
  outline: 2px solid var(--bs-primary);
  outline-offset: 2px;
  box-shadow: none;
}

/* ========== 4. CLOSE BUTTON (no change) ========== */

/* ========== 5. CAROUSEL ========== */
.carousel-control-prev:hover,
.carousel-control-next:hover {
  background-color: var(--bs-primary);
  opacity: 0.2;
}
.carousel-indicators [data-bs-target].active {
  background-color: var(--bs-primary);
}

/* ========== 6. TEXT MUTED ========== */
.text-muted {
  color: var(--bs-secondary) !important;
}

/* ========== 7. PLACEHOLDER ========== */
.placeholder {
  background-color: var(--bs-secondary) !important;
  opacity: 0.3;
}

/* ========== 8. PROGRESS BAR ========== */
.progress-bar {
  background-color: var(--bs-primary);
}

/* ========== 9. FORM VALIDATION & CHECKBOX/RANGE ========== */
.was-validated .form-control:valid,
.form-control.is-valid {
  border-color: var(--bs-success);
}
.was-validated .form-control:invalid,
.form-control.is-invalid {
  border-color: var(--bs-danger);
}
.form-check-input:checked {
  background-color: var(--bs-primary);
  border-color: var(--bs-primary);
}
.form-range::-webkit-slider-thumb,
.form-range::-moz-range-thumb {
  background-color: var(--bs-primary);
}

/* ========== 10. DROPDOWN, NAV-PILLS, PAGINATION, LIST GROUP ========== */
.dropdown-menu .dropdown-item:active {
  background-color: var(--bs-primary);
}
.nav-pills .nav-link.active {
  background-color: var(--bs-primary);
}
.page-item.active .page-link {
  background-color: var(--bs-primary);
  border-color: var(--bs-primary);
}
.list-group-item.active {
  background-color: var(--bs-primary);
  border-color: var(--bs-primary);
}

/* ========== 11. MODAL HEADER BORDER ========== */
.modal-header {
  border-bottom-color: var(--bs-primary);
  border-bottom-width: 2px;
}

/* ========== 12. BREADCRUMB ACTIVE ========== */
.breadcrumb-item.active {
  color: var(--bs-primary);
}

/* ========== 13. LINK HOVER (brightness filter) ========== */
a:not(.btn):hover {
  filter: brightness(0.95);
}
[data-bs-theme="dark"] a:not(.btn):hover {
  filter: brightness(1.1);
}

/* ==============================================
   Bootstrap 5 Complete Extension
   Includes: responsive spacing (1-9), negative margins,
   auto margins, hover backgrounds, font sizes
   ============================================== */

/* -------------------------------------------------
   SPACING VALUES (positive and negative, in rem)
   1: 0.25rem (4px)      -1: -0.25rem
   2: 0.5rem  (8px)      -2: -0.5rem
   3: 1rem    (16px)     -3: -1rem
   4: 1.5rem  (24px)     -4: -1.5rem
   5: 3rem    (48px)     -5: -3rem
   6: 4rem    (64px)     -6: -4rem
   7: 5rem    (80px)     -7: -5rem
   8: 6rem    (96px)     -8: -6rem
   9: 8rem    (128px)    -9: -8rem
   ------------------------------------------------- */

/* -----------------------------------------------
   BASE NON-RESPONSIVE HOVER BACKGROUNDS & TEXTS
   Extended with active + current menu selectors
   ----------------------------------------------- */

/* ----- Hover backgrounds (all colors) ----- */
.hover-bg-primary:hover,
.hover-bg-primary.active,
.current-menu-item > .hover-bg-primary,
.current_page_item > .hover-bg-primary,
.current-menu-parent > .hover-bg-primary,
.current-page-parent > .hover-bg-primary {
  background-color: var(--bs-primary) !important;
}

.hover-bg-secondary:hover,
.hover-bg-secondary.active,
.current-menu-item > .hover-bg-secondary,
.current_page_item > .hover-bg-secondary,
.current-menu-parent > .hover-bg-secondary,
.current-page-parent > .hover-bg-secondary {
  background-color: var(--bs-secondary) !important;
}

.hover-bg-success:hover,
.hover-bg-success.active,
.current-menu-item > .hover-bg-success,
.current_page_item > .hover-bg-success,
.current-menu-parent > .hover-bg-success,
.current-page-parent > .hover-bg-success {
  background-color: var(--bs-success) !important;
}

.hover-bg-danger:hover,
.hover-bg-danger.active,
.current-menu-item > .hover-bg-danger,
.current_page_item > .hover-bg-danger,
.current-menu-parent > .hover-bg-danger,
.current-page-parent > .hover-bg-danger {
  background-color: var(--bs-danger) !important;
}

.hover-bg-warning:hover,
.hover-bg-warning.active,
.current-menu-item > .hover-bg-warning,
.current_page_item > .hover-bg-warning,
.current-menu-parent > .hover-bg-warning,
.current-page-parent > .hover-bg-warning {
  background-color: var(--bs-warning) !important;
}

.hover-bg-info:hover,
.hover-bg-info.active,
.current-menu-item > .hover-bg-info,
.current_page_item > .hover-bg-info,
.current-menu-parent > .hover-bg-info,
.current-page-parent > .hover-bg-info {
  background-color: var(--bs-info) !important;
}

.hover-bg-light:hover,
.hover-bg-light.active,
.current-menu-item > .hover-bg-light,
.current_page_item > .hover-bg-light,
.current-menu-parent > .hover-bg-light,
.current-page-parent > .hover-bg-light {
  background-color: var(--bs-light) !important;
}

.hover-bg-dark:hover,
.hover-bg-dark.active,
.current-menu-item > .hover-bg-dark,
.current_page_item > .hover-bg-dark,
.current-menu-parent > .hover-bg-dark,
.current-page-parent > .hover-bg-dark {
  background-color: var(--bs-dark) !important;
}

.hover-bg-white:hover,
.hover-bg-white.active,
.current-menu-item > .hover-bg-white,
.current_page_item > .hover-bg-white,
.current-menu-parent > .hover-bg-white,
.current-page-parent > .hover-bg-white {
  background-color: var(--bs-white) !important;
}

.hover-bg-black:hover,
.hover-bg-black.active,
.current-menu-item > .hover-bg-black,
.current_page_item > .hover-bg-black,
.current-menu-parent > .hover-bg-black,
.current-page-parent > .hover-bg-black {
  background-color: var(--bs-black) !important;
}

.hover-bg-transparent:hover,
.hover-bg-transparent.active,
.current-menu-item > .hover-bg-transparent,
.current_page_item > .hover-bg-transparent,
.current-menu-parent > .hover-bg-transparent,
.current-page-parent > .hover-bg-transparent {
  background-color: transparent !important;
}

/* ----- Hover texts (all colors, now including white & black) ----- */
.hover-text-primary:hover,
.hover-text-primary.active,
.current-menu-item > .hover-text-primary,
.current_page_item > .hover-text-primary,
.current-menu-parent > .hover-text-primary,
.current-page-parent > .hover-text-primary {
  color: var(--bs-primary) !important;
}

.hover-text-secondary:hover,
.hover-text-secondary.active,
.current-menu-item > .hover-text-secondary,
.current_page_item > .hover-text-secondary,
.current-menu-parent > .hover-text-secondary,
.current-page-parent > .hover-text-secondary {
  color: var(--bs-secondary) !important;
}

.hover-text-success:hover,
.hover-text-success.active,
.current-menu-item > .hover-text-success,
.current_page_item > .hover-text-success,
.current-menu-parent > .hover-text-success,
.current-page-parent > .hover-text-success {
  color: var(--bs-success) !important;
}

.hover-text-danger:hover,
.hover-text-danger.active,
.current-menu-item > .hover-text-danger,
.current_page_item > .hover-text-danger,
.current-menu-parent > .hover-text-danger,
.current-page-parent > .hover-text-danger {
  color: var(--bs-danger) !important;
}

.hover-text-warning:hover,
.hover-text-warning.active,
.current-menu-item > .hover-text-warning,
.current_page_item > .hover-text-warning,
.current-menu-parent > .hover-text-warning,
.current-page-parent > .hover-text-warning {
  color: var(--bs-warning) !important;
}

.hover-text-info:hover,
.hover-text-info.active,
.current-menu-item > .hover-text-info,
.current_page_item > .hover-text-info,
.current-menu-parent > .hover-text-info,
.current-page-parent > .hover-text-info {
  color: var(--bs-info) !important;
}

.hover-text-light:hover,
.hover-text-light.active,
.current-menu-item > .hover-text-light,
.current_page_item > .hover-text-light,
.current-menu-parent > .hover-text-light,
.current-page-parent > .hover-text-light {
  color: var(--bs-light) !important;
}

.hover-text-dark:hover,
.hover-text-dark.active,
.current-menu-item > .hover-text-dark,
.current_page_item > .hover-text-dark,
.current-menu-parent > .hover-text-dark,
.current-page-parent > .hover-text-dark {
  color: var(--bs-dark) !important;
}

.hover-text-white:hover,
.hover-text-white.active,
.current-menu-item > .hover-text-white,
.current_page_item > .hover-text-white,
.current-menu-parent > .hover-text-white,
.current-page-parent > .hover-text-white {
  color: var(--bs-white) !important;
}

.hover-text-black:hover,
.hover-text-black.active,
.current-menu-item > .hover-text-black,
.current_page_item > .hover-text-black,
.current-menu-parent > .hover-text-black,
.current-page-parent > .hover-text-black {
  color: var(--bs-black) !important;
}

/* -----------------------------------------------
   RESPONSIVE HOVER BACKGROUNDS & TEXTS (all breakpoints)
   Same extended selectors, with breakpoint suffix
   ----------------------------------------------- */

/* === SM (≥576px) === */
@media (min-width: 576px) {
  /* Backgrounds */
  .hover-bg-primary-sm:hover,
  .hover-bg-primary-sm.active,
  .current-menu-item > .hover-bg-primary-sm,
  .current_page_item > .hover-bg-primary-sm,
  .current-menu-parent > .hover-bg-primary-sm,
  .current-page-parent > .hover-bg-primary-sm {
    background-color: var(--bs-primary) !important;
  }
  .hover-bg-secondary-sm:hover,
  .hover-bg-secondary-sm.active,
  .current-menu-item > .hover-bg-secondary-sm,
  .current_page_item > .hover-bg-secondary-sm,
  .current-menu-parent > .hover-bg-secondary-sm,
  .current-page-parent > .hover-bg-secondary-sm {
    background-color: var(--bs-secondary) !important;
  }
  .hover-bg-success-sm:hover,
  .hover-bg-success-sm.active,
  .current-menu-item > .hover-bg-success-sm,
  .current_page_item > .hover-bg-success-sm,
  .current-menu-parent > .hover-bg-success-sm,
  .current-page-parent > .hover-bg-success-sm {
    background-color: var(--bs-success) !important;
  }
  .hover-bg-danger-sm:hover,
  .hover-bg-danger-sm.active,
  .current-menu-item > .hover-bg-danger-sm,
  .current_page_item > .hover-bg-danger-sm,
  .current-menu-parent > .hover-bg-danger-sm,
  .current-page-parent > .hover-bg-danger-sm {
    background-color: var(--bs-danger) !important;
  }
  .hover-bg-warning-sm:hover,
  .hover-bg-warning-sm.active,
  .current-menu-item > .hover-bg-warning-sm,
  .current_page_item > .hover-bg-warning-sm,
  .current-menu-parent > .hover-bg-warning-sm,
  .current-page-parent > .hover-bg-warning-sm {
    background-color: var(--bs-warning) !important;
  }
  .hover-bg-info-sm:hover,
  .hover-bg-info-sm.active,
  .current-menu-item > .hover-bg-info-sm,
  .current_page_item > .hover-bg-info-sm,
  .current-menu-parent > .hover-bg-info-sm,
  .current-page-parent > .hover-bg-info-sm {
    background-color: var(--bs-info) !important;
  }
  .hover-bg-light-sm:hover,
  .hover-bg-light-sm.active,
  .current-menu-item > .hover-bg-light-sm,
  .current_page_item > .hover-bg-light-sm,
  .current-menu-parent > .hover-bg-light-sm,
  .current-page-parent > .hover-bg-light-sm {
    background-color: var(--bs-light) !important;
  }
  .hover-bg-dark-sm:hover,
  .hover-bg-dark-sm.active,
  .current-menu-item > .hover-bg-dark-sm,
  .current_page_item > .hover-bg-dark-sm,
  .current-menu-parent > .hover-bg-dark-sm,
  .current-page-parent > .hover-bg-dark-sm {
    background-color: var(--bs-dark) !important;
  }
  .hover-bg-white-sm:hover,
  .hover-bg-white-sm.active,
  .current-menu-item > .hover-bg-white-sm,
  .current_page_item > .hover-bg-white-sm,
  .current-menu-parent > .hover-bg-white-sm,
  .current-page-parent > .hover-bg-white-sm {
    background-color: var(--bs-white) !important;
  }
  .hover-bg-black-sm:hover,
  .hover-bg-black-sm.active,
  .current-menu-item > .hover-bg-black-sm,
  .current_page_item > .hover-bg-black-sm,
  .current-menu-parent > .hover-bg-black-sm,
  .current-page-parent > .hover-bg-black-sm {
    background-color: var(--bs-black) !important;
  }
  .hover-bg-transparent-sm:hover,
  .hover-bg-transparent-sm.active,
  .current-menu-item > .hover-bg-transparent-sm,
  .current_page_item > .hover-bg-transparent-sm,
  .current-menu-parent > .hover-bg-transparent-sm,
  .current-page-parent > .hover-bg-transparent-sm {
    background-color: transparent !important;
  }

  /* Texts */
  .hover-text-primary-sm:hover,
  .hover-text-primary-sm.active,
  .current-menu-item > .hover-text-primary-sm,
  .current_page_item > .hover-text-primary-sm,
  .current-menu-parent > .hover-text-primary-sm,
  .current-page-parent > .hover-text-primary-sm {
    color: var(--bs-primary) !important;
  }
  .hover-text-secondary-sm:hover,
  .hover-text-secondary-sm.active,
  .current-menu-item > .hover-text-secondary-sm,
  .current_page_item > .hover-text-secondary-sm,
  .current-menu-parent > .hover-text-secondary-sm,
  .current-page-parent > .hover-text-secondary-sm {
    color: var(--bs-secondary) !important;
  }
  .hover-text-success-sm:hover,
  .hover-text-success-sm.active,
  .current-menu-item > .hover-text-success-sm,
  .current_page_item > .hover-text-success-sm,
  .current-menu-parent > .hover-text-success-sm,
  .current-page-parent > .hover-text-success-sm {
    color: var(--bs-success) !important;
  }
  .hover-text-danger-sm:hover,
  .hover-text-danger-sm.active,
  .current-menu-item > .hover-text-danger-sm,
  .current_page_item > .hover-text-danger-sm,
  .current-menu-parent > .hover-text-danger-sm,
  .current-page-parent > .hover-text-danger-sm {
    color: var(--bs-danger) !important;
  }
  .hover-text-warning-sm:hover,
  .hover-text-warning-sm.active,
  .current-menu-item > .hover-text-warning-sm,
  .current_page_item > .hover-text-warning-sm,
  .current-menu-parent > .hover-text-warning-sm,
  .current-page-parent > .hover-text-warning-sm {
    color: var(--bs-warning) !important;
  }
  .hover-text-info-sm:hover,
  .hover-text-info-sm.active,
  .current-menu-item > .hover-text-info-sm,
  .current_page_item > .hover-text-info-sm,
  .current-menu-parent > .hover-text-info-sm,
  .current-page-parent > .hover-text-info-sm {
    color: var(--bs-info) !important;
  }
  .hover-text-light-sm:hover,
  .hover-text-light-sm.active,
  .current-menu-item > .hover-text-light-sm,
  .current_page_item > .hover-text-light-sm,
  .current-menu-parent > .hover-text-light-sm,
  .current-page-parent > .hover-text-light-sm {
    color: var(--bs-light) !important;
  }
  .hover-text-dark-sm:hover,
  .hover-text-dark-sm.active,
  .current-menu-item > .hover-text-dark-sm,
  .current_page_item > .hover-text-dark-sm,
  .current-menu-parent > .hover-text-dark-sm,
  .current-page-parent > .hover-text-dark-sm {
    color: var(--bs-dark) !important;
  }
  .hover-text-white-sm:hover,
  .hover-text-white-sm.active,
  .current-menu-item > .hover-text-white-sm,
  .current_page_item > .hover-text-white-sm,
  .current-menu-parent > .hover-text-white-sm,
  .current-page-parent > .hover-text-white-sm {
    color: var(--bs-white) !important;
  }
  .hover-text-black-sm:hover,
  .hover-text-black-sm.active,
  .current-menu-item > .hover-text-black-sm,
  .current_page_item > .hover-text-black-sm,
  .current-menu-parent > .hover-text-black-sm,
  .current-page-parent > .hover-text-black-sm {
    color: var(--bs-black) !important;
  }
}

/* === MD (≥768px) === */
@media (min-width: 768px) {
  .hover-bg-primary-md:hover,
  .hover-bg-primary-md.active,
  .current-menu-item > .hover-bg-primary-md,
  .current_page_item > .hover-bg-primary-md,
  .current-menu-parent > .hover-bg-primary-md,
  .current-page-parent > .hover-bg-primary-md {
    background-color: var(--bs-primary) !important;
  }
  .hover-bg-secondary-md:hover,
  .hover-bg-secondary-md.active,
  .current-menu-item > .hover-bg-secondary-md,
  .current_page_item > .hover-bg-secondary-md,
  .current-menu-parent > .hover-bg-secondary-md,
  .current-page-parent > .hover-bg-secondary-md {
    background-color: var(--bs-secondary) !important;
  }
  .hover-bg-success-md:hover,
  .hover-bg-success-md.active,
  .current-menu-item > .hover-bg-success-md,
  .current_page_item > .hover-bg-success-md,
  .current-menu-parent > .hover-bg-success-md,
  .current-page-parent > .hover-bg-success-md {
    background-color: var(--bs-success) !important;
  }
  .hover-bg-danger-md:hover,
  .hover-bg-danger-md.active,
  .current-menu-item > .hover-bg-danger-md,
  .current_page_item > .hover-bg-danger-md,
  .current-menu-parent > .hover-bg-danger-md,
  .current-page-parent > .hover-bg-danger-md {
    background-color: var(--bs-danger) !important;
  }
  .hover-bg-warning-md:hover,
  .hover-bg-warning-md.active,
  .current-menu-item > .hover-bg-warning-md,
  .current_page_item > .hover-bg-warning-md,
  .current-menu-parent > .hover-bg-warning-md,
  .current-page-parent > .hover-bg-warning-md {
    background-color: var(--bs-warning) !important;
  }
  .hover-bg-info-md:hover,
  .hover-bg-info-md.active,
  .current-menu-item > .hover-bg-info-md,
  .current_page_item > .hover-bg-info-md,
  .current-menu-parent > .hover-bg-info-md,
  .current-page-parent > .hover-bg-info-md {
    background-color: var(--bs-info) !important;
  }
  .hover-bg-light-md:hover,
  .hover-bg-light-md.active,
  .current-menu-item > .hover-bg-light-md,
  .current_page_item > .hover-bg-light-md,
  .current-menu-parent > .hover-bg-light-md,
  .current-page-parent > .hover-bg-light-md {
    background-color: var(--bs-light) !important;
  }
  .hover-bg-dark-md:hover,
  .hover-bg-dark-md.active,
  .current-menu-item > .hover-bg-dark-md,
  .current_page_item > .hover-bg-dark-md,
  .current-menu-parent > .hover-bg-dark-md,
  .current-page-parent > .hover-bg-dark-md {
    background-color: var(--bs-dark) !important;
  }
  .hover-bg-white-md:hover,
  .hover-bg-white-md.active,
  .current-menu-item > .hover-bg-white-md,
  .current_page_item > .hover-bg-white-md,
  .current-menu-parent > .hover-bg-white-md,
  .current-page-parent > .hover-bg-white-md {
    background-color: var(--bs-white) !important;
  }
  .hover-bg-black-md:hover,
  .hover-bg-black-md.active,
  .current-menu-item > .hover-bg-black-md,
  .current_page_item > .hover-bg-black-md,
  .current-menu-parent > .hover-bg-black-md,
  .current-page-parent > .hover-bg-black-md {
    background-color: var(--bs-black) !important;
  }
  .hover-bg-transparent-md:hover,
  .hover-bg-transparent-md.active,
  .current-menu-item > .hover-bg-transparent-md,
  .current_page_item > .hover-bg-transparent-md,
  .current-menu-parent > .hover-bg-transparent-md,
  .current-page-parent > .hover-bg-transparent-md {
    background-color: transparent !important;
  }

  .hover-text-primary-md:hover,
  .hover-text-primary-md.active,
  .current-menu-item > .hover-text-primary-md,
  .current_page_item > .hover-text-primary-md,
  .current-menu-parent > .hover-text-primary-md,
  .current-page-parent > .hover-text-primary-md {
    color: var(--bs-primary) !important;
  }
  .hover-text-secondary-md:hover,
  .hover-text-secondary-md.active,
  .current-menu-item > .hover-text-secondary-md,
  .current_page_item > .hover-text-secondary-md,
  .current-menu-parent > .hover-text-secondary-md,
  .current-page-parent > .hover-text-secondary-md {
    color: var(--bs-secondary) !important;
  }
  .hover-text-success-md:hover,
  .hover-text-success-md.active,
  .current-menu-item > .hover-text-success-md,
  .current_page_item > .hover-text-success-md,
  .current-menu-parent > .hover-text-success-md,
  .current-page-parent > .hover-text-success-md {
    color: var(--bs-success) !important;
  }
  .hover-text-danger-md:hover,
  .hover-text-danger-md.active,
  .current-menu-item > .hover-text-danger-md,
  .current_page_item > .hover-text-danger-md,
  .current-menu-parent > .hover-text-danger-md,
  .current-page-parent > .hover-text-danger-md {
    color: var(--bs-danger) !important;
  }
  .hover-text-warning-md:hover,
  .hover-text-warning-md.active,
  .current-menu-item > .hover-text-warning-md,
  .current_page_item > .hover-text-warning-md,
  .current-menu-parent > .hover-text-warning-md,
  .current-page-parent > .hover-text-warning-md {
    color: var(--bs-warning) !important;
  }
  .hover-text-info-md:hover,
  .hover-text-info-md.active,
  .current-menu-item > .hover-text-info-md,
  .current_page_item > .hover-text-info-md,
  .current-menu-parent > .hover-text-info-md,
  .current-page-parent > .hover-text-info-md {
    color: var(--bs-info) !important;
  }
  .hover-text-light-md:hover,
  .hover-text-light-md.active,
  .current-menu-item > .hover-text-light-md,
  .current_page_item > .hover-text-light-md,
  .current-menu-parent > .hover-text-light-md,
  .current-page-parent > .hover-text-light-md {
    color: var(--bs-light) !important;
  }
  .hover-text-dark-md:hover,
  .hover-text-dark-md.active,
  .current-menu-item > .hover-text-dark-md,
  .current_page_item > .hover-text-dark-md,
  .current-menu-parent > .hover-text-dark-md,
  .current-page-parent > .hover-text-dark-md {
    color: var(--bs-dark) !important;
  }
  .hover-text-white-md:hover,
  .hover-text-white-md.active,
  .current-menu-item > .hover-text-white-md,
  .current_page_item > .hover-text-white-md,
  .current-menu-parent > .hover-text-white-md,
  .current-page-parent > .hover-text-white-md {
    color: var(--bs-white) !important;
  }
  .hover-text-black-md:hover,
  .hover-text-black-md.active,
  .current-menu-item > .hover-text-black-md,
  .current_page_item > .hover-text-black-md,
  .current-menu-parent > .hover-text-black-md,
  .current-page-parent > .hover-text-black-md {
    color: var(--bs-black) !important;
  }
}

/* === LG (≥992px) === */
@media (min-width: 992px) {
  .hover-bg-primary-lg:hover,
  .hover-bg-primary-lg.active,
  .current-menu-item > .hover-bg-primary-lg,
  .current_page_item > .hover-bg-primary-lg,
  .current-menu-parent > .hover-bg-primary-lg,
  .current-page-parent > .hover-bg-primary-lg {
    background-color: var(--bs-primary) !important;
  }
  .hover-bg-secondary-lg:hover,
  .hover-bg-secondary-lg.active,
  .current-menu-item > .hover-bg-secondary-lg,
  .current_page_item > .hover-bg-secondary-lg,
  .current-menu-parent > .hover-bg-secondary-lg,
  .current-page-parent > .hover-bg-secondary-lg {
    background-color: var(--bs-secondary) !important;
  }
  .hover-bg-success-lg:hover,
  .hover-bg-success-lg.active,
  .current-menu-item > .hover-bg-success-lg,
  .current_page_item > .hover-bg-success-lg,
  .current-menu-parent > .hover-bg-success-lg,
  .current-page-parent > .hover-bg-success-lg {
    background-color: var(--bs-success) !important;
  }
  .hover-bg-danger-lg:hover,
  .hover-bg-danger-lg.active,
  .current-menu-item > .hover-bg-danger-lg,
  .current_page_item > .hover-bg-danger-lg,
  .current-menu-parent > .hover-bg-danger-lg,
  .current-page-parent > .hover-bg-danger-lg {
    background-color: var(--bs-danger) !important;
  }
  .hover-bg-warning-lg:hover,
  .hover-bg-warning-lg.active,
  .current-menu-item > .hover-bg-warning-lg,
  .current_page_item > .hover-bg-warning-lg,
  .current-menu-parent > .hover-bg-warning-lg,
  .current-page-parent > .hover-bg-warning-lg {
    background-color: var(--bs-warning) !important;
  }
  .hover-bg-info-lg:hover,
  .hover-bg-info-lg.active,
  .current-menu-item > .hover-bg-info-lg,
  .current_page_item > .hover-bg-info-lg,
  .current-menu-parent > .hover-bg-info-lg,
  .current-page-parent > .hover-bg-info-lg {
    background-color: var(--bs-info) !important;
  }
  .hover-bg-light-lg:hover,
  .hover-bg-light-lg.active,
  .current-menu-item > .hover-bg-light-lg,
  .current_page_item > .hover-bg-light-lg,
  .current-menu-parent > .hover-bg-light-lg,
  .current-page-parent > .hover-bg-light-lg {
    background-color: var(--bs-light) !important;
  }
  .hover-bg-dark-lg:hover,
  .hover-bg-dark-lg.active,
  .current-menu-item > .hover-bg-dark-lg,
  .current_page_item > .hover-bg-dark-lg,
  .current-menu-parent > .hover-bg-dark-lg,
  .current-page-parent > .hover-bg-dark-lg {
    background-color: var(--bs-dark) !important;
  }
  .hover-bg-white-lg:hover,
  .hover-bg-white-lg.active,
  .current-menu-item > .hover-bg-white-lg,
  .current_page_item > .hover-bg-white-lg,
  .current-menu-parent > .hover-bg-white-lg,
  .current-page-parent > .hover-bg-white-lg {
    background-color: var(--bs-white) !important;
  }
  .hover-bg-black-lg:hover,
  .hover-bg-black-lg.active,
  .current-menu-item > .hover-bg-black-lg,
  .current_page_item > .hover-bg-black-lg,
  .current-menu-parent > .hover-bg-black-lg,
  .current-page-parent > .hover-bg-black-lg {
    background-color: var(--bs-black) !important;
  }
  .hover-bg-transparent-lg:hover,
  .hover-bg-transparent-lg.active,
  .current-menu-item > .hover-bg-transparent-lg,
  .current_page_item > .hover-bg-transparent-lg,
  .current-menu-parent > .hover-bg-transparent-lg,
  .current-page-parent > .hover-bg-transparent-lg {
    background-color: transparent !important;
  }

  .hover-text-primary-lg:hover,
  .hover-text-primary-lg.active,
  .current-menu-item > .hover-text-primary-lg,
  .current_page_item > .hover-text-primary-lg,
  .current-menu-parent > .hover-text-primary-lg,
  .current-page-parent > .hover-text-primary-lg {
    color: var(--bs-primary) !important;
  }
  .hover-text-secondary-lg:hover,
  .hover-text-secondary-lg.active,
  .current-menu-item > .hover-text-secondary-lg,
  .current_page_item > .hover-text-secondary-lg,
  .current-menu-parent > .hover-text-secondary-lg,
  .current-page-parent > .hover-text-secondary-lg {
    color: var(--bs-secondary) !important;
  }
  .hover-text-success-lg:hover,
  .hover-text-success-lg.active,
  .current-menu-item > .hover-text-success-lg,
  .current_page_item > .hover-text-success-lg,
  .current-menu-parent > .hover-text-success-lg,
  .current-page-parent > .hover-text-success-lg {
    color: var(--bs-success) !important;
  }
  .hover-text-danger-lg:hover,
  .hover-text-danger-lg.active,
  .current-menu-item > .hover-text-danger-lg,
  .current_page_item > .hover-text-danger-lg,
  .current-menu-parent > .hover-text-danger-lg,
  .current-page-parent > .hover-text-danger-lg {
    color: var(--bs-danger) !important;
  }
  .hover-text-warning-lg:hover,
  .hover-text-warning-lg.active,
  .current-menu-item > .hover-text-warning-lg,
  .current_page_item > .hover-text-warning-lg,
  .current-menu-parent > .hover-text-warning-lg,
  .current-page-parent > .hover-text-warning-lg {
    color: var(--bs-warning) !important;
  }
  .hover-text-info-lg:hover,
  .hover-text-info-lg.active,
  .current-menu-item > .hover-text-info-lg,
  .current_page_item > .hover-text-info-lg,
  .current-menu-parent > .hover-text-info-lg,
  .current-page-parent > .hover-text-info-lg {
    color: var(--bs-info) !important;
  }
  .hover-text-light-lg:hover,
  .hover-text-light-lg.active,
  .current-menu-item > .hover-text-light-lg,
  .current_page_item > .hover-text-light-lg,
  .current-menu-parent > .hover-text-light-lg,
  .current-page-parent > .hover-text-light-lg {
    color: var(--bs-light) !important;
  }
  .hover-text-dark-lg:hover,
  .hover-text-dark-lg.active,
  .current-menu-item > .hover-text-dark-lg,
  .current_page_item > .hover-text-dark-lg,
  .current-menu-parent > .hover-text-dark-lg,
  .current-page-parent > .hover-text-dark-lg {
    color: var(--bs-dark) !important;
  }
  .hover-text-white-lg:hover,
  .hover-text-white-lg.active,
  .current-menu-item > .hover-text-white-lg,
  .current_page_item > .hover-text-white-lg,
  .current-menu-parent > .hover-text-white-lg,
  .current-page-parent > .hover-text-white-lg {
    color: var(--bs-white) !important;
  }
  .hover-text-black-lg:hover,
  .hover-text-black-lg.active,
  .current-menu-item > .hover-text-black-lg,
  .current_page_item > .hover-text-black-lg,
  .current-menu-parent > .hover-text-black-lg,
  .current-page-parent > .hover-text-black-lg {
    color: var(--bs-black) !important;
  }
}

/* === XL (≥1200px) === */
@media (min-width: 1200px) {
  .hover-bg-primary-xl:hover,
  .hover-bg-primary-xl.active,
  .current-menu-item > .hover-bg-primary-xl,
  .current_page_item > .hover-bg-primary-xl,
  .current-menu-parent > .hover-bg-primary-xl,
  .current-page-parent > .hover-bg-primary-xl {
    background-color: var(--bs-primary) !important;
  }
  .hover-bg-secondary-xl:hover,
  .hover-bg-secondary-xl.active,
  .current-menu-item > .hover-bg-secondary-xl,
  .current_page_item > .hover-bg-secondary-xl,
  .current-menu-parent > .hover-bg-secondary-xl,
  .current-page-parent > .hover-bg-secondary-xl {
    background-color: var(--bs-secondary) !important;
  }
  .hover-bg-success-xl:hover,
  .hover-bg-success-xl.active,
  .current-menu-item > .hover-bg-success-xl,
  .current_page_item > .hover-bg-success-xl,
  .current-menu-parent > .hover-bg-success-xl,
  .current-page-parent > .hover-bg-success-xl {
    background-color: var(--bs-success) !important;
  }
  .hover-bg-danger-xl:hover,
  .hover-bg-danger-xl.active,
  .current-menu-item > .hover-bg-danger-xl,
  .current_page_item > .hover-bg-danger-xl,
  .current-menu-parent > .hover-bg-danger-xl,
  .current-page-parent > .hover-bg-danger-xl {
    background-color: var(--bs-danger) !important;
  }
  .hover-bg-warning-xl:hover,
  .hover-bg-warning-xl.active,
  .current-menu-item > .hover-bg-warning-xl,
  .current_page_item > .hover-bg-warning-xl,
  .current-menu-parent > .hover-bg-warning-xl,
  .current-page-parent > .hover-bg-warning-xl {
    background-color: var(--bs-warning) !important;
  }
  .hover-bg-info-xl:hover,
  .hover-bg-info-xl.active,
  .current-menu-item > .hover-bg-info-xl,
  .current_page_item > .hover-bg-info-xl,
  .current-menu-parent > .hover-bg-info-xl,
  .current-page-parent > .hover-bg-info-xl {
    background-color: var(--bs-info) !important;
  }
  .hover-bg-light-xl:hover,
  .hover-bg-light-xl.active,
  .current-menu-item > .hover-bg-light-xl,
  .current_page_item > .hover-bg-light-xl,
  .current-menu-parent > .hover-bg-light-xl,
  .current-page-parent > .hover-bg-light-xl {
    background-color: var(--bs-light) !important;
  }
  .hover-bg-dark-xl:hover,
  .hover-bg-dark-xl.active,
  .current-menu-item > .hover-bg-dark-xl,
  .current_page_item > .hover-bg-dark-xl,
  .current-menu-parent > .hover-bg-dark-xl,
  .current-page-parent > .hover-bg-dark-xl {
    background-color: var(--bs-dark) !important;
  }
  .hover-bg-white-xl:hover,
  .hover-bg-white-xl.active,
  .current-menu-item > .hover-bg-white-xl,
  .current_page_item > .hover-bg-white-xl,
  .current-menu-parent > .hover-bg-white-xl,
  .current-page-parent > .hover-bg-white-xl {
    background-color: var(--bs-white) !important;
  }
  .hover-bg-black-xl:hover,
  .hover-bg-black-xl.active,
  .current-menu-item > .hover-bg-black-xl,
  .current_page_item > .hover-bg-black-xl,
  .current-menu-parent > .hover-bg-black-xl,
  .current-page-parent > .hover-bg-black-xl {
    background-color: var(--bs-black) !important;
  }
  .hover-bg-transparent-xl:hover,
  .hover-bg-transparent-xl.active,
  .current-menu-item > .hover-bg-transparent-xl,
  .current_page_item > .hover-bg-transparent-xl,
  .current-menu-parent > .hover-bg-transparent-xl,
  .current-page-parent > .hover-bg-transparent-xl {
    background-color: transparent !important;
  }

  .hover-text-primary-xl:hover,
  .hover-text-primary-xl.active,
  .current-menu-item > .hover-text-primary-xl,
  .current_page_item > .hover-text-primary-xl,
  .current-menu-parent > .hover-text-primary-xl,
  .current-page-parent > .hover-text-primary-xl {
    color: var(--bs-primary) !important;
  }
  .hover-text-secondary-xl:hover,
  .hover-text-secondary-xl.active,
  .current-menu-item > .hover-text-secondary-xl,
  .current_page_item > .hover-text-secondary-xl,
  .current-menu-parent > .hover-text-secondary-xl,
  .current-page-parent > .hover-text-secondary-xl {
    color: var(--bs-secondary) !important;
  }
  .hover-text-success-xl:hover,
  .hover-text-success-xl.active,
  .current-menu-item > .hover-text-success-xl,
  .current_page_item > .hover-text-success-xl,
  .current-menu-parent > .hover-text-success-xl,
  .current-page-parent > .hover-text-success-xl {
    color: var(--bs-success) !important;
  }
  .hover-text-danger-xl:hover,
  .hover-text-danger-xl.active,
  .current-menu-item > .hover-text-danger-xl,
  .current_page_item > .hover-text-danger-xl,
  .current-menu-parent > .hover-text-danger-xl,
  .current-page-parent > .hover-text-danger-xl {
    color: var(--bs-danger) !important;
  }
  .hover-text-warning-xl:hover,
  .hover-text-warning-xl.active,
  .current-menu-item > .hover-text-warning-xl,
  .current_page_item > .hover-text-warning-xl,
  .current-menu-parent > .hover-text-warning-xl,
  .current-page-parent > .hover-text-warning-xl {
    color: var(--bs-warning) !important;
  }
  .hover-text-info-xl:hover,
  .hover-text-info-xl.active,
  .current-menu-item > .hover-text-info-xl,
  .current_page_item > .hover-text-info-xl,
  .current-menu-parent > .hover-text-info-xl,
  .current-page-parent > .hover-text-info-xl {
    color: var(--bs-info) !important;
  }
  .hover-text-light-xl:hover,
  .hover-text-light-xl.active,
  .current-menu-item > .hover-text-light-xl,
  .current_page_item > .hover-text-light-xl,
  .current-menu-parent > .hover-text-light-xl,
  .current-page-parent > .hover-text-light-xl {
    color: var(--bs-light) !important;
  }
  .hover-text-dark-xl:hover,
  .hover-text-dark-xl.active,
  .current-menu-item > .hover-text-dark-xl,
  .current_page_item > .hover-text-dark-xl,
  .current-menu-parent > .hover-text-dark-xl,
  .current-page-parent > .hover-text-dark-xl {
    color: var(--bs-dark) !important;
  }
  .hover-text-white-xl:hover,
  .hover-text-white-xl.active,
  .current-menu-item > .hover-text-white-xl,
  .current_page_item > .hover-text-white-xl,
  .current-menu-parent > .hover-text-white-xl,
  .current-page-parent > .hover-text-white-xl {
    color: var(--bs-white) !important;
  }
  .hover-text-black-xl:hover,
  .hover-text-black-xl.active,
  .current-menu-item > .hover-text-black-xl,
  .current_page_item > .hover-text-black-xl,
  .current-menu-parent > .hover-text-black-xl,
  .current-page-parent > .hover-text-black-xl {
    color: var(--bs-black) !important;
  }
}

/* === XXL (≥1400px) === */
@media (min-width: 1400px) {
  .hover-bg-primary-xxl:hover,
  .hover-bg-primary-xxl.active,
  .current-menu-item > .hover-bg-primary-xxl,
  .current_page_item > .hover-bg-primary-xxl,
  .current-menu-parent > .hover-bg-primary-xxl,
  .current-page-parent > .hover-bg-primary-xxl {
    background-color: var(--bs-primary) !important;
  }
  .hover-bg-secondary-xxl:hover,
  .hover-bg-secondary-xxl.active,
  .current-menu-item > .hover-bg-secondary-xxl,
  .current_page_item > .hover-bg-secondary-xxl,
  .current-menu-parent > .hover-bg-secondary-xxl,
  .current-page-parent > .hover-bg-secondary-xxl {
    background-color: var(--bs-secondary) !important;
  }
  .hover-bg-success-xxl:hover,
  .hover-bg-success-xxl.active,
  .current-menu-item > .hover-bg-success-xxl,
  .current_page_item > .hover-bg-success-xxl,
  .current-menu-parent > .hover-bg-success-xxl,
  .current-page-parent > .hover-bg-success-xxl {
    background-color: var(--bs-success) !important;
  }
  .hover-bg-danger-xxl:hover,
  .hover-bg-danger-xxl.active,
  .current-menu-item > .hover-bg-danger-xxl,
  .current_page_item > .hover-bg-danger-xxl,
  .current-menu-parent > .hover-bg-danger-xxl,
  .current-page-parent > .hover-bg-danger-xxl {
    background-color: var(--bs-danger) !important;
  }
  .hover-bg-warning-xxl:hover,
  .hover-bg-warning-xxl.active,
  .current-menu-item > .hover-bg-warning-xxl,
  .current_page_item > .hover-bg-warning-xxl,
  .current-menu-parent > .hover-bg-warning-xxl,
  .current-page-parent > .hover-bg-warning-xxl {
    background-color: var(--bs-warning) !important;
  }
  .hover-bg-info-xxl:hover,
  .hover-bg-info-xxl.active,
  .current-menu-item > .hover-bg-info-xxl,
  .current_page_item > .hover-bg-info-xxl,
  .current-menu-parent > .hover-bg-info-xxl,
  .current-page-parent > .hover-bg-info-xxl {
    background-color: var(--bs-info) !important;
  }
  .hover-bg-light-xxl:hover,
  .hover-bg-light-xxl.active,
  .current-menu-item > .hover-bg-light-xxl,
  .current_page_item > .hover-bg-light-xxl,
  .current-menu-parent > .hover-bg-light-xxl,
  .current-page-parent > .hover-bg-light-xxl {
    background-color: var(--bs-light) !important;
  }
  .hover-bg-dark-xxl:hover,
  .hover-bg-dark-xxl.active,
  .current-menu-item > .hover-bg-dark-xxl,
  .current_page_item > .hover-bg-dark-xxl,
  .current-menu-parent > .hover-bg-dark-xxl,
  .current-page-parent > .hover-bg-dark-xxl {
    background-color: var(--bs-dark) !important;
  }
  .hover-bg-white-xxl:hover,
  .hover-bg-white-xxl.active,
  .current-menu-item > .hover-bg-white-xxl,
  .current_page_item > .hover-bg-white-xxl,
  .current-menu-parent > .hover-bg-white-xxl,
  .current-page-parent > .hover-bg-white-xxl {
    background-color: var(--bs-white) !important;
  }
  .hover-bg-black-xxl:hover,
  .hover-bg-black-xxl.active,
  .current-menu-item > .hover-bg-black-xxl,
  .current_page_item > .hover-bg-black-xxl,
  .current-menu-parent > .hover-bg-black-xxl,
  .current-page-parent > .hover-bg-black-xxl {
    background-color: var(--bs-black) !important;
  }
  .hover-bg-transparent-xxl:hover,
  .hover-bg-transparent-xxl.active,
  .current-menu-item > .hover-bg-transparent-xxl,
  .current_page_item > .hover-bg-transparent-xxl,
  .current-menu-parent > .hover-bg-transparent-xxl,
  .current-page-parent > .hover-bg-transparent-xxl {
    background-color: transparent !important;
  }

  .hover-text-primary-xxl:hover,
  .hover-text-primary-xxl.active,
  .current-menu-item > .hover-text-primary-xxl,
  .current_page_item > .hover-text-primary-xxl,
  .current-menu-parent > .hover-text-primary-xxl,
  .current-page-parent > .hover-text-primary-xxl {
    color: var(--bs-primary) !important;
  }
  .hover-text-secondary-xxl:hover,
  .hover-text-secondary-xxl.active,
  .current-menu-item > .hover-text-secondary-xxl,
  .current_page_item > .hover-text-secondary-xxl,
  .current-menu-parent > .hover-text-secondary-xxl,
  .current-page-parent > .hover-text-secondary-xxl {
    color: var(--bs-secondary) !important;
  }
  .hover-text-success-xxl:hover,
  .hover-text-success-xxl.active,
  .current-menu-item > .hover-text-success-xxl,
  .current_page_item > .hover-text-success-xxl,
  .current-menu-parent > .hover-text-success-xxl,
  .current-page-parent > .hover-text-success-xxl {
    color: var(--bs-success) !important;
  }
  .hover-text-danger-xxl:hover,
  .hover-text-danger-xxl.active,
  .current-menu-item > .hover-text-danger-xxl,
  .current_page_item > .hover-text-danger-xxl,
  .current-menu-parent > .hover-text-danger-xxl,
  .current-page-parent > .hover-text-danger-xxl {
    color: var(--bs-danger) !important;
  }
  .hover-text-warning-xxl:hover,
  .hover-text-warning-xxl.active,
  .current-menu-item > .hover-text-warning-xxl,
  .current_page_item > .hover-text-warning-xxl,
  .current-menu-parent > .hover-text-warning-xxl,
  .current-page-parent > .hover-text-warning-xxl {
    color: var(--bs-warning) !important;
  }
  .hover-text-info-xxl:hover,
  .hover-text-info-xxl.active,
  .current-menu-item > .hover-text-info-xxl,
  .current_page_item > .hover-text-info-xxl,
  .current-menu-parent > .hover-text-info-xxl,
  .current-page-parent > .hover-text-info-xxl {
    color: var(--bs-info) !important;
  }
  .hover-text-light-xxl:hover,
  .hover-text-light-xxl.active,
  .current-menu-item > .hover-text-light-xxl,
  .current_page_item > .hover-text-light-xxl,
  .current-menu-parent > .hover-text-light-xxl,
  .current-page-parent > .hover-text-light-xxl {
    color: var(--bs-light) !important;
  }
  .hover-text-dark-xxl:hover,
  .hover-text-dark-xxl.active,
  .current-menu-item > .hover-text-dark-xxl,
  .current_page_item > .hover-text-dark-xxl,
  .current-menu-parent > .hover-text-dark-xxl,
  .current-page-parent > .hover-text-dark-xxl {
    color: var(--bs-dark) !important;
  }
  .hover-text-white-xxl:hover,
  .hover-text-white-xxl.active,
  .current-menu-item > .hover-text-white-xxl,
  .current_page_item > .hover-text-white-xxl,
  .current-menu-parent > .hover-text-white-xxl,
  .current-page-parent > .hover-text-white-xxl {
    color: var(--bs-white) !important;
  }
  .hover-text-black-xxl:hover,
  .hover-text-black-xxl.active,
  .current-menu-item > .hover-text-black-xxl,
  .current_page_item > .hover-text-black-xxl,
  .current-menu-parent > .hover-text-black-xxl,
  .current-page-parent > .hover-text-black-xxl {
    color: var(--bs-black) !important;
  }
}

/* ==============================================
   Responsive Background & Text Color Utilities
   Usage: .bg-primary-sm, .text-secondary-md, etc.
   ============================================== */

/* ----- Helper: define all colors ----- */
/* This block generates classes for each breakpoint and color.
   We write them explicitly for maximum compatibility. */

/* === SM (≥576px) === */
@media (min-width: 576px) {
  /* Backgrounds */
  .bg-primary-sm { background-color: var(--bs-primary) !important; }
  .bg-secondary-sm { background-color: var(--bs-secondary) !important; }
  .bg-success-sm { background-color: var(--bs-success) !important; }
  .bg-danger-sm { background-color: var(--bs-danger) !important; }
  .bg-warning-sm { background-color: var(--bs-warning) !important; }
  .bg-info-sm { background-color: var(--bs-info) !important; }
  .bg-light-sm { background-color: var(--bs-light) !important; }
  .bg-dark-sm { background-color: var(--bs-dark) !important; }
  .bg-white-sm { background-color: var(--bs-white) !important; }
  .bg-black-sm { background-color: var(--bs-black) !important; }
  /* Texts */
  .text-primary-sm { color: var(--bs-primary) !important; }
  .text-secondary-sm { color: var(--bs-secondary) !important; }
  .text-success-sm { color: var(--bs-success) !important; }
  .text-danger-sm { color: var(--bs-danger) !important; }
  .text-warning-sm { color: var(--bs-warning) !important; }
  .text-info-sm { color: var(--bs-info) !important; }
  .text-light-sm { color: var(--bs-light) !important; }
  .text-dark-sm { color: var(--bs-dark) !important; }
  .text-white-sm { color: var(--bs-white) !important; }
  .text-black-sm { color: var(--bs-black) !important; }
}

/* === MD (≥768px) === */
@media (min-width: 768px) {
  .bg-primary-md { background-color: var(--bs-primary) !important; }
  .bg-secondary-md { background-color: var(--bs-secondary) !important; }
  .bg-success-md { background-color: var(--bs-success) !important; }
  .bg-danger-md { background-color: var(--bs-danger) !important; }
  .bg-warning-md { background-color: var(--bs-warning) !important; }
  .bg-info-md { background-color: var(--bs-info) !important; }
  .bg-light-md { background-color: var(--bs-light) !important; }
  .bg-dark-md { background-color: var(--bs-dark) !important; }
  .bg-white-md { background-color: var(--bs-white) !important; }
  .bg-black-md { background-color: var(--bs-black) !important; }

  .text-primary-md { color: var(--bs-primary) !important; }
  .text-secondary-md { color: var(--bs-secondary) !important; }
  .text-success-md { color: var(--bs-success) !important; }
  .text-danger-md { color: var(--bs-danger) !important; }
  .text-warning-md { color: var(--bs-warning) !important; }
  .text-info-md { color: var(--bs-info) !important; }
  .text-light-md { color: var(--bs-light) !important; }
  .text-dark-md { color: var(--bs-dark) !important; }
  .text-white-md { color: var(--bs-white) !important; }
  .text-black-md { color: var(--bs-black) !important; }
}

/* === LG (≥992px) === */
@media (min-width: 992px) {
  .bg-primary-lg { background-color: var(--bs-primary) !important; }
  .bg-secondary-lg { background-color: var(--bs-secondary) !important; }
  .bg-success-lg { background-color: var(--bs-success) !important; }
  .bg-danger-lg { background-color: var(--bs-danger) !important; }
  .bg-warning-lg { background-color: var(--bs-warning) !important; }
  .bg-info-lg { background-color: var(--bs-info) !important; }
  .bg-light-lg { background-color: var(--bs-light) !important; }
  .bg-dark-lg { background-color: var(--bs-dark) !important; }
  .bg-white-lg { background-color: var(--bs-white) !important; }
  .bg-black-lg { background-color: var(--bs-black) !important; }

  .text-primary-lg { color: var(--bs-primary) !important; }
  .text-secondary-lg { color: var(--bs-secondary) !important; }
  .text-success-lg { color: var(--bs-success) !important; }
  .text-danger-lg { color: var(--bs-danger) !important; }
  .text-warning-lg { color: var(--bs-warning) !important; }
  .text-info-lg { color: var(--bs-info) !important; }
  .text-light-lg { color: var(--bs-light) !important; }
  .text-dark-lg { color: var(--bs-dark) !important; }
  .text-white-lg { color: var(--bs-white) !important; }
  .text-black-lg { color: var(--bs-black) !important; }
}

/* === XL (≥1200px) === */
@media (min-width: 1200px) {
  .bg-primary-xl { background-color: var(--bs-primary) !important; }
  .bg-secondary-xl { background-color: var(--bs-secondary) !important; }
  .bg-success-xl { background-color: var(--bs-success) !important; }
  .bg-danger-xl { background-color: var(--bs-danger) !important; }
  .bg-warning-xl { background-color: var(--bs-warning) !important; }
  .bg-info-xl { background-color: var(--bs-info) !important; }
  .bg-light-xl { background-color: var(--bs-light) !important; }
  .bg-dark-xl { background-color: var(--bs-dark) !important; }
  .bg-white-xl { background-color: var(--bs-white) !important; }
  .bg-black-xl { background-color: var(--bs-black) !important; }

  .text-primary-xl { color: var(--bs-primary) !important; }
  .text-secondary-xl { color: var(--bs-secondary) !important; }
  .text-success-xl { color: var(--bs-success) !important; }
  .text-danger-xl { color: var(--bs-danger) !important; }
  .text-warning-xl { color: var(--bs-warning) !important; }
  .text-info-xl { color: var(--bs-info) !important; }
  .text-light-xl { color: var(--bs-light) !important; }
  .text-dark-xl { color: var(--bs-dark) !important; }
  .text-white-xl { color: var(--bs-white) !important; }
  .text-black-xl { color: var(--bs-black) !important; }
}

/* === XXL (≥1400px) === */
@media (min-width: 1400px) {
  .bg-primary-xxl { background-color: var(--bs-primary) !important; }
  .bg-secondary-xxl { background-color: var(--bs-secondary) !important; }
  .bg-success-xxl { background-color: var(--bs-success) !important; }
  .bg-danger-xxl { background-color: var(--bs-danger) !important; }
  .bg-warning-xxl { background-color: var(--bs-warning) !important; }
  .bg-info-xxl { background-color: var(--bs-info) !important; }
  .bg-light-xxl { background-color: var(--bs-light) !important; }
  .bg-dark-xxl { background-color: var(--bs-dark) !important; }
  .bg-white-xxl { background-color: var(--bs-white) !important; }
  .bg-black-xxl { background-color: var(--bs-black) !important; }

  .text-primary-xxl { color: var(--bs-primary) !important; }
  .text-secondary-xxl { color: var(--bs-secondary) !important; }
  .text-success-xxl { color: var(--bs-success) !important; }
  .text-danger-xxl { color: var(--bs-danger) !important; }
  .text-warning-xxl { color: var(--bs-warning) !important; }
  .text-info-xxl { color: var(--bs-info) !important; }
  .text-light-xxl { color: var(--bs-light) !important; }
  .text-dark-xxl { color: var(--bs-dark) !important; }
  .text-white-xxl { color: var(--bs-white) !important; }
  .text-black-xxl { color: var(--bs-black) !important; }
}

/* ==============================================
   Responsive Font Size & Font Weight Utilities
   Usage: .fs-sm-1, .fw-md-bold, .fs-lg-3, .fw-xl-normal
   ============================================== */

/* -----------------------------------------------
   BASE (non‑responsive) font sizes – if not already defined
   ----------------------------------------------- */
.fs-1 { font-size: 2.5rem !important; }
.fs-2 { font-size: 2rem !important; }
.fs-3 { font-size: 1.75rem !important; }
.fs-4 { font-size: 1.5rem !important; }
.fs-5 { font-size: 1.25rem !important; }
.fs-6 { font-size: 1rem !important; }

/* -----------------------------------------------
   RESPONSIVE FONT SIZES (1–6 for each breakpoint)
   ----------------------------------------------- */

/* SM (≥576px) */
@media (min-width: 576px) {
  .fs-sm-1 { font-size: 2.5rem !important; }
  .fs-sm-2 { font-size: 2rem !important; }
  .fs-sm-3 { font-size: 1.75rem !important; }
  .fs-sm-4 { font-size: 1.5rem !important; }
  .fs-sm-5 { font-size: 1.25rem !important; }
  .fs-sm-6 { font-size: 1rem !important; }
}

/* MD (≥768px) */
@media (min-width: 768px) {
  .fs-md-1 { font-size: 2.5rem !important; }
  .fs-md-2 { font-size: 2rem !important; }
  .fs-md-3 { font-size: 1.75rem !important; }
  .fs-md-4 { font-size: 1.5rem !important; }
  .fs-md-5 { font-size: 1.25rem !important; }
  .fs-md-6 { font-size: 1rem !important; }
}

/* LG (≥992px) */
@media (min-width: 992px) {
  .fs-lg-1 { font-size: 2.5rem !important; }
  .fs-lg-2 { font-size: 2rem !important; }
  .fs-lg-3 { font-size: 1.75rem !important; }
  .fs-lg-4 { font-size: 1.5rem !important; }
  .fs-lg-5 { font-size: 1.25rem !important; }
  .fs-lg-6 { font-size: 1rem !important; }
}

/* XL (≥1200px) */
@media (min-width: 1200px) {
  .fs-xl-1 { font-size: 2.5rem !important; }
  .fs-xl-2 { font-size: 2rem !important; }
  .fs-xl-3 { font-size: 1.75rem !important; }
  .fs-xl-4 { font-size: 1.5rem !important; }
  .fs-xl-5 { font-size: 1.25rem !important; }
  .fs-xl-6 { font-size: 1rem !important; }
}

/* XXL (≥1400px) */
@media (min-width: 1400px) {
  .fs-xxl-1 { font-size: 2.5rem !important; }
  .fs-xxl-2 { font-size: 2rem !important; }
  .fs-xxl-3 { font-size: 1.75rem !important; }
  .fs-xxl-4 { font-size: 1.5rem !important; }
  .fs-xxl-5 { font-size: 1.25rem !important; }
  .fs-xxl-6 { font-size: 1rem !important; }
}

/* -----------------------------------------------
   BASE (non‑responsive) font weights – standard Bootstrap ones
   ----------------------------------------------- */
.fw-lighter { font-weight: lighter !important; }
.fw-light { font-weight: 300 !important; }
.fw-normal { font-weight: 400 !important; }
.fw-medium { font-weight: 500 !important; }
.fw-semibold { font-weight: 600 !important; }
.fw-bold { font-weight: 700 !important; }
.fw-bolder { font-weight: bolder !important; }

/* Numeric weights (if you need them) */
.fw-100 { font-weight: 100 !important; }
.fw-200 { font-weight: 200 !important; }
.fw-300 { font-weight: 300 !important; }
.fw-400 { font-weight: 400 !important; }
.fw-500 { font-weight: 500 !important; }
.fw-600 { font-weight: 600 !important; }
.fw-700 { font-weight: 700 !important; }
.fw-800 { font-weight: 800 !important; }
.fw-900 { font-weight: 900 !important; }

/* -----------------------------------------------
   RESPONSIVE FONT WEIGHTS (all breakpoints)
   Weights: lighter, light, normal, medium, semibold, bold, bolder
   Plus numeric 100-900
   ----------------------------------------------- */

/* SM (≥576px) */
@media (min-width: 576px) {
  .fw-sm-lighter { font-weight: lighter !important; }
  .fw-sm-light { font-weight: 300 !important; }
  .fw-sm-normal { font-weight: 400 !important; }
  .fw-sm-medium { font-weight: 500 !important; }
  .fw-sm-semibold { font-weight: 600 !important; }
  .fw-sm-bold { font-weight: 700 !important; }
  .fw-sm-bolder { font-weight: bolder !important; }
  .fw-sm-100 { font-weight: 100 !important; }
  .fw-sm-200 { font-weight: 200 !important; }
  .fw-sm-300 { font-weight: 300 !important; }
  .fw-sm-400 { font-weight: 400 !important; }
  .fw-sm-500 { font-weight: 500 !important; }
  .fw-sm-600 { font-weight: 600 !important; }
  .fw-sm-700 { font-weight: 700 !important; }
  .fw-sm-800 { font-weight: 800 !important; }
  .fw-sm-900 { font-weight: 900 !important; }
}

/* MD (≥768px) */
@media (min-width: 768px) {
  .fw-md-lighter { font-weight: lighter !important; }
  .fw-md-light { font-weight: 300 !important; }
  .fw-md-normal { font-weight: 400 !important; }
  .fw-md-medium { font-weight: 500 !important; }
  .fw-md-semibold { font-weight: 600 !important; }
  .fw-md-bold { font-weight: 700 !important; }
  .fw-md-bolder { font-weight: bolder !important; }
  .fw-md-100 { font-weight: 100 !important; }
  .fw-md-200 { font-weight: 200 !important; }
  .fw-md-300 { font-weight: 300 !important; }
  .fw-md-400 { font-weight: 400 !important; }
  .fw-md-500 { font-weight: 500 !important; }
  .fw-md-600 { font-weight: 600 !important; }
  .fw-md-700 { font-weight: 700 !important; }
  .fw-md-800 { font-weight: 800 !important; }
  .fw-md-900 { font-weight: 900 !important; }
}

/* LG (≥992px) */
@media (min-width: 992px) {
  .fw-lg-lighter { font-weight: lighter !important; }
  .fw-lg-light { font-weight: 300 !important; }
  .fw-lg-normal { font-weight: 400 !important; }
  .fw-lg-medium { font-weight: 500 !important; }
  .fw-lg-semibold { font-weight: 600 !important; }
  .fw-lg-bold { font-weight: 700 !important; }
  .fw-lg-bolder { font-weight: bolder !important; }
  .fw-lg-100 { font-weight: 100 !important; }
  .fw-lg-200 { font-weight: 200 !important; }
  .fw-lg-300 { font-weight: 300 !important; }
  .fw-lg-400 { font-weight: 400 !important; }
  .fw-lg-500 { font-weight: 500 !important; }
  .fw-lg-600 { font-weight: 600 !important; }
  .fw-lg-700 { font-weight: 700 !important; }
  .fw-lg-800 { font-weight: 800 !important; }
  .fw-lg-900 { font-weight: 900 !important; }
}

/* XL (≥1200px) */
@media (min-width: 1200px) {
  .fw-xl-lighter { font-weight: lighter !important; }
  .fw-xl-light { font-weight: 300 !important; }
  .fw-xl-normal { font-weight: 400 !important; }
  .fw-xl-medium { font-weight: 500 !important; }
  .fw-xl-semibold { font-weight: 600 !important; }
  .fw-xl-bold { font-weight: 700 !important; }
  .fw-xl-bolder { font-weight: bolder !important; }
  .fw-xl-100 { font-weight: 100 !important; }
  .fw-xl-200 { font-weight: 200 !important; }
  .fw-xl-300 { font-weight: 300 !important; }
  .fw-xl-400 { font-weight: 400 !important; }
  .fw-xl-500 { font-weight: 500 !important; }
  .fw-xl-600 { font-weight: 600 !important; }
  .fw-xl-700 { font-weight: 700 !important; }
  .fw-xl-800 { font-weight: 800 !important; }
  .fw-xl-900 { font-weight: 900 !important; }
}

/* XXL (≥1400px) */
@media (min-width: 1400px) {
  .fw-xxl-lighter { font-weight: lighter !important; }
  .fw-xxl-light { font-weight: 300 !important; }
  .fw-xxl-normal { font-weight: 400 !important; }
  .fw-xxl-medium { font-weight: 500 !important; }
  .fw-xxl-semibold { font-weight: 600 !important; }
  .fw-xxl-bold { font-weight: 700 !important; }
  .fw-xxl-bolder { font-weight: bolder !important; }
  .fw-xxl-100 { font-weight: 100 !important; }
  .fw-xxl-200 { font-weight: 200 !important; }
  .fw-xxl-300 { font-weight: 300 !important; }
  .fw-xxl-400 { font-weight: 400 !important; }
  .fw-xxl-500 { font-weight: 500 !important; }
  .fw-xxl-600 { font-weight: 600 !important; }
  .fw-xxl-700 { font-weight: 700 !important; }
  .fw-xxl-800 { font-weight: 800 !important; }
  .fw-xxl-900 { font-weight: 900 !important; }
}

/* ==============================================
   Responsive Small Text Utility
   Usage: .small-sm, .small-md, .small-lg, .small-xl, .small-xxl
   Applies Bootstrap's small text styling (font-size: 0.875em)
   ============================================== */

/* Base (non‑responsive) small class – if not already present */
.small {
  font-size: 0.875em !important;
}

/* Responsive small classes */
@media (min-width: 576px) {
  .small-sm {
    font-size: 0.875em !important;
  }
}
@media (min-width: 768px) {
  .small-md {
    font-size: 0.875em !important;
  }
}
@media (min-width: 992px) {
  .small-lg {
    font-size: 0.875em !important;
  }
}
@media (min-width: 1200px) {
  .small-xl {
    font-size: 0.875em !important;
  }
}
@media (min-width: 1400px) {
  .small-xxl {
    font-size: 0.875em !important;
  }
}

/* -----------------------------------------------
   NEGATIVE MARGINS (non-responsive, values -1 to -9)
   Bootstrap already has -1 to -5; we add -6 to -9
   ----------------------------------------------- */
.m-n6 { margin: -4rem !important; }
.m-n7 { margin: -5rem !important; }
.m-n8 { margin: -6rem !important; }
.m-n9 { margin: -8rem !important; }

.mt-n6 { margin-top: -4rem !important; }
.mt-n7 { margin-top: -5rem !important; }
.mt-n8 { margin-top: -6rem !important; }
.mt-n9 { margin-top: -8rem !important; }

.mb-n6 { margin-bottom: -4rem !important; }
.mb-n7 { margin-bottom: -5rem !important; }
.mb-n8 { margin-bottom: -6rem !important; }
.mb-n9 { margin-bottom: -8rem !important; }

.ms-n6 { margin-left: -4rem !important; }
.ms-n7 { margin-left: -5rem !important; }
.ms-n8 { margin-left: -6rem !important; }
.ms-n9 { margin-left: -8rem !important; }

.me-n6 { margin-right: -4rem !important; }
.me-n7 { margin-right: -5rem !important; }
.me-n8 { margin-right: -6rem !important; }
.me-n9 { margin-right: -8rem !important; }

.mx-n6 { margin-left: -4rem !important; margin-right: -4rem !important; }
.mx-n7 { margin-left: -5rem !important; margin-right: -5rem !important; }
.mx-n8 { margin-left: -6rem !important; margin-right: -6rem !important; }
.mx-n9 { margin-left: -8rem !important; margin-right: -8rem !important; }

.my-n6 { margin-top: -4rem !important; margin-bottom: -4rem !important; }
.my-n7 { margin-top: -5rem !important; margin-bottom: -5rem !important; }
.my-n8 { margin-top: -6rem !important; margin-bottom: -6rem !important; }
.my-n9 { margin-top: -8rem !important; margin-bottom: -8rem !important; }

/* -----------------------------------------------
   RESPONSIVE NEGATIVE MARGINS (all breakpoints, values 1-9)
   Pattern: .m-n6-sm, .mt-n7-md, etc.
   ----------------------------------------------- */

/* SM (≥576px) */
@media (min-width: 576px) {
  .m-n6-sm { margin: -4rem !important; } .m-n7-sm { margin: -5rem !important; } .m-n8-sm { margin: -6rem !important; } .m-n9-sm { margin: -8rem !important; }
  .mt-n6-sm { margin-top: -4rem !important; } .mt-n7-sm { margin-top: -5rem !important; } .mt-n8-sm { margin-top: -6rem !important; } .mt-n9-sm { margin-top: -8rem !important; }
  .mb-n6-sm { margin-bottom: -4rem !important; } .mb-n7-sm { margin-bottom: -5rem !important; } .mb-n8-sm { margin-bottom: -6rem !important; } .mb-n9-sm { margin-bottom: -8rem !important; }
  .ms-n6-sm { margin-left: -4rem !important; } .ms-n7-sm { margin-left: -5rem !important; } .ms-n8-sm { margin-left: -6rem !important; } .ms-n9-sm { margin-left: -8rem !important; }
  .me-n6-sm { margin-right: -4rem !important; } .me-n7-sm { margin-right: -5rem !important; } .me-n8-sm { margin-right: -6rem !important; } .me-n9-sm { margin-right: -8rem !important; }
  .mx-n6-sm { margin-left: -4rem !important; margin-right: -4rem !important; } .mx-n7-sm { margin-left: -5rem !important; margin-right: -5rem !important; }
  .mx-n8-sm { margin-left: -6rem !important; margin-right: -6rem !important; } .mx-n9-sm { margin-left: -8rem !important; margin-right: -8rem !important; }
  .my-n6-sm { margin-top: -4rem !important; margin-bottom: -4rem !important; } .my-n7-sm { margin-top: -5rem !important; margin-bottom: -5rem !important; }
  .my-n8-sm { margin-top: -6rem !important; margin-bottom: -6rem !important; } .my-n9-sm { margin-top: -8rem !important; margin-bottom: -8rem !important; }
}

/* MD (≥768px) */
@media (min-width: 768px) {
  .m-n6-md { margin: -4rem !important; } .m-n7-md { margin: -5rem !important; } .m-n8-md { margin: -6rem !important; } .m-n9-md { margin: -8rem !important; }
  .mt-n6-md { margin-top: -4rem !important; } .mt-n7-md { margin-top: -5rem !important; } .mt-n8-md { margin-top: -6rem !important; } .mt-n9-md { margin-top: -8rem !important; }
  .mb-n6-md { margin-bottom: -4rem !important; } .mb-n7-md { margin-bottom: -5rem !important; } .mb-n8-md { margin-bottom: -6rem !important; } .mb-n9-md { margin-bottom: -8rem !important; }
  .ms-n6-md { margin-left: -4rem !important; } .ms-n7-md { margin-left: -5rem !important; } .ms-n8-md { margin-left: -6rem !important; } .ms-n9-md { margin-left: -8rem !important; }
  .me-n6-md { margin-right: -4rem !important; } .me-n7-md { margin-right: -5rem !important; } .me-n8-md { margin-right: -6rem !important; } .me-n9-md { margin-right: -8rem !important; }
  .mx-n6-md { margin-left: -4rem !important; margin-right: -4rem !important; } .mx-n7-md { margin-left: -5rem !important; margin-right: -5rem !important; }
  .mx-n8-md { margin-left: -6rem !important; margin-right: -6rem !important; } .mx-n9-md { margin-left: -8rem !important; margin-right: -8rem !important; }
  .my-n6-md { margin-top: -4rem !important; margin-bottom: -4rem !important; } .my-n7-md { margin-top: -5rem !important; margin-bottom: -5rem !important; }
  .my-n8-md { margin-top: -6rem !important; margin-bottom: -6rem !important; } .my-n9-md { margin-top: -8rem !important; margin-bottom: -8rem !important; }
}

/* LG (≥992px) */
@media (min-width: 992px) {
  .m-n6-lg { margin: -4rem !important; } .m-n7-lg { margin: -5rem !important; } .m-n8-lg { margin: -6rem !important; } .m-n9-lg { margin: -8rem !important; }
  .mt-n6-lg { margin-top: -4rem !important; } .mt-n7-lg { margin-top: -5rem !important; } .mt-n8-lg { margin-top: -6rem !important; } .mt-n9-lg { margin-top: -8rem !important; }
  .mb-n6-lg { margin-bottom: -4rem !important; } .mb-n7-lg { margin-bottom: -5rem !important; } .mb-n8-lg { margin-bottom: -6rem !important; } .mb-n9-lg { margin-bottom: -8rem !important; }
  .ms-n6-lg { margin-left: -4rem !important; } .ms-n7-lg { margin-left: -5rem !important; } .ms-n8-lg { margin-left: -6rem !important; } .ms-n9-lg { margin-left: -8rem !important; }
  .me-n6-lg { margin-right: -4rem !important; } .me-n7-lg { margin-right: -5rem !important; } .me-n8-lg { margin-right: -6rem !important; } .me-n9-lg { margin-right: -8rem !important; }
  .mx-n6-lg { margin-left: -4rem !important; margin-right: -4rem !important; } .mx-n7-lg { margin-left: -5rem !important; margin-right: -5rem !important; }
  .mx-n8-lg { margin-left: -6rem !important; margin-right: -6rem !important; } .mx-n9-lg { margin-left: -8rem !important; margin-right: -8rem !important; }
  .my-n6-lg { margin-top: -4rem !important; margin-bottom: -4rem !important; } .my-n7-lg { margin-top: -5rem !important; margin-bottom: -5rem !important; }
  .my-n8-lg { margin-top: -6rem !important; margin-bottom: -6rem !important; } .my-n9-lg { margin-top: -8rem !important; margin-bottom: -8rem !important; }
}

/* XL (≥1200px) */
@media (min-width: 1200px) {
  .m-n6-xl { margin: -4rem !important; } .m-n7-xl { margin: -5rem !important; } .m-n8-xl { margin: -6rem !important; } .m-n9-xl { margin: -8rem !important; }
  .mt-n6-xl { margin-top: -4rem !important; } .mt-n7-xl { margin-top: -5rem !important; } .mt-n8-xl { margin-top: -6rem !important; } .mt-n9-xl { margin-top: -8rem !important; }
  .mb-n6-xl { margin-bottom: -4rem !important; } .mb-n7-xl { margin-bottom: -5rem !important; } .mb-n8-xl { margin-bottom: -6rem !important; } .mb-n9-xl { margin-bottom: -8rem !important; }
  .ms-n6-xl { margin-left: -4rem !important; } .ms-n7-xl { margin-left: -5rem !important; } .ms-n8-xl { margin-left: -6rem !important; } .ms-n9-xl { margin-left: -8rem !important; }
  .me-n6-xl { margin-right: -4rem !important; } .me-n7-xl { margin-right: -5rem !important; } .me-n8-xl { margin-right: -6rem !important; } .me-n9-xl { margin-right: -8rem !important; }
  .mx-n6-xl { margin-left: -4rem !important; margin-right: -4rem !important; } .mx-n7-xl { margin-left: -5rem !important; margin-right: -5rem !important; }
  .mx-n8-xl { margin-left: -6rem !important; margin-right: -6rem !important; } .mx-n9-xl { margin-left: -8rem !important; margin-right: -8rem !important; }
  .my-n6-xl { margin-top: -4rem !important; margin-bottom: -4rem !important; } .my-n7-xl { margin-top: -5rem !important; margin-bottom: -5rem !important; }
  .my-n8-xl { margin-top: -6rem !important; margin-bottom: -6rem !important; } .my-n9-xl { margin-top: -8rem !important; margin-bottom: -8rem !important; }
}

/* XXL (≥1400px) */
@media (min-width: 1400px) {
  .m-n6-xxl { margin: -4rem !important; } .m-n7-xxl { margin: -5rem !important; } .m-n8-xxl { margin: -6rem !important; } .m-n9-xxl { margin: -8rem !important; }
  .mt-n6-xxl { margin-top: -4rem !important; } .mt-n7-xxl { margin-top: -5rem !important; } .mt-n8-xxl { margin-top: -6rem !important; } .mt-n9-xxl { margin-top: -8rem !important; }
  .mb-n6-xxl { margin-bottom: -4rem !important; } .mb-n7-xxl { margin-bottom: -5rem !important; } .mb-n8-xxl { margin-bottom: -6rem !important; } .mb-n9-xxl { margin-bottom: -8rem !important; }
  .ms-n6-xxl { margin-left: -4rem !important; } .ms-n7-xxl { margin-left: -5rem !important; } .ms-n8-xxl { margin-left: -6rem !important; } .ms-n9-xxl { margin-left: -8rem !important; }
  .me-n6-xxl { margin-right: -4rem !important; } .me-n7-xxl { margin-right: -5rem !important; } .me-n8-xxl { margin-right: -6rem !important; } .me-n9-xxl { margin-right: -8rem !important; }
  .mx-n6-xxl { margin-left: -4rem !important; margin-right: -4rem !important; } .mx-n7-xxl { margin-left: -5rem !important; margin-right: -5rem !important; }
  .mx-n8-xxl { margin-left: -6rem !important; margin-right: -6rem !important; } .mx-n9-xxl { margin-left: -8rem !important; margin-right: -8rem !important; }
  .my-n6-xxl { margin-top: -4rem !important; margin-bottom: -4rem !important; } .my-n7-xxl { margin-top: -5rem !important; margin-bottom: -5rem !important; }
  .my-n8-xxl { margin-top: -6rem !important; margin-bottom: -6rem !important; } .my-n9-xxl { margin-top: -8rem !important; margin-bottom: -8rem !important; }
}

/* -----------------------------------------------
   AUTO MARGINS (responsive)
   Bootstrap has non-responsive .m-auto, .mt-auto, etc.
   We add responsive versions: .m-auto-sm, .mt-auto-md, etc.
   ----------------------------------------------- */
@media (min-width: 576px) {
  .m-auto-sm { margin: auto !important; }
  .mt-auto-sm { margin-top: auto !important; }
  .mb-auto-sm { margin-bottom: auto !important; }
  .ms-auto-sm { margin-left: auto !important; }
  .me-auto-sm { margin-right: auto !important; }
  .mx-auto-sm { margin-left: auto !important; margin-right: auto !important; }
  .my-auto-sm { margin-top: auto !important; margin-bottom: auto !important; }
}
@media (min-width: 768px) {
  .m-auto-md { margin: auto !important; }
  .mt-auto-md { margin-top: auto !important; }
  .mb-auto-md { margin-bottom: auto !important; }
  .ms-auto-md { margin-left: auto !important; }
  .me-auto-md { margin-right: auto !important; }
  .mx-auto-md { margin-left: auto !important; margin-right: auto !important; }
  .my-auto-md { margin-top: auto !important; margin-bottom: auto !important; }
}
@media (min-width: 992px) {
  .m-auto-lg { margin: auto !important; }
  .mt-auto-lg { margin-top: auto !important; }
  .mb-auto-lg { margin-bottom: auto !important; }
  .ms-auto-lg { margin-left: auto !important; }
  .me-auto-lg { margin-right: auto !important; }
  .mx-auto-lg { margin-left: auto !important; margin-right: auto !important; }
  .my-auto-lg { margin-top: auto !important; margin-bottom: auto !important; }
}
@media (min-width: 1200px) {
  .m-auto-xl { margin: auto !important; }
  .mt-auto-xl { margin-top: auto !important; }
  .mb-auto-xl { margin-bottom: auto !important; }
  .ms-auto-xl { margin-left: auto !important; }
  .me-auto-xl { margin-right: auto !important; }
  .mx-auto-xl { margin-left: auto !important; margin-right: auto !important; }
  .my-auto-xl { margin-top: auto !important; margin-bottom: auto !important; }
}
@media (min-width: 1400px) {
  .m-auto-xxl { margin: auto !important; }
  .mt-auto-xxl { margin-top: auto !important; }
  .mb-auto-xxl { margin-bottom: auto !important; }
  .ms-auto-xxl { margin-left: auto !important; }
  .me-auto-xxl { margin-right: auto !important; }
  .mx-auto-xxl { margin-left: auto !important; margin-right: auto !important; }
  .my-auto-xxl { margin-top: auto !important; margin-bottom: auto !important; }
}

/* -----------------------------------------------
   FONT SIZES (responsive)
   Base sizes (non-responsive) already defined: .fs-xs, .fs-sm, .fs-md, .fs-lg, .fs-xl, .fs-xxl, .fs-xxxl
   We add responsive variants with breakpoint suffixes
   ----------------------------------------------- */
/* Base font sizes (if not already present) */
.fs-xs { font-size: 0.75rem !important; }
.fs-sm { font-size: 0.875rem !important; }
.fs-md { font-size: 1rem !important; }
.fs-lg { font-size: 1.25rem !important; }
.fs-xl { font-size: 1.5rem !important; }
.fs-xxl { font-size: 2rem !important; }
.fs-xxxl { font-size: 3rem !important; }

/* Responsive font sizes – each breakpoint */
@media (min-width: 576px) {
  .fs-xs-sm { font-size: 0.75rem !important; }
  .fs-sm-sm { font-size: 0.875rem !important; }
  .fs-md-sm { font-size: 1rem !important; }
  .fs-lg-sm { font-size: 1.25rem !important; }
  .fs-xl-sm { font-size: 1.5rem !important; }
  .fs-xxl-sm { font-size: 2rem !important; }
  .fs-xxxl-sm { font-size: 3rem !important; }
}
@media (min-width: 768px) {
  .fs-xs-md { font-size: 0.75rem !important; }
  .fs-sm-md { font-size: 0.875rem !important; }
  .fs-md-md { font-size: 1rem !important; }
  .fs-lg-md { font-size: 1.25rem !important; }
  .fs-xl-md { font-size: 1.5rem !important; }
  .fs-xxl-md { font-size: 2rem !important; }
  .fs-xxxl-md { font-size: 3rem !important; }
}
@media (min-width: 992px) {
  .fs-xs-lg { font-size: 0.75rem !important; }
  .fs-sm-lg { font-size: 0.875rem !important; }
  .fs-md-lg { font-size: 1rem !important; }
  .fs-lg-lg { font-size: 1.25rem !important; }
  .fs-xl-lg { font-size: 1.5rem !important; }
  .fs-xxl-lg { font-size: 2rem !important; }
  .fs-xxxl-lg { font-size: 3rem !important; }
}
@media (min-width: 1200px) {
  .fs-xs-xl { font-size: 0.75rem !important; }
  .fs-sm-xl { font-size: 0.875rem !important; }
  .fs-md-xl { font-size: 1rem !important; }
  .fs-lg-xl { font-size: 1.25rem !important; }
  .fs-xl-xl { font-size: 1.5rem !important; }
  .fs-xxl-xl { font-size: 2rem !important; }
  .fs-xxxl-xl { font-size: 3rem !important; }
}
@media (min-width: 1400px) {
  .fs-xs-xxl { font-size: 0.75rem !important; }
  .fs-sm-xxl { font-size: 0.875rem !important; }
  .fs-md-xxl { font-size: 1rem !important; }
  .fs-lg-xxl { font-size: 1.25rem !important; }
  .fs-xl-xxl { font-size: 1.5rem !important; }
  .fs-xxl-xxl { font-size: 2rem !important; }
  .fs-xxxl-xxl { font-size: 3rem !important; }
}