/* FARFETCH catalogue geometry. Kept page-local so the shared shell is untouched. */

.farfetch-catalog-page .catalog-layout,
.farfetch-catalog-page .product-grid,
.farfetch-catalog-page .product-grid > * {
  min-width: 0;
}

.farfetch-catalog-page .product-card-media {
  background: #f5f5f5;
}

.farfetch-catalog-page .product-grid {
  row-gap: 36px;
}

.farfetch-catalog-page .product-image {
  object-fit: contain;
  object-position: 50% 50%;
}

.ff-motion-capable .farfetch-catalog-page img.product-image-secondary.ff-load-image.is-loaded {
  opacity: 0;
}

.farfetch-catalog-page .product-price {
  white-space: nowrap;
}

.farfetch-catalog-page .product-availability {
  display: none;
}

/* Frozen Singapore Stone Island listing, 2026-08-13. Source geometry is
 * materially denser than the generic catalogue: 24px edge, 36px columns,
 * 321px cards at 1440, and the heading/department/filter rail sits above the
 * first row at y=449. Keep the route-specific contract reusable for later SG
 * brand captures without changing women/SA catalogue pages. */
.farfetch-catalog-page .catalog-page--stone-island-sg {
  max-width: none;
  padding: 13px 24px 100px;
}

.farfetch-catalog-page .catalog-page--stone-island-sg .catalog-heading {
  min-height: 139px;
}

.farfetch-catalog-page .catalog-page--stone-island-sg .catalog-heading h1 {
  line-height: 38px;
  margin: 47.5px 0 0;
}

.farfetch-catalog-page .catalog-page--stone-island-sg .catalog-department-tabs {
  display: flex;
  gap: 32px;
  height: 48px;
}

.farfetch-catalog-page .catalog-page--stone-island-sg .catalog-department-tabs a {
  color: #222;
  font-size: 15px;
  line-height: 20px;
  text-decoration: none;
}

.farfetch-catalog-page .catalog-page--stone-island-sg .catalog-department-tabs .is-current {
  font-weight: 700;
  text-decoration: underline;
  text-underline-offset: 4px;
}

.farfetch-catalog-page .catalog-page--stone-island-sg .catalog-toolbar {
  border: 0;
  grid-template-columns: 1fr auto 1fr;
  margin-bottom: 52px;
  min-height: 44px;
}

.farfetch-catalog-page .catalog-page--stone-island-sg .filter-toggle {
  border: 1px solid #222;
  font-size: 15px;
  font-weight: 700;
  min-height: 44px;
  padding: 10px 44px 10px 16px;
  position: relative;
}

.farfetch-catalog-page .catalog-page--stone-island-sg .filter-toggle svg {
  position: absolute;
  right: 16px;
}

.farfetch-catalog-page .catalog-page--stone-island-sg .catalog-filter-label--mobile {
  display: none;
}

.farfetch-catalog-page .catalog-page--stone-island-sg .product-grid {
  column-gap: 36px;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  row-gap: 36px;
}

.farfetch-catalog-page .catalog-page--stone-island-sg .product-grid > * {
  height: 536.984375px;
}

.farfetch-catalog-page .catalog-page--stone-island-sg .product-card {
  height: 100%;
}

.farfetch-catalog-page .catalog-page--stone-island-sg .product-card-copy {
  font-size: 15px;
  gap: 4px;
  line-height: 20px;
  padding-top: 12px;
  max-height: 109px;
  overflow: hidden;
}

.farfetch-catalog-page .catalog-page--stone-island-sg .product-card-copy strong,
.farfetch-catalog-page .catalog-page--stone-island-sg .product-price {
  font-size: 15px;
  line-height: 20px;
}

.farfetch-catalog-page .catalog-page--stone-island-sg .product-name {
  min-height: 0;
}

.farfetch-catalog-page .catalog-page--stone-island-sg .product-price {
  margin-top: 4px;
}

.farfetch-catalog-page .catalog-page--stone-island-sg .product-availability {
  display: block;
  font-size: 15px;
  line-height: 20px;
}

.farfetch-catalog-page .catalog-page--stone-island-sg .product-availability strong {
  display: block;
}

@media (min-width: 821px) and (max-width: 1023px) {
  .farfetch-catalog-page .product-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}

@media (hover: hover) and (pointer: fine) and (min-width: 821px) {
  .ff-motion-capable .farfetch-catalog-page .product-card-media:hover img.product-image-secondary.ff-load-image.is-loaded {
    opacity: 1 !important;
  }
}

@media (max-width: 820px) {
  .farfetch-catalog-page .catalog-page {
    max-width: none;
    overflow: clip;
    padding: 12px 16px 72px;
    width: 100%;
  }

  .farfetch-catalog-page .breadcrumbs {
    font-size: 13px;
    gap: 12px;
    line-height: 20px;
    min-height: 20px;
  }

  .farfetch-catalog-page .catalog-heading {
    min-height: 0;
    padding-bottom: 8px;
  }

  .farfetch-catalog-page .catalog-heading h1 {
    font-size: 23px;
    line-height: 28px;
    margin: 20px 0 0;
  }

  .farfetch-catalog-page .catalog-heading p {
    font-size: 13px;
    line-height: 20px;
  }

  .farfetch-catalog-page .catalog-toolbar {
    column-gap: 16px;
    grid-template-columns: auto minmax(0, 1fr);
    margin: 0 0 20px;
    min-height: 56px;
    width: 100%;
  }

  .farfetch-catalog-page .filter-toggle {
    font-size: 13px;
    min-height: 44px;
  }

  .farfetch-catalog-page .filter-toggle svg {
    height: 18px;
    width: 18px;
  }

  .farfetch-catalog-page .catalog-count {
    display: none;
  }

  .farfetch-catalog-page .sort-control {
    justify-self: end;
    max-width: 195px;
    min-width: 0;
    width: 100%;
  }

  .farfetch-catalog-page .sort-control select {
    display: block;
    font-size: 13px;
    height: 44px;
    max-width: none;
    min-width: 0;
    padding: 0 20px 0 0;
    text-align: right;
    text-align-last: right;
    width: 100%;
  }

  .farfetch-catalog-page .filter-panel {
    bottom: auto;
    box-shadow: 0 12px 28px rgb(0 0 0 / 12%);
    height: calc(100vh - 130px);
    height: calc(100dvh - 130px);
    left: 0;
    max-height: calc(100vh - 130px);
    max-height: calc(100dvh - 130px);
    max-width: 100vw;
    overscroll-behavior: contain;
    padding: 0 16px 24px;
    top: 130px;
    transform: translateX(-100%);
    width: 100vw;
  }

  .farfetch-catalog-page .filter-panel.is-open {
    transform: translateX(0);
  }

  .farfetch-catalog-page .filter-panel-heading {
    background: #fff;
    border-bottom: 1px solid #e6e6e6;
    height: 64px;
    margin: 0;
    position: sticky;
    top: 0;
    z-index: 1;
  }

  .farfetch-catalog-page .filter-panel-heading button {
    align-items: center;
    display: inline-flex;
    height: 44px;
    justify-content: center;
    padding: 0;
    width: 44px;
  }

  .farfetch-catalog-page .filter-panel details {
    padding: 0;
  }

  .farfetch-catalog-page .filter-panel summary {
    align-items: center;
    display: flex;
    min-height: 56px;
    margin: 0;
  }

  .farfetch-catalog-page .filter-panel label {
    min-height: 44px;
    margin: 0;
  }

  .farfetch-catalog-page .product-grid {
    --catalog-slide-width: min(164.438px, calc((100% - 12px) / 2));
    column-gap: 0;
    grid-template-columns: repeat(2, minmax(0, var(--catalog-slide-width)));
    justify-content: space-between;
    row-gap: 36px;
    width: 100%;
  }

  .farfetch-catalog-page .product-card {
    margin-inline: 6px;
  }

  .farfetch-catalog-page .product-card-media {
    aspect-ratio: 3 / 4;
  }

  .farfetch-catalog-page .product-image-secondary,
  .farfetch-catalog-page .product-card-media:hover .product-image-secondary,
  .ff-motion-capable .farfetch-catalog-page img.product-image-secondary.ff-load-image.is-loaded {
    opacity: 0 !important;
  }

  .farfetch-catalog-page .save-button {
    height: 44px;
    right: 0;
    top: 0;
    width: 44px;
  }

  .farfetch-catalog-page .save-button svg {
    height: 24px;
    stroke-width: 1.2;
    width: 24px;
  }

  .farfetch-catalog-page .product-card-copy {
    font-size: 13px;
    line-height: 20px;
    padding-top: 6px;
  }

  .farfetch-catalog-page .product-label {
    color: #727272;
    font-size: 13px;
    line-height: 20px;
    margin: 0;
  }

  .farfetch-catalog-page .product-card-copy strong,
  .farfetch-catalog-page .product-price {
    font-size: 13px;
    line-height: 20px;
  }

  .farfetch-catalog-page .product-name {
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    display: -webkit-box;
    line-height: 20px;
    min-height: 40px;
    overflow: hidden;
  }

  .farfetch-catalog-page .product-price {
    margin-top: 8px;
  }

  .farfetch-catalog-page .catalog-page--stone-island-sg {
    padding: 12px 16px 72px;
  }
}

/* The live women clothing listing uses a taller editorial heading before the
 * filter rail on phone widths. Keep this narrow override separate from the
 * 768px three-column state, whose source layout is materially different. */
@media (max-width: 575px) {
  /* The editorial New In landing has no inline search bar in the source.
   * Keep the row for the separate Clothing listing below, but remove it from
   * the landing shell itself. */
  body.farfetch-catalog-page .retail-site-header:has(~ .women-landing-page) .header-secondary {
    display: none !important;
    height: 0 !important;
    min-height: 0 !important;
  }
  .farfetch-catalog-page .catalog-page {
    padding-top: 12px;
  }

  .farfetch-catalog-page .site-header .header-secondary {
    align-items: center;
    border-bottom: 1px solid #e6e6e6 !important;
    display: flex !important;
    height: 56px !important;
    min-height: 56px !important;
    overflow: hidden;
    padding: 0 16px !important;
    position: relative;
  }

  .farfetch-catalog-page .site-header .header-secondary > .category-nav {
    align-items: center;
    display: flex !important;
    flex: 0 0 88px;
    gap: 24px;
    height: 56px;
    left: 16px;
    margin: 0;
    max-width: 88px;
    overflow-x: auto;
    overflow-y: hidden;
    position: absolute;
    top: 0;
    white-space: nowrap;
  }

  .farfetch-catalog-page .site-header .header-secondary > .category-nav a {
    display: block !important;
    flex: 0 0 auto;
    font-size: 15px;
    line-height: 20px;
  }

  .farfetch-catalog-page .site-header .header-secondary > .header-search {
    border-bottom: 1px solid #727272;
    display: flex !important;
    flex: 1 1 auto;
    height: 44px;
    left: 104px;
    margin: 0;
    min-width: 0;
    position: absolute;
    top: 6px;
    width: 270px;
  }

  .farfetch-catalog-page .site-header .header-secondary > .header-search input {
    display: block !important;
  }

  .farfetch-catalog-page .catalog-heading {
    min-height: 161px;
    padding-bottom: 0;
  }

  .farfetch-catalog-page .catalog-heading h1 {
    font-size: 30px;
    line-height: 38px;
    margin-top: 9px;
  }

  .farfetch-catalog-page .catalog-heading .catalog-description {
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    display: -webkit-box;
    font-size: 15px;
    line-height: 20px;
    margin: 10px 0 0;
    overflow: hidden;
  }

  .farfetch-catalog-page .catalog-toolbar {
    margin-bottom: 16px;
    min-height: 76px;
  }

  .farfetch-catalog-page .filter-toggle {
    border: 1px solid #1f1f1f;
    font-size: 15px;
    min-height: 44px;
    padding: 10px 44px 10px 16px;
    position: relative;
  }

  .farfetch-catalog-page .filter-toggle svg {
    position: absolute;
    right: 16px;
  }

  .farfetch-catalog-page .sort-control {
    display: none;
  }

  .farfetch-catalog-page .product-grid {
    --catalog-slide-width: 1fr;
    column-gap: 12px;
  }

  .farfetch-catalog-page .product-card {
    margin-inline: 0;
  }

  .farfetch-catalog-page .catalog-page--stone-island-sg .catalog-heading {
    min-height: 90px;
    padding: 28px 0 0;
    position: relative;
  }

  .farfetch-catalog-page .catalog-page--stone-island-sg .catalog-heading h1 {
    font-size: 30px;
    line-height: 38px;
    margin: 0;
  }

  .farfetch-catalog-page .catalog-page--stone-island-sg .breadcrumbs {
    display: none;
  }

  .farfetch-catalog-page .catalog-page--stone-island-sg .catalog-department-tabs {
    gap: 24px;
    height: 48px;
  }

  .farfetch-catalog-page .catalog-page--stone-island-sg .catalog-toolbar {
    display: block;
    left: 16px;
    margin: 0;
    min-height: 44px;
    position: absolute;
    top: 86px;
    width: calc(100% - 32px);
    z-index: 3;
  }

  .farfetch-catalog-page .catalog-page--stone-island-sg .filter-toggle {
    border: 1px solid #222;
    min-height: 44px;
    padding: 10px 44px 10px 16px;
    width: 100%;
  }

  .farfetch-catalog-page .catalog-page--stone-island-sg .catalog-count,
  .farfetch-catalog-page .catalog-page--stone-island-sg .sort-control {
    display: none;
  }

  .farfetch-catalog-page .catalog-page--stone-island-sg .catalog-filter-label--desktop {
    display: none;
  }

  .farfetch-catalog-page .catalog-page--stone-island-sg .catalog-filter-label--mobile {
    display: inline;
  }

  .farfetch-catalog-page .catalog-page--stone-island-sg .product-grid {
    column-gap: 12px;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    row-gap: 16px;
    margin-top: 4px;
  }

  .farfetch-catalog-page .catalog-page--stone-island-sg .product-grid > * {
    height: 339.640625px;
  }

  .farfetch-catalog-page .catalog-page--stone-island-sg .product-card-copy {
    font-size: 13px;
    gap: 0;
    line-height: 17px;
    padding-top: 6px;
    max-height: 109px;
  }

  .farfetch-catalog-page .catalog-page--stone-island-sg .product-card-copy strong,
  .farfetch-catalog-page .catalog-page--stone-island-sg .product-price {
    font-size: 13px;
    line-height: 17px;
  }

  .farfetch-catalog-page .catalog-page--stone-island-sg .product-name {
    -webkit-line-clamp: 2;
    line-height: 17px;
    min-height: 34px;
  }

  .farfetch-catalog-page .catalog-page--stone-island-sg .product-price {
    margin-top: 4px;
  }

  .farfetch-catalog-page .catalog-page--stone-island-sg .product-availability {
    font-size: 13px;
    line-height: 17px;
  }
}

@media (min-width: 576px) and (max-width: 820px) {
  .farfetch-catalog-page .product-grid {
    --catalog-slide-width: min(220px, calc((100% - 32px) / 3));
    grid-template-columns: repeat(3, minmax(0, var(--catalog-slide-width)));
  }
}

/* Keep the SG brand measurements last so the generic narrow-catalogue
 * refinements above cannot reintroduce variable cards or shifted text. */
@media (max-width: 575px) {
  .farfetch-catalog-page .catalog-page--stone-island-sg .product-card-copy,
  .farfetch-catalog-page .catalog-page--stone-island-sg .product-card-copy strong,
  .farfetch-catalog-page .catalog-page--stone-island-sg .product-price,
  .farfetch-catalog-page .catalog-page--stone-island-sg .product-availability {
    font-size: 15px;
    line-height: 20px;
  }

  .farfetch-catalog-page .catalog-page--stone-island-sg .product-name {
    line-height: 20px;
    min-height: 20px;
  }

  .farfetch-catalog-page .catalog-page--stone-island-sg .product-price {
    margin-top: 0;
  }
}

/* Current women-landing source: the phone header retains its commerce rail.
 * This stylesheet loads after the landing stylesheet, so keep the correction
 * here to supersede the retired compact-landing rule above. */
@media (max-width: 575px) {
  body.farfetch-catalog-page.farfetch-catalog-page .retail-site-header:has(~ .women-landing-page) .compact-mobile-actions {
    display: none !important;
  }

  body.farfetch-catalog-page.farfetch-catalog-page .retail-site-header:has(~ .women-landing-page) .department-nav {
    align-items: center !important;
    display: flex !important;
    height: 44px !important;
    left: 4px !important;
    position: absolute !important;
    top: 0 !important;
  }

  body.farfetch-catalog-page.farfetch-catalog-page .retail-site-header:has(~ .women-landing-page) .department-nav a {
    display: none !important;
  }

  body.farfetch-catalog-page.farfetch-catalog-page .retail-site-header:has(~ .women-landing-page) .welcome-department-picker {
    display: flex !important;
    width: 156.046875px !important;
  }

  body.farfetch-catalog-page.farfetch-catalog-page .retail-site-header:has(~ .women-landing-page) .site-logo {
    left: 82px !important;
    top: 14px !important;
    transform: none !important;
  }

  body.farfetch-catalog-page.farfetch-catalog-page .retail-site-header:has(~ .women-landing-page) .header-actions {
    right: -8px !important;
    top: 0 !important;
    width: 176px !important;
  }

  body.farfetch-catalog-page.farfetch-catalog-page .retail-site-header:has(~ .women-landing-page) .header-actions .region-button,
  body.farfetch-catalog-page.farfetch-catalog-page .retail-site-header:has(~ .women-landing-page) .header-actions .account-button {
    display: flex !important;
  }

  body.farfetch-catalog-page.farfetch-catalog-page .retail-site-header:has(~ .women-landing-page) .header-secondary {
    align-items: center !important;
    border-bottom: 1px solid #e6e6e6 !important;
    display: flex !important;
    height: 56px !important;
    min-height: 56px !important;
    overflow: hidden !important;
    padding: 0 4px !important;
    position: relative !important;
  }

  body.farfetch-catalog-page.farfetch-catalog-page .retail-site-header:has(~ .women-landing-page) .header-secondary > .mobile-menu-button,
  body.farfetch-catalog-page.farfetch-catalog-page .retail-site-header:has(~ .women-landing-page) .header-secondary > .mobile-new-in {
    display: none !important;
  }

  body.farfetch-catalog-page.farfetch-catalog-page .retail-site-header:has(~ .women-landing-page) .header-secondary > .category-nav {
    align-items: center !important;
    display: flex !important;
    flex: 0 0 76px !important;
    flex-direction: row !important;
    gap: 24px !important;
    height: 44px !important;
    left: 4px !important;
    margin: 0 !important;
    max-width: 76px !important;
    overflow-x: auto !important;
    overflow-y: hidden !important;
    padding: 0 0 0 12px !important;
    position: absolute !important;
    top: 0 !important;
    white-space: nowrap !important;
  }

  body.farfetch-catalog-page.farfetch-catalog-page .retail-site-header:has(~ .women-landing-page) .category-nav .sale-link {
    order: -1;
  }

  body.farfetch-catalog-page.farfetch-catalog-page .retail-site-header:has(~ .women-landing-page) .header-secondary > .header-search {
    display: flex !important;
    height: 44px !important;
    left: 104px !important;
    margin: 0 !important;
    min-width: 0 !important;
    position: absolute !important;
    top: 0 !important;
    width: 270px !important;
  }

  body.farfetch-catalog-page.farfetch-catalog-page .retail-site-header:has(~ .women-landing-page) .header-secondary > .header-search input {
    display: block !important;
  }
}

/* Clothing-result pages retain the same compact commerce shell as the live
 * women landing. The legacy catalogue left the generic hamburger shell in
 * place, which made the mobile result visibly different before its content
 * even began. */
@media (max-width: 575px) {
  /* The result shell shares its body class with the editorial women landing.
   * Only result pages hide the promotional copy; the source landing retains
   * the 30px “Incoming | Shop the latest arrivals” message. */
  body.farfetch-catalog-page:not(:has(main.women-landing-page)) .women-landing-promo-copy,
  body.farfetch-catalog-page .retail-site-header .compact-mobile-actions,
  body.farfetch-catalog-page .retail-site-header .header-primary::before {
    display: none !important;
  }

  body.farfetch-catalog-page .retail-site-header .department-nav {
    align-items: center !important;
    display: flex !important;
    height: 44px !important;
    left: 4px !important;
    position: absolute !important;
    top: 0 !important;
  }

  body.farfetch-catalog-page .retail-site-header .department-nav a {
    display: none !important;
  }

  body.farfetch-catalog-page .retail-site-header .welcome-department-picker {
    background: transparent !important;
    border: 1px solid transparent !important;
    display: flex !important;
    font-size: 15px !important;
    font-weight: 700 !important;
    line-height: 20px !important;
    padding: 10px 44px 10px 16px !important;
    width: 156.046875px !important;
  }

  body.farfetch-catalog-page .retail-site-header .site-logo {
    left: 82px !important;
    position: absolute !important;
    top: 14px !important;
    transform: none !important;
  }

  body.farfetch-catalog-page .retail-site-header .header-actions {
    display: flex !important;
    position: absolute !important;
    right: -8px !important;
    top: 0 !important;
    width: 176px !important;
  }

  body.farfetch-catalog-page .retail-site-header .header-actions .region-button,
  body.farfetch-catalog-page .retail-site-header .header-actions .account-button {
    display: flex !important;
  }

  body.farfetch-catalog-page .retail-site-header .header-secondary > .mobile-menu-button,
  body.farfetch-catalog-page .retail-site-header .header-secondary > .mobile-new-in {
    display: none !important;
  }

  body.farfetch-catalog-page .retail-site-header .header-secondary > .category-nav {
    align-items: center !important;
    display: flex !important;
    flex: 0 0 76px !important;
    flex-direction: row !important;
    gap: 24px !important;
    height: 44px !important;
    left: 4px !important;
    margin: 0 !important;
    max-width: 76px !important;
    overflow-x: auto !important;
    overflow-y: hidden !important;
    padding: 0 0 0 12px !important;
    position: absolute !important;
    top: 0 !important;
    white-space: nowrap !important;
  }

  body.farfetch-catalog-page .retail-site-header .header-secondary > .header-search {
    display: flex !important;
    height: 44px !important;
    left: 104px !important;
    margin: 0 !important;
    min-width: 0 !important;
    position: absolute !important;
    top: 0 !important;
    width: 270px !important;
  }

  body.farfetch-catalog-page .retail-site-header .header-secondary > .header-search input {
    display: block !important;
  }

  .farfetch-catalog-page .catalog-toolbar {
    background: #fff;
    border: 0;
  }

  .farfetch-catalog-page .product-grid {
    row-gap: 16px;
  }

  .farfetch-catalog-page .product-card-copy strong,
  .farfetch-catalog-page .product-price {
    font-size: 15px;
    line-height: 20px;
  }

  .farfetch-catalog-page .product-name {
    line-height: 17px;
    min-height: 34px;
  }

  .farfetch-catalog-page .product-label {
    line-height: 17px;
  }

  .farfetch-catalog-page .product-price {
    margin-top: 12px;
  }
}