.navbar-brand-logo img {width:46px;}
/* Изходът е последен в лентата. Лентата е flex колона с височина 100%,
   затова „Приложение", „Сайт" и изходът се долепят до долния край чрез
   .mt-auto на разделителя преди тях (идиомът на NexLink), а не с absolute —
   иначе четирите таба отгоре биха се припокрили с изхода. */
.app-navbar-tabs .nav-item.logout-icon {margin-bottom: 4px;}
aside.cms .app-navbar-brand, aside.cms .app-navbar-tabs {background:#534fcd}
/* Иконният таб-бар на CMS е лилав: иконите в покой са бели. Само в покой —
   hover/focus/active остават на правилото на NexLink
   (.app-navbar-tabs .nav-item .menu-link:hover i → var(--bs-secondary) върху var(--bs-light)).
   Без :not() това правило е по-специфично от това на NexLink и иконата остава
   бяла върху светлия hover фон. */
aside.cms .app-navbar-tabs .nav-item .menu-link:not(.active):not(:hover):not(:focus) > i {color:#fff;}
.clr-light {color:#fff!important;}
a.logo-mob img  {width: 120px;position: absolute;left: 50px;top: 22px;}
/* Светла тема: съдържанието (.app-wrapper) е #FAF9FF със заоблен ляв край,
   подменюто, хедърът и фонът около тях са светли (#FDFDFF — фонът от NexLink),
   футърът остава бял (bg-body). Хедърът е без долна рамка, футърът — без горна.
   Фонът е на .app-wrapper, не на body — иначе заоблянето не се вижда.
   Тъмната тема остава както е в темплейта. */
html:not([data-bs-theme=dark]) {--lx-wrapper-bg: #FAF9FF; --lx-submenu-bg: #FDFDFF;}
html:not([data-bs-theme=dark]) .app-wrapper {background-color: var(--lx-wrapper-bg);}
html:not([data-bs-theme=dark]) .app-menubar-tabs .app-tab-content {background-color: var(--lx-submenu-bg);}
html:not([data-bs-theme=dark]) .app-header {border-bottom: 0;}
html:not([data-bs-theme=dark]) .footer-wrapper {border-top: 0;}
/* заобляне само докато подменюто е отворено до съдържанието: над 1480px и не в режим mini/mini-hover
   (под 1480px подменюто е скрито и излиза само като наслагване — там без заобляне) */
@media (min-width: 1481px) {
	html:not([data-bs-theme=dark]):not([data-app-sidebar=mini]):not([data-app-sidebar=mini-hover]) .app-wrapper {border-radius: var(--bs-border-radius-xl) 0 0 var(--bs-border-radius-xl);}
}
@media (min-width: 768px){
    a.logo-mob img  {display:none;}
}

/* ——— bootstrap-select като ПОЛЕ във форма (doc 17 §5а) ———
   В NexLink bootstrap-select е само малък бутон-филтър (finance.php) и
   _dropdown.scss му дава width:auto !important. Във формите select-ът носеше
   .form-select: обвивката ставаше поле с рамка и стрелка, а вътре стоеше
   вторият бутон — „селект в селекта". Сега select-ът носи .lx-field
   (bootstrap-select пренася класа на обвивката), а бутонът приема стойностите
   на .form-select на NexLink: фон, рамка, радиус, отстъпи, стрелка.
   Тук, не в SCSS: в проекта няма компилатор на SCSS (няма package.json). */
.bootstrap-select.lx-field {width: 100% !important; min-width: 0;}
.d-flex > .bootstrap-select.lx-field {flex: 1 1 0;}
.bootstrap-select.lx-field > .dropdown-toggle {
    --bs-btn-bg: var(--bs-secondary-bg);
    --bs-btn-hover-bg: var(--bs-secondary-bg);
    --bs-btn-active-bg: var(--bs-secondary-bg);
    --bs-btn-border-color: var(--bs-border-color);
    --bs-btn-hover-border-color: var(--bs-border-color);
    --bs-btn-active-border-color: var(--bs-border-color);
    --bs-btn-color: var(--bs-body-color);
    --bs-btn-hover-color: var(--bs-body-color);
    --bs-btn-active-color: var(--bs-body-color);
    --bs-btn-border-radius: var(--bs-border-radius);
    --bs-btn-line-height: 1.6;
    --bs-btn-box-shadow: none;
    /* същата стрелка като .form-select (--bs-form-select-bg-img на Bootstrap) */
    --lx-select-chevron: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3e%3cpath fill='none' stroke='%23343a40' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='m2 5 6 6 6-6'/%3e%3c/svg%3e");
    padding-right: 3.6rem;
    background-image: var(--lx-select-chevron);
    background-repeat: no-repeat;
    background-position: right 1.2rem center;
    background-size: 16px 12px;
}
[data-bs-theme=dark] .bootstrap-select.lx-field > .dropdown-toggle {
    --lx-select-chevron: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3e%3cpath fill='none' stroke='%23dee2e6' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='m2 5 6 6 6-6'/%3e%3c/svg%3e");
}
/* стрелката е фонът, както при .form-select — без втората от .dropdown-toggle::after */
.bootstrap-select.lx-field > .dropdown-toggle::after {display: none;}
/* „— изберете —" в цвета на останалите полета ($input-placeholder-color), не #999 */
.bootstrap-select.lx-field > .dropdown-toggle.bs-placeholder {color: var(--bs-body-color);}
/* фокус и отворено — като .form-select:focus на NexLink ($input-focus-*) */
.bootstrap-select.lx-field > .dropdown-toggle:focus,
.bootstrap-select.lx-field.show > .dropdown-toggle {
    border-color: var(--bs-primary);
    box-shadow: 0 .1rem .3rem 0 rgba(var(--bs-primary-rgb), .2), 0 0 0 1px var(--bs-primary);
    outline: 0 !important;
}
/* ——— карта „Документи" (doc 17 §5а) ———
   Картите са тези на /sazdadeni-dokumenti (bg-light, avatar, h6 + ред отдолу).
   „За качване" е същата форма, приглушена и с пунктира на зоната — от
   класовете border-dashed opacity-75 в JS; тук е само лентата за прогреса. */
.lx-att-pending {background: var(--bs-body-bg); position: relative; overflow: hidden;}
.lx-att-bar {position: absolute; left: 0; right: 0; bottom: 0; height: 3px; background: var(--bs-border-color);}
.lx-att-bar > span {display: block; height: 100%; width: 0; background: var(--bs-primary); transition: width .15s linear;}
[role=button].lx-att-preview, [role=button].doc-preview-trigger {cursor: pointer;}
/* прегледът в модала на документите: PDF и текст в рамка, на белия лист */
.lx-att-frame {display: block; width: 100%; height: 75vh; border: 0; background: #fff; box-shadow: 0 2px 14px rgba(0,0,0,.22);}
.lx-att-img {max-width: 100%; max-height: 75vh; background: #fff; box-shadow: 0 2px 14px rgba(0,0,0,.22);}
.doc-preview-content.lx-att-none {min-height: 0; text-align: center;}

/* грешка — рамката като .form-select.is-invalid */
.bootstrap-select.lx-field.is-invalid > .dropdown-toggle {border-color: var(--bs-form-invalid-border-color);}
/* ред „друга страна" в делото: колоната на Bootstrap (.col) няма min-width: 0 и дълго
   име в bootstrap-select я разпъваше — „×" падаше на отделен ред на 400 px (10.09.2026) */
.lx-party > .col {min-width: 0;}

/* ——— дъската на задачите (elements/task-board.php, assets/js/lexgo.board.js) ———
   Каркасът и цветовете са на NexLink (task-management.php, .action-border-*);
   тук е само това, което шаблонът няма. */
.lx-drop {min-height: 3.5rem;}				/* празна колона пак приема пускане */
/* приоритетът — лента в левия ръб. .action-border-* на NexLink е САМО рамка при
   посочване (hover), не постоянна лента — затова лентата е тук, в същия цвят.
   Висок = primary, Спешен = dark; Нормален и Нисък — без лента. Не червено. */
.lx-task.action-border-primary {border-left: 3px solid var(--bs-primary);}
.lx-task.action-border-dark {border-left: 3px solid var(--bs-dark);}
.lx-ghost {opacity: .35;}
/* „без движение" — тих знак, който се усилва с времето; никога червен
   (червеното е само за просрочено) */
.lx-stale-1 {color: var(--bs-secondary-color);}
.lx-stale-2 {color: var(--bs-body-color); font-weight: 600;}
.lx-stale-3 {color: var(--bs-body-color); font-weight: 600; background: var(--bs-secondary-bg); border-radius: var(--bs-border-radius-sm); padding: 0 .35rem;}
.lx-lane.lx-collapsed .lx-lane-body {display: none;}
.lx-lane .lx-chevron {transition: transform .15s ease;}
.lx-lane.lx-collapsed .lx-chevron {transform: rotate(-90deg);}
/* телефон: една колона на дъската — тази от таба (data-mtab), О67 */
@media (max-width: 767.98px) {
    .lx-board[data-mtab="10"] .lx-colwrap:not([data-status="10"]),
    .lx-board[data-mtab="20"] .lx-colwrap:not([data-status="20"]),
    .lx-board[data-mtab="30"] .lx-colwrap:not([data-status="30"]),
    .lx-board[data-mtab="40"] .lx-colwrap:not([data-status="40"]) {display: none;}
}
.lx-progress {height: 4px;}					/* напредъкът по чеклиста — на картата и в хъба */

/* ——— Финансов преглед (Етап 8): цветовете на графиките — ЕДНО място, за графиката и за таблицата ———
   Графиките (lexgo.finance.js) четат тези променливи и се рисуват наново при смяна на темата.
   Б2: подредената скала (давността) — един цвят, светъл → тъмен: основният цвят на темата с
       прозрачност, както поничката на шаблона (leads.js: 0.09 / 0.2 / 0.5 / 0.7 / 1).
   Б3/Б4: адвокатите — до 4 цвята със значение, по мястото на човека сред всички (Finance::colorOf),
       петият нататък и „Без казус" — неутрален (c0).
   Б5: тъмната тема е ОТДЕЛЕН подбор от същите скали, не обръщане: скалата започва по-плътно (на тъмен
       фон 10% не се вижда), цветовете са изсветлени тонове на същите (+15–25%); вторичният цвят на
       NexLink в тъмна тема е негов (#b9c2da).
   Б6: статусните цветове — червено (просрочено, анулирано), зелено (платено), кехлибарено (частично)
       и тъмносиньото на черновата — не са серия.
   Цветовете са от палитрата на NexLink (_variables.scss, _color-palette.scss). */
:root {
    --lx-age-1: rgba(var(--bs-primary-rgb), .10); --lx-age-2: rgba(var(--bs-primary-rgb), .25); --lx-age-3: rgba(var(--bs-primary-rgb), .50);
    --lx-age-4: rgba(var(--bs-primary-rgb), .75); --lx-age-5: rgba(var(--bs-primary-rgb), 1);
    --lx-s-income: var(--bs-primary); --lx-s-invoiced: var(--bs-secondary); --lx-s-advance: #FD6A03; --lx-s-trust: var(--bs-info); --lx-s-collected: var(--bs-primary);
    --lx-c1: #9B59B6; --lx-c2: #FF7F50; --lx-c3: #7239EA; --lx-c4: #5A44BD; --lx-c0: #ADB5BD;
}
[data-bs-theme=dark] {
    --lx-age-1: rgba(var(--bs-primary-rgb), .30); --lx-age-2: rgba(var(--bs-primary-rgb), .45); --lx-age-3: rgba(var(--bs-primary-rgb), .60);
    --lx-age-4: rgba(var(--bs-primary-rgb), .80); --lx-age-5: rgba(var(--bs-primary-rgb), 1);
    --lx-s-income: #8380DC; --lx-s-advance: #FD8029; --lx-s-trust: #9446ED; --lx-s-collected: #8380DC;
    --lx-c1: #AF7AC5; --lx-c2: #FF9973; --lx-c3: #8E61EE; --lx-c4: #7B69CA; --lx-c0: #6C757D;
}
/* кръгчето в таблиците-близнаци и в легендите — същият цвят като в графиката */
.lx-dot {display: inline-block; width: .625rem; height: .625rem; border-radius: 50%; flex-shrink: 0; vertical-align: baseline;}
.lx-dot-age-1 {background: var(--lx-age-1);} .lx-dot-age-2 {background: var(--lx-age-2);} .lx-dot-age-3 {background: var(--lx-age-3);}
.lx-dot-age-4 {background: var(--lx-age-4);} .lx-dot-age-5 {background: var(--lx-age-5);}
/* скалата е прозрачност на един цвят — най-светлата степен се губи на бял фон; очертанието е като в графиката */
.lx-dot-age-1, .lx-dot-age-2, .lx-dot-age-3, .lx-dot-age-4, .lx-dot-age-5 {box-shadow: inset 0 0 0 1px var(--lx-age-5);}
.lx-dot-c0 {background: var(--lx-c0);} .lx-dot-c1 {background: var(--lx-c1);} .lx-dot-c2 {background: var(--lx-c2);} .lx-dot-c3 {background: var(--lx-c3);} .lx-dot-c4 {background: var(--lx-c4);}
.lx-dot-income {background: var(--lx-s-income);} .lx-dot-invoiced {background: var(--lx-s-invoiced);} .lx-dot-advance {background: var(--lx-s-advance);}
.lx-dot-trust {background: var(--lx-s-trust);} .lx-dot-collected {background: var(--lx-s-collected);}
/* графиката не прелива от картата на тесен екран (Apex дава на svg ширина в px) */
.lx-chart {min-height: 1px; max-width: 100%; overflow: hidden;}

/* ——— задачи на екипа (task.team.php) ——— */
.lx-person {cursor: pointer;}
.lx-person .lx-chevron {display: inline-block; transition: transform .15s ease;}
.lx-person.lx-open .lx-chevron {transform: rotate(90deg);}
.lx-person-tasks .lx-line:last-child {border-bottom: 0 !important;}
/* лентата „Прехвърли на…" остава видима при превъртане — под хедъра на обвивката (80px) */
.lx-bulk {position: sticky; top: 80px; z-index: 5; background: var(--bs-body-bg);}

/* ——— редове на фактурата (invoice.php, Финанси, Етап 2) ———
   На телефон всеки ред е с етикети (редът се пренася на три реда). На широк екран
   етикетите стоят само над първия ред — по-долу се скриват визуално (visually-hidden
   на Bootstrap), но остават за екранните четци и за label for. */
.lx-items .lx-row {border-bottom: 1px solid var(--bs-border-color); padding-bottom: .75rem;}
@media (min-width: 992px) {
	.lx-items .lx-row {border-bottom: 0; padding-bottom: 0;}
	.lx-items .lx-row + .lx-row .lx-item-lbl {position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important;}
}

/* ——— „Влизане като": лентата отгоре ———————————————————————————————————
   Лентата е ПЪРВО ДЕТЕ на `.app-wrapper` (вмъква се в public/index.php), затова
   НЯМА собствено правило за отместване — наследява колоната на съдържанието такава,
   каквато я прави темплейтът. Първият опит преписа `--app-sidebar-width` (250px), а
   лявата лента тук е `.app-menubar-tabs` = 320px — и се размина със 70px.
   Отместването идва от пет правила с три пречупвания; преписването им е обречено. */
.lx-imp-bar {
	position: sticky;
	top: var(--app-header-height, 80px);
	z-index: 8;					/* под хедъра (9), над съдържанието */
}
/* текстът да се свива, а не да избутва бутона извън лентата */
.lx-imp-bar > span { min-width: 0; }
/* на тясно: бутонът ПОД текста, не до него */
@media (max-width: 575.98px) {
	.lx-imp-bar {
		flex-direction: column;
		align-items: flex-start !important;
		gap: .5rem;
	}
}
