/* DPX v0.6.5-2 targeted same-version layout corrections.
   Loaded after v065-patches.css. No trading, settlement, broker, or data logic
   is changed by this stylesheet. */

/* 1. PC administrator account dropdown: escape compact-strip clipping and
   keep the complete menu above the Candle Trend/chart area. */
@media (min-width: 901px) and (min-height: 601px) {
  html body#dpxRoot.desktop-tab-layout .compact-account-strip.session-bar {
    position: relative !important;
    z-index: 3000 !important;
    overflow: visible !important;
  }
  html body#dpxRoot.desktop-tab-layout .compact-account-strip .session-account-slot,
  html body#dpxRoot.desktop-tab-layout .compact-account-strip #accountBar,
  html body#dpxRoot.desktop-tab-layout .compact-account-strip .account-menu-wrap {
    position: relative !important;
    z-index: 3001 !important;
    overflow: visible !important;
  }
  html body#dpxRoot.desktop-tab-layout #sessionAccountSlot .account-menu {
    z-index: 4000 !important;
  }
  html body#dpxRoot.desktop-tab-layout .demo-layout,
  html body#dpxRoot.desktop-tab-layout .desktop-bottom-tabs,
  html body#dpxRoot.desktop-tab-layout .desktop-tab-panels {
    position: relative !important;
    z-index: 1 !important;
  }
}

/* 2-3. Phone portrait Historical Orders: slightly larger first-column text,
   blue IN/OUT/TRGT/SL/MADE/DONE labels, green CALL, and red PUT. The adjusted
   six non-admin widths still total 100%, so no horizontal scroll is added. */
@media (max-width: 600px) and (orientation: portrait) {
  html body.phone-tab-layout.dpx-phone-ledger-user #ledgerTable .ledger-col-phoneTrade {
    width: 14% !important;
  }
  html body.phone-tab-layout.dpx-phone-ledger-user #ledgerTable .ledger-col-phoneInOut,
  html body.phone-tab-layout.dpx-phone-ledger-user #ledgerTable .ledger-col-phoneTargetSl {
    width: 18.5% !important;
  }
  html body.phone-tab-layout #ledgerTable .phone-value-stack b {
    color: #59c7ff !important;
  }
  html body.phone-tab-layout #ledgerTable .phone-trade-stack .side-call {
    color: #51f39b !important;
  }
  html body.phone-tab-layout #ledgerTable .phone-trade-stack .side-put {
    color: #ff5b7a !important;
  }
  html body.phone-tab-layout.dpx-phone-ledger-admin #ledgerTable .phone-trade-cell .phone-trade-stack b {
    font-size: 7.4px !important;
    line-height: 1.06 !important;
  }
  html body.phone-tab-layout.dpx-phone-ledger-admin #ledgerTable .phone-trade-cell .phone-trade-stack .ledger-side-direction {
    font-size: 7.8px !important;
    line-height: 1.06 !important;
  }
  html body.phone-tab-layout.user-normal.non-admin-ledger.dpx-phone-ledger-user #ledgerTable .phone-trade-cell .phone-trade-stack b {
    font-size: 8.6px !important;
    line-height: 1.06 !important;
  }
  html body.phone-tab-layout.user-normal.non-admin-ledger.dpx-phone-ledger-user #ledgerTable .phone-trade-cell .phone-trade-stack .ledger-side-direction {
    font-size: 9px !important;
    line-height: 1.06 !important;
  }
}

/* 4. Phone portrait Stop Auto: reserve space for the full short phone label
   without increasing the current auto-control row height. */
@media (max-width: 600px) and (orientation: portrait) {
  html body.phone-tab-layout.dpx-phone-portrait.v053-phone-trade-split #v053PhoneAutoControls {
    grid-template-columns: minmax(0, 1fr) 72px !important;
  }
  html body.phone-tab-layout.dpx-phone-portrait.v053-phone-trade-split #v053PhoneAutoControls .title-auto-run-toggle {
    box-sizing: border-box !important;
    width: 72px !important;
    min-width: 72px !important;
    max-width: 72px !important;
    padding-inline: 3px !important;
    font-size: 9.5px !important;
    overflow: hidden !important;
    text-overflow: clip !important;
    white-space: nowrap !important;
  }
}

/* 4. Phone landscape Stop Auto. Some rotated phones use the dedicated
   landscape topbar and others use the compact desktop arrangement. */
@media (orientation: landscape) and (max-height: 600px) and (max-width: 1100px) {
  html body.phone-tab-layout.phone-landscape-redesign.phone-landscape-tab-stage .landscape-trade-topbar .trade-title-status {
    min-width: 112px !important;
    overflow: visible !important;
  }
  html body.phone-tab-layout.phone-landscape-redesign.phone-landscape-tab-stage .landscape-trade-topbar #autoStatusPill {
    min-width: 0 !important;
    max-width: none !important;
    overflow: hidden !important;
    text-overflow: clip !important;
  }
  html body.phone-tab-layout.phone-landscape-redesign.phone-landscape-tab-stage .landscape-trade-topbar #autoRunToggleBtn {
    flex: 0 0 58px !important;
    box-sizing: border-box !important;
    width: 58px !important;
    min-width: 58px !important;
    max-width: 58px !important;
    padding-inline: 2px !important;
    font-size: 7px !important;
    overflow: hidden !important;
    text-overflow: clip !important;
    white-space: nowrap !important;
  }
  html body.desktop-tab-layout .trade-card .trade-title-status #autoRunToggleBtn {
    flex: 0 0 78px !important;
    box-sizing: border-box !important;
    width: 78px !important;
    min-width: 78px !important;
    max-width: 78px !important;
    padding-inline: 3px !important;
    font-size: 9px !important;
    overflow: hidden !important;
    text-overflow: clip !important;
    white-space: nowrap !important;
  }
}

/* 5. Normal-user phone portrait Net P&L alignment. The header is deliberately
   untouched. Only the live/open stack or settled-value wrapper below it moves
   left; the cell, calculation, color, status, and ledger data stay unchanged. */
@media (max-width: 600px) and (orientation: portrait) {
  html body.phone-tab-layout.dpx-phone-portrait.user-normal.non-admin-ledger.dpx-phone-ledger-user
  #ledgerTable tbody td.ledger-col-pnl > .dpx-pnl-status-stack,
  html body.phone-tab-layout.dpx-phone-portrait.user-normal.non-admin-ledger.dpx-phone-ledger-user
  #ledgerTable tbody td.ledger-col-pnl > .dpx-pnl-settled-value {
    position: relative !important;
    left: -7px !important;
  }
}

/* 6. Normal-user phone portrait final Reason column. Move the visible header
   text and each row control/reason left without changing the column's data or
   the Settle action. */
@media (max-width: 600px) and (orientation: portrait) {
  html body.phone-tab-layout.dpx-phone-portrait.user-normal.non-admin-ledger.dpx-phone-ledger-user
  #ledgerTable thead th.ledger-col-closeReason {
    text-indent: -7px !important;
  }
  html body.phone-tab-layout.dpx-phone-portrait.user-normal.non-admin-ledger.dpx-phone-ledger-user
  #ledgerTable tbody td.reason-cell > .dpx-ledger-settle,
  html body.phone-tab-layout.dpx-phone-portrait.user-normal.non-admin-ledger.dpx-phone-ledger-user
  #ledgerTable tbody td.reason-cell > .dpx-ledger-reason-text,
  html body.phone-tab-layout.dpx-phone-portrait.user-normal.non-admin-ledger.dpx-phone-ledger-user
  #ledgerTable tbody td.reason-cell > .broker-pending {
    position: relative !important;
    left: -7px !important;
  }
}
