/* ============================================================
   SPO - Fiche annonce HivePress UX v2
   Strictly limited to public hp_listing single pages.
   ============================================================ */

body.single-hp_listing {
  background: #f5f7fa;
}

body.single-hp_listing .site-content {
  --listing-ink: #11283f;
  --listing-muted: #587086;
  --listing-blue: #123e66;
  --listing-green: #087255;
  --listing-soft: #f3f7fb;
  --listing-line: rgba(15, 42, 68, .12);
  --listing-radius: 18px;
  --listing-shadow: 0 12px 32px rgba(15, 42, 68, .07);
}

body.single-hp_listing .hp-page__title,
body.single-hp_listing .hp-listing__title {
  color: var(--listing-ink);
  font-size: clamp(27px, 3vw, 37px);
  letter-spacing: -.035em;
  line-height: 1.13;
}

body.single-hp_listing :is(.hp-page__content, .hp-page__sidebar) :is(.hp-block, .hp-widget, .hp-listing__attributes) {
  overflow: hidden;
  margin-bottom: 16px;
  padding: clamp(16px, 2.5vw, 23px);
  border: 1px solid var(--listing-line);
  border-radius: var(--listing-radius);
  background: #fff;
  box-shadow: var(--listing-shadow);
}

body.single-hp_listing :is(.hp-listing__attribute, .hp-listing__details, .hp-listing__description) {
  color: var(--listing-muted);
  line-height: 1.65;
}

body.single-hp_listing :is(.hp-button, button.hp-button, .button, input[type="submit"]) {
  min-height: 48px;
  padding: 12px 18px;
  border-radius: 13px;
  background: var(--listing-blue);
  color: #fff;
  font-weight: 750;
}

body.single-hp_listing :is(.spo-training-card, .spo-widget) {
  overflow: hidden;
  border: 1px solid var(--listing-line);
  border-radius: var(--listing-radius);
  background: #fff;
  box-shadow: var(--listing-shadow);
}

body.single-hp_listing .spo-training-card--premium {
  border-top: 4px solid var(--listing-green);
}

body.single-hp_listing :is(a, button, input, select, textarea):focus-visible {
  outline: 3px solid #2767b1;
  outline-offset: 3px;
}

@media (max-width: 680px) {
  body.single-hp_listing :is(.hp-page__content, .hp-page__sidebar) :is(.hp-block, .hp-widget, .hp-listing__attributes) {
    padding: 16px 14px;
    border-radius: 15px;
  }
}