/* Phone layout, style A — Stock page tabs not covered in aiq-phone.css (Guidance, Capital, Credit, Acquisitions, Properties, Patents, Board & owners, Executive pay, Filings, Transcripts).
   Same rules as aiq-phone.css: every rule sits inside @media (max-width: 767px) and starts with html.aiq-phone
   (tests/test_phone_layout.py checks every aiq-phone*.css file). Loaded by _phone.html after aiq-phone.css. */

@media (max-width: 767px) {
  /* Company pages (Acquisitions, Properties, Patents, Board & owners, Executive pay): borderless 18px cards */
  html.aiq-phone.aiq-phone[data-theme] main :is(.acq-card, .prp-card, .pat-card, .brd-card, .pay-card) {
    background: var(--ph-card) !important; border-color: var(--ph-edge) !important; box-shadow: none !important;
    border-radius: var(--ph-r) !important; overflow: hidden; }
  /* Key-facts / Guidance cards: a wide table inside must not paint over the round corners */
  html.aiq-phone.aiq-phone[data-theme] main .fx-card { overflow: hidden; }
  /* inner boxes: Filings' key figure and "more" box, Credit's ratio switch */
  html.aiq-phone.aiq-phone[data-theme] main :is(.fx-kpi, .fx-more) { border-radius: var(--ph-r-sm) !important; }
  html.aiq-phone.aiq-phone[data-theme] main .cr-seg { border-radius: var(--ph-r-sm) !important; overflow: hidden; }
  /* Transcripts: call list items, the takeaways box and the Listen button */
  html.aiq-phone.aiq-phone[data-theme] main #tab-transcripts :is(.tx-sidebar-item, .tx-takeaways, button) { border-radius: var(--ph-r-sm) !important; }
}

/* Statements, TradingView-style (user, 2026-10-19, sent TradingView's Estimates screen: "they go edge to edge … enough
   white space so that it looks clean … not overly cluttered … readable"): the table spans the screen with no card,
   no banding and no row rules, 14.5px figures on 36px rows, subtotals bold, % / margin lines indented and quieter.
   Overrides the --tb-* tokens and the stmt-v2 sizes in financials/_statements.html. */
@media (max-width: 767px) {
  html.aiq-phone.aiq-phone[data-theme] #statements-inner.stmt-v2 { --tb-band: var(--ph-card); --tb-bg: var(--ph-card); --tb-row: transparent;
    --tb-hover: var(--ph-card); }
  html.aiq-phone.aiq-phone[data-theme] main #statements-inner .stmt-table-wrap { margin-left: -12px !important; margin-right: -12px !important;
    border-radius: 0 !important; }
  html.aiq-phone.aiq-phone[data-theme] #statements-inner.stmt-v2 .stmt-data-table.aiq-tbl thead th {
    background: var(--ph-card) !important; border: 0 !important; font-size: 13px !important; font-weight: 500 !important; color: var(--ph-mut) !important;
    padding-top: 12px !important; padding-bottom: 8px !important; }
  html.aiq-phone.aiq-phone[data-theme] #statements-inner.stmt-v2 .stmt-data-table.aiq-tbl thead th.stmt-ttm { color: var(--ph-ink) !important; font-weight: 600 !important; }
  html.aiq-phone.aiq-phone[data-theme] #statements-inner.stmt-v2 .stmt-data-table.aiq-tbl tbody tr:not([data-annotation]):not([data-pct-row]):not([data-seg-group]) td {
    font-size: 14.5px !important; line-height: 20px !important; padding-top: 8px !important; padding-bottom: 8px !important; border-bottom: 0 !important; }
  html.aiq-phone.aiq-phone[data-theme] #statements-inner.stmt-v2 .stmt-data-table.aiq-tbl tbody tr[data-separator] td { font-weight: 650 !important; }
  html.aiq-phone.aiq-phone[data-theme] #statements-inner.stmt-v2 .stmt-data-table.aiq-tbl tbody tr[data-separator] td:first-child { padding-top: 14px !important; }
  html.aiq-phone.aiq-phone[data-theme] #statements-inner.stmt-v2 .stmt-data-table.aiq-tbl tbody tr:is([data-pct-row], [data-annotation]) td {
    font-size: 13.5px !important; line-height: 18px !important; padding-top: 0 !important; padding-bottom: 6px !important; border-bottom: 0 !important; }
  html.aiq-phone.aiq-phone[data-theme] #statements-inner.stmt-v2 .stmt-data-table.aiq-tbl tbody tr:is([data-pct-row], [data-annotation]) td:first-child {
    padding-left: 28px !important; color: var(--ph-ink2) !important; }
  html.aiq-phone.aiq-phone[data-theme] #statements-inner.stmt-v2 .stmt-data-table.aiq-tbl :is(th, td):first-child { padding-left: 14px !important; }
}

/* Statements on phones keep the core (user, 2026-10-19: "consider on mobile what is really necessary to display"): no
   title (the chip names the page), no Options menu, no per-row filing-note icons. Annual | Quarterly and the unit stay. */
@media (max-width: 767px) {
  html.aiq-phone.aiq-phone[data-theme] #statements-inner :is(#stmts-title, #stmt-opt-btn, .stmt-fn-btn) { display: none !important; }
  html.aiq-phone.aiq-phone[data-theme] #statements-inner .stmt-data-table.aiq-tbl tbody td:first-child { padding-right: 8px !important; }
}
@media (max-width: 767px) {
  /* unit and Annual | Quarterly on one line */
  html.aiq-phone.aiq-phone[data-theme] #statements-inner.stmt-v2 #stmt-unit-note { order: 0 !important; flex-basis: auto !important; margin-right: auto; }
}

/* Toggles on the stock page as round-ended tracks like Annual | Quarterly (user, 2026-10-19: price range, Segments /
   Products / Regions, Credit's ratio switch looked boxy): grey track, white pill on the open option. (The Trend column
   stays: hidden for a moment, then "keep the trend … I do like the look of it".) */
@media (max-width: 767px) {
  html.aiq-phone.aiq-phone[data-theme] main :is(.ov-seg, .cr-seg) { border: 0 !important; border-radius: 999px !important; padding: 3px !important;
    background: rgba(118,118,128,.12) !important; gap: 2px !important; box-shadow: none !important; }
  html.aiq-phone.aiq-phone[data-theme] main :is(.ov-seg, .cr-seg) > button { border: 0 !important; border-radius: 999px !important; background: transparent !important;
    box-shadow: none !important; color: var(--ph-mut) !important; }
  html.aiq-phone.aiq-phone[data-theme] main :is(.ov-seg, .cr-seg) > button.is-on { background: var(--ph-card) !important; color: var(--ph-ink) !important;
    box-shadow: 0 1px 3px rgba(15,17,21,.14) !important; }
  html.aiq-phone.aiq-phone[data-theme="dark"] main :is(.ov-seg, .cr-seg) > button.is-on { background: #3A3A3C !important; }
  html.aiq-phone.aiq-phone[data-theme] main .ov-seg-sep { display: none !important; }
}

/* Charts tab: no key figures on phones (user, 2026-10-19: first "stripped down to bare bones", then "just get rid of
   the stats all together from the charts view"); Statistics has them. */
@media (max-width: 767px) {
  html.aiq-phone.aiq-phone[data-theme] #ch-kpis { display: none !important; }
}

/* Charts tab on phones = the Grid and nothing else (user, 2026-10-19: "should only have the grid mode … get rid of the
   other two options", then of the toolbar — Presets, + Metrics, range, Annual | Quarterly — "I don't think these
   options are necessary either"): no toolbar (Grid is the default view: 10 years, annual), no "Add metric" tile. */
@media (max-width: 767px) {
  html.aiq-phone.aiq-phone[data-theme] :is(#ch-bar, #charts-grid .cg-add) { display: none !important; }
}

/* Audit pass, final look (2026-10-19). Remaining boxy switches on the stock page become the round-ended track used
   everywhere else (grey track, white pill on the open option): the statements' Products | Regions fold, the KPI tab's
   Business / Products / Regions words + its Area | Bars, Annual | Quarterly, Values | YoY switches (.kd-seg), and the
   Statistics Values | YoY switch (.stx-seg). A one-button .kd-seg (Labels) is a plain grey pill. */
@media (max-width: 767px) {
  html.aiq-phone.aiq-phone[data-theme] main :is(.stmt-seg-kinds, .kd-words, .kd-seg, .stx-seg) {
    display: inline-flex !important; gap: 2px !important; padding: 3px !important; border: 0 !important; border-radius: 999px !important;
    background: rgba(118,118,128,.12) !important; box-shadow: none !important; }
  html.aiq-phone.aiq-phone[data-theme] main :is(.stmt-seg-kinds, .kd-words, .kd-seg, .stx-seg) > button {
    border: 0 !important; border-radius: 999px !important; background: transparent !important; box-shadow: none !important;
    padding: 0 11px !important; min-height: 28px; color: var(--ph-mut) !important; text-decoration: none !important; }
  html.aiq-phone.aiq-phone[data-theme] main :is(.stmt-seg-kinds, .kd-words, .kd-seg, .stx-seg) > button::after { display: none !important; }
  html.aiq-phone.aiq-phone[data-theme] main :is(.stmt-seg-kinds, .kd-words, .kd-seg, .stx-seg) > button.is-on {
    background: var(--ph-card) !important; color: var(--ph-ink) !important; font-weight: 600 !important; box-shadow: 0 1px 3px rgba(15,17,21,.14) !important; }
  html.aiq-phone.aiq-phone[data-theme="dark"] main :is(.stmt-seg-kinds, .kd-words, .kd-seg, .stx-seg) > button.is-on { background: #3A3A3C !important; }
  html.aiq-phone.aiq-phone[data-theme] main .kd-seg:has(> button:only-child) > button.is-on { background: transparent !important; box-shadow: none !important; color: var(--ph-ink) !important; }
}

/* Audit pass, continued: Comparables' view row (Overview · Valuation · Financials · Performance …) is a tab row → chips;
   its range / filter switches (.cmp-seg) and the .cg-view switches (Dividends' Per share | Yield …, 5Y | 10Y …; Insiders'
   and Filings' filters) → round tracks (Filings' long one scrolls inside its own row); Modeling's divider between Simple | Advanced and DCF | Reverse DCF | IRR goes (the two rows wrap on a phone);
   Overview's "Ten years of X in charts" promo goes (the Charts chip is one tap away). */
@media (max-width: 767px) {
  html.aiq-phone.aiq-phone[data-theme] main #cmp-views { display: flex !important; gap: 8px !important; overflow-x: auto; scrollbar-width: none;
    border: 0 !important; box-shadow: none !important; padding: 0 0 4px !important; }
  html.aiq-phone.aiq-phone[data-theme] main #cmp-views > button { flex: none !important; height: 34px !important; padding: 0 13px !important; border: 0 !important;
    border-radius: var(--ph-r-sm) !important; background: rgba(118,118,128,.12) !important; color: var(--ph-ink) !important; box-shadow: none !important;
    font: 500 14px Inter, sans-serif !important; white-space: nowrap; }
  html.aiq-phone.aiq-phone[data-theme] main #cmp-views > button::after { display: none !important; }
  html.aiq-phone.aiq-phone[data-theme] main #cmp-views > button:is(.on, .is-on, .active, [aria-selected="true"]) { background: #0F1115 !important; color: #fff !important; font-weight: 600 !important; }
  html.aiq-phone.aiq-phone[data-theme="dark"] main #cmp-views > button:is(.on, .is-on, .active, [aria-selected="true"]) { background: #F1F2F4 !important; color: #0F1115 !important; }
  html.aiq-phone.aiq-phone[data-theme] main :is(.cmp-seg, .cg-view) { display: inline-flex !important; gap: 2px !important; padding: 3px !important;
    border: 0 !important; border-radius: 999px !important; background: rgba(118,118,128,.12) !important; box-shadow: none !important; }
  html.aiq-phone.aiq-phone[data-theme] main :is(.cmp-seg, .cg-view) > button { border: 0 !important; border-radius: 999px !important;
    background: transparent !important; box-shadow: none !important; color: var(--ph-mut) !important; }
  html.aiq-phone.aiq-phone[data-theme] main :is(.cmp-seg, .cg-view) > button:is(.on, .is-on, .active) { background: var(--ph-card) !important;
    color: var(--ph-ink) !important; font-weight: 600 !important; box-shadow: 0 1px 3px rgba(15,17,21,.14) !important; }
  html.aiq-phone.aiq-phone[data-theme="dark"] main :is(.cmp-seg, .cg-view) > button:is(.on, .is-on, .active) { background: #3A3A3C !important; }
  html.aiq-phone.aiq-phone[data-theme] main .cg-view { max-width: 100%; overflow-x: auto; scrollbar-width: none; }
  html.aiq-phone.aiq-phone[data-theme] main .cg-view > button { flex: none; }
  html.aiq-phone.aiq-phone[data-theme] main #tab-modeling .md-vsep { display: none !important; }
  html.aiq-phone.aiq-phone[data-theme] main #tab-overview .lkl-promo { display: none !important; }
}

/* KPI tab chart headers (user, 2026-10-20: "too crowded on mobile with all the toggles and data labels"): the title on
   its own line, then the Products | Regions words and Annual | Quarterly on one row. The Labels and Area | Bars switches
   and the bar figures are left out on phones in _kpi_tab.html (phone()). */
@media (max-width: 767px) {
  html.aiq-phone.aiq-phone[data-theme] #kd-root .kd-h { gap: 8px 10px; }
  html.aiq-phone.aiq-phone[data-theme] #kd-root .kd-h > .kd-t { flex: 0 0 100%; }
}

/* Revenue mix (Statements → segments): phones always draw Flow, so the Flow | Bars switch goes (_statements.html segPhone()) */
@media (max-width: 767px) {
  html.aiq-phone.aiq-phone[data-theme] #stmt-seg-view-wrap { display: none !important; }
}
