/* Overview's 1Y | 5Y | 10Y = Home's range pills (user, 2026-10-29: "ensure the time toggle at the top is in the same
   style too", after the Overview took Home's record look; replaced the underline tabs, B of five drafts): left-aligned
   13px words, the chosen one in a grey capsule, as .hx-rng in phone/_home_hero.html. Loaded by _phone.html, phones only.
   :not(#_) ×9 outranks aiq-phone-attio.css's ×8 rules. tests/test_phone_layout.py */
@media (max-width: 767px) {
  html.aiq-phone .ovs-price .ov-seg:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) {
    display: flex !important; justify-content: flex-start; gap: 4px; margin: 0 !important; padding: 6px 4px 0 !important; border: 0 !important; border-radius: 0 !important;
    background: none !important; box-shadow: none !important; }
  html.aiq-phone .ovs-price .ov-seg .ov-seg-btn:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) {
    flex: none; justify-content: center; height: 30px; padding: 0 12px; border: 0 !important; border-radius: 999px !important; box-shadow: none !important;
    background: none !important; color: var(--ph-mut) !important; font: 600 13px/1 Inter, system-ui, sans-serif !important;
    font-variant-numeric: tabular-nums; letter-spacing: 0; }
  html.aiq-phone .ovs-price .ov-seg .ov-seg-btn.is-on:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) {
    background: rgba(118,118,128,.14) !important; color: var(--ph-ink) !important; }
}

/* The same look on every other phone switch (user, 2026-10-29: "implement this in other areas that need it"), replacing
   the grey round tracks from aiq-phone-fin / -lists / -markets.css: Chart's 1M…MAX + Lin | Log | %, Markets' switches,
   Credit, statements Products | Regions, KPI + Statistics switches, Comparables, the .cg-view switches (Dividends,
   Insiders, Filings), Screener Table | Plot, Superinvestors Table | Pie + returns. Tabs sit on a straight hairline, a
   blue bar under the chosen one, square ends; a switch alone in its row spreads across it. A one-button .kd-seg
   (Labels) stays a plain button, and a switch folded into an "All ▾" dropdown (.at-segpill) is left alone. */
@media (max-width: 767px) {
  html.aiq-phone[data-theme] :is(.aqp-seg, .mk3 .seg, .cr-seg, .stmt-seg-kinds, .kd-words, .kd-seg:not(:has(> button:only-child)), .stx-seg, .cmp-seg, .cg-view, .sc-view-switch, .si-view-switch, .retb-seg):not(:has(> .at-segpill)):not(#_):not(#_):not(#_) {
    display: inline-flex !important; gap: 0 !important; padding: 0 !important; border: 0 !important; border-radius: 0 !important;
    background: none !important; box-shadow: inset 0 -1px 0 var(--ph-line) !important; }
  html.aiq-phone[data-theme] :is(.aqp-seg, .mk3 .seg, .cr-seg, .stmt-seg-kinds, .kd-words, .kd-seg:not(:has(> button:only-child)), .stx-seg, .cmp-seg, .cg-view, .sc-view-switch, .si-view-switch, .retb-seg):not(:has(> .at-segpill)) > :is(button, a):not(#_):not(#_):not(#_) {
    flex: 1 0 auto; justify-content: center; min-width: 44px; height: 36px; min-height: 36px; padding: 0 12px !important; border: 0 !important;
    border-radius: 0 !important; background: none !important; box-shadow: none !important; color: var(--ph-mut) !important;
    font-size: 14px !important; font-weight: 500 !important; font-variant-numeric: tabular-nums; text-decoration: none !important; }
  html.aiq-phone[data-theme] :is(.aqp-seg, .mk3 .seg, .cr-seg, .stmt-seg-kinds, .kd-words, .kd-seg:not(:has(> button:only-child)), .stx-seg, .cmp-seg, .cg-view, .sc-view-switch, .si-view-switch, .retb-seg):not(:has(> .at-segpill)) > :is(button, a):is(.on, .is-on, .active, [aria-pressed="true"], [aria-selected="true"]):not(#_):not(#_):not(#_) {
    color: var(--ph-ink) !important; font-weight: 600 !important; box-shadow: inset 0 -2px 0 var(--ph-acc) !important; }
  html.aiq-phone[data-theme] :is(.aqp-seg, .mk3 .seg, .cr-seg, .stmt-seg-kinds, .kd-words, .kd-seg, .stx-seg, .cmp-seg, .cg-view, .sc-view-switch, .si-view-switch, .retb-seg):not(:has(> .at-segpill)) > :is(button, a):not(#_):not(#_):not(#_)::after { display: none !important; }
  /* Page sub-tab rows (user, 2026-10-29: "give the Dividends / Capital structure / Filings sub-tab rows the same blue bar
     and hairline"): .fxd-tabs + Filings' .fd-etabs keep their scrolling text tabs, on one straight hairline with the
     blue bar under the open one. :not(#_) ×8 beats aiq-phone-fin.css's ×7 ink underline. */
  html.aiq-phone[data-theme] main :is(.fxd-tabs, .fd-etabs):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) {
    border: 0 !important; border-radius: 0 !important; background: none !important; box-shadow: inset 0 -1px 0 var(--ph-line) !important;
    align-items: stretch !important; }   /* tabs fill the row, so the bar sits on the hairline */
  html.aiq-phone[data-theme] main :is(.fxd-tabs, .fd-etabs) > button:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) {
    border: 0 !important; border-radius: 0 !important; background: none !important; box-shadow: none !important; margin: 0 !important;
    display: inline-flex !important; align-items: center; height: auto !important; }
  html.aiq-phone[data-theme] main :is(.fxd-tabs, .fd-etabs) > button.on:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) {
    color: var(--ph-ink) !important; font-weight: 600 !important; box-shadow: inset 0 -2px 0 var(--ph-acc) !important; }
  html.aiq-phone[data-theme] main :is(.fxd-tabs, .fd-etabs) > button:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_)::after { display: none !important; content: none !important; }
  /* the Chart page's bottom bar: the range takes the row, Lin | Log | % keeps its own width */
  html.aiq-phone[data-theme] .aqp-bb #seg-range:not(#_):not(#_):not(#_):not(#_) { flex: 1 1 auto; }
  html.aiq-phone[data-theme] .aqp-bb:not(#_):not(#_):not(#_):not(#_) { gap: 10px; padding: 4px 12px !important; border-top: 0 !important; }
  html.aiq-phone[data-theme] .aqp-bb .aqp-seg > button:not(#_):not(#_):not(#_):not(#_) { min-width: 0; padding: 0 6px !important; }
  html.aiq-phone[data-theme] .aqp-bb .aqp-sp:not(#_):not(#_):not(#_):not(#_) { display: none; }
}
