/* =========================================================
   HOVER CONTRAST FIXES
   Ensures no button/link text or icon becomes invisible on hover
   because the text color matches the hover background color.
   ========================================================= */

/* ---- 1. Bootstrap outline buttons: icons with text-* classes
      become invisible when the hover bg fills with the same color ---- */

/* Warning buttons: yellow icon on yellow hover bg */
.btn-outline-warning:hover i,
.btn-outline-warning:hover .fa-solid,
.btn-outline-warning:hover .fa-brands,
.btn-outline-warning:hover .fa-regular {
  color: #000000 !important;
}

/* Success buttons: green icon on green hover bg */
.btn-outline-success:hover i,
.btn-outline-success:hover .fa-solid,
.btn-outline-success:hover .fa-brands,
.btn-outline-success:hover .fa-regular {
  color: #ffffff !important;
}

/* Danger buttons: red icon on red hover bg */
.btn-outline-danger:hover i,
.btn-outline-danger:hover .fa-solid,
.btn-outline-danger:hover .fa-brands,
.btn-outline-danger:hover .fa-regular {
  color: #ffffff !important;
}

/* Primary buttons: blue icon on blue hover bg */
.btn-outline-primary:hover i,
.btn-outline-primary:hover .fa-solid,
.btn-outline-primary:hover .fa-brands,
.btn-outline-primary:hover .fa-regular {
  color: #ffffff !important;
}

/* Info buttons: teal icon on teal hover bg */
.btn-outline-info:hover i,
.btn-outline-info:hover .fa-solid,
.btn-outline-info:hover .fa-brands,
.btn-outline-info:hover .fa-regular {
  color: #ffffff !important;
}

/* Dark buttons: dark icon on dark hover bg */
.btn-outline-dark:hover i,
.btn-outline-dark:hover .fa-solid,
.btn-outline-dark:hover .fa-brands,
.btn-outline-dark:hover .fa-regular {
  color: #ffffff !important;
}

/* Secondary buttons: gray icon on gray hover bg */
.btn-outline-secondary:hover i,
.btn-outline-secondary:hover .fa-solid,
.btn-outline-secondary:hover .fa-brands,
.btn-outline-secondary:hover .fa-regular {
  color: #ffffff !important;
}

/* Light buttons: light icon on light hover bg */
.btn-outline-light:hover i,
.btn-outline-light:hover .fa-solid,
.btn-outline-light:hover .fa-brands,
.btn-outline-light:hover .fa-regular {
  color: #000000 !important;
}

/* ---- 2. Community section benefit tags: ensure hover contrast ---- */
.smart-benefit-tag:hover {
  background: rgba(255, 255, 255, 0.18);
  color: #ffffff;
  border-color: rgba(255, 255, 255, 0.4);
}

.smart-benefit-tag:hover .text-warning {
  color: #fbbf24 !important;
}

.smart-benefit-tag:hover .text-success {
  color: #4ade80 !important;
}

.smart-benefit-tag:hover .text-info {
  color: #38bdf8 !important;
}

/* ---- 3. Admin sidebar: colored icons must stay visible on hover ---- */
.admin-sidebar .nav-link:hover .text-warning {
  color: #fbbf24 !important;
}

.admin-sidebar .nav-link:hover .text-success {
  color: #4ade80 !important;
}

.admin-sidebar .nav-link:hover .text-info {
  color: #38bdf8 !important;
}

.admin-sidebar .nav-link:hover .text-danger {
  color: #f87171 !important;
}

.admin-sidebar .nav-link:hover .text-primary {
  color: #60a5fa !important;
}

/* ---- 4. Product card add-to-cart button: ensure text is visible ---- */
.btn-add-to-cart-premium:hover {
  background: #1E8449;
  color: #ffffff;
}

/* ---- 5. Hero slider outline buttons on any background ---- */
.hero-slide-full .btn-outline-light:hover {
  background: #ffffff;
  color: #1a1a1a;
  border-color: #ffffff;
}

/* ---- 6. Footer app download badges: icon contrast on dark hover ---- */
.btn-dark:hover .text-warning {
  color: #fbbf24 !important;
}

.btn-dark:hover .text-white {
  color: #ffffff !important;
}

/* ---- 7. Contact page social media buttons: icon contrast ---- */
.btn-outline-dark:hover .fa-brands {
  color: #ffffff !important;
}

/* ---- 8. Push notification permission popup buttons ---- */
.btn-not-yet:hover {
  background: #f1f5f9;
  color: #1557b0;
}

.btn-yes-submit:hover {
  background: #1557b0;
  color: #ffffff;
}

/* ---- 9. Custom gold button: ensure text stays dark on gold hover ---- */
.btn-gold-custom:hover {
  background: linear-gradient(135deg, #e69500, #9a6b18);
  color: #ffffff;
}

/* ---- 10. Generic fix: any element with text-success/danger/warning inside
       outline button gets a hover override ---- */
[class*="btn-outline-"]:hover [class*="text-"] {
  transition: color 0.2s ease;
}
