/* Listing results filters and cards. */
/* --------------------------------------------------------------------------
 * Regional layer integration: keep the Layer 2 listing visually identical
 * when the same View is rendered outside the old front page route.
 * This is intentionally defensive because the original theme attached listing
 * styles only on front/view/taxonomy routes.
 * -------------------------------------------------------------------------- */
.directory-country-landing .view,
.directory-country-landing .view-directory-listing,
body.path-es-pe .view-directory-listing,
body.path-pe .view-directory-listing {
  width: 100%;
}

.directory-country-landing .views-exposed-form,
.directory-country-landing .view-filters,
body.path-es-pe .view-filters,
body.path-pe .view-filters {
  margin: 0 0 18px;
  padding: 18px;
  border: 1px solid var(--border, #dbe5f2);
  border-radius: 22px;
  background: var(--surface, #fff);
  box-shadow: var(--shadow-soft, 0 10px 30px rgba(15, 23, 42, .06));
}

.directory-country-landing .views-exposed-form .form--inline,
.directory-country-landing .view-filters .form--inline {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  gap: 12px;
  align-items: end;
}

.directory-country-landing .views-exposed-form label,
.directory-country-landing .view-filters label {
  display: block;
  margin: 0 0 6px;
  font-weight: 800;
  color: var(--text, #071f4f);
}

.directory-country-landing .views-exposed-form select,
.directory-country-landing .views-exposed-form input[type="text"],
.directory-country-landing .view-filters select,
.directory-country-landing .view-filters input[type="text"] {
  width: 100%;
  min-height: 48px;
  padding: 0 14px;
  border: 1px solid var(--border, #cbd9ec);
  border-radius: 16px;
  background: #fff;
  color: var(--text, #071f4f);
}

.directory-country-landing .views-exposed-form .form-submit,
.directory-country-landing .view-filters .form-submit {
  min-height: 48px;
  padding: 0 20px;
  border: 0;
  border-radius: 16px;
  background: var(--accent, #2563eb);
  color: #fff;
  font-weight: 900;
  cursor: pointer;
  box-shadow: 0 10px 22px rgba(37, 99, 235, .18);
}

.directory-country-landing .view-content,
.directory-country-landing .directory-results-grid,
body.path-es-pe .directory-results-grid,
body.path-pe .directory-results-grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 16px;
}

.directory-country-landing .views-row,
body.path-es-pe .views-row,
body.path-pe .views-row {
  min-width: 0;
}

.directory-country-landing .listing-card,
body.path-es-pe .listing-card,
body.path-pe .listing-card {
  position: relative;
  padding: 1rem;
  border: 1px solid var(--border, #dbe5f2);
  border-radius: var(--radius, 22px);
  background: var(--surface, #fff);
  box-shadow: var(--shadow-soft, 0 10px 30px rgba(15, 23, 42, .06));
}

.directory-country-landing .listing-card__inner,
body.path-es-pe .listing-card__inner,
body.path-pe .listing-card__inner {
  display: grid;
  grid-template-columns: 132px minmax(0, 1fr) auto;
  gap: 1rem;
  align-items: start;
}

.directory-country-landing .listing-card__media img,
body.path-es-pe .listing-card__media img,
body.path-pe .listing-card__media img {
  width: 132px;
  aspect-ratio: 3 / 4;
  object-fit: cover;
  border-radius: 16px;
  display: block;
}

.directory-country-landing .listing-card__image-placeholder,
body.path-es-pe .listing-card__image-placeholder,
body.path-pe .listing-card__image-placeholder {
  width: 132px;
  aspect-ratio: 3 / 4;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 16px;
  background: var(--surface-muted, #f1f5f9);
  color: var(--muted, #64748b);
  font-weight: 700;
}

.directory-country-landing .listing-card__title,
body.path-es-pe .listing-card__title,
body.path-pe .listing-card__title {
  margin: 0 0 .45rem;
  font-size: 1.05rem;
  line-height: 1.3;
}

.directory-country-landing .listing-card__title a,
body.path-es-pe .listing-card__title a,
body.path-pe .listing-card__title a {
  color: var(--text, #071f4f);
  text-decoration: none;
  font-weight: 900;
}

.directory-country-landing .listing-card__summary,
body.path-es-pe .listing-card__summary,
body.path-pe .listing-card__summary {
  margin: 0 0 .8rem;
  color: var(--muted, #64748b);
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

.listing-card__meta,
body.path-es-pe .listing-card__meta,
body.path-pe .listing-card__meta {
  display: grid;
  gap: .45rem;
}

.directory-country-landing .listing-card__meta-item,
body.path-es-pe .listing-card__meta-item,
body.path-pe .listing-card__meta-item {
  display: flex;
  align-items: center;
  gap: 10px;
  color: var(--text, #071f4f);
  margin-bottom: 8px;
}

.directory-country-landing .listing-card__meta-icon,
body.path-es-pe .listing-card__meta-icon,
body.path-pe .listing-card__meta-icon {
  width: 20px;
  min-width: 20px;
  height: 20px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  line-height: 1;
  color: var(--muted, #64748b);
}

.directory-country-landing .listing-card__meta-icon--pin::before,
body.path-es-pe .listing-card__meta-icon--pin::before,
body.path-pe .listing-card__meta-icon--pin::before {
  content: "";
  width: 24px;
  height: 24px;
  display: block;
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23EA4335' d='M12 2C8.13 2 5 5.13 5 9c0 5.25 7 13 7 13s7-7.75 7-13c0-3.87-3.13-7-7-7zm0 9.5c-1.38 0-2.5-1.12-2.5-2.5s1.12-2.5 2.5-2.5 2.5 1.12 2.5 2.5-1.12 2.5-2.5 2.5z'/%3E%3C/svg%3E");
}

.directory-country-landing .listing-card__flag-img,
body.path-es-pe .listing-card__flag-img,
body.path-pe .listing-card__flag-img {
  width: 22px;
  min-width: 22px;
  height: 16px;
  border-radius: 3px;
  object-fit: cover;
  display: inline-block;
  box-shadow: 0 0 0 1px rgba(15, 23, 42, .08);
}

.directory-country-landing .listing-card__badge,
body.path-es-pe .listing-card__badge,
body.path-pe .listing-card__badge {
  position: absolute;
  top: -10px;
  right: 12px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 28px;
  padding: 0 .65rem;
  border-radius: 999px;
  font-size: .65rem;
  font-weight: 900;
  background: #fff7ed;
  color: #c2410c;
  border: 1px solid #fed7aa;
}

.directory-country-landing .badge--super-top,
body.path-es-pe .badge--super-top,
body.path-pe .badge--super-top { background: #eef2ff; color: #4338ca; border-color: #c7d2fe; }
.directory-country-landing .badge--top,
body.path-es-pe .badge--top,
body.path-pe .badge--top { background: #fff7ed; color: #c2410c; border-color: #fed7aa; }
.directory-country-landing .badge--free,
body.path-es-pe .badge--free,
body.path-pe .badge--free { background: #f8fafc; color: #64748b; border-color: #e2e8f0; }

.directory-country-landing .listing-card__actions,
body.path-es-pe .listing-card__actions,
body.path-pe .listing-card__actions {
  display: flex;
  align-items: center;
  gap: 12px;
  padding-top: 2.5rem;
}

.directory-country-landing .listing-card__action,
body.path-es-pe .listing-card__action,
body.path-pe .listing-card__action {
  width: 50px;
  height: 50px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 999px;
  text-decoration: none;
  background: #fff;
  transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease;
}

.directory-country-landing .listing-card__action--phone,
body.path-es-pe .listing-card__action--phone,
body.path-pe .listing-card__action--phone {
  border: 1px solid #bfd6ff;
  box-shadow: 0 6px 18px rgba(59, 130, 246, .10);
}

.directory-country-landing .listing-card__action--whatsapp,
body.path-es-pe .listing-card__action--whatsapp,
body.path-pe .listing-card__action--whatsapp {
  border: 1px solid #b8efcf;
  box-shadow: 0 6px 18px rgba(34, 197, 94, .10);
}

.directory-country-landing .listing-card__action-icon,
body.path-es-pe .listing-card__action-icon,
body.path-pe .listing-card__action-icon {
  width: 22px;
  height: 22px;
  display: block;
  background-repeat: no-repeat;
  background-position: center;
  background-size: 20px 20px;
}

.directory-country-landing .listing-card__action-icon--phone,
body.path-es-pe .listing-card__action-icon--phone,
body.path-pe .listing-card__action-icon--phone {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%236633CC' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M22 16.92v3a2 2 0 0 1-2.18 2 19.79 19.79 0 0 1-8.63-3.07 19.5 19.5 0 0 1-6-6 19.79 19.79 0 0 1-3.07-8.67A2 2 0 0 1 4.11 2h3a2 2 0 0 1 2 1.72 12.84 12.84 0 0 0 .7 2.81 2 2 0 0 1-.45 2.11L8.09 9.91a16 16 0 0 0 6 6l1.27-1.27a2 2 0 0 1 2.11-.45 12.84 12.84 0 0 0 2.81.7A2 2 0 0 1 22 16.92z'%3E%3C/path%3E%3C/svg%3E");
}

.directory-country-landing .listing-card__action-icon--whatsapp,
body.path-es-pe .listing-card__action-icon--whatsapp,
body.path-pe .listing-card__action-icon--whatsapp {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32'%3E%3Cpath fill='%2325D366' d='M16 3.5C9.1 3.5 3.5 9 3.5 15.8c0 2.4.7 4.8 2 6.8L3.6 28l5.6-1.8c2 1.1 4.3 1.7 6.8 1.7H16c6.9 0 12.5-5.5 12.5-12.2S22.9 3.5 16 3.5Z'/%3E%3Cpath fill='white' d='M12.7 10.5c-.2 0-.5.1-.7.4-.3.3-1 1-1 2.3s1 2.6 1.1 2.8c.1.2 2 3.1 4.8 4.3.7.3 1.2.5 1.6.6.7.2 1.4.2 1.9.1.6-.1 1.7-.7 1.9-1.4.2-.7.2-1.2.1-1.3-.1-.1-.3-.2-.7-.4-.3-.2-1.9-.9-2.2-1-.3-.1-.5-.1-.6.1-.2.3-.7.9-.9 1.1-.2.2-.3.2-.6.1-.3-.2-1.3-.5-2.4-1.5-.9-.8-1.4-1.7-1.6-2-.2-.3 0-.4.1-.6l.4-.5c.1-.2.2-.3.3-.5.1-.2 0-.4 0-.5 0-.1-.6-1.6-.9-2.1-.2-.5-.5-.5-.7-.5h-.6Z'/%3E%3C/svg%3E");
}

@media (max-width: 767px) {
  .directory-country-landing .listing-card__inner,
  body.path-es-pe .listing-card__inner,
  body.path-pe .listing-card__inner {
    grid-template-columns: 96px minmax(0, 1fr);
  }
  .directory-country-landing .listing-card__media img,
  .directory-country-landing .listing-card__image-placeholder,
  body.path-es-pe .listing-card__media img,
  body.path-es-pe .listing-card__image-placeholder,
  body.path-pe .listing-card__media img,
  body.path-pe .listing-card__image-placeholder {
    width: 96px;
  }
  .directory-country-landing .listing-card__actions,
  body.path-es-pe .listing-card__actions,
  body.path-pe .listing-card__actions {
    grid-column: 1 / -1;
    padding-top: 0;
    justify-content: flex-end;
  }
}