/* ═══════════════════════════════════════════════════════════════════════ СМУГА ПОПЕРЕДЖЕННЯ ПРО ТЕХНІЧНІ РОБОТИ. Навіщо. Досі єдиним каналом був дзвіночок: він опитується раз на 30 с і показує ЛІЧИЛЬНИК непрочитаних. Людина, що заповнює форму, його просто не бачить — а за дві хвилини сайт лягає, і незбережене зникає (розпорядження власника 23.09.2026 після розгортання о 10:30). Чому смуга ЗСУВАЄ каркас, а не лягає поверх. Топбар — `position: fixed`, сайдбар і `.crm-shell` мають висоту 100vh. Накладена смуга закрила б кнопки топбару. Тому поки вона видима, клас `has-maint` на зсуває каркас рівно на її висоту — і знімається разом із нею. Файл живе ПОЗА `platform/`: правити `platform/*.css` заборонено (CLAUDE.md §8), а тут потрібні саме перевизначення поверх них. ═══════════════════════════════════════════════════════════════════════ */ :root { --maint-h: 44px; } .crm-maint-bar { position: fixed; top: 0; left: 0; right: 0; height: var(--maint-h); z-index: 9998; /* нижче confirmDialog (9999) і підказок (10000) */ display: flex; align-items: center; gap: 12px; padding: 0 16px; background: var(--color-warning-bg, #fff4e5); border-bottom: max(1px, 0.5px) solid var(--color-warning, #d97706); color: var(--color-text, #1f2937); font-size: 14px; line-height: 1.3; } .crm-maint-bar[hidden] { display: none; } .crm-maint-ico { flex-shrink: 0; font-size: 16px; color: var(--color-warning, #d97706); } .crm-maint-text { flex: 1; min-width: 0; } .crm-maint-title { font-weight: 600; margin-right: 6px; } .crm-maint-body { opacity: .85; } .crm-maint-ok { flex-shrink: 0; } /* Каркас зсувається рівно на висоту смуги — лише поки вона показана. */ html.has-maint .crm-shell { height: calc(100vh - var(--maint-h)); margin-top: var(--maint-h); } html.has-maint .crm-sidebar { height: calc(100vh - var(--maint-h)); } html.has-maint .crm-topbar { top: calc(var(--tb-margin-x, 8px) + var(--maint-h)); } /* Вузький екран: текст переносимо, кнопку лишаємо праворуч. */ @media (max-width: 640px) { :root { --maint-h: 60px; } .crm-maint-bar { align-items: flex-start; padding-top: 8px; } .crm-maint-body { display: block; } } [data-bs-theme="dark"] .crm-maint-bar { background: var(--color-warning-bg, #3a2a10); color: var(--color-text, #e5e7eb); }