/* LT-UI1: light, content-sized workspaces matching the approved target. */
:root { color-scheme: light; --trader-shadow: none; --trader-border: #d7dfed; }
body { overflow-x: visible; font-size: 13px; background: #f3f5f8; }
.app-main { min-width: 0; }
.trader-shell { max-width: 1320px; padding-inline: 16px; }
.trader-shell .trader-shell { padding-inline: 0; }
.wallet-panel, .trader-card, .metric-tile { box-shadow: none; border-radius: 10px; min-width: 0; }
.wallet-panel { padding: 14px; }
.trader-page-header h1 { font-size: 23px; }
.trader-kicker { text-transform: none; letter-spacing: 0; }
.trader-page-header p { margin-bottom: 4px; }
.metric-tile { padding: 12px 14px; background: white; }
.metric-tile > span:first-child { font-size: 10px; text-transform: uppercase; letter-spacing: .06em; }
.metric-tile strong { font-size: 20px; line-height: 1.5; font-weight: 600; }
.metric-tile small { font-size: 11px; }
.p8-info-line { font-size: 12px; margin: 6px 0; color: #586a85; overflow-wrap: anywhere; }
.p8-secondary { display: block; font-size: 10px; color: #64748b; overflow: hidden; text-overflow: ellipsis; }
.journal-metrics { grid-template-columns: repeat(9,minmax(0,1fr)); gap: 10px; margin-block: 10px 14px; }
.journal-metrics-title { font-size: 12px; margin-block: 8px; }
.journal-shell { gap: 10px; }
.journal-shell .metric-tile { border-left: 1px solid var(--trader-border); }
.journal-shell .e-grid .e-rowcell { white-space: normal; overflow-wrap: anywhere; }
.journal-shell .e-grid .e-headercelldiv { height: auto; white-space: normal; overflow-wrap: anywhere; padding-right: 0; }
.journal-shell .e-grid .e-headertext { white-space: normal; }
.journal-shell .e-multi-hidden { overflow: clip; }
.journal-metrics .metric-tile { padding: 10px; }
.journal-metrics .metric-tile strong { font-size: 18px; }
.journal-p4-filters { grid-template-columns: repeat(6,minmax(0,1fr)); gap: 10px; padding: 14px; }
.journal-quick-ranges { grid-column: 1 / 5; }
.journal-filter-actions { grid-column: 5 / -1; }
.journal-table-panel, .journal-strategy-scroll { overflow: visible; }
.journal-mini-curve { width: 100%; max-width: 130px; min-height: 32px; }
.journal-mini-curve svg { max-width: 100%; }
.journal-grid-detail { white-space: normal; overflow-wrap: anywhere; }
.journal-secondary-grid { grid-template-columns: minmax(0,1fr); }
.journal-strategy-scroll table { min-width: 0; width: 100%; table-layout: fixed; }
.journal-strategy-scroll th, .journal-strategy-scroll td { overflow-wrap: anywhere; }
.journal-strategy-scroll .journal-strategy-curve { width: 100%; max-width: 140px; }
.journal-strategy-scroll .badge { max-width: 100%; white-space: normal; overflow-wrap: anywhere; }
.p8-extra-metrics { margin-block: 10px; }
.p8-metric-facts { display: grid; grid-template-columns: minmax(0,1fr) minmax(0,2fr); gap: 6px 12px; padding: 12px; overflow-wrap: anywhere; }
.p8-metric-facts dd { margin: 0; }
.p8-service-health { font-size: 12px; margin-block: 16px; }
.p8-simple-table { width: 100%; table-layout: fixed; border-collapse: collapse; font-size: 12px; }
.p8-simple-table th, .p8-simple-table td { padding: 10px; border-bottom: 1px solid var(--trader-border); overflow-wrap: anywhere; }
.p8-simple-table th { font-size: 10px; font-weight: 500; text-transform: uppercase; color: #586a85; }
.p8-simple-table th:first-child { width: 25%; }
.p8-recent-trades { max-width: 100%; min-width: 0; }
.journal-calendar-card small { overflow-wrap: anywhere; white-space: normal; }
.journal-shell .e-grid .e-rowcell:not(.e-detailcell),
.trading-page .e-grid .e-rowcell:not(.e-detailcell) { white-space: normal; overflow-wrap: anywhere; }
.trading-page .wallet-origin-badges > * { min-width: 0; white-space: normal; overflow-wrap: anywhere; }
.trading-page code { white-space: normal; overflow-wrap: anywhere; }
.orders-page [data-order-expand] { font-size: 11px; padding: 4px 6px; }
.trading-page [data-ticket-field=product] { grid-column: 1 / -1; }
.trading-page [data-ticket-field=side], .trading-page [data-ticket-field=type] { grid-column: span 6; }
.p8-dashboard-grid { display: grid; grid-template-columns: minmax(0,2fr) minmax(0,1fr); gap: 16px; }
.p8-dashboard-grid .p8-value-history { order: 0; }
.p8-dashboard-grid .p8-distribution { order: 1; }
.p8-dashboard-grid .p8-accounts { order: 2; grid-column: 1 / -1; }
.p8-history-unavailable { min-height: 270px; display: grid; align-content: center; justify-items: center; color: #64748b; text-align: center; }
.p8-distribution .wallet-pie-host { min-height: 270px; }
.wallet-accounts-host, .orders-grid-host { min-width: 0; max-width: 100%; }
.wallet-metrics { grid-template-columns: repeat(5,minmax(0,1fr)); gap: 12px; }
.p8-valuation-details, .wallet-account-hints { font-size: 11px; color: #64748b; }
.p8-dashboard-grid .wallet-account-hints { margin-top: 8px; }
.orders-page .e-grid .e-rowcell { vertical-align: middle; overflow-wrap: normal; }
.orders-page .e-grid .e-rowcell .badge { white-space: nowrap; }
.p8-order-fact { margin-bottom: 6px; font-size: 12px; }
.orders-page .e-grid .e-detailcell { line-height: 1.5; }
.trading-page .wallet-order-ticket-panel, .trading-page #wallet-ticket { min-width: 0; }
.trading-page .wallet-ticket-field { margin-bottom: 6px; }
.trading-page .form-control, .trading-page .form-select { font-size: 12px; padding: 5px 8px; min-height: 30px; }
.trading-ticket-help { font-size: 11px; margin-block: 8px; }
.trading-page .wallet-ticket-extension { gap: 8px; }
.trading-page .wallet-panel-title { margin-bottom: 8px; }
.trading-page .wallet-ticket-facts { margin-top: 6px; }
.trading-page .e-grid .e-rowcell { white-space: normal; overflow-wrap: anywhere; }
.trading-page .e-grid .e-rowcell .badge { white-space: normal; overflow-wrap: anywhere; }
.trading-page .order-curve { width: 100%; max-width: 170px; min-width: 0; height: 40px; }
.trader-shell .e-grid .e-headercelldiv { height: auto; white-space: normal; overflow-wrap: anywhere; padding-right: 0; }
.trader-shell .e-grid .e-headertext { white-space: normal; }
.wallet-accounts-host .e-grid .e-rowcell:last-child { white-space: normal; }
.journal-period-list { max-height: none; overflow: visible; }
.journal-calendar-event small { overflow-wrap: anywhere; white-space: normal; }
@media (min-width: 1000px) {
 .trading-page .wallet-trading-layout { display: grid; grid-template-columns: 400px minmax(0,1fr); gap: 16px; align-items: start; }
}
.journal-shell .alert, .orders-page .alert { padding: 8px 12px; font-size: 12px; margin-block: 8px; }
/* EJ2 retains sorting/filtering/paging; content determines the table height. */
.trader-shell .e-grid { max-width: 100%; min-width: 0; font-size: 12px; }
.trader-shell .e-grid .e-content { height: auto !important; max-height: none !important; overflow-y: visible !important; }
.trader-shell .e-grid .e-gridcontent { overflow: visible; }
.trading-page #WalletAssetsGrid .e-content { overflow: visible !important; }
.trader-shell .e-grid .e-rowcell { padding: 8px 9px; line-height: 1.35; }
.trader-shell .e-grid .e-headercell { padding: 9px; font-size: 10px; text-transform: uppercase; letter-spacing: .03em; }
.trader-shell .e-grid .e-headercelldiv { font-size: 10px; }
.trader-shell .e-grid .e-rowcell:not(.e-detailcell) { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.journal-shell .e-grid .e-rowcell:not(.e-detailcell),
.trading-page .e-grid .e-rowcell:not(.e-detailcell) { white-space: normal; overflow-wrap: anywhere; }
.trader-shell .e-grid .e-detailcell { white-space: normal; overflow-wrap: anywhere; }
.trader-shell .e-grid .e-detailcell > * { min-width: 0; max-width: 100%; }
.trader-shell .e-grid .e-rowcell .badge { max-width: 100%; overflow: hidden; text-overflow: ellipsis; vertical-align: middle; font-size: 10px; }
@media (min-width: 801px) {
 .trader-shell .e-grid .e-content, .trader-shell .e-grid .e-gridheader { overflow-x: visible !important; }
}
@media (max-width: 800px) {
 .trader-shell { padding-inline: 10px; }
 .journal-metrics { grid-template-columns: repeat(2,minmax(0,1fr)); }
 .journal-p4-filters { grid-template-columns: repeat(2,minmax(0,1fr)); }
 .journal-p4-filters > *, .journal-quick-ranges, .journal-filter-actions { grid-column: auto; }
 .journal-date-range-field, .journal-quick-ranges, .journal-filter-actions { grid-column: 1 / -1; }
 .journal-table-panel { padding: 10px; }
 .trader-shell .e-grid .e-content { overflow-x: auto; }
 .journal-strategy-scroll { overflow-x: auto; }
 .journal-strategy-scroll table { min-width: 900px; }
 .journal-shell .journal-header { flex-wrap: wrap; }
 .wallet-metrics { grid-template-columns: repeat(2,minmax(0,1fr)); }
 .p8-dashboard-grid { grid-template-columns: minmax(0,1fr); }
 .journal-table-panel, .wallet-accounts-host { overflow-x: auto; }
 #TradingJournalGrid { min-width: 1060px; }
 #WalletAccountsGrid { min-width: 800px; }
 .journal-table-panel .e-grid .e-content, .wallet-accounts-host .e-grid .e-content { overflow: visible; }
 .journal-grid-detail { grid-template-columns: minmax(0,1fr); }
 .trading-data-tabs > .e-content > .e-item { overflow-x: auto; }
 .trading-data-tabs .e-grid { min-width: 900px; }
 .trading-data-tabs .e-grid .e-content { overflow: visible !important; }
 .p8-recent-trades { overflow-x: auto; }
 .p8-recent-trades table { min-width: 780px; }
}

/* LT-UI2 orders grid: no sideways scroll at any width (columns drop by priority, see OrderListLayout), header words break at spaces only, never inside a word. */
.orders-page .e-grid .e-headercell .e-headercelldiv { padding-right: 0; white-space: normal; overflow-wrap: normal; word-break: normal; hyphens: manual; }
.orders-page .e-grid .e-headercell .e-headertext { white-space: normal; overflow-wrap: normal; word-break: normal; }
.orders-page .e-grid .e-gridheader, .orders-page .e-grid .e-gridcontent .e-content { overflow-x: hidden !important; }
.orders-page .e-grid .e-headercell, .orders-page .e-grid .e-rowcell { padding-left: 8px; padding-right: 8px; }
@media (max-width: 739px) {
 /* phone: time, instrument, status and action only; the detail row carries the rest. Column order in the colgroup: 1 expander, 2 time, 4 instrument, 8 status, 10 action. */
 .orders-page .e-grid colgroup col:nth-child(2) { width: 76px !important; }
 .orders-page .e-grid colgroup col:nth-child(8) { width: 76px !important; }
 .orders-page .e-grid colgroup col:nth-child(10) { width: 60px !important; }
 .orders-page .e-grid .e-headercell .e-filtermenudiv { display: none; }
 .orders-page .e-grid .e-headercell, .orders-page .e-grid .e-rowcell { padding-left: 5px; padding-right: 5px; }
 .orders-page .e-grid .e-rowcell .badge { white-space: normal; }
}

/* LT-UI4: the complete symbol is available as title and in the full-width detail. */
.orders-page .e-grid .order-instrument-symbol { display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; white-space: normal; overflow: hidden; overflow-wrap: anywhere; line-height: 1.35; }
@media (max-width: 739px) {
 .orders-page .e-grid colgroup col:first-child { width: 22px !important; }
 .orders-page .e-grid .e-headercell .e-sortfilterdiv { display: none; }
 .orders-page .e-grid .e-headertext { display: block; max-width: 100%; overflow: visible; text-overflow: clip; }
 .orders-page .e-grid .e-rowcell time { white-space: normal; }
}