/*----AFFILIATES LIST BEGINS HERE----*/

/* Helpers */
.sr-only{
  position:absolute!important;width:1px!important;height:1px!important;
  padding:0!important;margin:-1px!important;overflow:hidden!important;
  clip:rect(0,0,0,0)!important;white-space:nowrap!important;border:0!important;
}

.vendor-directory { padding: 22px 15px 30px; }

/* Filter header */

.vendor-top{ /* display:flex; justify-content:space-between; align-items:flex-start; gap: 18px; margin-bottom: 14px;*/ }
.vendor-top__left{ flex: 1; }
.vendor-title{ margin:0; font-size: 28px; font-weight: 800; }
.vendor-subtitle{ margin: 6px 0 0; opacity: .85; }
.vendor-filters{ display:flex; align-items:center; gap: 10px; width: min(660px, 100%); }
.vendor-input,
.vendor-select { height: 38px; border-radius: 10px; border: 1px solid rgba(0,0,0,.18); padding: 0 12px; font-weight: 650; outline: none; }

.vendor-input{ flex: 1; background: #fff; }

.vendor-select{ width: 180px; /*background: #eef4ff;*/ }

.vendor-go { /*width: 38px; height: 38px; border-radius: 999px; border: 1px solid rgba(0,0,0,.18); background: #fff; font-size: 18px; line-height: 1;*/ cursor: pointer; }

.vendor-section { margin: 16px 0 12px; /*font-size: 16px;*/ font-weight: 800; }

.vendor-subtitle { margin: 16px 0 12px; font-size: 16px; font-weight: 800; }

.vendor-icon { display: inline-block; vertical-align: middle; }

/* Grid */
.vendor-grid { display:grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; }

/* Card */
.vendor-card { position: relative; background: #fff; border-radius: 12px; border: 1px solid rgba(0,0,0,.12); box-shadow: 0 1px 0 rgba(0,0,0,.05); overflow: hidden; }

.vendor-card__flag { position: absolute; top: 0; left: 0; z-index: 2; width: 100%; display: block; max-width: 100%; background: #394a59; color: #ffffff; text-align: center; padding-top: 5px; padding-bottom: 5px; font-weight: bold; }

.vendor-card__flag span { display: inline-block; font-weight: 900; font-size: 12px; color: #fff; background: #394a59; padding: 6px 10px; border-radius: 0; width: 100%; max-width: 100%; display: block; text-align: center; }

.vendor-card__body{ display:grid; grid-template-columns: 180px 1fr; gap: 14px; padding: 14px; padding-top: 44px; /* gives space for FEATURED flag */ }

.vendor-card:not(.vendor-card--featured) .vendor-card__body { padding-top: 14px; }

.vendor-card__aside { display:flex; flex-direction:column; gap: 10px; }

.vendor-card__logo { border: 1px solid rgba(0, 0, 0, .12); border-radius: 10px; padding: 10px; background: #fff; height: 120px; display: flex; justify-content: center; align-items: center; }

.vendor-card__logo img { display:block; width: 100%; height: auto; object-fit: contain; }

.vendor-card__email { display:inline-flex; align-items:center; justify-content:center; gap: 8px; padding: 10px 12px; border-radius: 999px; border: none; text-decoration: none; font-weight: 800; color: #fff; background: #394a59; }

a.vendor-card__email.button { display: inline-flex; color: #fff; }
a.vendor-card__email.button:hover { background: #2b3a47; color: #fff; }

.vendor-card__tier { margin-top:auto; font-weight: 900; font-size: 12px; border-radius: 999px; width: fit-content; padding: 7px 10px; background: #eef2ff; border: 1px solid rgba(0,0,0,.12); }

.vendor-card__tier.tier--bronze{ background:#fff2e6; }

.vendor-card__tier.tier--diamond{ background:#eefcff; }

.vendor-card__header { /*display:flex; align-items:flex-start; justify-content:space-between; gap: 10px;*/ }

.vendor-card__name { margin: 0; font-size: 25px; font-weight: 900; }

.vendor-badges { display:flex; gap: 8px; flex-wrap:wrap; justify-content:flex-end; }

.badge { font-size: 12px; font-weight: 900; padding: 6px 10px; border-radius: 999px; border: 1px solid rgba(0,0,0,.14); white-space: nowrap; }

.badge--blue{ background:#eef4ff; color:#1f4b8f; }

.badge--gold{ background:#ffe36c; color:#111; }

.vendor-meta { list-style:none; margin: 10px 0 0; padding: 0; display:grid; gap: 6px; font-size: 16px; }

.vendor-tags { margin-top: 12px; display:grid; gap: 8px; font-size: 13px; }

.tag-label { opacity:.7; font-weight: 800; margin-right: 6px; }

.tag-pill { display:inline-block; padding: 6px 10px; border-radius: 10px; border: 1px solid rgba(0,0,0,.12); background: #f6f7fb; font-weight: 800; }

.vendor-empty { grid-column: 1 / -1; padding: 14px; border-radius: 12px; background: rgba(255,255,255,.85); border: 1px solid rgba(0,0,0,.12); }

/* Logo placeholder */
.vendor-card__logo-placeholder { display:flex; align-items:center; justify-content:center; font-size: 36px; font-weight: 900; color: #394a59; opacity: .3; }

/* PAGINATION */

.vendor-pagination{ display:flex; justify-content:space-between; align-items:center; margin-top:24px; gap:16px; flex-wrap:wrap; }

.vendor-pagination__left{ display:flex; align-items:center; gap:8px; font-weight:700; }

.vendor-perpage{ width:90px; }

.vendor-pagination__right{ display:flex; align-items:center; gap:8px; }

.vendor-page-btn{ padding:8px 14px; border-radius:8px; border:1px solid rgba(0,0,0,.2); background:#fff; cursor:pointer; font-weight:700; }

.vendor-page-btn:hover{ background:#394a59; color:#fff; }

.vendor-page-btn:disabled{ opacity:.35; cursor:not-allowed; }

.vendor-page-numbers{ display:flex; gap:6px; }

.vendor-page-number{ padding:7px 11px; border-radius:8px; border:1px solid rgba(0,0,0,.2); cursor:pointer; font-weight:700; background:#fff; color: #394a59; }

.vendor-page-number.active{ background:#394a59; color:#fff; }

.vendor-page-dots{ padding:7px 4px; font-weight:700; color:#999; user-select:none; }

/* Dropdown arrow */
.vendor-select-wrap { position: relative; width: 180px; }

@media (max-width: 750px){
  .vendor-select-wrap{ width: 100%; }
}

.vendor-select{ -webkit-appearance: none; -moz-appearance: none; appearance: none; width: 100%; padding-right: 42px; background-color: #fff; }

.vendor-select-wrap::after { content:""; position:absolute; right: 14px; top: 50%; width: 12px; height: 12px; transform: translateY(-50%); pointer-events: none; background-repeat: no-repeat; background-size: 12px 12px; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23394a59' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'/%3E%3C/svg%3E"); }

.vendor-select:focus { outline: none; box-shadow: 0 0 0 3px rgba(57,74,89,.15); }

/* Responsive */
@media (max-width: 980px){
  .vendor-top{ flex-direction:column; }
  .vendor-top__right{ text-align:left; }
  .vendor-card__body{ grid-template-columns: 160px 1fr; }
}

@media (max-width: 750px){
  .vendor-grid{ grid-template-columns: 1fr; }
  .vendor-select{ width: 100%; }
  .vendor-filters{ flex-direction:column; align-items:stretch; width: 100%; }
  .vendor-top__left { width: 100%; }
  .vendor-input { padding: 15px; }
  .vendor-pagination{ flex-direction:column; align-items:stretch; text-align:center; }
  .vendor-pagination__left{ justify-content:center; }
  .vendor-pagination__right{ justify-content:center; flex-wrap:wrap; }
  .vendor-page-numbers{ flex-wrap:wrap; justify-content:center; }
}

@media (max-width: 560px){
  .vendor-card__body{ grid-template-columns: 1fr; }
  .vendor-card__logo img { width: inherit; height: inherit; }
}

/*----AFFILIATES LIST ENDS HERE----*/