/* Marketplace responsive repair */

body:not(.landing-page) .page-content {
  max-width: 100% !important;
  overflow-x: hidden !important;
}

.filter-bar {
  display: grid !important;
  grid-template-columns: minmax(260px, 1fr) repeat(3, minmax(160px, 210px)) !important;
  gap: 12px !important;
  align-items: stretch !important;
  width: 100% !important;
}

.filter-bar .search-input-wrap,
.filter-bar .filter-select,
.filter-bar select,
.filter-bar input {
  width: 100% !important;
  min-width: 0 !important;
}

.master-cards-grid {
  display: grid !important;
  grid-template-columns: repeat(auto-fit, minmax(290px, 1fr)) !important;
  gap: 16px !important;
  width: 100% !important;
  align-items: stretch !important;
}

.master-card {
  min-width: 0 !important;
  width: 100% !important;
}

.master-card * {
  max-width: 100%;
}

.mkt-metric-grid {
  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
}

.mkt-split {
  grid-template-columns: minmax(0, 1.4fr) minmax(280px, .9fr) !important;
  min-width: 0 !important;
}

.mkt-chart-box,
.mkt-split .card {
  min-width: 0 !important;
  overflow: hidden !important;
}

#master-detail-modal .modal,
#follow-master-modal .modal {
  max-height: calc(100vh - 28px) !important;
  overflow: hidden !important;
  display: flex !important;
  flex-direction: column !important;
}

#master-detail-body,
#follow-master-body {
  overflow-y: auto !important;
  -webkit-overflow-scrolling: touch !important;
  padding-bottom: 8px !important;
}

#master-detail-modal .modal-header,
#follow-master-modal .modal-header,
#master-detail-modal .modal-footer,
#follow-master-modal .modal-footer {
  flex: 0 0 auto !important;
}

#master-detail-modal .table-wrap,
#follow-master-modal .table-wrap {
  width: 100% !important;
  max-width: 100% !important;
  overflow-x: auto !important;
}

#master-detail-modal table,
#follow-master-modal table {
  min-width: 760px !important;
}

@media(max-width:1180px) {
  .filter-bar {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }

  .filter-bar .search-input-wrap {
    grid-column: 1 / -1 !important;
  }

  .mkt-split {
    grid-template-columns: 1fr !important;
  }
}

@media(max-width:760px) {
  .filter-bar {
    grid-template-columns: 1fr !important;
  }

  .master-cards-grid {
    grid-template-columns: 1fr !important;
    gap: 14px !important;
  }

  .master-card {
    padding: 16px !important;
  }

  .master-card > div:first-child {
    align-items: flex-start !important;
  }

  .master-card .btn,
  .master-card a.btn {
    width: 100% !important;
    justify-content: center !important;
  }

  .mkt-metric-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 10px !important;
  }

  #master-detail-modal .modal,
  #follow-master-modal .modal {
    width: calc(100vw - 18px) !important;
    max-width: calc(100vw - 18px) !important;
    max-height: calc(100vh - 18px) !important;
  }

  #master-detail-modal .modal-header,
  #follow-master-modal .modal-header,
  #master-detail-modal .modal-footer,
  #follow-master-modal .modal-footer {
    padding-left: 14px !important;
    padding-right: 14px !important;
  }

  #master-detail-body,
  #follow-master-body {
    padding-left: 14px !important;
    padding-right: 14px !important;
  }
}

@media(max-width:480px) {
  .mkt-metric-grid {
    grid-template-columns: 1fr !important;
  }

  .mkt-chart-box {
    min-height: 220px !important;
    padding: 10px !important;
  }

  #perf-equity-chart,
  #perf-monthly-chart {
    min-width: 0 !important;
  }
}
