/* =====================================================================
   Кабинет FBT — разделы меню (pages/cabinet.js). Префикс cb-.
   Только токены v001 и app.css; светлая и тёмная темы — через них.
   ===================================================================== */
:root {
  --cb-cloud: linear-gradient(135deg, #e7f0ff, #cfe0ff 60%, #b9cff7);
  --cb-bank: linear-gradient(135deg, #e6f8ee, #c9efd8 60%, #a8e2bf);
  --cb-pay: linear-gradient(135deg, #e9f6ff, #cdeafc 60%, #a6d8f5);
  --cb-broker: linear-gradient(135deg, #f1ecff, #ddd2fb 60%, #c6b6f2);
  --cb-ins: linear-gradient(135deg, #e6f7f4, #c6ece5 60%, #9ddccf);
  --cb-tel: linear-gradient(135deg, #fff1e3, #ffdfbd 60%, #ffca94);
  --cb-hero: linear-gradient(120deg, #eaf8ef 0%, #e3f1ff 55%, #efeaff 100%);
  --cb-tile-ink: #1f2a37;
}
@media (prefers-color-scheme: dark) { :root:not([data-theme="light"]) {
  --cb-cloud: linear-gradient(135deg, #18243a, #1d3157 60%, #23407a);
  --cb-bank: linear-gradient(135deg, #142a1e, #19402b 60%, #1f5638);
  --cb-pay: linear-gradient(135deg, #132634, #183a4f 60%, #1d4e6b);
  --cb-broker: linear-gradient(135deg, #1f1a33, #2c2450 60%, #3a2f6b);
  --cb-ins: linear-gradient(135deg, #12282a, #17403e 60%, #1c5752);
  --cb-tel: linear-gradient(135deg, #2c2116, #45311c 60%, #5d4022);
  --cb-hero: linear-gradient(120deg, #15291c 0%, #142538 55%, #221d36 100%);
  --cb-tile-ink: #e9edf2;
} }
:root[data-theme="dark"] {
  --cb-cloud: linear-gradient(135deg, #18243a, #1d3157 60%, #23407a);
  --cb-bank: linear-gradient(135deg, #142a1e, #19402b 60%, #1f5638);
  --cb-pay: linear-gradient(135deg, #132634, #183a4f 60%, #1d4e6b);
  --cb-broker: linear-gradient(135deg, #1f1a33, #2c2450 60%, #3a2f6b);
  --cb-ins: linear-gradient(135deg, #12282a, #17403e 60%, #1c5752);
  --cb-tel: linear-gradient(135deg, #2c2116, #45311c 60%, #5d4022);
  --cb-hero: linear-gradient(120deg, #15291c 0%, #142538 55%, #221d36 100%);
  --cb-tile-ink: #e9edf2;
}

/* заголовок раздела и действия */
.cb-page { gap: 16px }
.cb-head { display: flex; align-items: center; justify-content: space-between; gap: 12px 16px; flex-wrap: wrap }
.cb-ttl { min-width: 0 }
.cb-ttl h1 { margin: 0; font-size: 20px; line-height: 26px; font-weight: 600 }
.cb-ttl p { margin: 2px 0 0; color: var(--text-2); font-size: 14px; line-height: 18px }
.cb-acts { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; margin-left: auto }
.cb-tabs { flex-wrap: nowrap; overflow-x: auto; scrollbar-width: none; max-width: 100% }
.cb-tabs::-webkit-scrollbar { display: none }
.cb-tabs .n { color: var(--brand-ink) }
.cb-lead { margin: 0; color: var(--text-2); font-size: 14px; line-height: 21px; max-width: 80ch }
.cb-lead b { color: var(--text) }

/* строка фильтров: поиск и выпадающие списки, как в проде */
.cb-filters { display: flex; gap: 8px; flex-wrap: wrap; align-items: center }
.cb-filters > span { display: contents }
.cb-q { flex: 1 1 200px; height: 40px; max-width: 280px }
.cb-grow { flex: 1 1 200px }
.cb-dd { display: inline-flex; align-items: center; justify-content: space-between; gap: 8px; height: 40px; padding: 0 10px 0 12px; border-radius: var(--r-ctl); border: 1px solid var(--line-2); background: var(--surface); color: var(--text); font-size: 14px; white-space: nowrap; max-width: 260px; min-width: 120px; flex: 0 1 auto }
.cb-dd span { overflow: hidden; text-overflow: ellipsis }
.cb-dd .ico { color: var(--text-2); flex: none }
.cb-dd:hover { border-color: var(--line-3) }
.cb-dd.on { border-color: var(--brand); background: var(--brand-light); color: var(--brand-ink); font-weight: 500 }
.cb-dd.on .ico { color: var(--brand-ink) }
.cb-dd[aria-expanded="true"] .ico { transform: rotate(180deg) }
.cb-ddp { padding: 8px; display: flex; flex-direction: column; gap: 6px }
.cb-ddp .pf-search { height: 40px; margin: 2px 2px 4px }
.cb-ddl { display: flex; flex-direction: column; max-height: 320px; overflow: auto }
.pf-pop.sheet .cb-ddl { max-height: 56vh }
.cb-ddi { display: flex; align-items: center; gap: 10px; width: 100%; padding: 9px 10px; border-radius: 10px; text-align: left; font-size: 14px; cursor: pointer; color: var(--text) }
.cb-ddi:hover { background: var(--neutral) }
.cb-ddi > span { flex: 1; min-width: 0; display: flex; flex-direction: column }
.cb-ddi small { color: var(--text-2); font-size: 12px }
.cb-ddi.on { font-weight: 600 } .cb-ddi.on .ico { color: var(--brand) }
.cb-ddf { display: flex; justify-content: space-between; gap: 8px; padding-top: 8px; border-top: 1px solid var(--line-2) }
.cb-menu { display: flex; flex-direction: column }

.cb-list { display: flex; flex-direction: column; gap: 12px }
.cb-more { align-self: center; min-width: 200px }
.cb-pager { justify-content: center }
.cb-due { display: inline-flex; align-items: center; gap: 6px; font-size: 12px; color: var(--text-2) }
.cb-due .ico { width: 15px; height: 15px }
.cb-due.warn { color: var(--warn) } .cb-due.neg { color: var(--neg-ink) }

/* карточка поездки (как список поездок в проде) */
.cb-trip { border: 1px solid var(--line-2); border-radius: 20px; padding: 16px 20px; display: flex; flex-direction: column; gap: 10px; transition: border-color .15s }
.cb-trip:hover { border-color: var(--line-3) }
.cb-trip-top { display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap }
.cb-meta { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; font-size: 12px; color: var(--text-2) }
.cb-meta span + span::before { content: "·"; margin-right: 8px; color: var(--text-3) }
.cb-trip-b { display: flex; justify-content: space-between; gap: 16px }
.cb-trip-m { min-width: 0; display: flex; flex-direction: column; gap: 4px }
.cb-trip-m h3 { margin: 0; font-size: 20px; line-height: 26px; font-weight: 600 }
.cb-trip-m h3 a { color: inherit; text-decoration: none } .cb-trip-m h3 a:hover { color: var(--brand-ink) }
.cb-trip-m > small { color: var(--text-2); font-size: 12px }
.cb-pp { display: flex; gap: 6px; flex-wrap: wrap; margin-top: 6px }
.cb-pc { display: inline-flex; align-items: center; height: 24px; padding: 0 8px; border-radius: 8px; background: var(--neutral); font-size: 12px; font-weight: 500 }
.cb-svc { display: flex; gap: 6px; flex: none; align-self: flex-start }
.cb-svc span { width: 32px; height: 32px; border-radius: 10px; background: var(--neutral); color: var(--text-2); display: grid; place-items: center }
.cb-trip-f { display: flex; align-items: center; gap: 12px 16px; flex-wrap: wrap }
.cb-trip-f > b { font-size: 18px; font-weight: 700 }
.cb-trip-f .pf-row { margin-left: auto }

/* карточка заказа */
.cb-order { border: 1px solid var(--line-2); border-radius: 20px; padding: 16px 20px; display: flex; flex-direction: column; gap: 12px }
.cb-order-h { display: flex; align-items: center; gap: 8px 12px; flex-wrap: wrap }
.cb-order-h .badge { margin-left: auto }
.cb-otype { display: inline-flex; align-items: center; gap: 6px; font-weight: 600; font-size: 14px }
.cb-otype .ico { color: var(--brand) }
.cb-ono { display: inline-flex; align-items: center; gap: 6px; font-size: 12px; color: var(--text-2) }
.cb-otitle { margin: 0; font-size: 18px; line-height: 22px; font-weight: 600 }
.cb-ogrid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; padding: 12px 14px; border-radius: var(--r-in); background: var(--surface-2) }
.cb-oc { display: flex; flex-direction: column; gap: 2px; min-width: 0 }
.cb-oc span { font-size: 12px; color: var(--text-2) }
.cb-oc b { font-weight: 600; font-size: 14px }
.cb-oc small { font-size: 12px; color: var(--text-2); white-space: nowrap; overflow: hidden; text-overflow: ellipsis }
.cb-more-seg summary { cursor: pointer; color: var(--brand-ink); font-weight: 600; font-size: 14px; list-style: none; padding: 2px 0 }
.cb-more-seg summary::-webkit-details-marker { display: none }
.cb-more-seg[open] summary { margin-bottom: 8px }
.cb-ppl { display: flex; gap: 6px 20px; flex-wrap: wrap; font-size: 12px; color: var(--text-2) }
.cb-ppl b { color: var(--text); font-weight: 500 }
.cb-ppl a { color: var(--brand-ink); font-weight: 500 }
.cb-order-f { display: flex; align-items: center; gap: 12px 16px; flex-wrap: wrap; padding-top: 12px; border-top: 1px solid var(--line-2) }
.cb-osum { display: flex; flex-direction: column } .cb-osum span { font-size: 12px; color: var(--text-2) } .cb-osum b { font-size: 18px; font-weight: 700 }
.cb-order-f .pf-row { margin-left: auto }
.cb-order-f .btn .ico { margin-right: -2px }

/* таблицы с кликабельными строками */
.cb-click tbody tr { cursor: pointer }
.cb-agent { display: flex; gap: 12px; align-items: flex-start } .cb-agent b { display: block } .cb-agent small { color: var(--text-2) } .cb-agent p { margin: 6px 0 0; font-size: 14px }

/* AI Travel Agent */
.cb-ai { display: flex; flex-direction: column; gap: 14px; padding: 20px; border-radius: 20px; background: var(--cb-hero) }
.cb-ai-hero { display: flex; gap: 14px; align-items: center }
.cb-ai-i { width: 48px; height: 48px; border-radius: 16px; background: var(--surface); color: var(--brand); display: grid; place-items: center; flex: none; box-shadow: var(--shadow) }
.cb-ai-hero h2 { margin: 0; font-size: 18px; font-weight: 600 } .cb-ai-hero p { margin: 4px 0 0; color: var(--text-2); font-size: 14px }
.cb-ai-ask { display: flex; gap: 8px; background: var(--surface); border-radius: 18px; padding: 6px; box-shadow: 0 0 0 1.5px var(--brand) inset }
.cb-ai-ask input { flex: 1; min-width: 0; border: 0; outline: 0; background: transparent; font-size: 16px; padding: 0 12px; color: var(--text) }
.cb-ai .pf-chip { background: var(--surface) }
.cb-acc { display: flex; flex-direction: column }
.cb-acc details { border-top: 1px solid var(--line-2) }
.cb-acc details:first-child { border-top: 0 }
.cb-acc summary { list-style: none; cursor: pointer; display: flex; align-items: center; gap: 12px; padding: 14px 0; font-weight: 500; font-size: 16px }
.cb-acc summary::-webkit-details-marker { display: none }
.cb-acc summary::after { content: ""; margin-left: auto; width: 8px; height: 8px; border-right: 1.8px solid var(--text-2); border-bottom: 1.8px solid var(--text-2); transform: rotate(45deg) translateY(-3px); transition: transform .2s; flex: none }
.cb-acc details[open] summary::after { transform: rotate(-135deg) translateY(-1px) }
.cb-acc-b { padding: 0 0 16px; display: flex; flex-direction: column; gap: 12px; align-items: flex-start }
.cb-acc-b p { margin: 0; color: var(--text-2); font-size: 14px; line-height: 21px; max-width: 75ch }
.cb-acc-b .btn, .cb-acc-b + .btn { align-self: flex-start }
.cb-acc details:has(.cb-step) .cb-acc-b { padding-left: 40px }
.cb-step { width: 28px; height: 28px; border-radius: 50%; background: var(--brand-light); color: var(--brand-ink); display: inline-grid; place-items: center; font-size: 12px; font-weight: 700; flex: none }

/* Финансы */
.cb-fin { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px }
.cb-tile { background: var(--surface-2); border-radius: var(--r-in); padding: 16px 18px; display: flex; flex-direction: column; gap: 12px; min-width: 0 }
.cb-tl { display: flex; align-items: center; gap: 6px; font-size: 12px; color: var(--text-2) }
.cb-big { font-size: 28px; line-height: 32px; font-weight: 700; letter-spacing: -.01em }
.cb-cr { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px }
.cb-cr div { display: flex; flex-direction: column; gap: 2px } .cb-cr span { font-size: 12px; color: var(--text-2) } .cb-cr b { font-size: 14px; font-weight: 600 }
.cb-bar { height: 6px; border-radius: 999px; background: var(--neutral); overflow: hidden } .cb-bar i { display: block; height: 100%; background: var(--warn); border-radius: inherit }
.cb-tip { position: relative; display: inline-flex; color: var(--text-3); cursor: help; margin-left: auto }
.cb-tip em { position: absolute; right: -8px; top: 24px; width: 260px; z-index: 5; padding: 10px 12px; border-radius: 12px; background: #171717; color: #fff; font-style: normal; font-size: 12px; line-height: 17px; opacity: 0; pointer-events: none; transition: opacity .15s }
.cb-tip em { display: none } .cb-tip:hover em, .cb-tip:focus em { display: block; opacity: 1 }
.cb-tile .btn.ghost { color: var(--text-2) }
.cb-fintbl .cb-det { max-width: 280px; color: var(--text-2); font-size: 12px }
.pf-tbl td a { color: var(--brand-ink); text-decoration: none; font-weight: 500 } .pf-tbl td a:hover { text-decoration: underline }

/* Документы */
.cb-docrow { display: flex; flex-direction: column; gap: 12px; padding: 16px; border-radius: var(--r-in); background: var(--surface-2) }
.cb-docrow-h h3 { margin: 0; font-size: 16px; font-weight: 600 } .cb-docrow-h p { margin: 2px 0 0; color: var(--text-2); font-size: 14px }
.cb-docrow .cb-dd { background: var(--surface) }
.cb-docrow .pf-search { background: var(--surface); height: 40px }
.cb-docrow .cb-filters > .btn:last-child { margin-left: auto }
.cb-memo-l { display: flex; align-items: center; gap: 12px; padding: 14px 16px; border-radius: var(--r-in); border: 1px solid var(--line-2); color: var(--text); text-decoration: none }
.cb-memo-l:hover { border-color: var(--brand) }
.cb-memo-l > .ico:first-child { color: var(--info) } .cb-memo-l > .ico:last-child { color: var(--text-3); margin-left: auto }
.cb-memo-l span { display: flex; flex-direction: column } .cb-memo-l b { font-weight: 600 } .cb-memo-l small { color: var(--text-2); font-size: 12px }
.cb-mp { display: flex; flex-direction: column; gap: 12px; padding: 6px }
.cb-mp-y { display: flex; align-items: center; justify-content: space-between } .cb-mp-y b { font-weight: 600 } .cb-mp-y .iconbtn { width: 32px; height: 32px }
.cb-mp-g { display: grid; grid-template-columns: repeat(4, 1fr); gap: 4px }
.cb-mp-g button { height: 40px; border-radius: 10px; font-weight: 500; font-size: 14px; color: var(--text) }
.cb-mp-g button:hover:not(:disabled) { background: var(--neutral) }
.cb-mp-g button:disabled { color: var(--text-3); cursor: default }
.cb-mp-g button.in { background: var(--brand-light); color: var(--brand-ink) }
.cb-mp-g button.sel { background: var(--brand); color: #fff }
.cb-gi { display: flex; align-items: flex-start; gap: 12px; padding: 14px 16px; border: 1px solid var(--line-2); border-radius: var(--r-in); cursor: pointer }
.cb-gi:has(input:checked) { border-color: var(--brand); background: var(--brand-light) }
.cb-gi.dis { opacity: .6; cursor: not-allowed }
.cb-gi-b { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 4px } .cb-gi-b > b { font-weight: 600 } .cb-gi-b small { color: var(--text-2); font-size: 12px }
.cb-gi > b { white-space: nowrap; font-weight: 700 }
.cb-sticky { position: sticky; bottom: 16px; z-index: 5 }
.cb-sticky-in { display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap; padding: 12px 12px 12px 20px; border-radius: 20px; background: var(--surface); box-shadow: var(--shadow-lg) }

/* Сотрудники */
.cb-cbx { width: 36px }
.cb-who { display: flex; align-items: center; gap: 10px; flex-wrap: wrap } .cb-who > span { display: flex; flex-direction: column; min-width: 0 } .cb-who b { font-weight: 600; font-size: 14px } .cb-who small { color: var(--text-2); font-size: 12px }
.cb-emp tbody tr { cursor: pointer }
.cb-fl { display: flex; align-items: center; gap: 16px; flex-wrap: wrap } .cb-fl > span { font-size: 14px; color: var(--text-2) }
.cb-docbox { gap: 12px } .cb-docbox .pf-in { background: var(--surface) } .cb-docbox .pf-in:focus-within { background: var(--surface) }
.cb-hint.neg { color: var(--neg-ink) }
.cb-dict { display: flex; gap: 8px; align-items: center; flex-wrap: wrap } .cb-dict .pf-search { flex: 1 1 200px }
.cb-perm { display: flex; flex-direction: column; gap: 2px; padding: 12px 14px; border-radius: var(--r-ctl); background: var(--surface-2) } .cb-perm > b { font-size: 12px; color: var(--text-2); font-weight: 500; margin-bottom: 4px }
.cb-mile { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) auto; gap: 8px; align-items: center }
.cb-steps { margin: 0; padding: 0; list-style: none; display: flex; flex-direction: column; gap: 12px; counter-reset: s }
.cb-steps li { counter-increment: s; display: grid; grid-template-columns: 28px 1fr; gap: 4px 12px; padding: 14px; border-radius: var(--r-in); background: var(--surface-2) }
.cb-steps li::before { content: counter(s); grid-row: span 3; width: 28px; height: 28px; border-radius: 50%; background: var(--brand-light); color: var(--brand-ink); display: grid; place-items: center; font-weight: 700; font-size: 12px }
.cb-steps li b { font-weight: 600 } .cb-steps li span { color: var(--text-2); font-size: 14px } .cb-steps li .btn { justify-self: start; margin-top: 6px }

/* Тревел-политики */
.cb-pol td { vertical-align: top } .cb-pol td.lead .badge { margin-left: 6px }
.cb-pol small .ico { width: 12px; height: 12px; vertical-align: -1px; color: #f5a623; fill: #f5a623; stroke: none }
.cb-steps-h { display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap; position: sticky; top: -4px; z-index: 2; background: var(--surface); padding: 4px 0 12px; border-bottom: 1px solid var(--line-2) }
.cb-appr { margin: 0; padding: 0; list-style: none; display: flex; flex-direction: column; gap: 6px }
.cb-appr li { display: flex; align-items: center; gap: 10px; padding: 8px 10px; border-radius: var(--r-ctl); background: var(--surface) }
.cb-appr li span.pf-grow { display: flex; flex-direction: column } .cb-appr b { font-weight: 500; font-size: 14px } .cb-appr small { color: var(--text-2); font-size: 12px }
.cb-appr .iconbtn { width: 32px; height: 32px } .cb-appr [data-up] .ico { transform: rotate(180deg) }
.pf-box .pf-in { background: var(--surface) }
.cb-inl { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; font-size: 14px } .cb-num { width: 110px; min-height: 48px }
.cb-cols { display: grid; grid-template-columns: repeat(auto-fill, minmax(180px, 1fr)); gap: 2px 12px }
.cb-stars { display: flex; gap: 8px; flex-wrap: wrap }
.cb-star { position: relative; cursor: pointer }
.cb-star input { position: absolute; opacity: 0; pointer-events: none }
.cb-star span { display: inline-flex; align-items: center; gap: 4px; height: 40px; padding: 0 14px; border-radius: var(--r-ctl); border: 1.5px solid var(--line-2); font-weight: 600; font-size: 14px }
.cb-star span .ico { width: 15px; height: 15px; color: #f5a623; fill: #f5a623; stroke: none }
.cb-star input:checked + span { border-color: var(--brand); background: var(--brand-light); color: var(--brand-ink) }
.cb-star input:focus-visible + span { outline: 2px solid var(--brand); outline-offset: 2px }

/* Статьи расходов */
.cb-no { width: 56px; color: var(--text-2) }
.cb-exp td small { display: block }

/* Корпоративные тарифы */
.cb-rates { display: flex; flex-direction: column; gap: 8px; --cols: minmax(0, 1fr) minmax(0, 1fr) auto }
.cb-rates.c4 { --cols: minmax(0, .8fr) minmax(0, 1fr) minmax(0, 1fr) auto }
.cb-rh, .cb-rate { display: grid; grid-template-columns: var(--cols); gap: 8px; align-items: center }
.cb-rh span { font-size: 12px; color: var(--text-2); padding: 0 4px }
.cb-fake { height: 44px; padding: 0 14px; border-radius: var(--r-ctl); background: var(--field); display: flex; align-items: center; justify-content: space-between; gap: 8px; font-size: 14px; min-width: 0 }
.cb-fake span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap }
.cb-fake code { font: 600 12px/16px var(--font); color: var(--text-2) }
.cb-rate .btn { height: 44px; min-width: 104px }
.cb-rate.add { padding-top: 8px; border-top: 1px dashed var(--line-3) }
.cb-rate.add .pf-in { min-height: 48px; padding: 6px 12px }
.cb-rate.add .pf-in.sel > .ico { bottom: 14px }
.cb-ph img { width: 72px; height: 52px; border-radius: 10px; object-fit: cover; display: block }
.cb-only-m { display: none }

/* Привилегии */
.cb-priv-hero { position: relative; overflow: hidden; display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 32px; border-radius: var(--r-card); background: var(--cb-hero) }
.cb-priv-hero h1 { margin: 0; font-size: 32px; line-height: 38px; font-weight: 700; letter-spacing: -.015em; max-width: 20ch }
.cb-priv-hero p { margin: 10px 0 0; color: var(--text-2); font-size: 16px; max-width: 46ch }
.cb-priv-art { position: relative; width: 200px; height: 140px; flex: none }
.cb-priv-art i { position: absolute; border-radius: 28px; background: var(--brand); opacity: .9; transform: rotate(-12deg) }
.cb-priv-art i:nth-child(1) { width: 110px; height: 110px; right: 40px; top: 10px; background: linear-gradient(135deg, var(--brand), var(--brand-ink)) }
.cb-priv-art i:nth-child(2) { width: 70px; height: 70px; right: 0; top: 60px; background: linear-gradient(135deg, var(--ai-3), var(--ai-4)); opacity: .7 }
.cb-priv-art i:nth-child(3) { width: 46px; height: 46px; right: 140px; top: 70px; background: linear-gradient(135deg, var(--ai-2), var(--ai-3)); opacity: .6 }
.cb-priv { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px }
.cb-pc2 { background: var(--surface); border-radius: var(--r-card); padding: 8px 8px 16px; display: flex; flex-direction: column; gap: 12px; min-width: 0 }
.cb-pc2 > .btn { margin: auto 8px 0; width: auto }
.cb-pt { height: 132px; border-radius: 18px; display: flex; flex-direction: column; justify-content: space-between; padding: 16px; color: var(--cb-tile-ink) }
.cb-pt .ico { width: 32px; height: 32px; opacity: .85 }
.cb-pt span { font-weight: 700; font-size: 18px; letter-spacing: -.01em }
.t-cloud { background: var(--cb-cloud) } .t-bank { background: var(--cb-bank) } .t-pay { background: var(--cb-pay) } .t-broker { background: var(--cb-broker) } .t-ins { background: var(--cb-ins) } .t-tel { background: var(--cb-tel) }
.cb-pb { padding: 0 8px; display: flex; flex-direction: column; gap: 8px; font-size: 14px; line-height: 20px }
.cb-pb p { margin: 0 } .cb-pb ul { margin: 0; padding-left: 18px; color: var(--text-2); font-size: 14px; display: grid; gap: 2px }
.cb-ul { margin: 0; padding: 0; list-style: none; display: grid; gap: 8px; font-size: 14px }
.cb-ul li { display: flex; gap: 8px; align-items: flex-start } .cb-ul li .ico { color: var(--brand); width: 16px; height: 16px; margin-top: 2px; flex: none }
.cb-ul li.off { color: var(--text-3) } .cb-ul li.off .ico { color: var(--text-3) }

/* Важные обновления */
.cb-news { display: flex; flex-direction: column; gap: 12px }
.cb-post { padding: 20px; border-radius: var(--r-in); background: var(--surface-2); display: flex; flex-direction: column; gap: 10px }
.cb-post time { font-size: 12px; color: var(--text-2) }
.cb-post h2 { margin: 0; font-size: 20px; line-height: 26px; font-weight: 600 }
.cb-post p { margin: 0; color: var(--text-2); font-size: 14px; line-height: 21px; max-width: 72ch }

/* Профиль */
.cb-role { padding: 16px; border-radius: var(--r-in); border: 1px solid var(--line-2); display: flex; flex-direction: column; gap: 12px } .cb-role > b { font-size: 16px; font-weight: 600 }
.cb-role .cb-ul { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px 16px }

/* Контакты */
.cb-contacts { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px }
.cb-contacts .pf-card { gap: 12px }
.cb-contacts .pf-card > .btn, .cb-contacts .pf-card > .pf-row { margin-top: auto }
.cb-ci { width: 44px; height: 44px; border-radius: 14px; background: var(--brand-light); color: var(--brand-ink); display: grid; place-items: center }
.cb-contacts .pf-sub { margin-top: -6px }
.cb-tels { display: flex; flex-direction: column; gap: 6px }
.cb-tel { display: inline-flex; align-items: center; gap: 8px; color: var(--text); text-decoration: none; font-weight: 600; font-size: 16px; width: fit-content }
.cb-tel .ico { color: var(--text-2) } .cb-tel:hover { color: var(--brand-ink) }
.cb-addr { display: grid !important; grid-template-columns: 1fr; }
.cb-map { position: relative; height: 140px; border-radius: var(--r-in); overflow: hidden; background: var(--neutral) }
.cb-map img { width: 100%; height: 100%; object-fit: cover; display: block }
.cb-pin { position: absolute; left: 50%; top: 50%; transform: translate(-50%, -100%); width: 36px; height: 36px; border-radius: 50% 50% 50% 0; rotate: -45deg; background: var(--neg); color: #fff; display: grid; place-items: center; box-shadow: 0 4px 12px rgba(0, 0, 0, .25) }
.cb-pin .ico { rotate: 45deg; width: 18px; height: 18px }

/* адаптив */
@media (max-width: 1180px) {
  .cb-priv { grid-template-columns: repeat(2, minmax(0, 1fr)) }
}
@media (max-width: 760px) {
  .cb-head { align-items: flex-start }
  .cb-acts { margin-left: 0; width: 100% }
  .cb-acts > .btn, .cb-acts > a.btn { flex: 1 1 auto }
  .cb-tabs { order: 5; width: 100% }
  .cb-filters { flex-wrap: nowrap; overflow-x: auto; scrollbar-width: none; margin: 0 -16px; padding: 0 16px 2px }
  .cb-filters::-webkit-scrollbar { display: none }
  .cb-filters > * { flex: none }
  .cb-q { flex: 0 0 200px; max-width: none }
  .cb-docrow .cb-filters { flex-wrap: wrap; overflow: visible; margin: 0; padding: 0 }
  .cb-docrow .cb-filters > * { flex: 1 1 100% ; max-width: none }
  .cb-docrow .cb-filters > .btn:last-child { margin-left: 0 }
  .cb-trip, .cb-order { padding: 14px; border-radius: 16px }
  .cb-trip-m h3 { font-size: 18px; line-height: 22px }
  .cb-trip-f .pf-row, .cb-order-f .pf-row { margin-left: 0; width: 100% }
  .cb-trip-f .pf-row .btn, .cb-order-f .pf-row .btn { flex: 1 }
  .cb-ogrid { grid-template-columns: 1fr 1fr } .cb-ogrid .cb-oc:nth-child(3) { grid-column: 1 / -1 }
  .cb-order-h .badge { margin-left: 0 }
  .cb-fin { grid-template-columns: 1fr }
  .cb-big { font-size: 24px; line-height: 28px }
  .cb-mile { grid-template-columns: 1fr auto } .cb-mile .pf-in:first-child { grid-column: 1 / -1 }
  .cb-rh { display: none }
  .cb-rate, .cb-rates.c4 .cb-rate { grid-template-columns: 1fr }
  .cb-rate .btn { width: 100% }
  .cb-ph { display: flex !important; align-items: center; gap: 12px } .cb-only-m { display: block }
  .pf-tbl.cards td.cb-cbx { display: none }
  .cb-priv-hero { padding: 20px } .cb-priv-hero h1 { font-size: 24px; line-height: 30px } .cb-priv-art { display: none }
  .cb-priv, .cb-contacts { grid-template-columns: 1fr }
  .cb-role .cb-ul { grid-template-columns: 1fr }
  .cb-ai { padding: 16px } .cb-ai-ask { flex-direction: column; padding: 8px } .cb-ai-ask input { height: 44px } .cb-ai-ask .btn { width: 100% }
  .cb-acc details:has(.cb-step) .cb-acc-b { padding-left: 0 }
  .cb-sticky-in { padding: 12px } .cb-sticky-in .btn { width: 100% }
  .cb-tip em { width: min(240px, 70vw) }
}

/* таблицы политик и статей: значения не переносятся, иконки действий в строку */
.cb-pol td { white-space: nowrap } .cb-pol td.lead { white-space: normal; min-width: 150px } .cb-pol td small { white-space: nowrap }
.cb-pol .act .iconbtn, .cb-exp .act .iconbtn { display: inline-grid; width: 36px; height: 36px }
@media (max-width: 760px) { .cb-pol td { white-space: normal } }
@media (max-width: 760px) {
  .cb-trip-top .pf-link { display: none }
  .cb-meta { gap: 4px 10px } .cb-meta span + span::before { content: none }
  .cb-svc span { width: 28px; height: 28px; border-radius: 8px } .cb-svc .ico { width: 14px; height: 14px }
  .cb-trip-b { gap: 10px }
  .cb-cr { grid-template-columns: 1fr 1fr; gap: 10px 8px } .cb-cr span { white-space: nowrap }
  .cb-order-h { gap: 6px 10px }
}
.cb-acts > span:empty { display: none }
.cb-cv { display: inline-flex; flex-direction: column }
@media (max-width: 760px) { .cb-cv { align-items: flex-end } .cb-cv small { text-align: right } }
@media (max-width: 760px) {
  .cb-rate:not(.add) { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); padding-bottom: 8px; border-bottom: 1px solid var(--line-2) }
  .cb-rates.c4 .cb-rate:not(.add) { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) }
  .cb-rates.c4 .cb-rate:not(.add) .cb-fake:nth-child(3) { grid-column: 1 / -1 }
  .cb-rate:not(.add) .btn { grid-column: 1 / -1; height: 32px; background: transparent; color: var(--neg-ink); justify-self: start; min-width: 0; padding: 0 4px }
}
@media (max-width: 640px) {
  .pf-drawer .pf-l-f .pf-grow { display: none }
  .pf-drawer .pf-l-f [data-del], .pf-drawer .pf-l-f [data-restore] { order: 3; flex: 1 1 100%; border: 0; height: 40px }
}
@media (max-width: 640px) {
  .pf-drawer .pf-l-f [data-close] { flex: 0 0 auto; min-width: 96px }
  .cb-ai-i { display: none }
}
@media (max-width: 640px) {
  .cb-pf { display: grid; grid-template-columns: 1fr 1fr }
  .cb-pf [data-next] { grid-column: 1 / -1; order: -1 }
  .cb-pf .btn { min-width: 0 }
}
.cb-pol { font-size: 14px } .cb-pol td, .cb-pol th { padding-left: 8px; padding-right: 8px }
.cb-pol td:nth-child(2) { white-space: normal; min-width: 110px }
.cb-pol td.act { padding-right: 0 }

/* сотрудники: сетка по CabinetEmployeesTable (b2b-fbt) — фиксированные колонки, строки одной высоты */
.cb-emp-w { margin: 0 -24px; padding: 0 24px; overflow-x: auto }
.cb-emp2 { table-layout: fixed; min-width: 640px }
.cb-emp2 .c-emp { width: 40% } .cb-emp2 .c-pos { width: 32% } .cb-emp2 .c-dep { width: 28% }
.cb-emp2 th { padding: 14px 12px 13px }
.cb-emp2 td { padding: 12px; height: 64px; vertical-align: middle }
.cb-emp2 tbody tr:hover td { background: none }
.cb-en { display: block; font-size: 14px; line-height: 20px; font-weight: 600; white-space: nowrap; overflow: hidden; text-overflow: ellipsis }
.cb-em { display: block; font-size: 12px; line-height: 16px; color: var(--text-2); font-variant-numeric: tabular-nums }
.cb-tr { display: block; white-space: nowrap; overflow: hidden; text-overflow: ellipsis }
.btn.inert { cursor: default; pointer-events: none }
@media (max-width: 760px) {
  .cb-emp-w { margin: 0 -16px; padding: 0 16px; overflow: visible }
  .cb-emp2 { min-width: 0 }
  .cb-emp2 td { height: auto }
  .cb-emp2 td .cb-tr { white-space: normal; text-align: right }
}

/* аналитика: цвета графиков — проверены валидатором dataviz для светлой и тёмной темы */
.an-head { --an-1: #4ebc73; --an-warn: #e58600; --an-neg: #ff3347 }
.pf-cab-main { --an-1: #4ebc73; --an-warn: #e58600; --an-neg: #ff3347; --an-track: var(--neutral) }
@media (prefers-color-scheme: dark) { :root:not([data-theme="light"]) .pf-cab-main { --an-1: #36a15e; --an-warn: #c98500; --an-neg: #e0484f } }
:root[data-theme="dark"] .pf-cab-main { --an-1: #36a15e; --an-warn: #c98500; --an-neg: #e0484f }
.an-kpis { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px }
.an-kpi { background: var(--surface-2); border-radius: 16px; padding: 16px; display: flex; flex-direction: column; gap: 4px; min-width: 0 }
.an-kpi span { font-size: 12px; color: var(--text-2) }
.an-kpi b { font-size: 24px; line-height: 30px; font-weight: 600; letter-spacing: -.01em; white-space: nowrap }
.an-kpi small { font-size: 12px; color: var(--text-2) } .an-kpi small.ok { color: var(--brand-ink) } .an-kpi small.warn { color: var(--warn) }
.an-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 20px }
.an-wide { grid-column: 1 / -1 }
.an-ch { display: flex; justify-content: space-between; align-items: baseline; gap: 12px; flex-wrap: wrap }
/* столбцы по месяцам */
.an-bars { position: relative; height: 240px; padding-left: 52px }
.an-grid-y { position: absolute; inset: 0 0 24px 0; display: flex; flex-direction: column; justify-content: space-between; pointer-events: none }
.an-grid-y div { border-top: 1px solid var(--line-2); position: relative }
.an-grid-y span { position: absolute; left: 0; top: -9px; font-size: 12px; color: var(--text-3); background: var(--surface); padding-right: 6px }
.an-cols { position: relative; height: 100%; display: flex; gap: 8px; align-items: stretch }
.an-col { flex: 1; min-width: 0; display: flex; flex-direction: column; align-items: center; gap: 6px; cursor: default }
.an-bar-w { flex: 1; width: 100%; display: flex; align-items: flex-end; justify-content: center }
.an-bar { position: relative; width: min(100%, 40px); background: var(--an-1); border-radius: 4px 4px 0 0; transition: opacity .15s; min-height: 2px }
.an-col:hover .an-bar { opacity: .8 }
.an-bar em { position: absolute; left: 50%; bottom: calc(100% + 4px); transform: translateX(-50%); font-style: normal; font-size: 12px; font-weight: 600; color: var(--text); white-space: nowrap }
.an-col > span { font-size: 12px; color: var(--text-2); height: 18px }
/* горизонтальные полосы */
.an-hb { display: flex; flex-direction: column; gap: 14px }
.an-hr { display: flex; flex-direction: column; gap: 6px }
.an-hr-t { display: flex; justify-content: space-between; gap: 12px; font-size: 14px }
.an-hr-t span { display: inline-flex; align-items: center; gap: 8px; min-width: 0 } .an-hr-t .ico { color: var(--text-2) }
.an-hr small { font-size: 12px; color: var(--text-2) }
.an-track { height: 8px; border-radius: 999px; background: var(--an-track); overflow: hidden }
.an-track i { display: block; height: 100%; border-radius: 4px; background: var(--an-1) }
.an-track.sm { height: 4px; margin-top: 6px; max-width: 220px }
/* политика */
.an-hero { display: flex; align-items: baseline; gap: 12px; flex-wrap: wrap }
.an-hero b { font-size: 40px; line-height: 44px; font-weight: 600; letter-spacing: -.02em }
.an-hero span { color: var(--text-2); font-size: 14px }
.an-stack { display: flex; gap: 2px; height: 12px; border-radius: 999px; overflow: hidden }
.an-stack i { display: block; height: 100% } .an-stack i:first-child { border-radius: 999px 0 0 999px } .an-stack i:last-child { border-radius: 0 999px 999px 0 }
.an-stack .ok, .an-legend i.ok { background: var(--an-1) } .an-stack .warn, .an-legend i.warn { background: var(--an-warn) } .an-stack .neg, .an-legend i.neg { background: var(--an-neg) }
.an-legend { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 8px; font-size: 14px }
.an-legend li { display: flex; align-items: center; gap: 8px } .an-legend li b { margin-left: auto; font-weight: 600 }
.an-legend i { width: 10px; height: 10px; border-radius: 3px; flex: none }
/* когда бронируют */
.an-col2 { display: flex; flex-direction: column; gap: 14px }
.an-lead { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px; height: 220px; padding-top: 22px }
.an-lc { display: flex; flex-direction: column; align-items: center; gap: 4px; min-width: 0; cursor: default }
.an-lb-w { flex: 1; width: 100%; display: flex; align-items: flex-end; justify-content: center }
.an-lb { position: relative; width: min(100%, 56px); background: var(--an-1); border-radius: 4px 4px 0 0 }
.an-lb em { position: absolute; left: 50%; bottom: calc(100% + 4px); transform: translateX(-50%); font-style: normal; font-size: 12px; font-weight: 600 }
.an-lc b { font-size: 12px; font-weight: 600; white-space: nowrap } .an-lc span { font-size: 12px; color: var(--text-2); white-space: nowrap }
/* направления и люди */
.an-tbl td { vertical-align: top }
.an-ppl { display: flex; flex-direction: column }
.an-p { display: flex; align-items: center; gap: 10px; padding: 10px 0; border-top: 1px solid var(--line-2) }
.an-p:first-child { border-top: 0; padding-top: 0 }
.an-p .pf-grow { display: flex; flex-direction: column; min-width: 0 } .an-p .pf-grow b { font-weight: 600; font-size: 14px } .an-p small { font-size: 12px; color: var(--text-2) }
.an-pn { display: flex; flex-direction: column; align-items: flex-end; min-width: 64px } .an-pn b { font-size: 14px }
.an-ps { min-width: 92px; text-align: right; font-size: 14px; font-weight: 600 }
.an-tip { position: fixed; z-index: 90; pointer-events: none; background: #171717; color: #fff; font-size: 12px; line-height: 17px; padding: 7px 10px; border-radius: 10px; box-shadow: 0 6px 20px rgba(0, 0, 0, .2); max-width: 280px }
@media (max-width: 1100px) { .an-kpis { grid-template-columns: repeat(2, minmax(0, 1fr)) } }
@media (max-width: 760px) {
  .an-grid { grid-template-columns: 1fr }
  .an-bars { height: 200px; padding-left: 40px } .an-cols { gap: 4px } .an-col > span { font-size: 10px }
  .an-bar em { display: none }
  .an-lead { height: 180px; gap: 6px } .an-lc b { font-size: 12px } .an-lc span { font-size: 10px }
  .an-ps { display: none }
}

/* ===== Все заказы — по b2b-fbt pages/orders (OrdersPage, OrdersFilters, OrderCard, OrderCardActions) ===== */
.or-page { background: var(--surface); border-radius: 16px; min-width: 0 }
.or-head { min-height: 48px; display: flex; align-items: center; padding: 12px 16px; border-bottom: 1px solid var(--line-2) }
.or-head h1 { margin: 0; font-size: 18px; line-height: 24px; font-weight: 600 }
.or-filters { display: flex; flex-wrap: wrap; gap: 12px; padding: 16px; border-bottom: 1px solid var(--line-2) }
.or-search { position: relative; display: block; flex: 1 0 100%; min-width: 0 }
.or-search input { box-sizing: border-box; width: 100%; height: 36px; border: 0; border-radius: 12px; background: var(--field); color: var(--text); font-size: 14px; line-height: 18px; padding: 9px 40px 9px 12px; outline: none }
.or-search input:focus { box-shadow: 0 0 0 1px var(--brand) }
.or-search input::placeholder { color: var(--text-3) }
.or-search input::-webkit-search-cancel-button { -webkit-appearance: none }
.or-search .ico { position: absolute; top: 8px; right: 8px; width: 20px; height: 20px; color: var(--text-2); pointer-events: none }
.or-controls { display: flex; flex: 1 0 100%; flex-wrap: wrap; gap: 8px; min-width: 0 }
.or-dd { flex: 1 1 0; min-width: 0; height: 40px; display: inline-flex; align-items: center; justify-content: space-between; gap: 6px; padding: 10px 12px; border: 1px solid var(--neutral-hover); border-radius: 12px; background: var(--surface); color: var(--text-2); font-size: 14px; font-weight: 600; line-height: 18px; transition: border-color .15s, box-shadow .15s }
.or-dd span { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; text-align: left }
.or-dd .ico { width: 18px; height: 18px; flex: none; color: var(--text-2); transition: transform .15s }
.or-dd:hover { border-color: var(--line-3) }
.or-dd.on, .or-dd[aria-expanded="true"] { border-color: var(--brand); color: var(--text) }
.or-dd[aria-expanded="true"] .ico { transform: rotate(180deg) }
.or-fbtn { display: none }
.or-list-w { padding: 16px }
.or-list { display: flex; flex-direction: column; gap: 20px }
.or-more-btn { align-self: center; height: 40px; padding: 0 16px; border-radius: 12px; background: var(--neutral); color: var(--text); font-size: 14px; font-weight: 600 }
.or-more-btn:hover { background: var(--neutral-hover) }

/* карточка заказа */
.or-card { border: 1px solid var(--line); border-radius: 16px; background: var(--surface); min-width: 0 }
.or-ch { min-height: 44px; display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 12px 24px; border-bottom: 1px solid var(--line-2) }
.or-id { display: flex; align-items: center; gap: 12px; min-width: 0; font-size: 16px; line-height: 22px; color: var(--text) }
.or-svc { width: 24px; height: 24px; flex: none; padding: 2px; object-fit: contain; box-sizing: border-box }
.or-svc.i { display: grid; place-items: center; color: var(--text-3) }
.or-car { position: relative; width: 24px; height: 24px; flex: none; display: inline-block }
.or-car .b { position: absolute; top: 5.38px; left: 1px; width: 22px; height: 11.83px }
.or-car .l, .or-car .r { position: absolute; top: 12.95px; width: 6.16px; height: 6.13px }
.or-car .l { left: 3.08px } .or-car .r { left: 14.51px }
.or-st { border-radius: 999px; padding: 4px 6px; font-size: 12px; font-weight: 600; line-height: 16px; white-space: nowrap }
.or-st--success { background: var(--brand-light); color: var(--brand-ink) }
.or-st--warning { background: var(--warn-light); color: var(--warn) }
.or-st--error { background: var(--neg-light); color: var(--neg-ink) }
.or-st--default { background: var(--field); color: var(--text-2) }
.or-ctl { display: flex; align-items: center; gap: 8px; flex: none }
.or-btn { display: inline-flex; align-items: center; justify-content: center; gap: 8px; min-height: 32px; padding: 7px 12px; border: 1px solid var(--line); border-radius: 12px; background: transparent; color: var(--text-2); font-size: 14px; font-weight: 600; line-height: 18px; text-decoration: none; white-space: nowrap }
.or-btn:hover { background: var(--surface-2) }
.or-btn .ico { width: 16px; height: 16px; transition: transform .15s }
.or-btn[aria-expanded="true"] .ico { transform: rotate(180deg) }
.or-body { display: flex; gap: 16px; padding: 24px }
.or-airlines { position: relative; flex: none; width: 32px }
.or-al { position: absolute; left: 0; width: 32px; height: 32px; display: grid; place-items: center; border: 1px solid; border-radius: 999px; background: var(--surface); padding: 3px; box-sizing: border-box }
.or-al i { width: 24px; height: 24px; border-radius: 999px; display: grid; place-items: center; font-style: normal; font-size: 10px; font-weight: 700; color: #fff; letter-spacing: .02em }
.or-img { width: 56px; height: 56px; border-radius: 8px; object-fit: cover; flex: none }
.or-ph { flex: none; display: flex; align-items: center; justify-content: center; background: var(--field); border-radius: 8px }
.or-ph.tr { width: 72px; height: 40px }
.or-main { flex: 1; min-width: 0 }
.or-route { margin: 0 0 16px; font-size: 18px; line-height: 24px; font-weight: 600; color: var(--text) }
.or-route.big { font-size: 24px; line-height: 28px }
.or-hint { margin: -12px 0 16px; font-size: 14px; line-height: 18px; color: var(--text-2) }
.or-sub { margin: -12px 0 16px; font-size: 16px; line-height: 22px; color: var(--text-2) }
.or-meta { display: flex; flex-wrap: wrap; gap: 32px; margin: 0 }
.or-meta > div { min-width: 0 }
.or-meta dt, .or-ppl dt { font-size: 14px; line-height: 18px; color: var(--text-2) }
.or-meta dd, .or-ppl dd { margin: 2px 0 0; font-size: 16px; line-height: 22px; font-weight: 600; color: var(--text) }
.or-meta dd { white-space: nowrap }
.or-sec { display: block; margin-top: 2px; font-size: 14px; line-height: 18px; color: var(--text-2); white-space: nowrap }
.or-ppl { display: grid; grid-template-columns: max-content minmax(0, 1fr); gap: 6px 24px; margin: 16px 0 0; padding-top: 16px; border-top: 1px solid var(--line-2) }
.or-ppl dd { overflow-wrap: anywhere }
.or-more { margin-left: 4px; text-decoration: underline; cursor: default }
.or-pay { display: flex; flex-direction: column; align-items: center; gap: 12px; margin: 0 24px 24px; padding: 16px; border-radius: 16px; background: var(--warn-light) }
.or-timer { display: inline-flex; align-items: center; gap: 8px; color: var(--warn); font-size: 14px; font-weight: 500; line-height: 18px; white-space: nowrap }
.or-timer .ico { width: 24px; height: 24px; flex: none }
.or-paybtn { width: 100%; min-height: 46px; padding: 12px 16px; border-radius: 16px; background: var(--brand); color: #fff; font-size: 16px; font-weight: 600; line-height: 22px }
.or-paybtn:hover { background: var(--brand-hover) }
.or-exp { padding: 0 24px 24px }
.or-sel { width: 100%; height: 40px; display: flex; align-items: center; justify-content: space-between; gap: 6px; padding: 10px 12px; border-radius: 12px; background: var(--field); color: var(--text); font-size: 14px; line-height: 18px; text-align: left }
.or-sel span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap }
.or-sel .ico { width: 18px; height: 18px; color: var(--text-2); flex: none }
/* меню «Действия» */
.pf-pop.or-pop { padding: 6px; border-radius: 12px; box-shadow: 0 8px 24px rgba(0, 0, 0, .12), 0 0 0 1px var(--line) }
.or-menu { display: flex; flex-direction: column }
.or-mi { min-height: 36px; padding: 8px 12px; border-radius: 8px; color: var(--text); font-size: 14px; line-height: 18px; text-align: left }
.or-mi:hover, .or-mi:focus-visible { background: var(--field); outline: none }
.pf-pop.sheet.or-pop { padding: 0 16px calc(16px + env(safe-area-inset-bottom)); border-radius: 24px 24px 0 0 }

@media (max-width: 767px) {
  .or-filters { flex-wrap: wrap; gap: 8px; padding: 12px }
  .or-search { flex: 1 1 0 }
  .or-search input { height: 40px }
  .or-search .ico { top: 10px }
  .or-fbtn { display: inline-flex; align-items: center; gap: 6px; height: 40px; padding: 0 12px; border-radius: 12px; background: var(--neutral); color: var(--text); font-size: 14px; font-weight: 600; white-space: nowrap }
  .or-controls { display: none; flex-basis: 100% }
  .or-filters.open .or-controls { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)) }
  .or-list-w { padding: 12px }
  .or-list { gap: 16px }
  .or-ch { display: grid; grid-template-columns: minmax(0, 1fr); padding: 12px 16px }
  .or-id { flex-wrap: wrap; row-gap: 6px }
  .or-ctl { width: 100%; gap: 4px }
  .or-ctl .or-btn { flex: 1; min-height: 40px; padding-inline: 10px }
  .or-body { padding: 16px }
  .or-route, .or-route.big { font-size: 18px; line-height: 24px }
  .or-meta { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px }
  .or-ppl { grid-template-columns: 1fr }
  .or-pay { margin: 0 16px 16px }
  .or-exp { padding: 0 16px 16px }
}

/* масштаб кабинета как в проде (fbt.kz/ru/cabinet): меню 316 px, пункт 44, заголовок 18, поля и селекты 36, вкладки 32 */
.pf-cab { grid-template-columns: 316px minmax(0, 1fr) }
.pf-si { min-height: 44px; padding: 10px 12px; font-size: 14px; line-height: 18px; font-weight: 500 }
.pf-sg-h { font-size: 14px; line-height: 20px; font-weight: 500; padding: 0 12px 2px }
.pf-cab-main > .pf-card { padding: 16px; border-radius: 24px }
.cb-ttl h1 { font-size: 18px; line-height: 24px }
.cb-ttl p { font-size: 12px }
.cb-q { height: 36px } .cb-q input { font-size: 14px }
.cb-dd { height: 36px; font-weight: 600 }
.cb-tabs button { height: 32px; font-size: 14px; font-weight: 600; padding: 0 8px; border-radius: 12px }
.cb-tabs { padding: 0; background: none; gap: 4px }
.cb-tabs button.on { background: var(--info-light); color: var(--info); box-shadow: none }
.cb-tabs button.on .n { color: var(--info) }
.cb-trip-m h3 { font-size: 20px; line-height: 24px }
.cb-trip-f > b { font-size: 18px; line-height: 24px; font-weight: 600 }
@media (max-width: 1000px) { .pf-cab { grid-template-columns: 1fr } }

/* Документы как в проде: секции на белом через разделители, без подзаголовков, фильтры — серые поля в одну строку */
.cb-docrow { background: none; border-radius: 0; padding: 16px 0 0; border-top: 1px solid var(--line-2); gap: 12px }
.cb-docrow-h p { display: none }
.cb-docrow-h h3 { font-size: 16px; line-height: 22px; font-weight: 600 }
.cb-docrow .cb-filters { flex-wrap: nowrap }
.cb-docrow .cb-dd, .cb-docrow .cb-dd.on { flex: 1 1 0; max-width: none; min-width: 0; background: var(--field); border-color: transparent; color: var(--text); font-weight: 400 }
.cb-docrow .cb-dd.on .ico { color: var(--text-2) }
.cb-docrow .btn { height: 36px; flex: none }
@media (max-width: 760px) { .cb-docrow .cb-filters { flex-wrap: wrap } .cb-docrow .cb-dd, .cb-docrow .cb-dd.on { flex: 1 1 45% } }

/* Фильтры кабинета — серые поля, как в проде (сотрудники, финансы, документы) */
.cb-filters .cb-dd, .cb-filters .cb-dd.on { background: var(--field); border-color: transparent; color: var(--text); font-weight: 400; min-width: 180px }
.cb-filters .cb-dd.on { font-weight: 500 }
.cb-filters .cb-dd.on .ico { color: var(--text-2) }
.cb-filters .cb-dd:hover { background: var(--field-hover, var(--line)) }
.cb-filters .cb-q { flex: 1 1 240px; max-width: 320px }
@media (max-width: 760px) { .cb-filters .cb-dd, .cb-filters .cb-dd.on { min-width: 0; flex: 1 1 45% } .cb-filters .cb-q { max-width: none } }
/* Поездки: в проде фильтры — белые поля с обводкой в одну строку, поиск короткий */
.cb-trf { flex-wrap: nowrap }
.cb-trf .cb-q { flex: 0 1 180px }
.cb-trf .cb-dd, .cb-trf .cb-dd.on { flex: 1 1 0; min-width: 0; max-width: none; background: var(--surface); border: 1px solid var(--line-2); font-weight: 500 }
.cb-trf .cb-dd.on { border-color: var(--brand); color: var(--brand-ink) }
@media (max-width: 760px) { .cb-trf { flex-wrap: wrap } .cb-trf .cb-q { flex: 1 1 100% } .cb-trf .cb-dd, .cb-trf .cb-dd.on { flex: 1 1 45% } }
/* «Все заказы»: фильтры по ширине текста, 36 px, без обрезки — как в проде */
@media (min-width: 761px) { .or-dd { flex: 1 1 auto; height: 36px; padding: 8px 10px } .or-controls { gap: 8px } }

/* в кабинете крошки — без полосы: слева меню разделов */
.pf-cab-main .pf-crumbs { min-height: 0; padding: 0 0 12px; background: none; box-shadow: none; clip-path: none }
/* кабинет на телефоне: поиск на всю ширину, списки по два в ряд; вкладки прокручиваются вбок */
@media (max-width: 760px) {
  .cb-filters { flex-wrap: wrap }
  .cb-filters .cb-q { flex: 1 1 100%; max-width: none }
  .cb-head .pf-seg, .cb-page > .pf-seg { max-width: 100%; overflow-x: auto; scrollbar-width: none; flex-wrap: nowrap }
  .cb-head .pf-seg button { flex: none; white-space: nowrap }
}
