/* CATNARA CREW REFERRAL RUNTIME CSS
   Semantic replacement for the former HF referral width patch. */

/* CATNARA HF18.1 - Referral list parent-column fix */

.catnara-referral-wide-section {
  width: 100% !important;
  max-width: none !important;
  min-width: 0 !important;
  box-sizing: border-box !important;
}

.catnara-referral-wide-list {
  width: 100% !important;
  max-width: none !important;
  min-width: 0 !important;
  box-sizing: border-box !important;

  /* The actual bug: the list wrapper can remain a two-column grid,
     so 100%-wide cards only fill the LEFT column. Force one column. */
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) !important;
  grid-auto-columns: minmax(0, 1fr) !important;
  justify-items: stretch !important;
  align-items: stretch !important;
}

.catnara-referral-wide-card {
  width: 100% !important;
  max-width: none !important;
  min-width: 0 !important;
  box-sizing: border-box !important;

  /* Span all columns even if an older rule recreates multiple columns. */
  grid-column: 1 / -1 !important;
  justify-self: stretch !important;
  flex: 1 1 100% !important;
  flex-basis: 100% !important;
}

.catnara-referral-wide-chain {
  max-width: none !important;
  min-width: 0 !important;
  width: 100% !important;
  box-sizing: border-box !important;
}

.catnara-referral-wide-card [data-catnara-referral-unclip="1"] {
  max-width: none !important;
  overflow: visible !important;
  text-overflow: clip !important;
  white-space: normal !important;
}

@media (min-width: 800px) {
  .catnara-referral-wide-card {
    padding-left: 18px !important;
    padding-right: 18px !important;
  }
}

@media (max-width: 799px) {
  .catnara-referral-wide-list,
  .catnara-referral-wide-card,
  .catnara-referral-wide-chain {
    width: 100% !important;
    max-width: 100% !important;
  }
}