/* ==========================================================================
   HEIMISH TRAVEL — Vendor Profile Page
   Body classes: .hp-template--vendor-view-page, .hp-template--user-view-page
   Body class: .hp-template--user-view-page
   Requires: account-shared.css
   
   Sidebar: vendor card (avatar, name, rating, message button)
   Content: vendor's listings (vendor) or empty (user profile)
   ========================================================================== */


/* ==========================================================================
   VENDOR SUMMARY CARD
   ========================================================================== */

.hp-template--vendor-view-page .hp-vendor__summary,
.hp-template--user-view-page .hp-vendor__summary {
  text-align: center !important;
}

/* Avatar */
.hp-template--vendor-view-page .hp-vendor__image,
.hp-template--user-view-page .hp-vendor__image {
  width: 5rem !important;
  height: 5rem !important;
  border-radius: 50% !important;
  overflow: hidden !important;
  margin: 0 auto var(--space-xs) !important;
}

.hp-template--vendor-view-page .hp-vendor__image img,
.hp-template--user-view-page .hp-vendor__image img {
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  display: block !important;
}

/* Name + online badge */
.hp-template--vendor-view-page .hp-vendor__name,
.hp-template--user-view-page .hp-vendor__name {
  font-size: var(--text-l) !important;
  font-weight: 600 !important;
  color: var(--primary) !important;
  margin: 0 0 var(--space-xs) !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 0.4em !important;
}

.hp-template--vendor-view-page .hp-vendor__online-badge--active,
.hp-template--user-view-page .hp-vendor__online-badge--active {
  width: 0.6em !important;
  height: 0.6em !important;
  border-radius: 50% !important;
  background: #22c55e !important;
  display: inline-block !important;
  flex-shrink: 0 !important;
}

/* Offline badge — hidden or muted */
.hp-template--vendor-view-page .hp-vendor__online-badge:not(.hp-vendor__online-badge--active),
.hp-template--user-view-page .hp-vendor__online-badge:not(.hp-vendor__online-badge--active) {
  display: none !important;
}

/* Verified badge */
.hp-template--vendor-view-page .hp-vendor__verified-badge,
.hp-template--user-view-page .hp-vendor__verified-badge {
  color: var(--action) !important;
  font-size: 0.65em !important;
}

/* Details row */
.hp-template--vendor-view-page .hp-vendor__details--primary,
.hp-template--user-view-page .hp-vendor__details--primary {
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  gap: var(--space-xs) !important;
}

.hp-template--vendor-view-page .hp-vendor__registered-date,
.hp-template--user-view-page .hp-vendor__registered-date {
  font-size: var(--text-s) !important;
  color: var(--neutral) !important;
}

/* Rating */
.hp-template--vendor-view-page .hp-vendor__rating,
.hp-template--user-view-page .hp-vendor__rating {
  display: flex !important;
  align-items: center !important;
  gap: 0.4em !important;
}

.hp-template--vendor-view-page .hp-rating__stars .fa-star,
.hp-template--user-view-page .hp-rating__stars .fa-star {
  color: rgba(0, 0, 0, 0.15) !important;
  font-size: 0.85rem !important;
}

.hp-template--vendor-view-page .hp-rating__stars .fa-star.active,
.hp-template--user-view-page .hp-rating__stars .fa-star.active {
  color: var(--action) !important;
}

.hp-template--vendor-view-page .hp-rating__value,
.hp-template--user-view-page .hp-rating__value {
  font-size: var(--text-s) !important;
  font-weight: 600 !important;
  color: var(--primary) !important;
}

.hp-template--vendor-view-page .hp-rating__count,
.hp-template--user-view-page .hp-rating__count {
  font-size: var(--text-s) !important;
  color: var(--neutral) !important;
}


/* ==========================================================================
   SEND MESSAGE BUTTON
   ========================================================================== */

.hp-template--vendor-view-page .hp-vendor__actions--primary,
.hp-template--user-view-page .hp-vendor__actions--primary {
  margin-top: var(--space-s) !important;
}

.hp-template--vendor-view-page .hp-vendor__action--message,
.hp-template--user-view-page .hp-vendor__action--message {
  width: 100% !important;
  border-radius: 999px !important;
  padding: var(--space-xs) var(--space-s) !important;
  font-size: var(--text-s) !important;
  font-weight: 600 !important;
  background: var(--primary) !important;
  color: var(--white, #fff) !important;
  border: none !important;
  cursor: pointer !important;
  transition: opacity 0.15s ease !important;
  text-align: center !important;
  display: block !important;
}

.hp-template--vendor-view-page .hp-vendor__action--message:hover,
.hp-template--user-view-page .hp-vendor__action--message:hover {
  opacity: 0.85 !important;
}


/* ==========================================================================
   VENDOR LISTINGS GRID
   ========================================================================== */

.hp-template--vendor-view-page .hp-listings .hp-row,
.hp-template--user-view-page .hp-listings .hp-row {
  display: grid !important;
  grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)) !important;
  gap: var(--space-s) !important;
}

.hp-template--vendor-view-page .hp-grid__item,
.hp-template--user-view-page .hp-grid__item {
  max-width: 100% !important;
  width: 100% !important;
}

/* Listing cards on vendor page — vertical block style */
.hp-template--vendor-view-page .hp-listing--view-block,
.hp-template--user-view-page .hp-listing--view-block {
  display: flex !important;
  flex-direction: column !important;
  background: var(--white, #fff) !important;
  border: 1px solid rgba(0, 0, 0, 0.06) !important;
  border-radius: var(--radius) !important;
  overflow: hidden !important;
  transition: box-shadow 0.2s ease !important;
}

.hp-template--vendor-view-page .hp-listing--view-block:hover,
.hp-template--user-view-page .hp-listing--view-block:hover {
  box-shadow: 0 4px 16px rgba(0, 0, 0, 0.08) !important;
}

/* Image */
.hp-template--vendor-view-page .hp-listing__image,
.hp-template--user-view-page .hp-listing__image {
  border-radius: var(--radius) var(--radius) 0 0 !important;
  overflow: hidden !important;
}

.hp-template--vendor-view-page .hp-listing__image img,
.hp-template--user-view-page .hp-listing__image img {
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  display: block !important;
}

/* Featured badge */
.hp-template--vendor-view-page .hp-listing__featured-badge,
.hp-template--user-view-page .hp-listing__featured-badge {
  position: absolute !important;
  top: var(--space-xs) !important;
  left: var(--space-xs) !important;
  background: var(--white, #fff) !important;
  color: var(--action) !important;
  width: 2rem !important;
  height: 2rem !important;
  border-radius: 50% !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  font-size: 0.75rem !important;
  box-shadow: 0 1px 4px rgba(0, 0, 0, 0.1) !important;
  z-index: 2 !important;
}

/* Content */
.hp-template--vendor-view-page .hp-listing__content,
.hp-template--user-view-page .hp-listing__content {
  padding: var(--space-xs) var(--space-s) !important;
  flex: 1 !important;
}

.hp-template--vendor-view-page .hp-listing__title,
.hp-template--user-view-page .hp-listing__title {
  font-size: var(--text-m) !important;
  font-weight: 600 !important;
  margin: 0 0 var(--space-xs) !important;
  line-height: 1.3 !important;
}

.hp-template--vendor-view-page .hp-listing__title a,
.hp-template--user-view-page .hp-listing__title a {
  color: var(--primary) !important;
  text-decoration: none !important;
}

.hp-template--vendor-view-page .hp-listing__title a:hover,
.hp-template--user-view-page .hp-listing__title a:hover {
  text-decoration: underline !important;
}

.hp-template--vendor-view-page .hp-listing__location,
.hp-template--user-view-page .hp-listing__location {
  font-size: var(--text-s) !important;
  color: var(--neutral) !important;
}

.hp-template--vendor-view-page .hp-listing__location a,
.hp-template--user-view-page .hp-listing__location a {
  color: var(--neutral) !important;
  text-decoration: none !important;
}

.hp-template--vendor-view-page .hp-listing__categories a,
.hp-template--user-view-page .hp-listing__categories a {
  font-size: var(--text-s) !important;
  color: var(--neutral) !important;
}

.hp-template--vendor-view-page .hp-listing__created-date,
.hp-template--user-view-page .hp-listing__created-date {
  display: none !important;
}

/* Attributes */
.hp-template--vendor-view-page .hp-listing__attributes--secondary,
.hp-template--user-view-page .hp-listing__attributes--secondary {
  font-size: var(--text-s) !important;
  color: var(--neutral) !important;
  padding-top: var(--space-xs) !important;
}

.hp-template--vendor-view-page .hp-listing__attributes--secondary .hp-row,
.hp-template--user-view-page .hp-listing__attributes--secondary .hp-row {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 0.25em var(--space-s) !important;
}

/* Footer */
.hp-template--vendor-view-page .hp-listing__footer,
.hp-template--user-view-page .hp-listing__footer {
  padding: var(--space-xs) var(--space-s) !important;
  border-top: 1px solid rgba(0, 0, 0, 0.04) !important;
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
}

.hp-template--vendor-view-page .hp-listing__attribute--price,
.hp-template--user-view-page .hp-listing__attribute--price {
  font-size: var(--text-m) !important;
  font-weight: 700 !important;
  color: var(--primary) !important;
}

/* Action icons */
.hp-template--vendor-view-page .hp-listing__actions--primary,
.hp-template--user-view-page .hp-listing__actions--primary {
  display: flex !important;
  align-items: center !important;
  gap: var(--space-xs) !important;
}

.hp-template--vendor-view-page .hp-listing__actions--primary .hp-modal,
.hp-template--user-view-page .hp-listing__actions--primary .hp-modal {
  display: none !important;
}

.hp-template--vendor-view-page .hp-listing__action,
.hp-template--user-view-page .hp-listing__action {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 2rem !important;
  height: 2rem !important;
  border-radius: 50% !important;
  color: var(--neutral) !important;
  text-decoration: none !important;
  transition: all 0.15s ease !important;
}

.hp-template--vendor-view-page .hp-listing__action:hover,
.hp-template--user-view-page .hp-listing__action:hover {
  color: var(--primary) !important;
  background: var(--primary-light) !important;
}

.hp-template--vendor-view-page .hp-listing__action--favorite[data-state="active"],
.hp-template--user-view-page .hp-listing__action--favorite[data-state="active"] {
  color: #ef4444 !important;
}


/* ==========================================================================
   NO RESULTS
   ========================================================================== */

.hp-template--vendor-view-page .hp-no-results,
.hp-template--user-view-page .hp-no-results {
  text-align: center !important;
  padding: var(--space-l) 0 !important;
}

.hp-template--vendor-view-page .hp-no-results h2,
.hp-template--user-view-page .hp-no-results h2 {
  font-size: var(--text-l) !important;
  font-weight: 600 !important;
  color: var(--primary) !important;
  margin: 0 0 var(--space-xs) !important;
}

.hp-template--vendor-view-page .hp-no-results p,
.hp-template--user-view-page .hp-no-results p {
  font-size: var(--text-s) !important;
  color: var(--neutral) !important;
}