/*
 * positions — Open-positions Team/Location facet-filter shell.
 * Values from the spec's ## Computed Styles, per viewport (1440 base;
 * 768 -> max-width:991; 375 -> max-width:479; form row->column flip at
 * max-width:767). Run breakpoint set: {479, 767, 991, 1919}.
 * All selectors scoped under the component root to keep cross-component
 * canonical utility classes (c-all_blogs__*, c-about_info__*, c-accordion__*,
 * c-careers_jointeam__*) from bleeding into their owning components.
 */

/* ---- Section root ------------------------------------------------------- */
.c-positions__section-positions {
  display: block;
  width: 100%;
  font-family: var(--font-family-body);
  font-size: 16px;
  font-weight: 400;
  line-height: 24px;
  color: var(--color-text-primary); /* rgb(51,51,51) */
}

/* ---- Padding wrapper (padding-global + padding-section-medium) ---------- */
.c-positions__section-positions .c-about_info__heading-wrap-5 {
  display: block;
  padding: 96px var(--space-40); /* 96px 40px */
}

/* ---- Hidden Webflow CMS source lists (feed the visible dropdowns) ------- */
.c-positions__section-positions .positions__cms-source {
  display: none;
}

/* ---- Content column (container-large + max-width-856) ------------------- */
.c-positions__section-positions .c-about_info__heading-wrap {
  display: block;
  max-width: 856px;
  margin-inline: auto; /* centres the 856px column; = spec's 1440 margin 0 252px */
}

/* ---- Filter form ------------------------------------------------------- */
.c-positions__section-positions .c-all_blogs__category-filter-form {
  display: block;
  width: 100%;
}
.c-positions__section-positions .c-positions__form-2 {
  display: flex;
  align-items: center;
  gap: 100px;
  margin: 0 0 var(--space-20); /* 0 0 20px */
  width: 100%;
}

/* Facet control wrapper (filter-item) — fixed width per breakpoint. */
.c-positions__section-positions .c-positions__filter-item {
  display: flex;
  position: relative;
  align-items: center;
  gap: var(--space-10); /* 10px */
  width: 328px;
  height: 38px;
  color: var(--color-text-secondary); /* rgb(115,115,115) — label chrome */
}
.c-positions__section-positions .positions__facet-label {
  flex: 0 0 auto;
  color: var(--color-text-secondary);
}
/* Reconstructed dropdown box (beyond capture depth-5): bordered white box,
   "All" default on the left, dark caret on the right. */
.c-positions__section-positions .positions__facet-select {
  flex: 1 1 auto;
  display: flex;
  align-items: center;
  justify-content: space-between;
  height: 38px;
  padding: 0 var(--space-12);
  border: 1px solid var(--color-text-dark); /* rgb(18,18,18) */
  background: var(--color-bg-page);
  color: var(--color-text-dark);
}
.c-positions__section-positions .positions__facet-value {
  color: var(--color-text-dark);
}
.c-positions__section-positions .positions__facet-chevron {
  flex: 0 0 auto;
  width: 0;
  height: 0;
  border-left: 5px solid transparent;
  border-right: 5px solid transparent;
  border-top: 6px solid var(--color-text-dark);
}
.c-positions__section-positions .positions__reset {
  width: 0;
  height: 0;
}

/* Webflow submit-result boxes — hidden at rest (no captured "after" state). */
.c-positions__section-positions .positions__form-done {
  display: none;
  padding: var(--space-20);
  text-align: center;
  background-color: rgb(221, 221, 221);
}
.c-positions__section-positions .positions__form-fail {
  display: none;
  margin: var(--space-10) 0 0;
  padding: var(--space-10);
  background-color: rgb(255, 222, 222);
}

/* ---- Native empty-collection bar (w-dyn-empty) ------------------------- */
.c-positions__section-positions .c-positions__collection-list-wrapper-2 {
  display: block;
  width: 100%;
}
.c-positions__section-positions .positions__dyn-empty {
  display: block;
  padding: var(--space-10);
  width: 100%;
  background-color: rgb(221, 221, 221);
}
.c-positions__section-positions .positions__dyn-empty-text {
  display: block;
}

/* ---- Custom no-results state (no-result-found) ------------------------- */
.c-positions__section-positions .c-all_blogs__no-result-found {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  padding: var(--space-40) 0; /* 40px 0 */
  width: 100%;
}
.c-positions__section-positions .c-positions__media {
  display: block;
  width: 256px;
  max-width: 100%;
  height: 256px;
  object-fit: contain;
}
.c-positions__section-positions .positions__no-result-text {
  display: block;
}

/* ---- Tablet (<=991px) — 768 measurements ------------------------------- */
@media (max-width: 991px) {
  .c-positions__section-positions .c-about_info__heading-wrap-5 {
    padding: var(--space-64) var(--space-40); /* 64px 40px */
  }
  .c-positions__section-positions .c-positions__filter-item {
    width: 290px;
  }
}

/* ---- Form row -> column flip (<=767px) --------------------------------- */
@media (max-width: 767px) {
  .c-positions__section-positions .c-positions__form-2 {
    flex-direction: column;
    justify-content: space-between;
    align-items: center;
    gap: var(--space-12); /* 12px */
  }
  .c-positions__section-positions .c-positions__filter-item {
    width: 100%;
  }
}

/* ---- Mobile (<=479px) — 375 measurements ------------------------------- */
@media (max-width: 479px) {
  .c-positions__section-positions .c-about_info__heading-wrap-5 {
    padding: 48px var(--space-16); /* 48px 16px */
  }
}
