/* ===== Swap Offer Page Overrides ===== */
/* Keep /swap/:asset adaptive overrides here so they do not affect /buy and /sell. */

body[data-page-group="offers-swap"] {
  --bp2p-offers-swap-action-width: 7.5rem;
}

body[data-page-group="offers-swap"] .offers-swap-form-grid {
  align-items: end;
}

body[data-page-group="offers-swap"] .offers-swap-field-col {
  display: flex;
  flex-direction: column;
}

body[data-page-group="offers-swap"] .offers-swap-field-col .market-select,
body[data-page-group="offers-swap"] .offers-swap-field-col .market-amount-group {
  width: 100%;
}

body[data-page-group="offers-swap"] .offers-swap-summary-row {
  row-gap: .875rem;
}

body[data-page-group="offers-swap"] .market-amount-group {
  position: relative;
  isolation: isolate;
}

body[data-page-group="offers-swap"] .market-amount-group > .form-control {
  padding-right: 4.2rem;
  border-radius: var(--tblr-border-radius) !important;
  border-top-right-radius: var(--tblr-border-radius) !important;
  border-bottom-right-radius: var(--tblr-border-radius) !important;
}

body[data-page-group="offers-swap"] .market-amount-fiat--static {
  position: absolute;
  top: 50%;
  right: .3rem;
  z-index: 7;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 0 !important;
  background: transparent;
  border: 0;
  line-height: 1;
  transform: translateY(-50%);
}

body[data-page-group="offers-swap"] .market-amount-fiat--static .market-amount-code {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 3.5rem;
  min-height: 1.9rem;
  height: 1.9rem;
  padding: .125rem .5rem .0625rem;
  border: 1px solid var(--tblr-border-color);
  border-radius: calc(var(--tblr-border-radius) - 2px);
  background: var(--tblr-bg-surface);
  color: var(--tblr-body-color);
  font-size: .875rem;
  font-weight: 600;
  line-height: 1;
  white-space: nowrap;
}

body[data-page-group="offers-swap"] .offers-table-seller-cell {
  width: 27%;
  min-width: 12.5rem;
}

body[data-page-group="offers-swap"] .offers-swap-table-receive-cell {
  width: 24%;
  min-width: 11.5rem;
}

body[data-page-group="offers-swap"] .offers-swap-table-price-head {
  white-space: nowrap;
}

body[data-page-group="offers-swap"] .offers-swap-table-head-inner {
  display: inline-grid;
  grid-template-columns: auto var(--bp2p-offers-swap-action-width);
  align-items: center;
  gap: .75rem;
  width: max-content;
  max-width: 100%;
  margin-left: auto;
}

body[data-page-group="offers-swap"] .offers-swap-table-head-inner > span {
  justify-self: end;
}

body[data-page-group="offers-swap"] .offers-swap-sort-select {
  display: inline-flex;
  flex: 0 0 auto;
  justify-self: end;
}

body[data-page-group="offers-swap"] .offers-swap-table-price-cell {
  width: 1%;
  min-width: 18rem;
}

body[data-page-group="offers-swap"] .offers-swap-table-price-layout {
  display: inline-grid;
  grid-template-columns: auto var(--bp2p-offers-swap-action-width);
  align-items: center;
  gap: 1rem;
  width: max-content;
  max-width: 100%;
  margin-left: auto;
}

body[data-page-group="offers-swap"] .offers-swap-table-price-copy {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  gap: .25rem;
  min-width: 0;
}

body[data-page-group="offers-swap"] .offers-swap-table-price-copy .offers-table-price-limits {
  margin-top: 0;
  flex-wrap: nowrap !important;
  justify-content: flex-end;
}

body[data-page-group="offers-swap"] .offers-swap-table-action {
  width: 100%;
  min-width: var(--bp2p-offers-swap-action-width);
  flex: 0 0 auto;
}

body[data-page-group="offers-swap"] .offers-swap-table-receive img {
  flex: 0 0 auto;
  border-radius: 999px;
}

@media (max-width: 991.98px) {
  body[data-page-group="offers-swap"] .offers-swap-summary-row {
    align-items: flex-start !important;
  }
}

@media (min-width: 768px) and (max-width: 991.98px) {
  body[data-page-group="offers-swap"] {
    --bp2p-offers-swap-action-width: 6.5rem;
  }

  body[data-page-group="offers-swap"] .offers-results-card .table thead th,
  body[data-page-group="offers-swap"] .offers-results-card .table tbody td {
    padding-inline: .75rem;
  }

  body[data-page-group="offers-swap"] .offers-table-seller-cell {
    width: 28%;
    min-width: 10.75rem;
  }

  body[data-page-group="offers-swap"] .offers-swap-table-receive-cell {
    width: 24%;
    min-width: 10.5rem;
  }

  body[data-page-group="offers-swap"] .offers-swap-table-price-cell {
    min-width: 14.25rem;
  }

  body[data-page-group="offers-swap"] .offers-swap-table-price-layout {
    gap: .75rem;
  }

  body[data-page-group="offers-swap"] .offers-swap-table-head-inner {
    gap: .5rem;
  }

  body[data-page-group="offers-swap"] .offers-swap-table-price-copy .offers-table-price-main {
    gap: .5rem !important;
  }
}

@media (max-width: 575.98px) {
  body[data-page-group="offers-swap"] .offers-swap-summary-row {
    justify-content: flex-start !important;
  }

  body[data-page-group="offers-swap"] .offers-swap-summary-row > .btn[type="submit"] {
    width: 100%;
  }

  body[data-page-group="offers-swap"] .market-amount-group > .form-control {
    padding-right: 4rem;
  }

  body[data-page-group="offers-swap"] .market-amount-fiat--static {
    right: .35rem;
  }

  body[data-page-group="offers-swap"] .market-amount-fiat--static .market-amount-code {
    min-width: 3.5rem;
  }
}

@media (min-width: 992px) and (max-width: 1199.98px) {
  body[data-page-group="offers-swap"] {
    --bp2p-offers-swap-action-width: 6.75rem;
  }

  body[data-page-group="offers-swap"] .offers-table-seller-cell {
    width: 28%;
    min-width: 12rem;
  }

  body[data-page-group="offers-swap"] .offers-swap-table-receive-cell {
    width: 24%;
    min-width: 10.5rem;
  }

  body[data-page-group="offers-swap"] .offers-swap-table-price-cell {
    min-width: 16rem;
  }

  body[data-page-group="offers-swap"] .offers-swap-table-price-layout {
    gap: .75rem;
  }

  body[data-page-group="offers-swap"] .offers-swap-table-head-inner {
    gap: .5rem;
  }
}