/* =================================================
   Accessibility Fixes - Contrast & ARIA Improvements
   ================================================= */

/* Fix low-contrast text on colored backgrounds */

/* Primary button contrast improvement */
.btn-primary {
  /* Ensure minimum 4.5:1 contrast ratio */
  background-color: #8f731f !important; /* Much darker gold for 4.6:1 on white */
  border-color: #8f731f !important;
  color: #fff !important;
}

.btn-primary:hover,
.btn-primary:focus {
  background-color: #6b5617 !important; /* Even darker on hover */
  border-color: #6b5617 !important;
  color: #fff !important;
}

/* Links on gold backgrounds */
a[style*="background-color: rgb(184, 153, 46)"],
a[style*="background: rgb(184, 153, 46)"],
.bg-gold a,
.btn-gold {
  background-color: #8f731f !important;
  color: #fff !important;
}

/* Link contrast improvements */
a {
  /* Ensure links have sufficient contrast */
  text-decoration-skip-ink: auto;
}

a:focus {
  outline: 2px solid #005fcc;
  outline-offset: 2px;
}

/* Badge contrast improvements */
.badge.bg-secondary {
  background-color: #5a6268 !important; /* Darker for better contrast */
}

.badge.bg-light {
  background-color: #d3d3d3 !important; /* Darker light background */
  color: #000 !important;
}

/* Badge counters - ensure 4.5:1 contrast */
.header-icon .badge,
.cart-count,
.notification-count,
span.badge {
  font-weight: 700;
}

/* Red badge counter (error/alert) - CRITICAL FIX */
.badge.bg-danger,
.bg-danger.badge,
.notification-count,
[class*="badge"][style*="background-color: rgb(239, 68, 68)"],
span[style*="background-color: rgb(239, 68, 68)"] {
  background-color: #b91c1c !important; /* Darker red for 4.8:1+ */
  color: #fff !important;
  border: 1px solid #991b1b !important;
}

/* For very small badges (10px font) - ensure 4.5:1 minimum */
.notification-count,
.header-icon .badge {
  background-color: #991b1b !important; /* Even darker for 10px text = 5.2:1 */
  font-size: 11px !important; /* Slightly larger for readability */
  min-width: 18px !important;
  padding: 2px 5px !important;
}

/* Gold/yellow badge counter */
.badge.bg-warning,
.bg-warning.badge,
[class*="badge"][style*="background-color: rgb(201, 169, 97)"],
[class*="badge"][style*="background: rgb(201, 169, 97)"] {
  background-color: #92722d !important; /* Much darker gold for 4.5:1+ */
  color: #fff !important;
}

/* Text muted - ensure readable contrast */
.text-muted {
  color: #6c757d !important; /* WCAG AA compliant */
}

/* Navigation active state contrast */
.nav-link.active,
.navbar-nav .nav-link.active {
  color: #000 !important; /* High contrast for active links */
  font-weight: 600;
}

/* Navigation on LIGHT backgrounds - ensure dark text */
.navbar.bg-white .nav-link,
.navbar.header-light .nav-link,
.navbar.bg-white a,
.navbar.header-light a,
header:not([style*="rgb(37, 40, 64)"]) .nav-link,
.bg-white .navbar-nav .nav-link {
  color: #000 !important; /* Dark text on light backgrounds */
}

/* Icon buttons on light backgrounds */
.navbar.bg-white i,
.navbar.header-light i,
.header-light .header-icon i {
  color: #000 !important;
}

/* Event date boxes - ensure dark text */
.event-date-box,
.event-date-box * {
  color: #000 !important; /* Dark text for visibility */
}

/* White buttons - ensure dark text on white background */
.btn.btn-white,
a.btn.btn-white,
button.btn.btn-white,
.btn-white.btn-small,
.btn-white.btn-rounded {
  color: #000 !important; /* Dark text on white button */
  background-color: #fff !important;
  border-color: #ddd !important;
}

.btn.btn-white:hover,
a.btn.btn-white:hover,
button.btn.btn-white:hover,
.btn-white.btn-small:hover,
.btn-white.btn-rounded:hover {
  color: #000 !important;
  background-color: #f5f5f5 !important;
  border-color: #ccc !important;
}

/* Button text spans - inherit color from parent button */
.btn-text,
span.btn-text {
  color: inherit !important; /* Always inherit from parent for proper contrast */
}

/* Only force black on explicitly white/light buttons */
.btn-white .btn-text,
.btn-light .btn-text {
  color: #000 !important;
}

/* Transparent/outline buttons - ensure dark text (but allow white on hover) */
.btn-transparent-dark-gray,
.btn-transparent-dark-gray .btn-text,
.btn-transparent-base-color,
.btn-transparent-base-color .btn-text,
a.btn.btn-transparent-base-color,
a[href*="Register"].btn,
.btn-outline-primary {
  color: #000 !important;
}

/* White text on hover for transparent buttons */
.btn-transparent-dark-gray:hover,
.btn-transparent-dark-gray:hover .btn-text,
.btn-transparent-dark-gray:active,
.btn-transparent-dark-gray:active .btn-text,
.btn-transparent-base-color:hover,
.btn-transparent-base-color:hover .btn-text,
.btn-outline-primary:hover,
.btn-outline-primary:focus,
.btn-outline-primary:active {
  color: #fff !important;
}

/* Text links - ensure dark text (except in footer dark) */
a.text-dark-gray,
a.text-decoration-line-bottom,
.text-dark-gray a,
a.text-dark-gray:hover,
a.text-decoration-line-bottom:hover,
a.fs-14.text-dark-gray,
a.fs-14.text-dark-gray.fw-500,
a[href*="ForgotPassword"],
a[href^="tel:"]:not(.btn-outline-base-color):not(footer.footer-dark a):not(
    footer a
  ),
a[href^="mailto:"]:not(.btn-outline-base-color):not([href^="mailto:?"]):not(
    footer.footer-dark a
  ):not(footer a),
a[href*="google.com/maps"]:not(.btn-outline-base-color) {
  color: #000 !important;
}

/* Footer dark links must be white */
footer.footer-dark a[href^="tel:"],
footer.footer-dark a[href^="mailto:"],
footer a[href^="tel:"],
footer a[href^="mailto:"] {
  color: #fff !important;
}

footer.footer-dark a[href^="tel:"]:hover,
footer.footer-dark a[href^="mailto:"]:hover {
  color: #d4af37 !important;
}

/* Dark sections - ensure light text */
.bg-dark,
.bg-dark-gray,
.statistics-section.bg-dark,
section.bg-dark,
[class*="bg-dark"] {
  color: #fff !important;
}

.bg-dark h1,
.bg-dark h2,
.bg-dark h3,
.bg-dark h4,
.bg-dark h5,
.bg-dark h6,
.bg-dark .statistic-number,
.bg-dark .statistic-item,
section.bg-dark h1,
section.bg-dark h2,
section.bg-dark h3,
section.bg-dark h4,
section.bg-dark h5,
section.bg-dark h6 {
  color: #fff !important;
}

/* Navigation on dark backgrounds - fix low contrast */
.navbar[data-mobile-nav-bg-color="#252840"] .navbar-nav .nav-link,
.navbar.bg-dark-gray .nav-link,
.navbar-dark .nav-link,
header[style*="background-color: rgb(37, 40, 64)"] a,
header[style*="background: rgb(37, 40, 64)"] a {
  color: #fff !important; /* White for maximum contrast on dark bg */
}

/* Navigation text with rgba(0,0,0,0.65) on dark bg - CRITICAL FIX */
header[style*="background-color: rgb(37, 40, 64)"]
  span[style*="rgba(0, 0, 0, 0.65)"],
header[style*="background: rgb(37, 40, 64)"] span[style*="rgba(0, 0, 0, 0.65)"],
.header-dark .navbar-toggler-line,
.header-dark span.navbar-toggler-line {
  color: #fff !important;
  opacity: 1 !important;
  background-color: #fff !important; /* For hamburger menu lines */
}

/* Hamburger lines on light header - must be dark */
.header-light .navbar-toggler-line,
.header-light span.navbar-toggler-line,
.bg-white .navbar-toggler-line,
nav.header-light .navbar-toggler-line {
  background-color: #232323 !important;
  opacity: 1 !important;
}

/* Social media links on semi-transparent backgrounds */
footer a.facebook,
footer a.twitter,
footer a.instagram,
.social-icon a,
footer [style*="background-color: rgba(212, 175, 55, 0.1)"] {
  background-color: #8f731f !important; /* Solid dark gold for contrast */
  padding: 8px 12px !important;
  border-radius: 4px !important;
}

/* Dropdown active items */
.dropdown-item.active,
a.dropdown-item.active {
  background-color: #8f731f !important; /* Dark gold */
  color: #fff !important;
  border-color: #8f731f !important;
}

.dropdown-item.active:hover,
.dropdown-item.active:focus {
  background-color: #6b5617 !important;
  color: #fff !important;
}

/* Footer text contrast (dark background) */
footer.footer-dark,
.bg-dark-gray {
  color: #e0e0e0 !important; /* Better contrast on dark backgrounds */
}

footer.footer-dark a,
.bg-dark-gray a {
  color: #fff !important;
  text-decoration: underline;
}

footer.footer-dark a:hover,
.bg-dark-gray a:hover {
  color: #d4af37 !important; /* Gold accent on hover */
}

/* Form label contrast */
label,
.form-label {
  color: #212529 !important; /* Ensure labels are readable */
  font-weight: 500;
}

/* Placeholder text contrast */
::placeholder {
  color: #6c757d !important;
  opacity: 1;
}

/* Alert contrast improvements */
.alert-warning {
  background-color: #fff3cd;
  border-color: #ffecb5;
  color: #664d03; /* High contrast text */
}

.alert-info {
  background-color: #cfe2ff;
  border-color: #b6d4fe;
  color: #084298; /* High contrast text */
}

/* Table header contrast */
thead th {
  color: #000 !important;
  font-weight: 600;
}

/* Hero text overlay contrast */
.hero-content,
.cover-background .overlay-content {
  text-shadow: 0 2px 4px rgba(0, 0, 0, 0.5); /* Improve readability on images */
}

/* Price display contrast */
.price,
.amount {
  color: #000 !important;
  font-weight: 700;
}

/* Focus visible improvements for keyboard navigation */
*:focus-visible {
  outline: 2px solid #005fcc;
  outline-offset: 2px;
  border-radius: 2px;
}

button:focus-visible,
.btn:focus-visible {
  outline: 2px solid #005fcc;
  outline-offset: 2px;
}

/* Remove default browser focus styles */
*:focus:not(:focus-visible) {
  outline: none;
}

/* Card title contrast - except inside .text-white containers */
.card-title,
h1,
h2,
h3,
h4,
h5,
h6 {
  color: #000 !important; /* Ensure headings have maximum contrast */
}

/* Allow white headings inside .text-white containers (e.g., event hero sections) */
.text-white h1,
.text-white h2,
.text-white h3,
.text-white h4,
.text-white h5,
.text-white h6,
.text-white .card-title {
  color: #fff !important;
}

/* Event Location section - phone and email links should be dark for readability */
aside a[href^="tel:"],
aside a[href^="mailto:"],
.event-location a[href^="tel:"],
.event-location a[href^="mailto:"] {
  color: #000 !important;
}

/* Dropdown menu contrast */
.dropdown-menu {
  border: 1px solid #ccc;
}

.dropdown-item {
  color: #212529 !important;
}

.dropdown-item:hover,
.dropdown-item:focus {
  background-color: #f8f9fa;
  color: #000 !important;
}

.dropdown-item.active {
  background-color: #0d6efd;
  color: #fff !important;
}

/* Testimonial text contrast */
.testimonial-text {
  color: #212529 !important;
}

/* Menu item price contrast */
.menu-item-price {
  color: #000 !important;
  font-weight: 700;
}

/* Icon-only button accessible labels */
button[aria-label]:not([title]) {
  /* Ensure icon buttons have visible tooltips on hover */
  position: relative;
}

/* Status badge improvements */
.status-badge {
  padding: 0.35em 0.65em;
  font-size: 0.875em;
  font-weight: 600;
}

.status-badge.bg-success {
  background-color: #198754 !important;
  color: #fff !important;
}

.status-badge.bg-danger {
  background-color: #dc3545 !important;
  color: #fff !important;
}

.status-badge.bg-warning {
  background-color: #ffc107 !important;
  color: #000 !important; /* Black text for yellow background */
}

/* Pagination contrast */
.pagination .page-link {
  color: #005fcc;
  border: 1px solid #dee2e6;
}

.pagination .page-link:hover {
  background-color: #f8f9fa;
  border-color: #dee2e6;
  color: #003d7a;
}

.pagination .page-item.active .page-link {
  background-color: #0d6efd;
  border-color: #0d6efd;
  color: #fff;
  font-weight: 600;
}

/* Skip link high visibility */
.skip-link:focus {
  background: #000 !important;
  color: #fff !important;
  font-weight: 700;
  padding: 1rem;
  z-index: 9999;
}

/* =================================================
   ULTRA-SPECIFIC CONTRAST FIXES (High Priority)
   These use multiple selectors to ensure they override
   ================================================= */

/* Notification badge - MUST be darker red */
.header-icon span.notification-count,
span.notification-count[style*="background"],
.header-icon .badge,
.icon span[class*="count"] {
  background-color: #991b1b !important;
  color: #fff !important;
  font-size: 11px !important;
  font-weight: 700 !important;
  min-width: 18px !important;
}

/* Hamburger menu lines - dark background = white lines */
.header-dark button.navbar-toggler span.navbar-toggler-line,
.header-dark .navbar-toggler .navbar-toggler-line,
[data-mobile-nav-bg-color="dark"] .navbar-toggler-line {
  background-color: #fff !important;
  opacity: 1 !important;
}

/* Hamburger menu lines - light/white background = dark lines */
.header-light button.navbar-toggler span.navbar-toggler-line,
.header-light .navbar-toggler .navbar-toggler-line,
.bg-white button.navbar-toggler span.navbar-toggler-line,
.bg-white .navbar-toggler .navbar-toggler-line,
nav.header-light button.navbar-toggler span.navbar-toggler-line {
  background-color: #232323 !important;
  opacity: 1 !important;
}

/* Social icons - solid backgrounds required */
.social-icon a.facebook,
a[class*="facebook"],
.footer-social a,
[style*="rgba(212, 175, 55, 0.1)"] {
  background-color: #8f731f !important;
  color: #fff !important;
  padding: 10px !important;
}

/* Dropdown active - dark gold background */
.dropdown-menu .dropdown-item.active,
a.dropdown-item[class*="active"],
.language-selector .dropdown-item.active {
  background-color: #8f731f !important;
  color: #fff !important;
}

/* Force white text on dark mobile nav - MOBILE MENU ONLY (not desktop nav) */
.mobile-menu .nav-link,
.mobile-menu
  a:not(.btn-outline-base-color):not([href^="tel:"]):not([href^="mailto:"]),
.navbar-collapse.show .nav-link,
.navbar-collapse.collapsing .nav-link,
.navbar-full-screen-menu-inner .nav-link,
.navbar-full-screen-menu-inner a {
  color: #fff !important;
}

/* Desktop header icon spacing - remove extra padding on account icon */
.header-account-icon.icon {
  padding-left: 0 !important;
}

/* Mobile header spacing - reduce gaps between icons */
@media (max-width: 991px) {
  /* Remove auto-margin and flex-grow that create big gap */
  header#header nav > div.container-lg > .col-auto.me-auto,
  header#header nav > div.container-lg > .col-auto.me-lg-0.me-auto {
    margin-right: 0 !important;
    flex: 0 0 auto !important;
  }

  header#header nav > div.container-lg {
    gap: 8px !important;
    justify-content: space-between !important;
  }

  header#header .menu-order {
    order: 5 !important;
    padding-left: 0 !important;
    flex: 0 0 auto !important;
  }

  header#header .col-auto.text-end.d-flex {
    flex: 0 0 auto !important;
    margin-left: auto !important;
  }

  header#header .header-icon .icon > a {
    padding-left: 8px !important;
    padding-right: 8px !important;
  }

  /* Remove white space below header on mobile - header is not sticky */
  .ipad-top-space-margin {
    margin-top: 0 !important;
  }

  .full-screen.ipad-top-space-margin {
    height: 100vh !important;
  }

  /* Search popup mobile spacing fix - center vertically */
  .header-search-icon .search-form {
    align-items: center !important;
    padding-top: 0 !important;
    height: 100vh !important;
    justify-content: center !important;
  }

  .header-search-icon .search-form-box {
    width: 90% !important;
    max-width: 340px !important;
    margin: 0 auto !important;
    padding: 0 15px !important;
  }

  .header-search-icon .search-form-box h2 {
    margin-top: 0 !important;
    margin-bottom: 15px !important;
    font-size: 20px !important;
    letter-spacing: 0 !important;
  }

  .header-search-icon .search-close {
    right: 30px !important;
  }
}

/* Contact widget links - ULTRA HIGH PRIORITY */
a[href^="tel:"],
a[href^="tel:"]:hover,
a[href^="tel:"]:visited,
a[href^="mailto:"],
a[href^="mailto:"]:hover,
a[href^="mailto:"]:visited {
  color: #000 !important;
}
