/* «Топ-5 лидеров рынка» (static/leaders.js). Каркас — классы «Динамики финансов» (fd-*); здесь своё:
   вкладки в шапке, ровная панель фильтров, цвета как в PBI «Main Report competitors»: розовый —
   чужой товар/поставщик (#EEC0C3), зелёный — наш (#D3F8D4), голубые полосы, значок позиции у доли. */
.tl-modal{--tl-bar:#9dc3e6;--tl-pink:#f6d9db;--tl-theirs:#f3d3d5;--tl-ours:#d3f8d4;--tl-sel:#e8f1fc}
/* вкладки — сегмент в шапке, не липкий слой над таблицей (§10) */
.tl-tabs{display:flex;border:1px solid var(--line-strong);border-radius:6px;overflow:hidden}
.tl-tab{height:28px;padding:0 12px;border:0;border-right:1px solid var(--line-strong);background:#fff;font-size:12px;cursor:pointer;color:var(--text)}
.tl-tab:last-child{border-right:0}
.tl-tab.active{background:var(--accent);color:#fff;font-weight:600}
/* панель фильтров: все поля одной высоты (28 px), шрифта (12 px) и ширины */
.tl-modal .fd-bar{align-items:flex-end;gap:8px 12px}
.tl-modal .fd-bar .fd-field{width:150px;min-width:150px}
.tl-modal .fd-bar .fd-field.tl-wide2{width:312px;min-width:312px}
.tl-modal .fd-bar .fd-dates{display:flex;gap:12px}
.tl-modal .fd-bar .fd-dates input{width:150px}
.tl-modal .fd-bar .ctrl-input,.tl-modal .fd-bar select,.tl-modal .fd-bar .msel-btn,.tl-modal .fd-bar .tl-reset{
  box-sizing:border-box;height:28px;font-size:12px;line-height:26px;padding:0 8px;border:1px solid var(--line-strong);
  border-radius:4px;background:#fff;color:var(--text)}
.tl-modal .fd-bar .msel{width:100%;min-width:0}
.tl-modal .fd-bar .msel-btn{width:100%;text-align:left;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.tl-modal .fd-bar .msel-btn.on{border-color:var(--accent);background:var(--tl-sel)}
.tl-modal .fd-bar .tl-reset{width:100%;cursor:pointer}
.tl-seg{display:flex;height:28px;border:1px solid var(--line-strong);border-radius:4px;overflow:hidden}
.tl-seg button{flex:1;border:0;background:#fff;font-size:12px;cursor:pointer;color:var(--text)}
.tl-seg button+button{border-left:1px solid var(--line-strong)}
.tl-seg button.active{background:var(--accent);color:#fff;font-weight:600}
.tl-modal.tl-noside .tl-side{display:none}
/* таблицы */
.tl-modal .fd-table thead th{background:#fff;color:#1a1f2b;font-weight:700;border-bottom:2px solid var(--line-strong)}
.tl-table td{font-variant-numeric:tabular-nums}
.tl-table tr.fd-grand td{font-weight:700;background:#f7f9fb}
/* «Лидеры рынка» */
.tl-toptab .fd-c1{width:230px;min-width:230px;max-width:230px}
.tl-toptab th.tl-top,.tl-toptab td.tl-top{text-align:left;width:190px;min-width:190px;max-width:190px;overflow:hidden;text-overflow:ellipsis}
.tl-toptab td.tl-ours{background:var(--tl-ours)}
.tl-toptab td.tl-theirs{background:var(--tl-theirs)}
.tl-table tr.tl-nodir td.fd-c1{color:var(--muted);font-style:italic}
/* «Анализ конкурентов» */
.tl-cmp th.tl-bk{text-align:center;border-left:1px solid var(--line-strong)}
.tl-cmp th.tl-mh{white-space:normal;min-width:74px;font-size:var(--fs-cap);vertical-align:bottom}
.tl-cmp .tl-f0{position:sticky;left:0;z-index:2;background:#fff;text-align:left;width:170px;min-width:170px;max-width:170px;white-space:normal;vertical-align:top}
.tl-cmp thead .tl-f0{z-index:4}
.tl-cmp td.tl-f1,.tl-cmp td.tl-f2,.tl-cmp td.tl-f3,.tl-cmp td.tl-f4{text-align:left;max-width:180px;overflow:hidden;text-overflow:ellipsis}
.tl-cmp th.tl-f1,.tl-cmp th.tl-f2,.tl-cmp th.tl-f3,.tl-cmp th.tl-f4{text-align:left}
.tl-cmp tr.tl-dirrow td{background:#f7f9fb;border-top:1px solid var(--line-strong)}
.tl-cmp tr.tl-ours td:not(.tl-f0){background:var(--tl-ours)}
.tl-cmp tr.tl-theirs td:not(.tl-f0){background:var(--tl-theirs)}
.tl-cmp tr.tl-selrow td{font-weight:600}
.tl-dot{display:inline-block;width:9px;height:9px;border-radius:50%;margin-right:6px;vertical-align:middle}
.tl-sum{width:100%;table-layout:fixed;border-collapse:collapse;font-size:var(--fs-cap)}
.tl-sum th:nth-child(1),.tl-sum td:nth-child(1){width:44%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.tl-sum th:nth-child(2),.tl-sum td:nth-child(2){width:36%}
.tl-sum th:nth-child(3),.tl-sum td:nth-child(3){width:20%}
.tl-sum th,.tl-sum td{padding:3px 4px;border-bottom:1px solid var(--line);text-align:right}
.tl-sum th:first-child,.tl-sum td:first-child{text-align:left}
.tl-side{width:300px}
/* «Сверка по годам» */
.tl-years .fd-c1{width:200px;min-width:200px;max-width:200px;vertical-align:top;font-weight:600}
.tl-years .tl-year{text-align:left;min-width:48px}
.tl-years th:not(.fd-c1):not(.tl-year){min-width:96px}
.tl-years td.tl-yc{background:var(--tl-pink)}
.tl-years td.tl-ytot{font-weight:700;background:var(--tl-theirs)}
.tl-years tr.tl-blockend td{border-bottom:1px solid var(--line-strong)}
@media (max-width:700px){
  .tl-tabs{order:5;width:100%}
  .tl-tab{flex:1;padding:0 6px}
  .tl-toptab .fd-c1,.tl-years .fd-c1,.tl-cmp .tl-f0{width:130px;min-width:130px;max-width:130px}
}
