/* fortisx: larger sticky trade panel; chart stays docked */
@media (max-width: 1100px) {
  :root {
    /* slightly shorter chart → more room for trade form */
    --fx-chart-h: min(240px, 30vh) !important;
  }

  .fx-page,
  .sec-page,
  .sec-fx {
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
  }

  /* keep pair bar + trade form visible while scrolling orders/assets */
  .fx-page > .fx-pair-bar,
  .sec-page > .fx-pair-bar,
  .sec-fx > .fx-pair-bar {
    position: sticky;
    top: 0;
    z-index: 27;
    background: #000;
    border-bottom: 1px solid #1a1d21;
  }

  .fx-page > .fx-trade-row,
  .sec-page > .fx-trade-row,
  .sec-fx > .fx-trade-row {
    position: sticky;
    top: 42px; /* under pair bar */
    z-index: 26;
    background: #000;
    min-height: min(52vh, 460px) !important;
    max-height: none !important;
    flex: 1 1 auto !important;
    border-bottom: 1px solid #1a1d21;
    box-shadow: 0 8px 16px rgba(0,0,0,.45);
  }

  .fx-page > .fx-trade-row .fx-form,
  .sec-fx > .fx-trade-row .fx-form {
    min-height: min(52vh, 460px);
  }

  .fx-page > .fx-form-body,
  .fx-page .fx-form-body,
  .sec-fx .fx-form-body {
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
  }

  /* orders/assets scroll under sticky trade block */
  .fx-page > .fx-bottom,
  .fx-page > .panel.bottom,
  .sec-fx > .fx-bottom,
  .sec-page > .fx-bottom {
    position: relative;
    z-index: 1;
    max-height: none !important;
    min-height: 180px;
    padding-bottom: 8px;
  }

  .fx-mode-title {
    font-size: 16px !important;
  }
}
