/* IyangaMarket gateway desktop density pass.
   Scoped to the root gateway by its unique home aria-label so the Food and Labour apps are unaffected. */
@media (min-width: 1024px) {
  main:has(a[aria-label="IyangaMarket home"]) {
    height: 100dvh !important;
    min-height: 0 !important;
    overflow: hidden !important;
  }

  /* Compact the black hero so the market panels get substantially more viewport height. */
  main:has(a[aria-label="IyangaMarket home"]) > div:first-child {
    height: 132px !important;
  }

  main:has(a[aria-label="IyangaMarket home"]) > div:first-child > header > div {
    height: 42px !important;
    padding-left: 20px !important;
    padding-right: 20px !important;
  }

  /* The PNG has generous internal whitespace, so enlarge it visually without making the header taller. */
  main:has(a[aria-label="IyangaMarket home"]) a[aria-label="IyangaMarket home"] {
    width: 170px !important;
    height: 42px !important;
    display: flex !important;
    align-items: center !important;
    overflow: visible !important;
  }

  main:has(a[aria-label="IyangaMarket home"]) img[alt="IyangaMarket"] {
    height: 58px !important;
    width: auto !important;
    max-width: none !important;
    transform: scale(1.55) !important;
    transform-origin: left center !important;
  }

  main:has(a[aria-label="IyangaMarket home"]) > div:first-child > section {
    height: 90px !important;
    min-height: 0 !important;
    padding-top: 0 !important;
    padding-bottom: 0 !important;
  }

  main:has(a[aria-label="IyangaMarket home"]) > div:first-child > section > div {
    transform: translateY(-2px) !important;
  }

  main:has(a[aria-label="IyangaMarket home"]) > div:first-child h1 {
    font-size: 34px !important;
    line-height: 1 !important;
  }

  main:has(a[aria-label="IyangaMarket home"]) > div:first-child > section > div > p {
    margin-top: 4px !important;
    font-size: 13px !important;
  }

  main:has(a[aria-label="IyangaMarket home"]) > div:first-child > section > div > div {
    margin-top: 5px !important;
    padding: 3px 10px !important;
    font-size: 9px !important;
  }

  /* Use almost the whole remaining viewport for the two market panels. */
  main:has(a[aria-label="IyangaMarket home"]) > div:nth-child(2) {
    height: calc(100dvh - 138px) !important;
    margin-top: 6px !important;
    max-width: 1720px !important;
    gap: 12px !important;
    padding-left: 14px !important;
    padding-right: 14px !important;
    padding-bottom: 4px !important;
  }

  main:has(a[aria-label="IyangaMarket home"]) > div:nth-child(2) > section {
    grid-template-rows: 70px 52px minmax(0, 1fr) 52px !important;
    border-radius: 16px !important;
  }

  /* Market title area. */
  main:has(a[aria-label="IyangaMarket home"]) > div:nth-child(2) > section > div:nth-child(1) {
    gap: 12px !important;
    padding-left: 16px !important;
    padding-right: 16px !important;
  }

  main:has(a[aria-label="IyangaMarket home"]) > div:nth-child(2) > section > div:nth-child(1) > div:first-child {
    width: 52px !important;
    height: 52px !important;
    border-radius: 14px !important;
  }

  main:has(a[aria-label="IyangaMarket home"]) > div:nth-child(2) > section > div:nth-child(1) h2 {
    font-size: 24px !important;
  }

  main:has(a[aria-label="IyangaMarket home"]) > div:nth-child(2) > section > div:nth-child(1) p {
    margin-top: 3px !important;
    font-size: 9.5px !important;
  }

  /* Category/service rail. */
  main:has(a[aria-label="IyangaMarket home"]) > div:nth-child(2) > section > div:nth-child(2) {
    padding-left: 16px !important;
    padding-right: 16px !important;
    padding-bottom: 0 !important;
  }

  main:has(a[aria-label="IyangaMarket home"]) > div:nth-child(2) > section > div:nth-child(2) > div:first-child {
    margin-bottom: 2px !important;
  }

  /* Give the nearby list maximum usable height. */
  main:has(a[aria-label="IyangaMarket home"]) > div:nth-child(2) > section > div:nth-child(3) {
    padding-left: 16px !important;
    padding-right: 16px !important;
  }

  main:has(a[aria-label="IyangaMarket home"]) > div:nth-child(2) > section > div:nth-child(3) > div:first-child {
    margin-bottom: 2px !important;
  }

  /* Smaller rows make roughly seven nearby results visible at 100% zoom. */
  main:has(a[aria-label="IyangaMarket home"]) > div:nth-child(2) > section > div:nth-child(3) > div:nth-child(2) > a {
    height: 46px !important;
    min-height: 46px !important;
    grid-template-columns: 48px minmax(0, 1fr) 62px 14px !important;
    gap: 6px !important;
    padding: 2px 6px !important;
  }

  main:has(a[aria-label="IyangaMarket home"]) > div:nth-child(2) > section > div:nth-child(3) > div:nth-child(2) > a > div:first-child {
    width: 44px !important;
    height: 36px !important;
  }

  main:has(a[aria-label="IyangaMarket home"]) > div:nth-child(2) > section > div:nth-child(3) > div:nth-child(2) > a p:first-child {
    font-size: 9px !important;
  }

  main:has(a[aria-label="IyangaMarket home"]) > div:nth-child(2) > section > div:nth-child(3) > div:nth-child(2) > a p:nth-child(2) {
    font-size: 7.5px !important;
  }

  main:has(a[aria-label="IyangaMarket home"]) > div:nth-child(2) > section > div:nth-child(3) > div:nth-child(2) > a p:nth-child(3) {
    font-size: 7px !important;
  }

  /* Compact bottom CTAs while keeping them visually strong. */
  main:has(a[aria-label="IyangaMarket home"]) > div:nth-child(2) > section > a:last-child {
    height: 46px !important;
    margin: 2px 16px 4px !important;
    padding-left: 14px !important;
    padding-right: 14px !important;
  }

  main:has(a[aria-label="IyangaMarket home"]) > div:nth-child(2) > section > a:last-child > svg {
    width: 26px !important;
    height: 26px !important;
  }

  main:has(a[aria-label="IyangaMarket home"]) > div:nth-child(2) > section > a:last-child span span:first-child {
    font-size: 11.5px !important;
  }

  main:has(a[aria-label="IyangaMarket home"]) > div:nth-child(2) > section > a:last-child span span:last-child {
    font-size: 7.5px !important;
  }
}