/* === Digital Bud - Listing UI (Brand: Amber #ffc107 / Deep Green #0e8e14) === */

/* Register as Mentor button (improved) */
.hp-listing-add__link,
a[href*="add-listing"] {
  background-color: #ffc107 !important; /* amber */
  color: #000000 !important;
  border-radius: 10px;
  font-weight: 600;
  padding: 8px 16px;
  display: inline-block;
  text-decoration: none;
  transition: transform .18s ease, box-shadow .18s ease, background-color .18s ease;
  box-shadow: 0 2px 6px rgba(0,0,0,0.06);
}
.hp-listing-add__link:hover,
a[href*="add-listing"]:hover {
  background-color: #0e8e14 !important; /* deep green */
  color: #ffffff !important;
  transform: translateY(-2px);
}

/* Hide vendor name if intentional — keep visually hidden but accessible to screen readers */
.hp-vendor__name,
.hp-listing__vendor {
  position: absolute !important;
  left: -9999px !important;
  width: 1px !important;
  height: 1px !important;
  overflow: hidden !important;
}

/* Make filter/search controls visible + interactive across themes */
.hp-filter,
.hp-search-form,
.hp-filter-form {
  opacity: 1 !important;
  visibility: visible !important;
  pointer-events: auto !important;
  margin-bottom: 14px;
}

/* Ensure inputs are clickable (z-index guard) */
.hp-search-form input,
.hp-filter-form select,
.hp-filter-form input,
.hp-filter-form label {
  z-index: 5 !important;
  position: relative;
}

/* Ensure buttons are visible on mobile */
.hp-search-form button,
.hp-filter-form button {
  display: inline-block !important;
  opacity: 1 !important;
  pointer-events: auto !important;
}

/* Prevent AJAX overlap breaking the grid layout */
.hp-listings {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 18px;
}

/* Card styling for listings to improve appearance and scan-ability */
.hp-listing {
  flex: 1 1 calc(33.333% - 18px);
  min-width: 240px;
  max-width: 380px;
  background: #fff;
  border-radius: 12px;
  padding: 14px;
  box-shadow: 0 6px 18px rgba(12,12,12,0.04);
  transition: transform .18s ease, box-shadow .18s ease;
}
.hp-listing:hover { transform: translateY(-6px); box-shadow: 0 12px 28px rgba(12,12,12,0.06); }

/* Responsive layout: 2 columns on medium, 1 column on small */
@media (max-width: 992px) {
  .hp-listing { flex: 1 1 calc(50% - 18px); }
}
@media (max-width: 640px) {
  .hp-listing { flex: 1 1 100%; }
  .hp-listing-add__link { padding: 10px 18px; font-size: 15px; }
  .hp-listings { gap: 12px; }
}

/* Make filter panel more prominent (optional visual boost for conversions) */
.hp-filter-form {
  background: #ffffff;
  border: 2px solid #ffc107;
  border-radius: 12px;
  padding: 12px;
  box-shadow: 0 6px 20px rgba(0,0,0,0.03);
}