/* =====================================================================
   BAUST ERP — Дизайн-система v1 (CSS)
   Єдине джерело правди для нового інтерфейсу. Світла тема, мінімалізм,
   принцип «увага — головний ресурс»: акцент тільки там, куди треба дивитись.

   Як це влаштовано:
   - Усі кольори/радіуси/тіні задані ОДИН раз у :root як змінні (--bt-*).
   - Компоненти — це класи з префіксом .bt-  (button, card, sidebar, table…).
   - Щоб не зачепити стару частину ERP, базові стилі живуть під коренем .bt-app.
   Еталон: «Baust ERP - UI Kit.dc.html» + правила у CLAUDE.md дизайн-проєкту.
   ===================================================================== */

/* ---------- Шрифт Gilroy (файли в /public/fonts) ---------- */
@font-face{font-family:'Gilroy';src:url('../fonts/Gilroy-Regular.woff2') format('woff2'),url('../fonts/Gilroy-Regular.woff') format('woff');font-weight:300 400;font-style:normal;font-display:swap;}
@font-face{font-family:'Gilroy';src:url('../fonts/Gilroy-Medium.woff2') format('woff2'),url('../fonts/Gilroy-Medium.woff') format('woff');font-weight:500;font-style:normal;font-display:swap;}
@font-face{font-family:'Gilroy';src:url('../fonts/Gilroy-SemiBold.woff2') format('woff2'),url('../fonts/Gilroy-SemiBold.woff') format('woff');font-weight:600;font-style:normal;font-display:swap;}
@font-face{font-family:'Gilroy';src:url('../fonts/Gilroy-Bold.woff2') format('woff2'),url('../fonts/Gilroy-Bold.woff') format('woff');font-weight:700;font-style:normal;font-display:swap;}
@font-face{font-family:'Gilroy';src:url('../fonts/Gilroy-ExtraBold.woff2') format('woff2'),url('../fonts/Gilroy-ExtraBold.woff') format('woff');font-weight:800;font-style:normal;font-display:swap;}
@font-face{font-family:'Gilroy';src:url('../fonts/Gilroy-Black.woff2') format('woff2'),url('../fonts/Gilroy-Black.woff') format('woff');font-weight:900;font-style:normal;font-display:swap;}

/* ---------- 01 · Токени (змінні) ---------- */
:root{
  /* Три акценти — і тільки три */
  --bt-green:#A2C520;        /* дохід / бренд / активна навігація */
  --bt-green-press:#92B31B;  /* press-стан залитої зеленої */
  --bt-green-tint:#EEF4D8;   /* фон активного / тінт */
  --bt-green-seg:#C7DD55;    /* активний сегмент перемикача */
  --bt-green-border:#D6E6B0; /* рамка зеленого «+» квадрата */

  --bt-blue:#6B93E8;         /* прибуток / дія / фокус — головна цифра «куди дивимось» */
  --bt-blue-press:#2257d6;   /* press-стан залитої синьої */
  --bt-blue-tint:#F4F7FE;    /* hover ghost-синього */
  --bt-blue-tint2:#E8EEFE;   /* фон синього бейджа */
  --bt-blue-border:#D6E2FF;  /* outline-рамка синьої фін-кнопки */

  --bt-coral:#ED8B8B;        /* витрати / деструктив */
  --bt-coral-press:#e07575;  /* press-стан залитої коралової */
  --bt-coral-tint:#FBEAEA;   /* hover м'якої деструкції */
  --bt-coral-border:#F1D6D6; /* рамка soft-danger */

  /* Три сірих — і тільки три */
  --bt-ink:#1A1D23;          /* основний текст, числа */
  --bt-gray-d:#7A8089;       /* другорядний текст, лейбли */
  --bt-gray:#9098A2;         /* підписи, плейсхолдери, іконки */
  --bt-line:#DCE0E6;         /* межі, розділювачі, треки (трохи темніше — читається на білому тлі) */

  --bt-bg:#F6F7F9;           /* фон сторінки */
  --bt-card:#FFFFFF;         /* картки */
  --bt-row-active:#F1F3F5;   /* hover/активний рядок навігації (світло-сірий) */
  --bt-row-press:#E4E7EB;    /* натиснута/вибрана кнопка (темніший сірий) */
  --bt-dashed:#C9CED5;       /* колір пунктирної «додати» */

  /* Радіуси */
  --bt-r-card:16px; --bt-r-card-sm:14px;
  --bt-r-fin:11px;  --bt-r-btn:10px; --bt-r-9:9px; --bt-r-input:8px; --bt-r-7:7px; --bt-r-6:6px;

  /* Тіні */
  --bt-sh-outline:0 1px 2px rgba(20,30,50,.06);   /* outline-кнопка/тулбар */
  --bt-sh-raise:0 1px 2px rgba(20,30,50,.04),0 2px 10px rgba(20,30,50,.05);  /* легкий підйом картки на білому тлі */
  --bt-sh-card:0 6px 22px rgba(20,30,50,.06);     /* картка/hover */
  --bt-sh-pop:0 14px 40px rgba(20,30,50,.18);     /* поповер/меню */
  --bt-sh-modal:0 24px 60px rgba(20,30,50,.28);   /* модальне вікно */

  --bt-font:'Gilroy',-apple-system,'Helvetica Neue',Arial,sans-serif;
}

/* ---------- Lucide-іконки: рівно 1.25px на всіх ---------- */
svg.lucide{stroke-width:1.25px;}
svg.lucide *{vector-effect:non-scaling-stroke;}

/* ---------- Базовий каркас (тільки під .bt-app, щоб не чіпати стару ERP) ---------- */
.bt-app, .bt-app *{box-sizing:border-box;}
.bt-app{
  /* Каркас (сайдбар + верхня смуга) зафіксований рівно на висоту екрана й сам НЕ
     прокручується. Прокрутка живе всередині .bt-main (своя для кожної сторінки);
     на оргсхемі .bt-main--fixed вимикає її (там зум/панорама полотна). */
  margin:0; height:100vh; overflow:hidden; display:flex;
  /* Каркас білий (як сайдбар/топбар): legacy .content і так білий, а новий фон
     прибирає сірий обідок, що проступав по краях. Дрібні сірі акценти (бейджі,
     hover, поля пошуку) лишаються на --bt-bg і не міняються. */
  background:var(--bt-card); color:var(--bt-ink);
  font-family:var(--bt-font); font-size:14px; font-weight:500; line-height:1.4;
  font-variant-numeric:tabular-nums;
  /* Свідомо БЕЗ -webkit-font-smoothing та text-rendering:optimizeLegibility:
     на Windows/Chrome optimizeLegibility «розмиває» дрібний текст, а еталонні
     макети (які виглядають чітко) цих директив не мають. Хай браузер малює
     текст стандартним шляхом (ClearType/DirectWrite) — так найчіткіше. */
}
.bt-app ::-webkit-scrollbar{width:10px;height:10px;}
.bt-app ::-webkit-scrollbar-thumb{background:#D9DDE2;border-radius:6px;border:2px solid var(--bt-bg);}

/* =====================================================================
   09 · ЛІВА БОКОВА ПАНЕЛЬ (сайдбар)
   ===================================================================== */
.bt-sidebar{
  width:248px; flex:none; background:var(--bt-card);
  border-right:1px solid var(--bt-line);
  display:flex; flex-direction:column;
  /* position:relative (НЕ sticky): застосунок сам не прокручується, тож стікі не
     потрібен; а sticky створює окремий GPU-шар, на якому текст і SVG-логотип
     малюються м'якше (без ClearType). relative зберігає z-index-стек для флайауту. */
  position:relative; height:100vh;
  /* z-index підіймає весь сайдбар (і його флайаут-меню) над основним контентом,
     інакше попап профілю ховається під полотном оргсхеми. */
  z-index:40;
}
.bt-sidebar__head{display:flex;align-items:center;justify-content:space-between;min-height:56px;padding:0 12px 0 18px;}
.bt-sidebar__logo{height:31px;width:auto;display:block;margin-left:7px;}
.bt-sidebar__logo-mark{height:30px;width:auto;display:none;margin:0 auto;}
/* хрестик у шапці панелі — ховає бічне меню (десктоп) / закриває драуер (мобільний) */
.bt-sidebar__close{flex:none;width:34px;height:34px;border-radius:9px;display:flex;align-items:center;justify-content:center;
  cursor:pointer;background:none;border:none;color:var(--bt-gray);}
.bt-sidebar__close i,.bt-sidebar__close svg{width:19px;height:19px;color:var(--bt-gray);}
.bt-sidebar__close:hover{background:#F4F5F7;}
.bt-sidebar__nav{display:flex;flex-direction:column;gap:2px;padding:6px 12px 0;overflow-y:auto;flex:1;cursor:pointer;}

/* секційний надзаголовок усередині навігації */
.bt-nav-group{font:800 10px/1 var(--bt-font);letter-spacing:.07em;text-transform:uppercase;
  color:var(--bt-gray);padding:14px 13px 6px;}

.bt-nav-row{
  display:flex;align-items:center;gap:12px;padding:10px 13px;border-radius:9px;
  font:500 13.5px/1 var(--bt-font);color:var(--bt-gray-d);
  text-decoration:none;cursor:pointer;white-space:nowrap;
  /* плавне згортання/розгортання: відступ (іконка «пливе»), фон при наведенні */
  transition:padding .18s ease, background .12s ease;
}
.bt-nav-row i,.bt-nav-row svg{width:18px;height:18px;flex:none;color:var(--bt-gray);}
/* текст пункту: у згорнутому стані плавно «стискається» й зникає замість миттєвого пропадання */
.bt-nav-row span{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;
  transition:max-width .18s ease, opacity .14s ease;max-width:170px;}
.bt-nav-row:hover{background:var(--bt-row-active);}
.bt-nav-row.is-active{font-weight:700;color:var(--bt-ink);background:var(--bt-row-active);}
.bt-nav-row.is-active i,.bt-nav-row.is-active svg{color:var(--bt-green);}
/* «скоро» — модуль ще не зроблено */
.bt-nav-row.is-soon{cursor:default;opacity:.6;}
/* селектор з елементом span — щоб перебити .bt-nav-row span (flex:1/max-width/overflow) */
.bt-nav-row span.bt-nav-row__soon{font:700 8.5px/1 var(--bt-font);letter-spacing:.05em;text-transform:uppercase;
  color:var(--bt-gray);background:var(--bt-bg);border:1px solid var(--bt-line);
  border-radius:5px;padding:3px 5px;flex:none;max-width:none;overflow:visible;}

/* профіль (низ) */
.bt-sidebar__foot{margin-top:auto;border-top:1px solid var(--bt-line);padding:10px 12px 12px;position:relative;}
.bt-profile{display:flex;align-items:center;gap:10px;padding:8px 9px;border-radius:10px;cursor:pointer;transition:padding .18s ease;}
.bt-profile:hover{background:var(--bt-bg);}
.bt-profile__ava{width:34px;height:34px;border-radius:50%;background:#E7EAEE center/cover;flex:none;}
/* обгортка тексту профілю: ховаємо переповнення, щоб під час анімації ширини
   ім'я плавно «виїжджало», а не переносилось на 2 рядки й не стрибало назад */
.bt-profile__meta{overflow:hidden;}
.bt-profile__name{font:700 13px/1.1 var(--bt-font);color:var(--bt-ink);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.bt-profile__role{font:500 11px/1 var(--bt-font);color:var(--bt-gray);margin-top:4px;}
.bt-profile i{width:16px;height:16px;color:var(--bt-gray);flex:none;}

/* меню профілю (поповер, відкривається вгору) */
.bt-usermenu{position:absolute;left:12px;right:12px;bottom:64px;background:var(--bt-card);
  border:1px solid var(--bt-line);border-radius:12px;box-shadow:var(--bt-sh-pop);padding:6px;display:none;}
.bt-usermenu.is-open{display:block;}
/* згорнутий стан: меню профілю виїжджає ВГОРУ над аватаром (як у розгорнутому),
   лише фіксуємо ширину, бо панель вузька. Зʼявляється при наведенні або кліку. */
.bt-app.is-collapsed .bt-usermenu{left:10px;right:auto;bottom:64px;width:216px;z-index:60;}
/* показ при наведенні (в обох станах панелі) керується класом is-hover через JS
   (mouseenter/mouseleave), а не CSS :hover — інакше меню «вискакує» одразу після
   оновлення сторінки, якщо курсор просто стоїть над аватаром. */
.bt-usermenu.is-hover{display:block;}
/* рядок меню — той самий вигляд, що й пункт навігації (.bt-nav-row) */
.bt-usermenu__row{display:flex;align-items:center;gap:12px;padding:10px 13px;border-radius:9px;cursor:pointer;
  font:500 13.5px/1 var(--bt-font);color:var(--bt-gray-d);text-decoration:none;}
/* і <i>, і згенерований lucide <svg> — інакше svg лишається 24px і кольору за замовч. */
.bt-usermenu__row i,.bt-usermenu__row svg{width:18px;height:18px;color:var(--bt-gray);flex:none;}
.bt-usermenu__row:hover{background:var(--bt-row-active);}
.bt-usermenu__row--danger,.bt-usermenu__row--danger i,.bt-usermenu__row--danger svg{color:var(--bt-coral);}
/* «Журнал дій» (лише власник/CEO): зелений значок-акцент; активний стан = поточна сторінка */
.bt-usermenu__row--accent i,.bt-usermenu__row--accent svg{color:var(--bt-green);}
.bt-usermenu__row.is-active{background:var(--bt-row-active);font-weight:700;color:var(--bt-ink);}
.bt-usermenu__sep{margin:5px;height:1px;background:var(--bt-line);}
/* рядок-перемикач «Режим перегляду» + перемикач (switch) */
.bt-usermenu__row--toggle{cursor:pointer;}
.bt-switch{margin-left:auto;width:34px;height:20px;border-radius:11px;background:var(--bt-line);
  position:relative;flex:none;transition:background .15s ease;}
.bt-switch__knob{position:absolute;top:2px;left:2px;width:16px;height:16px;border-radius:50%;
  background:#fff;box-shadow:0 1px 2px rgba(20,30,50,.25);transition:transform .15s ease;}
.bt-usermenu__row--toggle.is-on .bt-switch{background:var(--bt-green);}
.bt-usermenu__row--toggle.is-on .bt-switch__knob{transform:translateX(14px);}
.bt-usermenu__hint{font:500 11px/1.35 var(--bt-font);color:var(--bt-gray);padding:2px 13px 8px;}

/* =====================================================================
   ДЕРЕВО / СПИСОК НАВІГАЦІЇ (.bt-tree) — КАНОНІЧНИЙ КОМПОНЕНТ
   ---------------------------------------------------------------------
   ⚠️ ПРАВИЛО ЄДНОСТІ (обов'язкове для всіх списків/дерев ЕРП):
   • Виділення вибраного рядка = фон var(--bt-row-press) + текст та іконка
     var(--bt-ink) + жирний. Наведення = фон var(--bt-row-active).
     НЕ використовувати синій (--bt-blue) для виділення чи навігації —
     синій лише для кнопок-дій і фокуса полів. Вигляд має збігатися з
     головним меню (.bt-nav-row), щоб сприйняття було однакове.
   • Іконка типу = 18px, колір var(--bt-gray) → var(--bt-ink) в активному.
   • Рівні вкладеності — через CSS-змінну --d (0,1,2…) на рядку.
   Розмітка: .bt-tree > .bt-tree__row[style="--d:N"] з дочірніми
     .bt-tree__tw (трикутник) · .bt-tree__ic (іконка) · .bt-tree__label
     [· .bt-tree__act > .bt-tree__mini]. Перейменування — .bt-tree__rename.
   ===================================================================== */
.bt-tree{display:flex;flex-direction:column;gap:1px;}
.bt-tree__row{
  position:relative;display:flex;align-items:center;gap:8px;
  min-height:34px;padding:5px 8px 5px calc(8px + var(--d,0)*16px);
  border-radius:9px;cursor:pointer;user-select:none;
  font:500 13.5px/1 var(--bt-font);color:var(--bt-gray-d);
  transition:background .12s ease;
}
.bt-tree__row:hover{background:var(--bt-row-active);}
.bt-tree__row.is-active{background:var(--bt-row-press);color:var(--bt-ink);font-weight:700;}
/* трикутник розкриття — тонкий, вторинний */
.bt-tree__tw{flex:0 0 14px;width:14px;height:14px;display:flex;align-items:center;justify-content:center;color:var(--bt-gray);}
.bt-tree__tw i{width:14px;height:14px;}
.bt-tree__row.is-active .bt-tree__tw{color:var(--bt-ink);}
/* іконка типу — як іконки головного меню (18px, сіра → темна активна) */
.bt-tree__ic{flex:0 0 18px;display:flex;align-items:center;justify-content:center;color:var(--bt-gray);}
.bt-tree__ic i,.bt-tree__ic svg{width:18px;height:18px;}
.bt-tree__row.is-active .bt-tree__ic{color:var(--bt-ink);}
.bt-tree__emoji{font-size:15px;line-height:1;}
.bt-tree__label{flex:1;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
/* інлайн-перейменування */
.bt-tree__rename{flex:1;min-width:0;font:inherit;color:var(--bt-ink);background:var(--bt-card);
  border:1px solid var(--bt-gray-d);border-radius:6px;padding:2px 6px;outline:0;}
/* дії рядка — з'являються при наведенні (нейтральні, без синього) */
.bt-tree__act{display:none;align-items:center;gap:1px;flex:none;margin-left:2px;}
.bt-tree__row:hover .bt-tree__act{display:flex;}
.bt-tree__mini{width:22px;height:22px;display:flex;align-items:center;justify-content:center;
  border:0;background:transparent;border-radius:6px;color:var(--bt-gray);cursor:pointer;}
.bt-tree__mini:hover{background:var(--bt-row-press);color:var(--bt-ink);}
.bt-tree__mini i{width:15px;height:15px;}
.bt-tree__mini--danger:hover{color:var(--bt-coral);}
.bt-tree__empty{padding:16px 12px;color:var(--bt-gray);font:500 13px/1.5 var(--bt-font);}

/* =====================================================================
   ПОШУК (.bt-search) — КАНОНІЧНЕ просте поле пошуку
   ---------------------------------------------------------------------
   Просте поле з плейсхолдером «Пошук», БЕЗ іконки-лупи. Стандарт за
   замовчуванням для пошуку у списках/панелях. (Винятки зі своїм виглядом:
   .obj-search — пошук на сторінці з кнопкою очистки; .bt-picker__search —
   компактний пошук у пікерах.) Нові екрани беруть .bt-search.
   Розмітка: <input type="text" class="bt-search" placeholder="Пошук">
   ===================================================================== */
.bt-search{
  display:block;width:100%;height:38px;padding:0 13px;box-sizing:border-box;
  border:1px solid var(--bt-line);border-radius:var(--bt-r-input,8px);
  background:var(--bt-bg);color:var(--bt-ink);font:500 13.5px/1 var(--bt-font);
  outline:0;transition:border-color .12s ease, background .12s ease;
}
.bt-search::placeholder{color:var(--bt-gray);}
.bt-search:focus{border-color:var(--bt-gray-d);background:var(--bt-card);}

/* =====================================================================
   ТОСТ (.bt-toast) — КАНОНІЧНЕ коротке сповіщення з опційною дією
   ---------------------------------------------------------------------
   Темна пігулка внизу по центру (як банер режиму), 1 рядок + кнопка-дія
   (напр. «Повернути» для undo). Зникає сама. Один тост за раз.
   Розмітка: .bt-toast > .bt-toast__msg [+ .bt-toast__action]
   ===================================================================== */
.bt-toast{position:fixed;left:50%;bottom:20px;transform:translateX(-50%);z-index:130;
  display:flex;align-items:center;gap:10px;max-width:calc(100vw - 32px);
  padding:9px 10px 9px 18px;background:#15181D;color:#fff;border-radius:999px;
  box-shadow:var(--bt-sh-pop);font:600 13px/1.2 var(--bt-font);animation:btToastIn .18s ease;}
.bt-toast__msg{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.bt-toast__action{border:0;background:transparent;color:var(--bt-green);cursor:pointer;flex:none;
  font:700 13px/1 var(--bt-font);padding:7px 10px;border-radius:8px;}
.bt-toast__action:hover{background:rgba(255,255,255,.08);}
.bt-toast.is-hiding{opacity:0;transition:opacity .2s ease;}
@keyframes btToastIn{from{opacity:0;transform:translate(-50%,8px);}to{opacity:1;transform:translate(-50%,0);}}

/* банер режиму «очима співробітника» (вгорі головної області) */
/* режим «очима функції» — невелика ЧОРНА смужка ВНИЗУ екрана */
.bt-impbar{position:fixed;left:50%;bottom:18px;transform:translateX(-50%);z-index:120;
  display:flex;align-items:center;gap:14px;max-width:calc(100vw - 32px);
  padding:9px 10px 9px 16px;background:#15181D;color:#fff;border-radius:999px;
  box-shadow:0 8px 28px rgba(0,0,0,.32);font:600 13px/1.3 var(--bt-font);}
.bt-impbar__txt{display:flex;align-items:center;gap:8px;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.bt-impbar__txt i,.bt-impbar__txt svg{width:16px;height:16px;flex:none;}
.bt-impbar__exit{border:none;background:#fff;color:#15181D;border-radius:999px;
  padding:6px 16px;font:700 12.5px/1 var(--bt-font);cursor:pointer;flex:none;}
.bt-impbar__exit:hover{background:#E9ECEF;}

/* інлайн-селектор «очима кого» — над профілем у футері сайдбара */
.bt-impinline{margin:0 12px 8px;border:1px solid var(--bt-line);border-radius:10px;background:var(--bt-card);
  box-shadow:var(--bt-sh-pop);overflow:hidden;display:flex;flex-direction:column;max-height:46vh;}
.bt-impinline__title{padding:9px 12px 4px;font:800 11px/1 var(--bt-font);letter-spacing:.04em;
  text-transform:uppercase;color:var(--bt-gray);}
.bt-impinline__search{margin:4px 10px 6px;padding:8px 10px;border:1px solid var(--bt-line);border-radius:8px;
  font:500 13px/1 var(--bt-font);outline:none;}
.bt-impinline__search:focus{border-color:var(--bt-blue);}
.bt-impinline__list{overflow-y:auto;padding:2px 6px 8px;}
.bt-impinline__row{margin:0;}
.bt-impinline__row button{width:100%;display:flex;align-items:center;justify-content:space-between;gap:8px;
  text-align:left;border:none;background:none;cursor:pointer;
  padding:8px 10px;border-radius:7px;font:600 13px/1.2 var(--bt-font);color:var(--bt-ink);}
.bt-impinline__row button:hover{background:var(--bt-row-active);}
.bt-impinline__row button span{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.bt-impinline__row button em{flex:none;font:600 10.5px/1 var(--bt-font);font-style:normal;letter-spacing:.02em;
  text-transform:uppercase;color:var(--bt-gray);background:var(--bt-line);border-radius:5px;padding:3px 6px;}
.bt-impinline__empty{padding:10px 12px;color:var(--bt-gray);font:500 12.5px/1.4 var(--bt-font);}

/* =====================================================================
   ОСНОВНА ОБЛАСТЬ
   ===================================================================== */
.bt-main{flex:1;min-width:0;display:flex;flex-direction:column;
  /* Прокрутка лише в межах головної області (не всього сайту) і лише коли контент
     не вміщається. scrollbar-gutter:stable резервує місце під смугу, тож поява/зникнення
     смуги не зсуває контент. Сайдбар має власну висоту 100vh і не прокручується. */
  height:100vh;overflow-y:auto;scrollbar-gutter:stable;}
.bt-content{max-width:1180px;width:100%;margin:0 auto;padding:30px 36px 80px;}

/* хлібний слід */
.bt-crumbs{display:flex;align-items:center;gap:7px;font:600 12px/1 var(--bt-font);color:var(--bt-gray);margin-bottom:14px;}
.bt-crumbs a{color:var(--bt-gray);text-decoration:none;}
.bt-crumbs a:hover{color:var(--bt-ink);}
.bt-crumbs .sep{color:var(--bt-line);}
.bt-crumbs .cur{color:var(--bt-ink);font-weight:700;}

/* шапка сторінки */
.bt-pagehead{display:flex;align-items:flex-end;justify-content:space-between;gap:20px;margin-bottom:22px;flex-wrap:wrap;}
.bt-page-title{font:800 26px/1.05 var(--bt-font);letter-spacing:-.02em;margin:0;}
.bt-section-label{font:800 11px/1 var(--bt-font);letter-spacing:.07em;text-transform:uppercase;color:var(--bt-gray);margin:0 0 12px;}
.bt-subtle{font:400 12px/1.5 var(--bt-font);color:var(--bt-gray);}

.bt-toolbar{display:flex;align-items:center;gap:12px;flex-wrap:wrap;}

/* під-навігація РОЗДІЛУ (вкладки на сторінці) — підпункти живуть тут, не в сайдбарі.
   Активна вкладка: темний текст + зелена риска знизу. «Скоро» — приглушено. */
.bt-subnav{display:flex;align-items:stretch;gap:2px;margin:0;overflow-x:auto;scrollbar-width:none;}
.bt-subnav::-webkit-scrollbar{display:none;}
.bt-subnav__item{position:relative;display:inline-flex;align-items:center;gap:7px;
  padding:0 14px;border:none;border-bottom:2px solid transparent;background:none;
  font:600 14px/1 var(--bt-font);color:var(--bt-gray-d);text-decoration:none;white-space:nowrap;cursor:pointer;}
.bt-subnav__item:hover{color:var(--bt-ink);}
.bt-subnav__item.is-active{color:var(--bt-ink);border-bottom-color:var(--bt-green);}
.bt-subnav__item.is-soon{opacity:.5;cursor:default;}
/* Активна вкладка — справжнє жирне накреслення (700), чітке. Щоб зміна 600↔700
   не зсувала сусідні вкладки, наперед резервуємо ширину під жирний текст:
   прихована копія тексту (::after, 700) у колонці задає ширину, видимий рядок
   лишається зверху. Без text-shadow — тому текст не «пікселить». */
.bt-subnav__lbl{display:inline-flex;flex-direction:column;}
.bt-subnav__lbl::after{content:attr(data-label);height:0;overflow:hidden;visibility:hidden;font-weight:700;}
.bt-subnav__item.is-active .bt-subnav__lbl{font-weight:700;}
.bt-subnav__soon{font:700 8px/1 var(--bt-font);letter-spacing:.05em;text-transform:uppercase;color:var(--bt-gray);
  background:var(--bt-bg);border:1px solid var(--bt-line);border-radius:5px;padding:3px 5px;}

/* =====================================================================
   04 · КНОПКИ (шість типів A–F)
   ===================================================================== */
/* A · Solid (залита) — головна дія. На блок — лише одна синя. */
.bt-btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;height:40px;
  padding:0 16px;border-radius:var(--bt-r-btn);border:1px solid transparent;
  font:700 13px/1 var(--bt-font);cursor:pointer;white-space:nowrap;background:none;text-decoration:none;}
.bt-btn i,.bt-btn svg{width:16px;height:16px;flex:none;}
.bt-btn--primary{background:var(--bt-blue);color:#fff;}
.bt-btn--primary:hover{background:var(--bt-blue-press);}
.bt-btn--danger{background:var(--bt-coral);color:#fff;}
.bt-btn--danger:hover{background:var(--bt-coral-press);}
.bt-btn--dialog{height:42px;}

/* B · Outline / тулбар — робочий кінь. Накреслення 500. */
.bt-btn--outline{background:var(--bt-card);border-color:var(--bt-line);color:var(--bt-gray-d);
  font-weight:500;box-shadow:var(--bt-sh-outline);padding:0 13px;gap:7px;}
.bt-btn--outline i,.bt-btn--outline svg{color:var(--bt-gray);}
.bt-btn--outline:hover{background:var(--bt-line);border-color:var(--bt-gray);color:var(--bt-ink);}

/* C · Ghost акцентна — компактна дія в картці. */
.bt-btn--ghost{height:auto;padding:6px 11px;border-radius:var(--bt-r-input);border-color:var(--bt-line);
  background:var(--bt-card);color:var(--bt-blue);font:700 11.5px/1 var(--bt-font);gap:7px;}
.bt-btn--ghost i,.bt-btn--ghost svg{width:14px;height:14px;}
.bt-btn--ghost:hover{background:var(--bt-blue-tint);}

/* D · Dashed «додати» — порожні слоти. UPPERCASE. */
.bt-btn--dashed{height:auto;padding:11px 16px;border-radius:var(--bt-r-9);
  border:1.5px dashed var(--bt-dashed);background:none;color:var(--bt-gray-d);
  font:700 11px/1 var(--bt-font);text-transform:uppercase;letter-spacing:.03em;gap:7px;}
.bt-btn--dashed i,.bt-btn--dashed svg{width:15px;height:15px;}
.bt-btn--dashed:hover{border-color:var(--bt-blue);color:var(--bt-blue);}

/* E · Danger soft — м'яка деструкція в потоці. */
.bt-btn--danger-soft{background:var(--bt-card);border-color:var(--bt-coral-border);border-radius:var(--bt-r-9);
  color:var(--bt-coral);font:700 12.5px/1 var(--bt-font);}
.bt-btn--danger-soft:hover{background:var(--bt-coral-tint);}

/* Іконкові квадрати — ghost, без рамки */
.bt-iconbtn{width:40px;height:40px;border-radius:var(--bt-r-btn);background:var(--bt-card);border:none;
  display:inline-flex;align-items:center;justify-content:center;cursor:pointer;}
.bt-iconbtn i,.bt-iconbtn svg{width:18px;height:18px;color:var(--bt-gray);}
.bt-iconbtn:hover{background:#F4F5F7;}
.bt-iconbtn--sm{width:36px;height:36px;border-radius:var(--bt-r-9);}
.bt-iconbtn--sm i,.bt-iconbtn--sm svg{width:17px;height:17px;color:var(--bt-gray-d);}
.bt-iconbtn.is-active{background:var(--bt-green-tint);}        /* перемикач view/edit активний */
.bt-iconbtn.is-active i,.bt-iconbtn.is-active svg{color:var(--bt-ink);}
/* інлайн-квадрат 22 */
.bt-iconbtn--xs{width:22px;height:22px;border-radius:var(--bt-r-6);border:1px solid var(--bt-line);background:var(--bt-card);}
.bt-iconbtn--xs i,.bt-iconbtn--xs svg{width:13px;height:13px;color:var(--bt-gray);}
.bt-iconbtn--xs:hover{background:#F4F5F7;}
.bt-iconbtn--add{border-color:var(--bt-green-border);}
.bt-iconbtn--add i,.bt-iconbtn--add svg{color:var(--bt-green);}
.bt-iconbtn--add:hover{border-color:var(--bt-green);}

/* F · Фінансові дії (рядок) — головна solid зелена + outline у своєму акценті */
.bt-finrow{display:flex;gap:9px;}
.bt-finbtn{display:flex;align-items:center;justify-content:center;gap:8px;flex:1;height:44px;
  border-radius:var(--bt-r-fin);border:1px solid transparent;background:var(--bt-card);
  font:700 12.5px/1 var(--bt-font);cursor:pointer;white-space:nowrap;}
.bt-finbtn i,.bt-finbtn svg{width:16px;height:16px;flex:none;}
.bt-finbtn--income{background:var(--bt-green);color:#fff;}
.bt-finbtn--income:hover{background:var(--bt-green-press);}
.bt-finbtn--expense{border-color:var(--bt-coral-border);color:var(--bt-coral);}
.bt-finbtn--expense:hover{background:var(--bt-coral-tint);}
.bt-finbtn--transfer{border-color:var(--bt-blue-border);color:var(--bt-blue);}
.bt-finbtn--transfer:hover{background:var(--bt-blue-tint);}
.bt-finbtn--neutral{border-color:var(--bt-line);color:var(--bt-gray-d);}
.bt-finbtn--neutral:hover{background:#F4F5F7;}

/* =====================================================================
   05 · ПЕРЕМИКАЧІ ТА ПОЛЯ
   ===================================================================== */
.bt-label{font:700 9px/1 var(--bt-font);letter-spacing:.06em;text-transform:uppercase;color:var(--bt-gray);
  margin-bottom:5px;display:block;}
.bt-input,.bt-select{width:100%;border:1px solid var(--bt-line);border-radius:var(--bt-r-input);
  padding:9px 11px;font:700 13px/1 var(--bt-font);color:var(--bt-ink);outline:none;background:var(--bt-card);}
.bt-input:focus,.bt-select:focus{border-color:var(--bt-blue);}
.bt-select{cursor:pointer;font-size:12.5px;}

/* select2 у стилі UI KIT. Обгортці селекта дати клас .bt-select2, а клас дропдауну
   .bt-select2-drop вішати на події select2:open (дропдаун живе в <body>, через
   обгортку не заскоупити; опція dropdownCssClass у нашій збірці select2 4.0.13
   non-full кидає виняток і вбиває віджет). Навмисно вузький скоуп, щоб не
   зачепити старі сторінки з дефолтним select2 (облік часу, аналітика). */
.bt-select2 .select2-container--default .select2-selection--single{height:auto;position:relative;
  border:1px solid var(--bt-line);border-radius:var(--bt-r-input);background:var(--bt-card);
  padding:9px 30px 9px 11px;}
.bt-select2 .select2-container--default .select2-selection--single .select2-selection__rendered{
  color:var(--bt-ink);font:700 12.5px/1 var(--bt-font);padding:0;}
.bt-select2 .select2-container--default .select2-selection--single .select2-selection__placeholder{
  color:var(--bt-gray);}
.bt-select2 .select2-container--default .select2-selection--single .select2-selection__arrow{
  position:absolute;top:0;right:8px;height:100%;width:12px;margin:0;
  display:flex;align-items:center;justify-content:center;}
.bt-select2 .select2-container--default .select2-selection--single .select2-selection__arrow b{
  position:static;margin:0;border-color:var(--bt-gray) transparent transparent;border-width:5px 4px 0;}
.bt-select2 .select2-container--default.select2-container--open .select2-selection--single,
.bt-select2 .select2-container--default.select2-container--focus .select2-selection--single{
  border-color:var(--bt-blue);}
.bt-select2-drop.select2-dropdown{border:1px solid var(--bt-line);border-radius:var(--bt-r-input);
  font:600 12.5px/1.3 var(--bt-font);color:var(--bt-ink);box-shadow:0 8px 24px rgba(0,0,0,.08);overflow:hidden;}
.bt-select2-drop .select2-search--dropdown .select2-search__field{border:1px solid var(--bt-line);
  border-radius:var(--bt-r-input);padding:7px 10px;font:600 12.5px/1 var(--bt-font);outline:none;}
.bt-select2-drop .select2-results__option{padding:8px 11px;}
.bt-select2-drop .select2-results__option--highlighted[aria-selected]{background:var(--bt-row-active);color:var(--bt-ink);}
.bt-select2-drop .select2-results__option[aria-selected=true]{background:var(--bt-blue-tint);color:var(--bt-ink);}

/* сегментний перемикач (UA/EN) */
.bt-seg{display:inline-flex;background:var(--bt-row-active);border-radius:var(--bt-r-9);padding:3px;gap:3px;}
.bt-seg__item{padding:6px 12px;border-radius:var(--bt-r-6);font:700 12px/1 var(--bt-font);color:var(--bt-gray-d);cursor:pointer;border:none;background:none;}
.bt-seg__item.is-active{background:var(--bt-card);color:var(--bt-ink);box-shadow:var(--bt-sh-outline);}

/* тумблер */
.bt-switch{width:40px;height:22px;border-radius:11px;background:var(--bt-line);position:relative;cursor:pointer;border:none;flex:none;transition:background .14s;}
.bt-switch::after{content:'';position:absolute;top:2px;left:2px;width:18px;height:18px;border-radius:50%;background:#fff;box-shadow:0 1px 2px rgba(0,0,0,.2);transition:left .14s;}
.bt-switch.is-on{background:var(--bt-blue);}
.bt-switch.is-on::after{left:20px;}

/* =====================================================================
   КАРТКИ ТА KPI
   ===================================================================== */
.bt-card{background:var(--bt-card);border:1px solid var(--bt-line);border-radius:var(--bt-r-card);padding:18px 20px;box-shadow:var(--bt-sh-raise);}
.bt-card--sm{border-radius:var(--bt-r-card-sm);}
.bt-card__title{font:800 16px/1.1 var(--bt-font);margin:0 0 16px;}

/* KPI-картка з кольоровою лівою рискою */
.bt-kpi{background:var(--bt-card);border:1px solid var(--bt-line);border-radius:var(--bt-r-card-sm);
  padding:16px 18px;box-shadow:inset 3px 0 0 var(--bt-gray),var(--bt-sh-raise);}
.bt-kpi--income{box-shadow:inset 3px 0 0 var(--bt-green),var(--bt-sh-raise);}
.bt-kpi--profit{box-shadow:inset 3px 0 0 var(--bt-blue),var(--bt-sh-raise);}
.bt-kpi--expense{box-shadow:inset 3px 0 0 var(--bt-coral),var(--bt-sh-raise);}
.bt-kpi__label{font:700 10px/1 var(--bt-font);letter-spacing:.06em;text-transform:uppercase;color:var(--bt-gray);}
.bt-kpi__value{font:800 19px/1 var(--bt-font);letter-spacing:-.01em;margin-top:10px;}
.bt-kpi__sub{font:400 12px/1.4 var(--bt-font);color:var(--bt-gray);margin-top:6px;}
.bt-num{font-variant-numeric:tabular-nums;}
.t-green{color:var(--bt-green);} .t-blue{color:var(--bt-blue);} .t-coral{color:var(--bt-coral);}
.t-ink{color:var(--bt-ink);} .t-gray{color:var(--bt-gray);} .t-gray-d{color:var(--bt-gray-d);}

/* статус-бейджі */
.bt-badge{display:inline-block;padding:5px 11px;border-radius:var(--bt-r-7);font:700 11px/1 var(--bt-font);background:var(--bt-bg);color:var(--bt-gray-d);}
.bt-badge--work{background:var(--bt-green-tint);color:var(--bt-green);}
.bt-badge--done{background:var(--bt-blue-tint2);color:var(--bt-blue);}
.bt-badge--pause{background:var(--bt-coral-tint);color:var(--bt-coral);}
.bt-badge--wait{background:#F2F4F6;color:var(--bt-gray-d);}
/* «Здано, очікує оплати» — світло-синій (небесний), світліший за «Завершено» */
.bt-badge--delivered{background:#E5F5FD;color:#38A8DE;}

/* =====================================================================
   ТАБЛИЦІ (інженерія таблиць: числа праворуч, tabular-nums, зебра,
   фіксований заголовок)
   ===================================================================== */
.bt-table-wrap{background:var(--bt-card);border:1px solid var(--bt-line);border-radius:var(--bt-r-card-sm);overflow:hidden;box-shadow:var(--bt-sh-raise);}
.bt-table{width:100%;border-collapse:collapse;font:500 13px/1.3 var(--bt-font);}
.bt-table th{position:sticky;top:0;background:var(--bt-card);z-index:1;
  font:700 10px/1 var(--bt-font);letter-spacing:.05em;text-transform:uppercase;color:var(--bt-gray);
  text-align:left;padding:12px 14px;border-bottom:1px solid var(--bt-line);}
.bt-table td{padding:12px 14px;border-bottom:1px solid var(--bt-line);color:var(--bt-ink);}
.bt-table tr:last-child td{border-bottom:none;}
.bt-table tbody tr:nth-child(even){background:#FBFCFD;}      /* зебра */
.bt-table tbody tr:hover{background:var(--bt-bg);}
.bt-table .num{text-align:right;font-variant-numeric:tabular-nums;}
.bt-table th.num{text-align:right;}

/* =====================================================================
   ВЕРХНЯ СМУГА (постійна на всіх сторінках) + ХОВАНЕ БІЧНЕ МЕНЮ
   ===================================================================== */
/* Смуга завжди зверху: ліворуч «пиріжок» (зʼявляється, коли меню сховане),
   далі — вкладки розділу (subnav). Липка, тож не їде при прокрутці.
   Усі значення ІДЕНТИЧНІ .bt-orgbar (шапка Оргсхеми) — щоб при переході між
   сторінками розділу (Оргсхема ↔ Співробітники) шапка, вкладки й пиріжок були
   однакові й не «стрибали». Розмір/вигляд пиріжка теж = .bt-orgbar__burger. */
.bt-topbar{flex:none;display:flex;align-items:stretch;gap:16px;min-height:56px;padding:0 20px;
  background:var(--bt-card);border-bottom:1px solid var(--bt-line);position:sticky;top:0;z-index:30;
  box-shadow:0 4px 12px rgba(20,30,50,.05);}
.bt-topbar__tabs{flex:1;display:flex;align-items:stretch;min-width:0;}
.bt-topbar__burger{display:none;width:38px;height:38px;border-radius:10px;align-self:center;
  align-items:center;justify-content:center;cursor:pointer;background:none;border:none;flex:none;margin-left:-4px;margin-right:2px;}
.bt-topbar__burger i,.bt-topbar__burger svg{width:20px;height:20px;color:var(--bt-ink);}
.bt-topbar__burger:hover{background:var(--bt-row-active);}
/* десктоп: пиріжок видно лише коли бічне меню сховане */
.bt-app.is-menu-hidden .bt-topbar__burger,
.bt-app.is-menu-hidden .bt-orgbar__burger{display:flex;}
/* сховане бічне меню (десктоп): панель зникає повністю, контент — на всю ширину */
.bt-app.is-menu-hidden .bt-sidebar{display:none;}

@media (max-width:900px){
  .bt-app{display:block;height:auto;overflow:visible;}
  /* 100vh на iOS Safari включає зону під адресну смугу — драуер стає вищим за
     видиму область, і футер з іменем користувача виїжджає за нижній край
     екрана. 100dvh — коректна висота з урахуванням адресної смуги (де
     підтримується); дублюємо властивість, бо старіші браузери 100dvh ігнорують
     і залишаються на робочому 100vh. */
  .bt-sidebar{position:fixed;left:0;top:0;z-index:50;transform:translateX(-100%);box-shadow:var(--bt-sh-modal);height:100vh;height:100dvh;}
  .bt-app.is-menu-open .bt-sidebar{transform:translateX(0);}
  .bt-app.is-menu-open::after{content:'';position:fixed;inset:0;background:rgba(20,30,50,.35);z-index:40;}
  /* мобільний: панель — оверлей, схована за замовчуванням (transform), тож
     desktop-правило display:none скасовуємо, а пиріжок показуємо завжди. */
  .bt-app.is-menu-hidden .bt-sidebar{display:flex;}
  .bt-topbar__burger,.bt-orgbar__burger{display:flex;}
  .bt-main{height:auto;overflow:visible;}
  .bt-topbar{padding:0 12px;gap:8px;}
  .bt-content{padding:18px 16px 64px;}
  .bt-page-title{font-size:22px;}
}

/* згорнутий сайдбар (десктоп) — клік по логотипу */
.bt-app.is-collapsed .bt-sidebar{width:76px;}
/* у згорнутому стані прибираємо асиметричні відступи шапки й центруємо значок,
   інакше він ширший за контентну зону й виглядає зміщеним. */
.bt-app.is-collapsed .bt-sidebar__head{padding:0;justify-content:center;}
.bt-app.is-collapsed .bt-sidebar__logo{display:none;}
.bt-app.is-collapsed .bt-sidebar__logo-mark{display:block;margin:0;}
.bt-app.is-collapsed .bt-nav-row__soon,
.bt-app.is-collapsed .bt-nav-group,
.bt-app.is-collapsed .bt-profile__name,
.bt-app.is-collapsed .bt-profile__role,
.bt-app.is-collapsed .bt-profile__meta,
.bt-app.is-collapsed .bt-profile > i,
.bt-app.is-collapsed .bt-profile > svg{display:none;}
/* текст пунктів навігації — не ховаємо різко (display:none), а плавно стискаємо
   до нуля й розчиняємо; тоді під час анімації ширини панелі немає «стрибка». */
.bt-app.is-collapsed .bt-nav-row span{max-width:0;opacity:0;}
/* padding-left 17px → іконка стає рівно по центру 76px-рейки; перехід дає плавний зсув */
.bt-app.is-collapsed .bt-nav-row{padding:10px 17px;}
.bt-app.is-collapsed .bt-profile{justify-content:center;}
/* мікрозсув аватара на 1px вліво за бажанням (візуальне центрування) */
.bt-app.is-collapsed .bt-profile__ava{transform:translateX(-1px);}

/* згорнутий стан: підказка з назвою кнопки праворуч при наведенні.
   overflow:visible на nav — щоб підказка не обрізалась краєм панелі. */
.bt-app.is-collapsed .bt-sidebar__nav{overflow:visible;}
.bt-app.is-collapsed .bt-nav-row{position:relative;}
.bt-app.is-collapsed .bt-nav-row:hover span{
  display:block;position:absolute;left:100%;top:50%;transform:translateY(-50%);
  margin-left:10px;background:var(--bt-ink);color:#fff;padding:7px 11px;border-radius:9px;
  white-space:nowrap;font:600 12.5px/1 var(--bt-font);box-shadow:var(--bt-sh-pop);
  z-index:70;pointer-events:none;text-overflow:clip;overflow:visible;
  /* підказка має бути повністю видима, тож скидаємо «стискання» згорнутого стану.
     transition:none — щоб підказка з'являлась миттєво, а не «виростала» з нуля. */
  max-width:none;opacity:1;transition:none;}

/* =====================================================================
   ОРГСХЕМА (вид усередині розділу «Компанія»)
   Імерсивний екран: повноширинна смуга вкладок + полотно зі схемою.
   Власник → Департамент → Відділи → Функції (посади), у кожного ЦКП.
   Кольори департаменту специфічні (тінти-«папки»), тому задані локально.
   ===================================================================== */
/* смуга вкладок розділу (повноширинна, замість .bt-content). Це @section('topbar')
   сторінки Оргсхема — та сама висота/вигляд, що й постійна .bt-topbar. */
.bt-orgbar{flex:none;min-height:56px;display:flex;align-items:stretch;gap:16px;padding:0 20px;
  background:var(--bt-card);border-bottom:1px solid var(--bt-line);box-shadow:0 4px 12px rgba(20,30,50,.05);position:relative;z-index:30;}
/* вкладки рендеряться класами .bt-subnav/.bt-subnav__item — тими самими, що й на
   інших сторінках розділу (Співробітники, Відпустки, Найм), щоб шапка була
   ідентичною і не «стрибала» при переході між вкладками. */
.bt-orgbar__tabs{flex:1;display:flex;align-items:stretch;border-bottom:none;margin:0;min-width:0;}
.bt-orgbar__tools{flex:none;align-self:center;display:flex;align-items:center;gap:8px;}
.bt-orgtoolbar{align-self:center;}
.bt-orgtool{width:38px;height:38px;border-radius:10px;display:flex;align-items:center;justify-content:center;cursor:pointer;background:none;border:none;}
.bt-orgtool i,.bt-orgtool svg{width:17px;height:17px;color:var(--bt-gray-d);}
.bt-orgtool:hover{background:var(--bt-row-active);}
.bt-orgtool.is-active{background:var(--bt-row-press);}
.bt-orgtool.is-active i,.bt-orgtool.is-active svg{color:var(--bt-ink);}
/* підказка з назвою кнопки — миттєва й оформлена так само, як у згорнутому меню зліва.
   Кнопки вгорі праворуч, тож показуємо підказку знизу, вирівняну по правому краю. */
.bt-orgtool[data-tip]{position:relative;}
.bt-orgtool[data-tip]:hover::after{
  content:attr(data-tip);position:absolute;top:100%;right:0;margin-top:8px;
  background:var(--bt-ink);color:#fff;padding:7px 11px;border-radius:9px;
  white-space:nowrap;font:600 12.5px/1 var(--bt-font);box-shadow:var(--bt-sh-pop);
  z-index:70;pointer-events:none;}

/* «пиріжок» у смузі оргсхеми — прихований, поки бічне меню відкрите; зʼявляється,
   коли меню сховане (десктоп, правило .is-menu-hidden вище) або на вузьких екранах. */
.bt-orgbar__burger{display:none;width:38px;height:38px;border-radius:10px;align-self:center;
  align-items:center;justify-content:center;cursor:pointer;background:none;border:none;
  flex:none;margin-left:-4px;margin-right:2px;}
.bt-orgbar__burger i,.bt-orgbar__burger svg{width:20px;height:20px;color:var(--bt-ink);}
.bt-orgbar__burger:hover{background:var(--bt-row-active);}

/* --- Оргсхема: вузькі екрани (планшет/мобільний, ≤900px) --- */
@media (max-width:900px){
  .bt-orgbar{padding:0 12px;gap:8px;}
  .bt-orgbar__burger{display:flex;}              /* пиріжок зліва відкриває меню */
  /* вкладки можуть не вміститись — даємо горизонтальну прокрутку без смуги */
  .bt-orgbar__tabs{overflow-x:auto;-ms-overflow-style:none;scrollbar-width:none;}
  .bt-orgbar__tabs::-webkit-scrollbar{display:none;}
}

/* --- Оргсхема: мобільний (≤600px) ---
   Прибираємо кнопки «Перегляд»/«Коригування»: редагувати оргсхему з телефона
   не можна. На планшеті (iPad, >600px) кнопки лишаються. */
@media (max-width:600px){
  .bt-orgbar__tools{display:none;}
}

/* полотно (біле, прокручуване) + центрована «дошка» */
.bt-orgcanvas{flex:1;min-height:0;overflow:auto;background:var(--bt-card);}
/* ширину борда задає найширший рівень дерева (max-content); position:relative — база для SVG-з'єднувачів */
.bt-orgboard{position:relative;width:max-content;margin:0 auto;padding:48px 0 100px;display:flex;flex-direction:column;align-items:center;}

/* картка власника */
.bt-org-owner{width:360px;background:var(--bt-card);border:1.5px solid var(--bt-line);border-radius:11px;
  padding:14px 18px;box-shadow:0 2px 8px rgba(20,30,50,.05);text-align:center;}
.bt-org-owner__t{font:800 12px/1.2 var(--bt-font);text-transform:uppercase;letter-spacing:.01em;color:var(--bt-ink);}
/* назва посади + людина у картці власника — по центру */
.bt-org-owner .bt-org-person,
.bt-org-owner .bt-org-assign{justify-content:center;}
/* людина на оргсхемі — лише фото + ім'я, без «таблетки» (фон = фон картки) */
.bt-org-person{display:inline-flex;align-items:center;gap:7px;margin-top:6px;}
.bt-org-person__ava{width:22px;height:22px;border-radius:50%;background:#E7EAEE;flex:none;
  display:flex;align-items:center;justify-content:center;font:800 8.5px/1 var(--bt-font);color:#5A6068;
  box-shadow:0 0 0 1.25px var(--bt-card);}
.bt-org-person__name{font:700 10px/1 var(--bt-font);color:var(--bt-ink);}
.bt-org-person{cursor:pointer;}
/* кільце статусу: тонка біла лінія — у ВСІХ (відділяє фото одне від одного в стеку);
   якщо людина онлайн — довкола білої з'являється ще й зелена лінія.
   box-shadow (не border) — щоб не зсувати розмітку. */
.bt-org-person__ava.is-online{box-shadow:0 0 0 1.25px var(--bt-card),0 0 0 2.75px var(--bt-green);}

/* КІЛЬКА людей на функції (різні команди): лише фото поряд із легким напливом,
   без імен — ім'я показує наведення (контактна картка) і бокова панель.
   Кільце статусу — те саме правило, що й скрізь (.bt-org-person__ava вище). */
.bt-org-people{display:inline-flex;align-items:center;margin-top:6px;}
.bt-org-people__it{display:inline-flex;border-radius:50%;position:relative;cursor:pointer;}
.bt-org-people__it + .bt-org-people__it{margin-left:-5px;}
.bt-org-people__it:hover{z-index:2;}
/* у центрованих картках (власник/CEO — на випадок майбутнього) — по центру */
.bt-org-owner .bt-org-people,.bt-org-exec .bt-org-people{justify-content:center;}

/* контактна картка (hover у режимі перегляду) */
.bt-contact{position:fixed;z-index:80;width:270px;background:var(--bt-card);border:1px solid var(--bt-line);
  border-radius:14px;box-shadow:var(--bt-sh-pop);padding:14px;font-family:var(--bt-font);}
.bt-contact__head{display:flex;align-items:center;gap:11px;margin-bottom:10px;}
.bt-contact__ava{width:42px;height:42px;border-radius:50%;background:#E7EAEE center/cover;flex:none;
  display:flex;align-items:center;justify-content:center;font:800 14px/1 var(--bt-font);color:#5A6068;}
.bt-contact__name{font:800 15px/1.2 var(--bt-font);color:var(--bt-ink);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.bt-contact__status{display:flex;align-items:center;gap:6px;margin-top:5px;font:500 12px/1.2 var(--bt-font);color:var(--bt-gray);}
.bt-contact__status.is-online{color:var(--bt-green);}
.bt-contact__dot{width:7px;height:7px;border-radius:50%;background:var(--bt-green);flex:none;}
.bt-contact__row{display:flex;align-items:center;gap:10px;padding:8px 0;}
.bt-contact__row + .bt-contact__row{border-top:1px solid var(--bt-line);}
.bt-contact__row > i,.bt-contact__row > svg{width:17px;height:17px;color:var(--bt-gray);flex:none;}
.bt-contact__val{flex:1;min-width:0;font:600 13px/1.2 var(--bt-font);color:var(--bt-ink);
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.bt-contact__copy{width:28px;height:28px;border:none;background:none;border-radius:7px;cursor:pointer;flex:none;
  display:flex;align-items:center;justify-content:center;}
.bt-contact__copy i,.bt-contact__copy svg{width:15px;height:15px;color:var(--bt-gray);}
.bt-contact__copy:hover{background:var(--bt-row-active);}
.bt-contact__copy.is-copied i,.bt-contact__copy.is-copied svg{color:var(--bt-green);}
.bt-contact__actions{display:flex;gap:8px;margin-top:12px;}
.bt-contact__btn{flex:1;display:flex;align-items:center;justify-content:center;height:40px;border-radius:10px;
  background:var(--bt-blue);color:#fff;font:700 13.5px/1 var(--bt-font);text-decoration:none;border:none;cursor:pointer;}
.bt-contact__btn:hover{background:var(--bt-blue-press);}

/* вертикальний з'єднувач */
.bt-org-link{width:1.5px;height:26px;background:var(--bt-dashed);}

/* департамент-група: фактичну ширину задає JS (deptHtml) = рівно ряд відділів під ним;
   604px (=3 відділи по 196 + 2 гепи по 8) — запасний фолбек, якщо inline-ширину не виставлено */
.bt-org-dept{width:604px;display:flex;flex-direction:column;}
/* грід (не flex): номер+назва в 1-му рядку поряд, а ЦКП/бейдж доступу — прямі діти head,
   тож можуть зайняти 2-й рядок на всю ширину (grid-column:1/-1), не встромлені під номер,
   як у функцій (там номера немає, тож усе й так починається з краю картки). */
.bt-org-depthead{background:#D9E3F7;border:1.5px solid #C3D3EF;border-radius:10px;padding:16px 16px;
  box-shadow:0 2px 8px rgba(20,30,50,.05);display:grid;grid-template-columns:auto 1fr;column-gap:13px;align-items:start;}
.bt-org-depthead__num{font:900 28px/1 var(--bt-font);color:var(--bt-ink);}
.bt-org-depthead__col{min-width:0;}
.bt-org-depthead .bt-org-ckp,.bt-org-depthead .bt-org-prof{grid-column:1/-1;}
.bt-org-name{font:800 15px/1.2 var(--bt-font);text-transform:uppercase;letter-spacing:.01em;color:#000;}
.bt-org-role{font:700 9.5px/1.2 var(--bt-font);text-transform:uppercase;letter-spacing:.05em;color:var(--bt-gray-d);margin-top:4px;}
.bt-org-ckp{font:400 11.5px/1.5 var(--bt-font);color:#5A6068;margin-top:7px;}
.bt-org-ckp b{font-weight:500;color:var(--bt-ink);}
/* бейдж профілю доступу (інструмент «Доступ» у режимі редагування) — клікабельний */
.bt-org-prof{display:inline-flex;align-items:center;gap:5px;margin-top:7px;cursor:pointer;
  padding:3px 8px;border-radius:7px;border:1px solid var(--bt-blue-border);background:var(--bt-blue-tint);
  font:700 10px/1.2 var(--bt-font);color:var(--bt-blue);white-space:nowrap;}
.bt-org-prof i,.bt-org-prof svg{width:13px;height:13px;}
.bt-org-prof:hover{background:var(--bt-blue-tint2);}
.bt-org-prof.is-empty{border-color:var(--bt-line);background:var(--bt-bg);color:var(--bt-gray);border-style:dashed;}

/* ряд відділів */
/* ряд відділів: flex:1 — заповнює всю висоту колонки (тіла відділів дотягуються вниз);
   align-items:stretch — усі відділи однакової висоти, до низу колонки.
   196px + gap 8px — компактніша схема по ширині (розміри синхронні з UNIT_W/UNIT_GAP у JS). */
.bt-org-units{display:flex;gap:8px;align-items:stretch;margin-top:10px;flex:1 1 auto;}
.bt-org-unit{width:196px;flex:none;background:#D9E3F7;border:1.5px solid #C3D3EF;border-radius:9px;
  padding:16px 11px 16px;box-shadow:0 1px 4px rgba(20,30,50,.05);}
/* грід — та сама логіка, що й у .bt-org-depthead вище: ЦКП/бейдж на повну ширину, не під номером */
.bt-org-unit__head{display:grid;grid-template-columns:auto 1fr;column-gap:9px;align-items:start;min-height:118px;padding-bottom:14px;}
.bt-org-unit__num{font:900 17px/1 var(--bt-font);color:var(--bt-ink);min-width:16px;text-align:center;}
.bt-org-unit__col{min-width:0;}
.bt-org-unit__head .bt-org-ckp,.bt-org-unit__head .bt-org-prof{grid-column:1/-1;}
.bt-org-unit .bt-org-name{font-size:12px;}
.bt-org-unit .bt-org-role{font-size:8.5px;}
.bt-org-unit .bt-org-ckp{font-size:9.5px;line-height:1.42;margin-top:8px;}

/* функція (посада) — тонка лінія-розділювач зверху; перша лінія на всю ширину картки */
.bt-org-pos{padding:16px 4px 16px;margin-top:0;border-top:1px solid rgba(26,29,35,.09);position:relative;}
.bt-org-unit__head + .bt-org-pos{margin:0 -11px;padding:16px 15px;}
/* остання функція у відділі: прибираємо її нижній відступ, щоб простір до краю картки
   задавав сам відділ (18px) — без подвоєння 16+18. */
.bt-org-unit > .bt-org-pos:last-child{padding-bottom:0;}

/* підфункції — другорядні щодо своєї функції: без фону/рамки-картки (інакше переважають
   увагу над батьком) і без горизонтальних ліній між ними. Замість цього — своя коротка
   вертикальна риска зліва в КОЖНОЇ підфункції (не одна суцільна на весь список): проміжок
   між рисками (=gap) сам показує межу між сусідніми підфункціями. Назва — приглушеним
   кольором (не таким контрастним, як у самої функції) і без великих літер. */
.bt-org-pos__subs{margin-top:10px;display:flex;flex-direction:column;gap:16px;}
/* риска — псевдоелемент, що виступає за межі свого блоку В ПРОМІЖОК (gap), а не border-left
   самого блоку — так вона довша, а відстань між написами лишається рівно gap, не росте разом з нею. */
.bt-org-pos__subs .bt-org-pos{border:none;background:none;padding:0 0 0 11px;margin:0;}
/* однаковий виступ з обох боків у КОЖНОЇ підфункції (перша й остання — не виняток), щоб усі
   риски були однакової довжини; не більш як половина gap (16px), інакше сусідні зіллються. */
.bt-org-pos__subs .bt-org-pos::before{content:'';position:absolute;left:0;top:-6px;bottom:-6px;
  width:1px;background:rgba(26,29,35,.12);}
.bt-org-pos__subs .bt-org-pos__name{color:var(--bt-gray-d);text-transform:none;font-weight:700;}
/* кнопка «+Підфункція» — прямий нащадок .bt-org-pos (сестра .bt-org-pos__subs, не всередині неї) */
.bt-org-pos > .bt-org-adddash{font-size:9px;padding:6px;}

/* ---- верхівка-дерево: CEO + заступники, ряди-слоти, з'єднувачі ---- */
/* SVG-шар з'єднувачів — позаду карток, масштабується разом з #org-zoom */
.bt-org-svg{position:absolute;top:0;left:0;z-index:0;pointer-events:none;overflow:visible;}
/* усі вузли дерева — над лініями */
.bt-orgboard > .bt-org-owner,
.bt-orgboard > .bt-org-execrow,
.bt-orgboard > .bt-org-deprow,
.bt-orgboard > .bt-org-ckp-company,
.bt-orgboard > .bt-org-adddash{position:relative;z-index:1;}

/* рівні CEO та заступників: слоти з фіксованою шириною = ширині групи департаментів унизу.
   Однакові верхні відступи обох рядів (30px) тримають заступників РІВНО посередині
   між гендиректором і департаментами. */
.bt-org-execrow{display:flex;gap:24px;align-items:flex-start;margin-top:30px;}
/* ряд заступників: усі картки однакової висоти (тягнуться до найвищої) */
.bt-org-execrow--stretch{align-items:stretch;}
.bt-org-slot{flex:none;display:flex;justify-content:center;}

/* ряд УСІХ департаментів — горизонтально, з тим самим проміжком, що й слоти (DEPT_GAP=24 —
   трохи більше повітря між департаментами).
   align-items:stretch → усі колонки однакової висоти (дотягнуті до смуги ЦКП унизу). */
.bt-org-deprow{display:flex;gap:24px;align-items:stretch;margin-top:30px;}

/* картка керівництва (CEO / заступник). Ширину задає JS інлайном (CEO — фікс, заступник —
   «покриває» групу). min-height + --stretch у ряду роблять заступників однакової висоти. */
.bt-org-exec{background:var(--bt-card);border:1.5px solid var(--bt-line);border-radius:10px;min-height:96px;
  padding:14px 16px;box-shadow:0 2px 8px rgba(20,30,50,.05);text-align:center;position:relative;}
.bt-org-exec__t{font:800 12.5px/1.25 var(--bt-font);text-transform:uppercase;letter-spacing:.01em;color:var(--bt-ink);}
.bt-org-exec .bt-org-ckp{margin-top:8px;text-align:center;}
.bt-org-exec .bt-org-person,.bt-org-exec .bt-org-assign{justify-content:center;}
/* ЦКП у картці власника (тепер показуємо) — компактніше, по центру */
.bt-org-owner .bt-org-ckp{margin-top:8px;text-align:center;}
/* кнопка «додати департамент» під рядом — окремий відступ */
.bt-org-adddash--dept{margin-top:18px;}

/* ЦКП КОМПАНІЇ — широка біла смуга внизу (висота як департамент, великі літери).
   align-self:stretch → на всю ширину дерева (= ряд департаментів). */
.bt-org-ckp-company{align-self:stretch;margin-top:10px;min-height:96px;
  display:flex;align-items:center;justify-content:center;gap:10px;
  background:#fff;border:1.5px solid var(--bt-line);border-radius:10px;
  box-shadow:0 2px 10px rgba(20,30,50,.06);padding:18px 36px;text-align:center;
  text-transform:uppercase;font:800 30px/1.3 var(--bt-font);color:var(--bt-ink);letter-spacing:.015em;}
.bt-org-ckp-company b{color:var(--bt-blue);flex:none;}
/* редагування ЦКП компанії (режим «Текст»): природний регістр (щоб не зберігся
   ВЕРХНІЙ через innerText), видима клікабельна зона навіть коли порожньо */
.bt-org-ckp-company span[contenteditable="true"]{text-transform:none;
  min-width:140px;text-align:left;}

/* Режим «Текст» — за еталоном дизайну: поле під курсором отримує легкий сірий
   тінт, активне поле — суцільний сірий блок із синьою обводкою навколо ЦІЛОГО
   блоку (двохрядкова назва чи ЦКП виділяються одним прямокутником, не рядками).
   width:fit-content — рамка по тексту; блок лишається блочним, тож сусідні
   елементи (людина, роль) не злипаються з назвою в один рядок. */
.bt-orgcanvas--live [contenteditable="true"]{cursor:text;outline:none;border-radius:5px;
  display:block;width:fit-content;max-width:100%;padding:3px 6px;margin:-3px -6px;}
.bt-orgcanvas--live [contenteditable="true"]:hover{background:rgba(20,30,50,.06);}
.bt-orgcanvas--live [contenteditable="true"]:focus{background:#EDEFF2;
  box-shadow:0 0 0 2px var(--bt-blue);color:var(--bt-ink);}
.bt-orgcanvas--live [contenteditable="true"]::selection{background:#C6D8FB;}
.bt-orgcanvas--live [contenteditable="true"]::-moz-selection{background:#C6D8FB;}
/* назви у центрованих картках (власник, CEO/заступники): тримаємо по центру
   (text-align:center на блок із fit-content не діє — центруємо авто-маргінами) */
.bt-orgcanvas--live .bt-org-owner__t[contenteditable="true"],
.bt-orgcanvas--live .bt-org-exec__t[contenteditable="true"]{margin-left:auto;margin-right:auto;}
/* ЦКП компанії: лейбл і текст в одному рядку, рамка по span цілим блоком */
.bt-orgcanvas--live .bt-org-ckp-company span[contenteditable="true"]{display:inline-block;vertical-align:top;}

/* ЦКП у режимі «Текст»: рамка охоплює цілий блок разом із написом «ЦКП:».
   Сам span усередині — без власної рамки (інакше було б дві). */
.bt-org-ckp--edit{border-radius:6px;padding:3px 6px;margin-left:-6px;margin-right:-6px;cursor:text;}
.bt-org-ckp--edit:hover{background:rgba(20,30,50,.06);}
.bt-org-ckp--edit:focus-within{background:#EDEFF2;box-shadow:0 0 0 2px var(--bt-blue);}
.bt-org-ckp--edit span[contenteditable="true"]{display:inline;padding:0;margin:0;border-radius:0;}
.bt-org-ckp--edit span[contenteditable="true"]:hover,
.bt-org-ckp--edit span[contenteditable="true"]:focus{background:none;box-shadow:none;}

/* =====================================================================
   ОРГСХЕМА — ЖИВИЙ ЕКРАН (зум/панорама, редагування, бокова панель)
   ===================================================================== */
.bt-main--fixed{overflow:hidden;height:100vh;scrollbar-gutter:auto;}
/* на мобільному .bt-main стає height:auto — для оргсхеми тримаємо повну висоту,
   щоб полотно зі схемою мало куди розгорнутись. 100dvh — коректна висота з
   урахуванням адресної смуги мобільного браузера (де підтримується). */
@media (max-width:900px){ .bt-main--fixed{height:100vh;height:100dvh;overflow:hidden;} }

/* полотно з масштабуванням: панорама-перетягуванням, зум колесом.
   user-select:none — щоб під час панорами текст НЕ виділявся;
   у полях редагування виділення повертаємо.
   touch-action:none — жести (пан пальцем, пінч-зум) дістаються схемі,
   а не нативному скролу/зуму сторінки (мобільний/планшет). */
.bt-orgcanvas--live{position:relative;overflow:hidden;cursor:grab;touch-action:none;
  user-select:none;-webkit-user-select:none;-moz-user-select:none;}
.bt-orgcanvas--live [contenteditable="true"]{user-select:text;-webkit-user-select:text;-moz-user-select:text;}
.bt-orgcanvas--live.is-panning{cursor:grabbing;}
/* НЕ ставимо will-change:transform постійно — інакше браузер кешує растр на 1×
   і розмиває текст при збільшенні. Промоцію вмикаємо лише під час руху (у JS). */
.bt-orgzoom{position:absolute;top:0;left:0;transform-origin:0 0;}
.bt-orgzoom .bt-orgboard{margin:0;padding:48px 0 120px;}
/* рамка-індикатор режиму редагування */
.bt-orgcanvas--live.is-edit::after{content:'';position:absolute;inset:0;border:3px solid var(--bt-coral);
  pointer-events:none;z-index:15;border-radius:2px;}

/* елементи керування зумом (правий нижній кут) */
.bt-zoomctl{position:absolute;right:18px;bottom:18px;z-index:18;display:flex;flex-direction:column;gap:6px;
  background:var(--bt-card);border:1px solid var(--bt-line);border-radius:12px;padding:6px;box-shadow:var(--bt-sh-card);}
.bt-zoomctl button{width:34px;height:34px;border:none;background:none;border-radius:8px;cursor:pointer;
  display:flex;align-items:center;justify-content:center;color:var(--bt-gray-d);}
.bt-zoomctl button:hover{background:var(--bt-bg);}
.bt-zoomctl button i,.bt-zoomctl button svg{width:17px;height:17px;}
.bt-zoomctl__val{font:700 10px/1 var(--bt-font);color:var(--bt-gray);text-align:center;padding:2px 0;}

/* кнопки навігації полотна (правий нижній кут, за мобільним еталоном):
   зменшити / збільшити / вписати — горизонтальний білий блок із розділювачами */
.bt-orgzoomctl{position:absolute;right:16px;bottom:16px;z-index:18;display:flex;
  background:var(--bt-card);border:1px solid var(--bt-line);border-radius:12px;
  box-shadow:0 4px 16px rgba(20,30,50,.12);overflow:hidden;}
.bt-orgzoomctl button{width:44px;height:44px;border:none;background:none;cursor:pointer;
  display:flex;align-items:center;justify-content:center;color:var(--bt-ink);padding:0;}
.bt-orgzoomctl button + button{border-left:1px solid var(--bt-line);}
.bt-orgzoomctl button:hover{background:#F4F5F7;}
.bt-orgzoomctl button i,.bt-orgzoomctl button svg{width:19px;height:19px;}
.bt-orgzoomctl button[data-zoom="fit"] i,.bt-orgzoomctl button[data-zoom="fit"] svg{width:18px;height:18px;color:var(--bt-gray-d);}

/* підказка інструмента (унизу по центру) */
.bt-toolhint{position:absolute;left:50%;bottom:20px;transform:translateX(-50%);z-index:18;
  background:var(--bt-ink);color:#fff;font:600 11.5px/1.3 var(--bt-font);padding:7px 13px;border-radius:9px;
  box-shadow:0 4px 14px rgba(20,30,50,.2);white-space:nowrap;pointer-events:none;}

/* панель інструментів редагування (у смузі вкладок) */
.bt-orgtoolbar{flex:1;display:flex;align-items:center;gap:3px;}
.bt-orgtoolbar__btn{display:inline-flex;align-items:center;gap:6px;height:34px;padding:0 11px;border-radius:9px;
  border:none;background:none;cursor:pointer;font:600 12.5px/1 var(--bt-font);color:var(--bt-gray-d);white-space:nowrap;}
.bt-orgtoolbar__btn i,.bt-orgtoolbar__btn svg{width:16px;height:16px;color:var(--bt-gray);}
.bt-orgtoolbar__btn:hover{background:#F4F5F7;color:var(--bt-ink);}
.bt-orgtoolbar__btn.is-active{background:var(--bt-green-tint);color:var(--bt-ink);}
.bt-orgtoolbar__btn.is-active i,.bt-orgtoolbar__btn.is-active svg{color:#5C7A12;}
.bt-orgtoolbar__sep{width:1px;height:22px;background:var(--bt-line);margin:0 5px;}

/* у перегляді «клік» лише на назві (відкриває бокову панель); решта — панорама (grab) */
.bt-orgcanvas--live:not(.is-edit) .bt-org-name,
.bt-orgcanvas--live:not(.is-edit) .bt-org-pos__name,
.bt-orgcanvas--live:not(.is-edit) .bt-org-owner__t{cursor:pointer;}
/* у режимі призначення вся картка клікабельна */
.bt-orgcanvas--live.is-assign .bt-org-depthead,
.bt-orgcanvas--live.is-assign .bt-org-unit,
.bt-orgcanvas--live.is-assign .bt-org-pos,
.bt-orgcanvas--live.is-assign .bt-org-owner{cursor:pointer;}
/* у режимі «Колір» клікабельна ціль — шапка департаменту */
.bt-orgcanvas--live.is-color .bt-org-depthead{cursor:pointer;}

/* інлайн-кнопки додавання/видалення на картках */
.bt-org-act{position:absolute;top:9px;right:9px;width:22px;height:22px;border-radius:6px;background:var(--bt-card);
  border:1px solid var(--bt-line);display:flex;align-items:center;justify-content:center;cursor:pointer;z-index:6;}
.bt-org-act i,.bt-org-act svg{width:13px;height:13px;color:var(--bt-gray);}
.bt-org-act:hover{background:#F4F5F7;}
.bt-org-act--add{border-color:var(--bt-green-border);}
.bt-org-act--add i,.bt-org-act--add svg{color:#7A9A1C;}
.bt-org-act--add:hover{background:var(--bt-green-tint);}
.bt-org-depthead,.bt-org-unit,.bt-org-owner{position:relative;}

/* кнопка-пунктир «додати» всередині */
.bt-org-adddash{margin-top:9px;border:1.5px dashed var(--bt-dashed);border-radius:9px;padding:10px;
  display:flex;align-items:center;justify-content:center;gap:7px;cursor:pointer;color:var(--bt-gray);
  font:700 10px/1 var(--bt-font);text-transform:uppercase;letter-spacing:.03em;}
.bt-org-adddash:hover{border-color:var(--bt-blue);color:var(--bt-blue);}
.bt-org-adddash i,.bt-org-adddash svg{width:13px;height:13px;}

/* лінія-вставка при перетягуванні */
.bt-drop-line{position:absolute;background:var(--bt-blue);border-radius:2px;z-index:8;}
.bt-org-unit.is-dragging,.bt-org-pos.is-dragging{opacity:.45;}
/* контейнер-ціль, коли блок кидають «усередину» (в інший відділ/департамент) */
.bt-org-unit.is-drop-target,.bt-org-depthead.is-drop-target{outline:2px dashed var(--bt-blue);outline-offset:3px;}

/* призначена людина (чип) + кнопка «призначити» */
.bt-org-assign{display:inline-flex;align-items:center;gap:6px;margin-top:6px;border:1px dashed var(--bt-dashed);
  border-radius:8px;padding:4px 9px;cursor:pointer;font:700 9px/1 var(--bt-font);text-transform:uppercase;
  letter-spacing:.03em;color:var(--bt-gray-d);background:none;}
.bt-org-assign:hover{border-color:var(--bt-blue);color:var(--bt-blue);}
.bt-org-assign i,.bt-org-assign svg{width:12px;height:12px;}

/* поповер вибору людини */
.bt-picker{position:fixed;z-index:80;width:268px;background:var(--bt-card);border:1px solid var(--bt-line);
  border-radius:12px;box-shadow:var(--bt-sh-pop);padding:6px;max-height:340px;overflow-y:auto;}
.bt-picker__search{display:flex;align-items:center;gap:7px;background:var(--bt-bg);border-radius:8px;padding:7px 9px;margin-bottom:4px;}
.bt-picker__search i,.bt-picker__search svg{width:14px;height:14px;color:var(--bt-gray);flex:none;}
.bt-picker__search input{border:none;outline:none;background:none;font:500 12.5px/1 var(--bt-font);width:100%;color:var(--bt-ink);}
.bt-picker__row{display:flex;align-items:center;gap:10px;padding:8px 9px;border-radius:9px;cursor:pointer;text-align:left;border:none;background:none;width:100%;}
.bt-picker__row:hover{background:var(--bt-bg);}
.bt-picker__ava{width:30px;height:30px;border-radius:50%;background:#E7EAEE center/cover;flex:none;
  display:flex;align-items:center;justify-content:center;font:800 10px/1 var(--bt-font);color:#5A6068;}
.bt-picker__name{font:700 13px/1.1 var(--bt-font);color:var(--bt-ink);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.bt-picker__role{font:500 10.5px/1.2 var(--bt-font);color:var(--bt-gray);margin-top:2px;}
.bt-picker__row--clear .bt-picker__ava{background:none;border:1px dashed var(--bt-dashed);}
/* нотатка вгорі пікера у мульти-режимі («можна кілька людей») */
.bt-picker__note{padding:7px 11px 6px;font:600 10.5px/1.35 var(--bt-font);color:var(--bt-gray-d);
  background:var(--bt-bg);border-radius:8px;margin-bottom:4px;}

/* поповер вибору кольору департаменту (інструмент «Колір») */
.bt-colorpop{width:236px;padding:12px;max-height:none;}
.bt-colorpop__title{font:800 10.5px/1 var(--bt-font);letter-spacing:.05em;text-transform:uppercase;color:var(--bt-gray-d);margin:2px 2px 10px;}
.bt-colorpop__grid{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;}
.bt-colorpop__sw{aspect-ratio:1;border-radius:9px;border:1.5px solid transparent;cursor:pointer;
  display:flex;align-items:center;justify-content:center;padding:0;transition:transform .1s ease;}
.bt-colorpop__sw:hover{transform:scale(1.07);}
.bt-colorpop__sw i,.bt-colorpop__sw svg{width:15px;height:15px;color:var(--bt-ink);}
.bt-colorpop__custom{display:flex;align-items:center;gap:9px;margin-top:11px;padding:7px 8px;border-radius:9px;
  cursor:pointer;font:600 12.5px/1 var(--bt-font);color:var(--bt-gray-d);}
.bt-colorpop__custom:hover{background:var(--bt-bg);color:var(--bt-ink);}
.bt-colorpop__custom input{width:26px;height:26px;border:1px solid var(--bt-line);padding:1px;background:none;cursor:pointer;border-radius:7px;flex:none;}

/* бокова панель (деталі блоку) */
@keyframes btSlideIn{from{transform:translateX(100%);}to{transform:translateX(0);}}
@keyframes btFadeIn{from{opacity:0;}to{opacity:1;}}
.bt-side-overlay{position:fixed;inset:0;background:rgba(20,28,44,.34);z-index:60;animation:btFadeIn .2s ease;}
.bt-side{position:fixed;top:0;right:0;bottom:0;width:min(54%,760px);z-index:61;background:var(--bt-bg);
  box-shadow:-12px 0 50px rgba(20,30,50,.22);display:flex;flex-direction:column;animation:btSlideIn .26s cubic-bezier(.22,.61,.36,1);}
.bt-side__head{flex:none;background:var(--bt-card);border-bottom:1px solid var(--bt-line);padding:18px 26px;display:flex;align-items:center;gap:12px;}
.bt-side__swatch{width:14px;height:14px;border-radius:50%;flex:none;box-shadow:0 0 0 1.5px #D0D4DA;}
.bt-side__title{font:800 21px/1.15 var(--bt-font);letter-spacing:-.01em;}
.bt-side__sub{font:500 12.5px/1 var(--bt-font);color:var(--bt-gray-d);margin-top:5px;}
.bt-side__x{width:38px;height:38px;border-radius:10px;display:flex;align-items:center;justify-content:center;cursor:pointer;flex:none;border:none;background:none;margin-left:auto;}
.bt-side__x:hover{background:#F4F5F7;}
.bt-side__body{flex:1;min-height:0;overflow-y:scroll;scrollbar-gutter:stable;padding:24px 26px 40px;}
.bt-side__card{background:var(--bt-card);border:1px solid var(--bt-line);border-radius:14px;padding:18px 20px;}
.bt-side__card + .bt-side__card{margin-top:16px;}
.bt-side__label{font:800 11px/1 var(--bt-font);letter-spacing:.05em;text-transform:uppercase;margin-bottom:10px;}
.bt-side__ckp{font:500 14px/1.6 var(--bt-font);color:var(--bt-ink);}
.bt-side__child{display:flex;align-items:flex-start;gap:10px;padding:11px 0;border-bottom:1px solid var(--bt-bg);}
.bt-side__child:last-child{border-bottom:none;}
.bt-side__dot{width:7px;height:7px;border-radius:50%;background:var(--bt-green);flex:none;margin-top:6px;}

/* модалка підтвердження видалення */
.bt-confirm{position:fixed;inset:0;z-index:90;display:flex;align-items:center;justify-content:center;background:rgba(20,28,44,.4);animation:btFadeIn .15s ease;}
.bt-confirm__box{background:var(--bt-card);border-radius:16px;box-shadow:var(--bt-sh-modal);padding:24px;width:380px;max-width:92vw;}
.bt-confirm__t{font:800 17px/1.3 var(--bt-font);margin-bottom:8px;}
.bt-confirm__d{font:500 13px/1.5 var(--bt-font);color:var(--bt-gray-d);margin-bottom:20px;}
.bt-confirm__row{display:flex;gap:10px;justify-content:flex-end;}
.bt-org-pos__name{font:800 10px/1.25 var(--bt-font);text-transform:uppercase;letter-spacing:.01em;color:var(--bt-ink);}
.bt-org-pos__role{font:700 8px/1.2 var(--bt-font);text-transform:uppercase;letter-spacing:.04em;color:var(--bt-gray);margin-top:3px;}
.bt-org-pos .bt-org-ckp{font-size:9.5px;line-height:1.42;margin-top:6px;}
/* фото (одне з ім'ям чи стек без імен) перед ЦКП: завжди звичайний позитивний
   відступ — раніше тут був від'ємний «-2px», через що фото ВІЗУАЛЬНО торкалося
   тексту ЦКП; тепер однаково і для одиночного фото, і для стеку. */
.bt-org-pos .bt-org-person + .bt-org-ckp,
.bt-org-pos .bt-org-people + .bt-org-ckp{margin-top:8px;}

/* =====================================================================
   СУБ-МЕНЮ РОЗДІЛУ (повноширинна смуга вкладок над вмістом сторінки)
   Підпункти розділу (Фінанси: Cashflow / Інвойси / Зарплати …) живуть тут,
   а не в лівій панелі. Рендериться partials/baust-subnav.
   ===================================================================== */
.bt-subbar{flex:none;display:flex;align-items:center;gap:16px;min-height:52px;padding:0 28px;
  background:var(--bt-card);border-bottom:1px solid var(--bt-line);}
.bt-subbar .bt-subnav{border-bottom:none;margin:0;}
@media (max-width:900px){ .bt-subbar{padding:0 14px;} }

/* =====================================================================
   ЛЕГАСІ-ВМІСТ У НОВОМУ КАРКАСІ (.bt-app--legacy)
   Старі сторінки (layouts.app) тепер живуть усередині нового каркаса з лівою
   панеллю. Тут лише ТОНКІ правки, щоб старий вміст лишався як був:
   - повертаємо базовий колір/накреслення тексту старої ERP (Gilroy і так спільний);
   - даємо головній області горизонтальну прокрутку для широких таблиць;
   - .content лишається білим (як раніше) і тягнеться на всю висоту.
   ===================================================================== */
.bt-app--legacy .bt-main{overflow:auto;}
.bt-app--legacy .bt-legacy-content{color:#000;font-weight:400;}
/* старий off-canvas більше не використовується — нейтралізуємо його трансформації */
.bt-app--legacy .content{transform:none !important;}

/* =====================================================================
   СТОРІНКА «ОБ'ЄКТИ» (новий дизайн, у легасі-каркасі)
   Список = акордеон карток: рядок → фін-бари об'єкта + проекти з кільцями.
   ===================================================================== */
/* Фон контенту — білий (як сайдбар/топбар). Картки й кнопки відділяються від
   білого тла легкою тінню (нижче), а не сірим фоном сторінки. Темніші лінії й
   білий фон тепер глобальні (див. --bt-line і .bt-app), тож тут локальних оверрайдів нема. */
.obj-page{background:var(--bt-card);min-height:100vh;font-family:var(--bt-font);color:var(--bt-ink);
  font-variant-numeric:tabular-nums;}
.obj-wrap{max-width:1180px;margin:0 auto;padding:26px 32px 70px;}

.obj-head{display:flex;align-items:center;justify-content:space-between;gap:20px;margin-bottom:18px;flex-wrap:wrap;}
.obj-tools{display:flex;align-items:center;gap:12px;flex-wrap:wrap;justify-content:flex-end;}
/* На білому фоні сторінки штатна --bt-sh-outline (alpha .06) майже не читається —
   даємо пошуку й кнопкам тулбару трохи виразнішу легку тінь, щоб вони відділялись. */
.obj-tools .bt-btn,.obj-search{box-shadow:0 1px 2px rgba(20,30,50,.05),0 2px 8px rgba(20,30,50,.06);}
.obj-tools .bt-btn:hover{box-shadow:0 2px 4px rgba(20,30,50,.06),0 4px 12px rgba(20,30,50,.08);}

/* пошук */
.obj-search{display:flex;align-items:center;gap:9px;background:var(--bt-card);border:1px solid var(--bt-line);
  border-radius:var(--bt-r-btn);padding:0 12px;height:40px;width:320px;max-width:100%;box-shadow:var(--bt-sh-outline);}
.obj-search i,.obj-search svg{width:16px;height:16px;color:var(--bt-gray);flex:none;}
.obj-search input{border:none;outline:none;background:transparent;font:500 14px/1 var(--bt-font);color:var(--bt-ink);width:100%;}
.obj-search__clear{margin-left:auto;color:var(--bt-gray);text-decoration:none;font-size:18px;line-height:1;padding:0 2px;}
.obj-search__clear:hover{color:var(--bt-ink);}

/* фільтр статусу — компактна кнопка-іконка (як .obj-sort-btn), підказка при наведенні */
.obj-filter{position:relative;}
.obj-filter__btn{width:40px;padding:0;gap:0;}
.obj-filter__btn.is-active{background:var(--bt-row-press);color:var(--bt-ink);border-color:var(--bt-row-press);}
.obj-filter__btn.is-active i,.obj-filter__btn.is-active svg{color:var(--bt-ink);}
.obj-filter__menu{position:absolute;top:48px;right:0;width:210px;z-index:30;background:var(--bt-card);
  border:1px solid var(--bt-line);border-radius:12px;box-shadow:var(--bt-sh-pop);padding:6px;}
.obj-filter__menu[hidden]{display:none;}
.obj-filter__title{padding:8px 11px 6px;font:700 10px/1 var(--bt-font);letter-spacing:.07em;text-transform:uppercase;color:var(--bt-gray);}
.obj-filter__opt{display:flex;align-items:center;gap:8px;width:100%;text-align:left;border:none;background:none;cursor:pointer;
  padding:9px 11px;border-radius:8px;font:500 14px/1 var(--bt-font);color:var(--bt-ink);text-decoration:none;}
.obj-filter__opt span{flex:1;}
.obj-filter__opt i,.obj-filter__opt svg{width:16px;height:16px;color:var(--bt-blue);}
.obj-filter__opt:hover{background:#F4F5F7;}
/* мульти-вибір статусів (чекбокси зі статус-бейджами) */
.obj-filter__check{display:flex;align-items:center;gap:9px;padding:7px 9px;border-radius:8px;cursor:pointer;}
.obj-filter__check:hover{background:#F4F5F7;}
.obj-filter__check input{width:16px;height:16px;flex:none;cursor:pointer;accent-color:var(--bt-green);}
.obj-filter__check .bt-badge{cursor:pointer;}

/* кнопка «Сортування за активністю» — іконка-тумблер поруч із фільтром статусу.
   Активний стан — за конвенцією без синього (див. правило біля .bt-tree): сірий фон + ink-текст. */
.obj-sort-btn{width:40px;padding:0;gap:0;}
.obj-sort-btn.is-active{background:var(--bt-row-press);color:var(--bt-ink);border-color:var(--bt-row-press);}
.obj-sort-btn.is-active i,.obj-sort-btn.is-active svg{color:var(--bt-ink);}

/* Тултіп (.bt-tip): показує data-tip при hover/focus. */
.bt-tip{position:relative;}
.bt-tip::after{content:attr(data-tip);position:absolute;top:calc(100% + 8px);right:0;z-index:50;
  width:max-content;max-width:280px;padding:8px 11px;border-radius:var(--bt-r-9);
  background:var(--bt-ink);color:#fff;font:500 12px/1.45 var(--bt-font);text-align:left;white-space:normal;
  opacity:0;visibility:hidden;transition:opacity .12s ease .25s;pointer-events:none;}
.bt-tip:hover::after,.bt-tip:focus-visible::after{opacity:1;visibility:visible;}

/* список */
.obj-list,.objects{display:flex;flex-direction:column;gap:10px;list-style:none;margin:0;padding:0;}

/* картка об'єкта — легка тінь відділяє білу картку від білого фону сторінки */
.obj-card{background:var(--bt-card);border:1px solid var(--bt-line);border-radius:var(--bt-r-card-sm);overflow:hidden;
  box-shadow:var(--bt-sh-raise);transition:box-shadow .15s ease;}
.obj-card:hover{box-shadow:0 2px 4px rgba(20,30,50,.05),0 8px 22px rgba(20,30,50,.07);}
.obj-row{display:grid;grid-template-columns:54px minmax(160px,1fr) 116px 120px 120px 128px 24px;gap:16px;align-items:center;
  padding:14px 16px;cursor:pointer;transition:background .12s ease;}
.obj-row:hover{background:#FAFBFC;}
.obj-row__thumb{width:54px;height:44px;border-radius:8px;background:#ECEEF1 center/cover no-repeat;flex:none;}
.obj-row__main{min-width:0;}
.obj-row__title{font:800 13.5px/1.2 var(--bt-font);letter-spacing:-.01em;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.obj-row__client{font:500 12px/1.3 var(--bt-font);color:var(--bt-gray-d);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;margin-top:3px;}
/* обгортка трьох сум: на десктопі «прозора» (display:contents — діти самі є
   колонками сітки .obj-row), на мобільному стає окремим рядком (див. @media) */
.obj-row__nums{display:contents;}
.obj-row__num{text-align:right;}
.obj-row__val{font:800 15px/1 var(--bt-font);letter-spacing:-.01em;}
.obj-row__cap{font:500 9.5px/1 var(--bt-font);letter-spacing:.06em;text-transform:uppercase;color:var(--bt-gray);margin-top:4px;}
.obj-row__chev{display:flex;align-items:center;justify-content:flex-end;}
.obj-row__chev i,.obj-row__chev svg{width:18px;height:18px;color:var(--bt-gray);transition:transform .18s ease;}
.obj-card.is-open .obj-row__chev i,.obj-card.is-open .obj-row__chev svg{transform:rotate(180deg);}

/* розгорнута панель */
.obj-panel{border-top:1px solid var(--bt-line);padding:16px;background:#FBFCFD;}
.obj-panel[hidden]{display:none;}

/* фін-бари об'єкта */
.obj-bars{background:var(--bt-card);border:1px solid var(--bt-line);border-radius:var(--bt-r-fin);padding:16px 18px;margin-bottom:16px;}
.obj-bar + .obj-bar{margin-top:14px;}
.obj-bar__head{display:flex;align-items:baseline;gap:9px;margin-bottom:7px;flex-wrap:wrap;}
.obj-bar__label{font:800 10.5px/1 var(--bt-font);letter-spacing:.07em;text-transform:uppercase;}
.obj-bar__sum{font:800 16px/1 var(--bt-font);letter-spacing:-.01em;}
.obj-bar__muted{font:400 11px/1 var(--bt-font);color:var(--bt-gray);}
.obj-bar__track{height:10px;border-radius:6px;background:var(--bt-line);overflow:hidden;display:flex;}
.obj-bar__foot{display:flex;justify-content:space-between;margin-top:6px;font:400 12px/1 var(--bt-font);color:var(--bt-gray);}

/* шапка блоку проектів */
.obj-projhead{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:10px;flex-wrap:wrap;}
.obj-projhead__t{font:800 12.5px/1 var(--bt-font);letter-spacing:.02em;}
.obj-projhead__act{display:flex;align-items:center;gap:8px;flex-wrap:wrap;}
.obj-projhead__act .obj-del-form{margin:0;}

/* сітка проектів */
.obj-projgrid{display:grid;grid-template-columns:repeat(2,1fr);gap:9px;align-items:start;}
.proj-card{display:block;border:1px solid var(--bt-line);border-radius:var(--bt-r-fin);background:var(--bt-card);
  padding:12px 15px;text-decoration:none;color:inherit;transition:background .12s ease,border-color .12s ease;}
.proj-card:hover{background:#FAFBFC;border-color:#D7DBE0;}
.proj-card__head{display:flex;align-items:center;justify-content:space-between;gap:10px;}
.proj-card__title{font:800 13px/1.2 var(--bt-font);letter-spacing:-.01em;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.proj-card__sub{font:500 11px/1.3 var(--bt-font);color:var(--bt-gray-d);margin-top:2px;}
.proj-card__rings{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin-top:12px;}
.proj-ring{display:flex;align-items:center;gap:11px;min-width:0;}
.proj-ring__circle{width:50px;height:50px;border-radius:50%;display:flex;align-items:center;justify-content:center;flex:none;}
.proj-ring__inner{width:37px;height:37px;border-radius:50%;background:#fff;display:flex;align-items:center;justify-content:center;font:800 13px/1 var(--bt-font);}
.proj-ring__meta{min-width:0;}
.proj-ring__lbl{font:700 9px/1.2 var(--bt-font);letter-spacing:.04em;text-transform:uppercase;}
.proj-ring__act{font:800 13px/1.2 var(--bt-font);margin-top:3px;}
.proj-ring__sub{font:400 11.5px/1.2 var(--bt-font);color:var(--bt-gray);margin-top:2px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}

/* службове */
.obj-empty{background:var(--bt-card);border:1px dashed var(--bt-line);border-radius:12px;padding:18px;
  text-align:center;color:var(--bt-gray);font:500 13px/1.4 var(--bt-font);}
.obj-empty--big{padding:48px;border-style:solid;}
.obj-archive-head{font:800 12px/1 var(--bt-font);letter-spacing:.05em;text-transform:uppercase;color:var(--bt-gray);margin:26px 0 12px;}
.obj-pagination{margin:22px 0 6px;display:flex;justify-content:center;}
.obj-archive-more{margin-top:18px;}

/* Пагінація (.bt-pager) — заміна дефолтного Bootstrap-вигляду `->links()`.
   Конвенція навігації: hover = --bt-row-active, активна сторінка = --bt-row-press
   + жирний ink-текст, БЕЗ синього (--bt-blue) — див. правило біля .bt-tree. */
.bt-pager{display:flex;align-items:center;gap:4px;}
.bt-pager__item,.bt-pager__nav{display:inline-flex;align-items:center;justify-content:center;
  min-width:34px;height:34px;padding:0 4px;border-radius:var(--bt-r-9);border:none;background:none;
  font:700 13px/1 var(--bt-font);color:var(--bt-gray-d);text-decoration:none;cursor:pointer;}
.bt-pager__item:hover{background:var(--bt-row-active);color:var(--bt-ink);}
.bt-pager__item.is-active{background:var(--bt-row-press);color:var(--bt-ink);}
.bt-pager__nav{color:var(--bt-gray);}
.bt-pager__nav i,.bt-pager__nav svg{width:16px;height:16px;}
.bt-pager__nav:hover{background:var(--bt-row-active);color:var(--bt-ink);}
.bt-pager__nav.is-disabled{opacity:.35;pointer-events:none;}
.bt-pager__ellipsis{display:inline-flex;align-items:center;justify-content:center;min-width:34px;height:34px;
  color:var(--bt-gray);font:700 13px/1 var(--bt-font);}

@media (max-width:860px){
  .obj-wrap{padding:16px 14px 60px;}
  .obj-head{align-items:flex-start;margin-bottom:14px;}
  /* тулбар: пошук тягнеться на всю ширину, кнопки фільтра/сортування — поруч в один рядок */
  .obj-tools{width:100%;flex-wrap:nowrap;}
  .obj-search{flex:1 1 auto;min-width:0;width:auto;}
  /* рядок об'єкта: [фото · назва/клієнт · шеврон], під ними статус окремим рядком,
     нижче — рядок трьох сум. Так бейдж не тисне на ім'я клієнта, а довгий статус
     («Здано, очікує оплати») видно повністю. Позиції задані явно, бо
     grid-column:1/-1 ламає авто-розкладку шеврона. */
  .obj-row{grid-template-columns:48px minmax(0,1fr) 18px;gap:10px;padding:12px 14px;grid-auto-rows:auto;}
  .obj-row__thumb{width:48px;height:40px;grid-row:1;grid-column:1;}
  .obj-row__main{grid-row:1;grid-column:2;}
  .obj-row__chev{grid-row:1;grid-column:3;}
  .obj-row__status{grid-row:2;grid-column:1/-1;}
  .obj-row__nums{display:grid;grid-row:3;grid-column:1/-1;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;}
  .obj-row__num{text-align:left;}
  .obj-row__val{font-size:13.5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
  /* розгорнута панель: трохи щільніші відступи, підписи барів не злипаються */
  .obj-panel{padding:12px;background:var(--bt-card);}
  /* фін-бари теж без «блоку в блоці»: на всю ширину, знизу лінія-розділювач перед проектами */
  .obj-bars{border:none;border-radius:0;background:none;padding:4px 0 16px;margin-bottom:14px;
    border-bottom:1px solid var(--bt-line);}
  .obj-bar__foot{flex-wrap:wrap;gap:4px 12px;line-height:1.4;}
  /* проекти БЕЗ «блоку в блоці»: плоскі рядки на всю ширину, розділені лінією —
     так звільняється ширина, і кільця дохід/витрати/прибуток стають в один ряд */
  .obj-projgrid{grid-template-columns:1fr;gap:0;}
  .proj-card{border:none;border-radius:0;background:none;padding:13px 0;border-top:1px solid var(--bt-line);}
  .obj-projgrid .proj-card:first-child{border-top:none;padding-top:4px;}
  .proj-card:hover{background:none;}
  /* кільце стає вертикальним: кружок зверху, підписи під ним — три колонки в ряд */
  .proj-card__rings{grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;margin-top:11px;}
  .proj-ring{flex-direction:column;align-items:center;text-align:center;gap:7px;}
  .proj-ring__circle{width:46px;height:46px;}
  .proj-ring__inner{width:34px;height:34px;font-size:12px;}
  .proj-ring__meta{max-width:100%;}
  .proj-ring__act{font-size:12.5px;margin-top:2px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
  .proj-ring__sub{font-size:10.5px;}
}

/* ── Сторінка проекту (нова шапка + інлайн-редагування фінансів) ── */
.proj-head-card{display:flex;align-items:center;gap:16px;background:var(--bt-card);border:1px solid var(--bt-line);
  border-radius:var(--bt-r-card-sm);padding:16px 18px;font-family:var(--bt-font);box-shadow:var(--bt-sh-raise);}
.proj-head__thumb{width:56px;height:56px;border-radius:11px;background:#ECEEF1 center/cover no-repeat;flex:none;}
.proj-head__main{flex:1;min-width:0;}
.proj-head__title{font:800 18px/1.2 var(--bt-font);letter-spacing:-.01em;color:var(--bt-ink);}
.proj-head__sub{font:500 14px/1.3 var(--bt-font);color:var(--bt-gray-d);margin-top:5px;}

.proj-edit-card{background:var(--bt-card);border:1px solid var(--bt-blue-border);border-radius:var(--bt-r-card-sm);
  padding:18px 20px;box-shadow:0 4px 16px rgba(47,107,255,.06);font-family:var(--bt-font);}
.proj-edit__title{display:flex;align-items:center;gap:8px;font:800 11px/1 var(--bt-font);letter-spacing:.05em;
  text-transform:uppercase;color:var(--bt-blue);margin-bottom:14px;}
.proj-edit__title i,.proj-edit__title svg{width:14px;height:14px;}
.proj-edit__full{margin-bottom:14px;}
.proj-edit__full .bt-input{text-align:left;width:100%;}
.proj-edit__grid{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;}
.proj-edit__grid .bt-input{text-align:right;}
.proj-edit__actions{display:flex;align-items:center;gap:10px;margin-top:16px;}
@media (max-width:760px){
  .proj-edit-card{padding:14px;}
  .proj-edit__grid{grid-template-columns:repeat(2,1fr);gap:12px;}
  /* кнопки не вміщаються в один рядок: Видалити проект — окремим рядком зверху,
     під ним Скасувати+Зберегти діляться рядком 50/50 */
  .proj-edit__actions{flex-wrap:wrap;}
  .proj-edit__actions > span{display:none;}   /* спейсер між групами не потрібен */
  .proj-edit__actions .bt-btn{flex:1 1 auto;justify-content:center;}
  .proj-edit__actions .bt-btn--danger-soft{flex-basis:100%;}
}

/* білий фон сторінки проекту (як на списку і решті ЕРП) */
.project_show .content{background:var(--bt-card);}
/* ширина блоку проекту — як у макеті (≈920px), а не вузькі 550px; + повітря під смугою */
.project_show .container.narrow{max-width:950px;padding-top:22px;}

/* шеврони акордеонів проекту — Lucide chevron-down (як у макеті), праворуч, з поворотом */
.project_show .card-header > a{display:flex !important;align-items:center;justify-content:space-between;gap:10px;width:100%;}
.bt-acc-chev{width:18px;height:18px;color:var(--bt-gray);flex:none;transition:transform .2s ease;}
.project_show a:not(.collapsed) .bt-acc-chev{transform:rotate(180deg);}

/* =====================================================================
   СТОРІНКА «ЗАМОВНИКИ» (легасі-список у новому каркасі)
   Однотонний білий фон (як на решті ЕРП): легасі .content білий, каркас тепер
   теж білий — робимо .content явно білим, щоб фон був суцільним без сірих швів. */
.client_index .content,.client_show .content{background:var(--bt-card);}
/* фото замовника — завжди чорно-біле (на типові іконки за статтю НЕ застосовується) */
.cl-ava--bw{filter:grayscale(1);}

/* хлібний слід — повноширинна смуга вгорі (НЕ липка, без нижньої лінії — за побажанням) */
.bt-crumbbar{display:flex;align-items:center;gap:9px;
  padding:15px 32px;background:var(--bt-card);
  font:500 14px/1 var(--bt-font);flex-wrap:wrap;}
.bt-crumbbar a{color:var(--bt-gray-d);text-decoration:none;}
.bt-crumbbar a:hover{color:var(--bt-ink);}
.bt-crumbbar > span{color:var(--bt-gray-d);}
.bt-crumbbar .cur{color:var(--bt-ink);font-weight:700;}
/* лише прямі діти-шеврони (не іконка всередині кнопки-олівця) */
.bt-crumbbar > i,.bt-crumbbar > svg{width:14px;height:14px;color:var(--bt-gray);flex:none;}
@media (max-width:860px){ .bt-crumbbar{padding:13px 16px;} }
/* хлібні крихти всередині верхньої білої шапки (сторінка проекту) */
.bt-topbar--crumb{align-items:center;gap:10px;}
.bt-crumbbar--intop{padding:0;background:none;flex:1;min-width:0;}
.bt-crumbbar--intop .cur{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}

/* клікабельний перемикач статусу стадії/проекту */
.proj-status{position:relative;}
.proj-status__btn{display:inline-flex;align-items:center;gap:5px;border:none;cursor:pointer;font:inherit;
  font-weight:700;line-height:1;}
.proj-status__btn i,.proj-status__btn svg{width:13px;height:13px;opacity:.7;}
.proj-status__btn.is-saving{opacity:.55;pointer-events:none;}
.proj-status__menu{position:absolute;top:calc(100% + 6px);right:0;z-index:60;background:var(--bt-card);
  border:1px solid var(--bt-line);border-radius:var(--bt-r-9);box-shadow:0 10px 28px rgba(20,30,50,.14);
  padding:6px;display:flex;flex-direction:column;gap:3px;min-width:190px;}
.proj-status__opt{background:none;border:none;text-align:left;padding:5px;border-radius:var(--bt-r-7);cursor:pointer;}
.proj-status__opt:hover{background:var(--bt-row-active);}
.proj-status__opt .bt-badge{cursor:pointer;}

/* інлайн-редагування реквізитів об'єкта (у розгорнутій картці списку) */
.obj-edit-form{background:var(--bt-card);border:1px solid var(--bt-blue-border);border-radius:var(--bt-r-fin);
  padding:14px 16px;margin-bottom:16px;box-shadow:0 4px 16px rgba(47,107,255,.06);}
.obj-edit__head{display:flex;align-items:center;justify-content:space-between;margin-bottom:14px;}
.obj-edit__title{display:flex;align-items:center;gap:8px;font:800 11px/1 var(--bt-font);letter-spacing:.05em;
  text-transform:uppercase;color:var(--bt-blue);}
.obj-edit__title i,.obj-edit__title svg{width:14px;height:14px;}
.obj-edit__grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:12px;}
.obj-edit__actions{display:flex;align-items:center;justify-content:flex-end;gap:10px;margin-top:14px;}
/* заміна фото об'єкта в режимі редагування */
.obj-edit__photo{display:flex;align-items:center;gap:14px;margin-bottom:14px;}
.obj-edit__thumb{width:64px;height:52px;flex:none;border-radius:var(--bt-r-9);background-size:cover;
  background-position:center;background-color:var(--bt-row-active);border:1px solid var(--bt-line);}
.obj-edit__photoact{display:flex;flex-direction:column;align-items:flex-start;gap:5px;}
.obj-photo-label{height:34px;padding:0 12px;cursor:pointer;}
.obj-photo-label i,.obj-photo-label svg{width:15px;height:15px;}
.obj-edit__photohint{font:500 11px/1 var(--bt-font);color:var(--bt-gray);}
@media (max-width:760px){ .obj-edit__grid{grid-template-columns:1fr;} }

/* транзакції проекту (Витрати по фондах) — новий стиль */
.proj-tx-list{background:var(--bt-card);border:1px solid var(--bt-line);border-radius:var(--bt-r-card-sm);padding:2px 16px;box-shadow:var(--bt-sh-raise);}
.proj-tx{display:flex;align-items:center;gap:13px;padding:13px 2px;border-bottom:1px solid var(--bt-line);}
.proj-tx:last-child{border-bottom:none;}
.proj-tx__dot{width:30px;height:30px;border-radius:9px;display:flex;align-items:center;justify-content:center;flex:none;background:var(--bt-gray);}
.proj-tx__dot i,.proj-tx__dot svg{width:14px;height:14px;color:#fff;}
.proj-tx__dot--income{background:var(--bt-green);}
.proj-tx__dot--expense{background:var(--bt-coral);}
.proj-tx__dot--profit{background:var(--bt-blue);}
.proj-tx__main{flex:1;min-width:0;}
.proj-tx__amt{font:800 14px/1.1 var(--bt-font);}
.proj-tx__fund{font:700 12px/1.3 var(--bt-font);color:var(--bt-gray-d);margin-top:2px;}
.proj-tx__desc{font:400 11px/1.35 var(--bt-font);color:var(--bt-gray);margin-top:2px;}
.proj-tx__meta{text-align:right;flex:none;}
.proj-tx__meta div{font:400 11px/1.4 var(--bt-font);color:var(--bt-gray);}
.proj-tx__meta .proj-tx__date{font-weight:700;color:var(--bt-gray-d);}
.proj-tx__act{display:none;align-items:center;gap:4px;flex:none;}
body.proj-editing .proj-tx__act{display:flex;}
.proj-tx__act .bt-iconbtn{width:30px;height:30px;}
.proj-tx__act .bt-iconbtn i,.proj-tx__act .bt-iconbtn svg{width:15px;height:15px;}
.proj-tx__act form{margin:0;}
.proj-tx-empty{padding:24px;text-align:center;color:var(--bt-gray);font:500 13px/1.4 var(--bt-font);}

/* =====================================================================
   11 · КАРТКА ЗАДАЧІ ТА БЛОКИ КАЛЕНДАРЯ (сторінка «Задачі», ще не збудована)
   Бек-лог: картка draggable у панелі «Задачі для розподілу», перетягується
   у тижневу сітку. Блоки в сітці — напівпрозорі, без лівої акцентної риски:
   подія Google Calendar — нейтральна сіра, задача — зелений тінт,
   перевантаження (факт > план) — кораловий. Підсумок дня показує лише
   «Вільний час» (мінус — кораловим, фон комірки не фарбується).
   ===================================================================== */
.bt-task-panel{background:var(--bt-bg);border-radius:var(--bt-r-card);padding:16px;
  display:flex;flex-direction:column;gap:10px;}
.bt-task-card{max-width:236px;background:var(--bt-card);border:1px solid #DCDFE4;
  border-radius:var(--bt-r-fin);padding:10px 11px;box-shadow:0 1px 2px rgba(20,30,50,.05);cursor:grab;}
.bt-task-card.is-dragging{opacity:.45;cursor:grabbing;}
.bt-task-card__top{display:flex;align-items:center;justify-content:space-between;margin-bottom:7px;gap:8px;}
.bt-task-card__time{display:inline-flex;align-items:center;gap:4px;height:21px;padding:0 7px;
  background:#F4F5F7;border-radius:var(--bt-r-6);font:700 11px/1 var(--bt-font);color:var(--bt-gray-d);}
.bt-task-card__time i,.bt-task-card__time svg{width:12px;height:12px;color:var(--bt-gray);}
.bt-task-card__code{font:700 11px/1 var(--bt-font);color:var(--bt-gray);}
.bt-task-card__title{font:600 12.5px/1.3 var(--bt-font);color:var(--bt-ink);margin-bottom:8px;}
.bt-task-card__product{display:flex;align-items:center;gap:6px;padding-top:8px;
  border-top:1px solid var(--bt-line);font:500 11px/1.3 var(--bt-font);color:var(--bt-gray-d);}

/* сітка тижня — тонкі горизонтальні смуги годин під блоками */
.bt-cal-grid{display:flex;gap:12px;border:1px solid var(--bt-line);border-radius:var(--bt-r-card);padding:12px;
  background-image:repeating-linear-gradient(to bottom,#fff 0,#fff 27px,#F0F2F4 27px,#F0F2F4 28px);}
.bt-cal-block{flex:1;border-radius:var(--bt-r-7);padding:6px 9px;}
.bt-cal-block--busy{background:rgba(244,245,247,.72);border:1px solid rgba(236,238,241,.6);}
.bt-cal-block--task{background:rgba(233,243,205,.74);border:1px solid rgba(162,197,32,.34);}
.bt-cal-block--over{background:rgba(251,234,234,.78);border:1px solid rgba(237,139,139,.32);}
.bt-cal-block__title{font:600 12px/1.25 var(--bt-font);color:var(--bt-ink);}
.bt-cal-block--busy .bt-cal-block__title{font-weight:500;color:var(--bt-gray-d);}
.bt-cal-block__time{font:500 10.5px/1.2 var(--bt-font);color:var(--bt-gray);margin-top:2px;}
.bt-cal-block__meta{font:600 10px/1.2 var(--bt-font);color:var(--bt-gray-d);margin-top:3px;}
.bt-cal-block--over .bt-cal-block__meta{color:var(--bt-coral);}

/* підсумок дня — рядок Σ, лише «Вільний час» */
.bt-day-summary{display:flex;border:1px solid var(--bt-line);border-radius:var(--bt-r-card);overflow:hidden;max-width:320px;}
.bt-day-summary__cell{flex:1;padding:14px 13px;}
.bt-day-summary__cell + .bt-day-summary__cell{border-left:1px solid var(--bt-line);}
.bt-day-summary__label{font:400 11px/1 var(--bt-font);color:var(--bt-gray);}
.bt-day-summary__value{font:800 13px/1 var(--bt-font);color:var(--bt-ink);margin-top:4px;}
.bt-day-summary__value--over{color:var(--bt-coral);}

/* =====================================================================
   12 · BOTTOM SHEET + TOAST (мобільні патерни за макетом «Об'єкти (Mobile)»)
   Шторка знизу: затемнення на весь екран, панель прилипає до низу.
   Керується bt-sheet.js (btSheet.open/close, btToast).
   ===================================================================== */
@keyframes btFadeIn{from{opacity:0;}to{opacity:1;}}
@keyframes btSheetIn{from{transform:translateY(100%);}to{transform:translateY(0);}}

.bt-sheet{position:fixed;inset:0;z-index:1200;background:rgba(20,28,44,.42);
  display:flex;align-items:flex-end;justify-content:center;animation:btFadeIn .18s ease;}
.bt-sheet[hidden]{display:none;}
.bt-sheet__panel{width:100%;max-width:560px;background:var(--bt-card);border-radius:18px 18px 0 0;
  box-shadow:0 -10px 40px rgba(20,30,50,.2);padding:18px 18px 24px;max-height:86vh;
  display:flex;flex-direction:column;animation:btSheetIn .22s cubic-bezier(.4,0,.2,1);
  font-family:var(--bt-font);color:var(--bt-ink);}
.bt-sheet__grab{width:38px;height:4px;border-radius:3px;background:#E4E6EA;margin:0 auto 14px;flex:none;}
.bt-sheet__title{font:800 17px/1.2 var(--bt-font);margin-bottom:14px;flex:none;}
.bt-sheet__scroll{flex:1;min-height:0;overflow-y:auto;margin:0 -6px;padding:0 6px;}
/* рядок-дія шторки: квадратик-іконка + назва (+ підпис) */
.bt-sheet-item{display:flex;align-items:center;gap:12px;padding:13px 11px;border-radius:11px;cursor:pointer;
  background:none;border:none;width:100%;text-align:left;font-family:var(--bt-font);}
.bt-sheet-item:hover{background:#F4F5F7;}
.bt-sheet-item--danger:hover{background:var(--bt-coral-tint);}
.bt-sheet-item__ico{width:38px;height:38px;border-radius:10px;background:var(--bt-blue-tint2);
  display:flex;align-items:center;justify-content:center;flex:none;}
.bt-sheet-item__ico i,.bt-sheet-item__ico svg{width:19px;height:19px;color:var(--bt-blue);}
.bt-sheet-item--danger .bt-sheet-item__ico{background:var(--bt-coral-tint);}
.bt-sheet-item--danger .bt-sheet-item__ico i,.bt-sheet-item--danger .bt-sheet-item__ico svg{color:var(--bt-coral);}
.bt-sheet-item__label{flex:1;min-width:0;font:700 14px/1.2 var(--bt-font);color:var(--bt-ink);}
.bt-sheet-item--danger .bt-sheet-item__label{color:var(--bt-coral);}
.bt-sheet-item__sub{display:block;font:400 11.5px/1.3 var(--bt-font);color:var(--bt-gray);margin-top:3px;}
/* пошук усередині шторки (вибір замовника) */
.bt-sheet__search{display:flex;align-items:center;gap:9px;border:1px solid var(--bt-line);border-radius:10px;
  padding:11px 12px;margin-bottom:8px;flex:none;}
.bt-sheet__search:focus-within{border-color:var(--bt-blue);}
.bt-sheet__search i,.bt-sheet__search svg{width:17px;height:17px;color:var(--bt-gray);flex:none;}
.bt-sheet__search input{flex:1;min-width:0;border:none;outline:none;background:transparent;
  font:500 16px/1 var(--bt-font);color:var(--bt-ink);}
/* рядок списку вибору (замовник) */
.bt-sheet-row{display:flex;align-items:center;gap:11px;padding:13px 11px;border-radius:10px;cursor:pointer;
  background:none;border:none;width:100%;text-align:left;font-family:var(--bt-font);}
.bt-sheet-row:hover{background:#F4F5F7;}
.bt-sheet-row.is-selected{background:var(--bt-blue-tint);}
.bt-sheet-row i,.bt-sheet-row svg{width:17px;height:17px;color:var(--bt-gray);flex:none;}
.bt-sheet-row__label{flex:1;min-width:0;font:500 13.5px/1.3 var(--bt-font);color:var(--bt-ink);
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.bt-sheet-row .bt-sheet-row__check{color:var(--bt-blue);}
.bt-sheet-row--create .bt-sheet-row__label{color:var(--bt-blue);font-weight:700;}
.bt-sheet-row--create .bt-sheet-row__plus{width:26px;height:26px;border-radius:7px;background:var(--bt-blue-tint2);
  display:flex;align-items:center;justify-content:center;flex:none;}
.bt-sheet-row--create .bt-sheet-row__plus i,.bt-sheet-row--create .bt-sheet-row__plus svg{width:15px;height:15px;color:var(--bt-blue);}
.bt-sheet-empty{text-align:center;padding:26px 10px;font:500 13px/1.4 var(--bt-font);color:var(--bt-gray);}

/* тост унизу по центру */
.bt-toast{position:fixed;left:50%;bottom:28px;transform:translateX(-50%) translateY(16px);z-index:1400;
  background:var(--bt-ink);color:#fff;border-radius:11px;padding:11px 16px;
  font:600 12.5px/1.3 var(--bt-font);box-shadow:0 12px 34px rgba(20,30,50,.28);white-space:nowrap;
  opacity:0;visibility:hidden;transition:opacity .18s ease,transform .18s ease,visibility .18s;}
.bt-toast.is-visible{opacity:1;visibility:visible;transform:translateX(-50%) translateY(0);}

/* повноекранне прев'ю зображення (документи проекту, мобайл) */
.bt-filepreview{position:fixed;inset:0;z-index:1250;background:#F6F7F9;display:flex;flex-direction:column;
  animation:btFadeIn .16s ease;font-family:var(--bt-font);}
.bt-filepreview[hidden]{display:none;}
.bt-filepreview__bar{flex:none;height:56px;display:flex;align-items:center;gap:11px;padding:0 12px;
  background:var(--bt-card);border-bottom:1px solid var(--bt-line);}
.bt-filepreview__close{width:38px;height:38px;border-radius:10px;display:flex;align-items:center;justify-content:center;
  cursor:pointer;background:none;border:none;flex:none;}
.bt-filepreview__close:hover{background:#F4F5F7;}
.bt-filepreview__close i,.bt-filepreview__close svg{width:21px;height:21px;color:var(--bt-ink);}
.bt-filepreview__name{flex:1;min-width:0;font:700 14px/1.15 var(--bt-font);color:var(--bt-ink);
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.bt-filepreview__body{flex:1;min-height:0;overflow:auto;padding:18px 16px 28px;}
.bt-filepreview__body img{display:block;width:100%;border:1px solid var(--bt-line);border-radius:14px;background:#fff;}

/* =====================================================================
   13 · МОБІЛЬНИЙ СПИСОК ОБ'ЄКТІВ + ОКРЕМА СТОРІНКА ОБ'ЄКТА (.eob-*)
   Макет: «Baust ERP — Об'єкти (Mobile)». На ≤860px рядок списку стає
   компактною карткою (фото · шифр+назва/замовник · шеврон →) і веде на
   окрему сторінку entity.show (перехід робить JS у entities/index).
   ===================================================================== */
@media (max-width:860px){
  .obj-row__status,.obj-row__nums{display:none;}
  .obj-row{grid-template-columns:52px minmax(0,1fr) 19px;gap:13px;padding:12px 14px;}
  .obj-row__thumb{width:52px;height:52px;border-radius:10px;grid-row:1;grid-column:1;}
  .obj-row__title{font-size:15px;}
  .obj-row__client{font-size:13px;}
  /* шеврон «праворуч» (перехід на сторінку), а не «вниз» (акордеон) */
  .obj-row__chev i,.obj-row__chev svg{transform:rotate(-90deg);}
  .obj-card{border-radius:13px;}
}

/* сторінка об'єкта */
.eob-wrap{max-width:640px;margin:0 auto;padding:14px 14px 40px;font-family:var(--bt-font);color:var(--bt-ink);
  font-variant-numeric:tabular-nums;}
/* єдина картка: шапка (фото·назва·замовник·статус) + розділювач + фін-бари */
.eob-card{background:var(--bt-card);border:1px solid var(--bt-line);border-radius:var(--bt-r-card-sm);
  overflow:hidden;box-shadow:var(--bt-sh-raise);margin-bottom:14px;}
.eob-page.is-editing .eob-card{border-color:var(--bt-blue-border);box-shadow:0 4px 16px rgba(47,107,255,.06);}
.eob-card__head{display:flex;align-items:flex-start;gap:13px;padding:13px 15px;}
.eob-card__thumb{width:56px;height:56px;border-radius:11px;background:#ECEEF1 center/cover no-repeat;flex:none;position:relative;overflow:hidden;}
.eob-card__main{flex:1;min-width:0;}
.eob-card__title{font:800 16px/1.2 var(--bt-font);letter-spacing:-.01em;}
.eob-card__client{font:500 13px/1.3 var(--bt-font);color:var(--bt-gray-d);margin-top:4px;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.eob-card__status{margin-top:8px;}
.eob-card__div{height:1px;background:var(--bt-line);margin:0 15px;}
/* фін-бари всередині картки — без власної рамки-«блока в блоці» */
.eob-card .obj-bars{border:none;border-radius:0;box-shadow:none;margin-bottom:0;padding:16px;}

/* редагування (вмикається класом .is-editing на .eob-page) */
.eob-view{display:block;}
.eob-edit{display:none;}
.eob-page.is-editing .eob-view{display:none;}
.eob-page.is-editing .eob-edit{display:block;}
.eob-edit-fields{display:flex;flex-direction:column;gap:8px;}
.eob-edit-fields .eob-row2{display:flex;gap:8px;}
.eob-edit-fields .eob-code{flex:0 0 38%;min-width:0;font-weight:800;}
.eob-edit-fields .eob-name{flex:1;min-width:0;font-weight:700;}
.eob-label{font:700 9.5px/1 var(--bt-font);letter-spacing:.05em;text-transform:uppercase;color:var(--bt-gray);margin-bottom:6px;}
.eob-hint{font:400 11px/1.4 var(--bt-font);color:var(--bt-gray);margin-top:6px;}
/* кнопка-«селект» замовника, відкриває шторку вибору */
.eob-clientbtn{width:100%;display:flex;align-items:center;gap:10px;border:1px solid var(--bt-line);
  border-radius:var(--bt-r-input);padding:10px 11px;cursor:pointer;background:var(--bt-card);font-family:var(--bt-font);}
.eob-clientbtn:hover{border-color:var(--bt-blue);}
.eob-clientbtn i,.eob-clientbtn svg{width:16px;height:16px;color:var(--bt-gray);flex:none;}
.eob-clientbtn span{flex:1;min-width:0;font:500 13px/1.2 var(--bt-font);color:var(--bt-ink);text-align:left;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
/* фото в режимі редагування: оверлей-камера / пунктирний плейсхолдер */
.eob-photo-overlay{position:absolute;inset:0;background:rgba(20,28,44,.46);display:flex;align-items:center;justify-content:center;}
.eob-photo-overlay i,.eob-photo-overlay svg{width:19px;height:19px;color:#fff;}
.eob-photo-empty{width:100%;height:100%;border:1.5px dashed var(--bt-dashed);border-radius:11px;background:#F4F5F7;
  display:flex;align-items:center;justify-content:center;}
.eob-photo-empty i,.eob-photo-empty svg{width:19px;height:19px;color:var(--bt-gray);}

/* блок проектів на сторінці об'єкта */
.eob-projhead{display:flex;align-items:center;justify-content:space-between;gap:10px;margin:2px 0 13px;padding:0 2px;}
.eob-projhead__t{font:800 13px/1 var(--bt-font);letter-spacing:.02em;padding-left:8px;}
.eob-addbtn{display:none;align-items:center;gap:8px;border:1px solid var(--bt-line);border-radius:10px;
  padding:11px 18px;font:700 13.5px/1 var(--bt-font);color:var(--bt-blue);cursor:pointer;background:var(--bt-card);}
.eob-addbtn:hover{background:var(--bt-blue-tint);border-color:var(--bt-blue);}
.eob-addbtn i,.eob-addbtn svg{width:17px;height:17px;}
.eob-page.is-editing .eob-addbtn{display:flex;}
.eob-projlist{display:flex;flex-direction:column;gap:9px;}
.eob-proj{display:block;background:var(--bt-card);border:1px solid var(--bt-line);border-radius:13px;
  padding:14px 15px;cursor:pointer;box-shadow:var(--bt-sh-raise);text-decoration:none;color:inherit;
  transition:background .12s ease,border-color .12s ease;}
.eob-proj:hover{background:#FAFBFC;border-color:var(--bt-blue-border);color:inherit;text-decoration:none;}
.eob-proj__head{display:flex;align-items:center;gap:12px;margin-bottom:13px;}
.eob-proj__main{flex:1;min-width:0;}
.eob-proj__title{font:800 14px/1.2 var(--bt-font);letter-spacing:-.01em;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.eob-proj__status{margin-top:6px;}
.eob-proj__head i,.eob-proj__head svg{width:18px;height:18px;color:var(--bt-gray);flex:none;}
.eob-proj__mets{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;border-top:1px solid #F4F5F7;padding-top:12px;}
.eob-met__lbl{font:700 8.5px/1.2 var(--bt-font);letter-spacing:.05em;text-transform:uppercase;color:var(--bt-gray);}
.eob-met__val{font:800 14px/1.2 var(--bt-font);margin-top:4px;white-space:nowrap;}
.eob-met__sub{font:400 10px/1.2 var(--bt-font);color:var(--bt-gray);margin-top:2px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.eob-empty{background:var(--bt-card);border:1px dashed var(--bt-line);border-radius:12px;padding:18px;
  text-align:center;color:var(--bt-gray);font:500 13px/1.4 var(--bt-font);}

/* =====================================================================
   14 · СТОРІНКА ПРОЕКТУ — мобільна адаптація + перекомпонована картка
   редагування фінансів (за макетом; діє і на десктопі)
   ===================================================================== */
/* фін-бари ховаються в режимі редагування (менше шуму, фокус на полях) */
body.proj-editing .proj-bars{display:none;}

/* на мобільному шапка + бари зливаються в одну картку з розділювачем.
   УВАГА: мобільний стиль .obj-bars зі списку об'єктів (border:none, padding 4px…)
   у цьому ж @media перебивав фін-блок сторінки проекту — тому .proj-bars нижче
   задає повний вигляд явно (фон, бокові рамки, низ із заокругленням, відступи). */
@media (max-width:860px){
  .proj-head-card{border-radius:14px 14px 0 0;border-bottom:none;padding:13px 15px;
    box-shadow:none;}   /* тінь шапки падала на фін-блок і малювала «край» на стику */
  .proj-head__thumb{width:52px;height:52px;}
  .proj-head__title{font-size:16px;}
  .proj-head__sub{font-size:13px;}
  .proj-bars{margin-top:0 !important;background:var(--bt-card);
    border:1px solid var(--bt-line);border-top:none;border-bottom:1px solid var(--bt-line);
    border-radius:0 0 14px 14px;padding:20px 16px 18px;box-shadow:var(--bt-sh-raise);
    position:relative;}
  .proj-bars::before{content:'';position:absolute;top:0;left:15px;right:15px;height:1px;background:var(--bt-line);}
  body.proj-editing .proj-head-card{border-radius:14px;border-bottom:1px solid var(--bt-blue-border);
    border-color:var(--bt-blue-border);box-shadow:var(--bt-sh-raise);}
  .project_show .container.narrow{padding-top:14px;}

  /* хлібні крихти — ОДИН рядок зі скролом убік (як у макеті): нічого не переноситься
     і не обрізається; якщо не влазить — рядок прокручується, JS докручує вправо,
     щоб було видно поточну сторінку (останню крихту) */
  .bt-crumbbar--intop{flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none;
    -webkit-overflow-scrolling:touch;}
  .bt-crumbbar--intop::-webkit-scrollbar{display:none;}
  .bt-crumbbar--intop a,.bt-crumbbar--intop .cur,
  .bt-crumbbar--intop > i,.bt-crumbbar--intop > svg{flex:none;white-space:nowrap;}
  .bt-crumbbar--intop .cur{overflow:visible;text-overflow:clip;}
}

/* сегментний перемикач валюти проекту */
.proj-cur-seg{display:flex;gap:4px;background:#F4F5F7;border-radius:10px;padding:3px;max-width:440px;}
.proj-cur-seg__opt{flex:1;display:flex;align-items:center;justify-content:center;height:36px;border-radius:8px;
  cursor:pointer;font:700 12px/1 var(--bt-font);color:var(--bt-gray-d);border:none;background:none;}
.proj-cur-seg__opt.is-active{background:var(--bt-green-seg);color:var(--bt-ink);}

/* перекомпонована картка редагування: вертикальний стек полів (як у макеті) */
.proj-edit__stack{display:flex;flex-direction:column;gap:16px;max-width:440px;}
.proj-edit__stack .bt-input{text-align:right;width:100%;}
.proj-edit__fieldhead{display:flex;align-items:center;justify-content:space-between;margin-bottom:7px;}
.proj-edit__fieldhead .bt-label{margin-bottom:0;}
.proj-edit__fundlink{display:flex;align-items:center;gap:5px;cursor:pointer;font:700 10px/1 var(--bt-font);
  color:var(--bt-blue);background:none;border:none;padding:0;}
.proj-edit__fundlink i,.proj-edit__fundlink svg{width:13px;height:13px;}
.proj-edit__div{height:1px;background:var(--bt-line);margin:4px 0;}
/* факс-«селект», якого ще нема на бекенді: виглядає як селект, тап → тост «в розробці» */
.proj-edit__fakeselect{width:100%;display:flex;align-items:center;justify-content:space-between;gap:10px;
  border:1px solid var(--bt-line);border-radius:var(--bt-r-input);padding:11px;cursor:pointer;
  background:var(--bt-card);font:600 13px/1 var(--bt-font);color:var(--bt-gray);}
.proj-edit__fakeselect i,.proj-edit__fakeselect svg{width:15px;height:15px;color:var(--bt-gray);flex:none;}

/* індикатори юросіб у шапці проекту (перегляд): іконка + тап-тултіп */
.proj-ent{display:flex;align-items:center;gap:6px;margin-top:5px;min-width:0;}
.proj-ent .proj-head__sub{margin-top:0;}
.proj-ent__chip{width:21px;height:21px;flex:none;display:flex;align-items:center;justify-content:center;
  border-radius:6px;cursor:pointer;color:var(--bt-gray);position:relative;background:none;border:none;}
.proj-ent__chip:hover{background:#F4F5F7;color:var(--bt-blue);}
.proj-ent__chip i,.proj-ent__chip svg{width:14px;height:14px;}
/* тултіп: довгі назви юросіб переносяться (max-width), а горизонтальну позицію
   підтискає JS (projEntShowTip), щоб підказка ніколи не вилазила за край вікна */
.proj-ent__tip{position:absolute;top:25px;left:0;z-index:70;background:var(--bt-ink);color:#fff;border-radius:8px;
  padding:7px 10px;font:600 11px/1.3 var(--bt-font);white-space:normal;width:max-content;max-width:min(300px,calc(100vw - 24px));
  box-shadow:0 8px 24px rgba(20,30,50,.24);display:none;}
.proj-ent__chip.is-open .proj-ent__tip{display:block;}

/* мобільні документи проекту (рендеряться JS'ом у documents.blade) */
/* контейнер — bootstrap-grid 1fr: без minmax(0,…) довга nowrap-назва розпирає
   рядок ширше екрана і «⋮» їде за край */
.documents-cards{grid-template-columns:minmax(0,1fr) !important;}
.btdoc-row{display:flex;align-items:center;gap:12px;padding:10px 0;border-bottom:1px solid #F4F5F7;cursor:pointer;min-width:0;}
.btdoc-row:last-child{border-bottom:none;}
.btdoc-row__tile{width:38px;height:46px;border-radius:9px;flex:none;display:flex;align-items:center;justify-content:center;overflow:hidden;}
.btdoc-row__main{flex:1;min-width:0;}
.btdoc-row__name{font:500 13.5px/1.2 var(--bt-font);color:var(--bt-ink);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.btdoc-row__meta{font:400 11px/1.3 var(--bt-font);color:var(--bt-gray);margin-top:4px;}
.btdoc-row__more{width:34px;height:34px;border-radius:9px;display:flex;align-items:center;justify-content:center;
  flex:none;cursor:pointer;background:none;border:none;}
.btdoc-row__more:hover{background:#F4F5F7;}
.btdoc-row__more i,.btdoc-row__more svg{width:18px;height:18px;color:var(--bt-gray);}
.btdoc-badge{position:relative;width:30px;height:37px;}
.btdoc-badge__txt{position:absolute;left:0;right:0;top:14px;height:12px;display:flex;align-items:center;justify-content:center;
  font:800 7.5px var(--bt-font);color:#fff;letter-spacing:.2px;}

/* ── Іконки типів транзакцій (ЄДИНІ для всіх екранів) ──────────────────────
   Джерело: макет «Baust ERP - Іконки транзакцій». Круглий ЗАЛИТИЙ бейдж,
   білий гліф Lucide (лінія 1.25 абсолютна). Іконки за типами:
   дохід plus · витрата minus · обмін/переказ arrow-right-left ·
   дивіденд arrow-down · не розпізнано help-circle (нейтральний тінт).
   Базовий розмір 28px (списки/фіди), --lg 56px (герої/деталі). */
.bt-txico{width:28px;height:28px;border-radius:50%;flex:none;display:inline-flex;
  align-items:center;justify-content:center;background:#F2F4F6;color:#fff;}
.bt-txico i,.bt-txico svg{width:13px;height:13px;}
.bt-txico svg *{vector-effect:non-scaling-stroke;} /* 1.25px лінія незалежно від масштабу */
.bt-txico--income{background:var(--bt-green);}
.bt-txico--expense{background:var(--bt-coral);}
.bt-txico--dividend{background:var(--bt-blue);}
.bt-txico--transfer{background:var(--bt-gray-d);}
.bt-txico--unknown{background:#F2F4F6;color:var(--bt-gray);}
.bt-txico--lg{width:56px;height:56px;}
.bt-txico--lg i,.bt-txico--lg svg{width:23px;height:23px;}