/* KMD Engineering Hub -- спільний шар інтерфейсу для всіх модулів (2026-11-04, аудит інтерфейсу, Ігор: «одна шапка, одна
   головна кнопка, телефон без обрізань»). Підключається ОСТАННІМ у <head> кожної сторінки -- поверх власних стилів модуля.
   Тут лише те, що має бути однаковим усюди; специфіка модуля лишається у його файлі. */

/* ---- Головна кнопка дії (п. 11): звичайний регістр, одна висота й вага -- «Розрахувати», «Згенерувати специфікацію»,
   «Розрахувати розкрій», «Розкласти плити» */
.calc-btn, .generate, #calculate-btn {
    text-transform: none !important;
    letter-spacing: 0 !important;
    font-weight: 700 !important;
    font-size: 15px !important;
    border-radius: 6px !important;
    min-height: 44px;
}

/* ---- Чіп об'єкта в шапці не стискається до «Без о…» -- поступається стан розрахунку (він має підказку) */
header.topbar .menu-strip .kmd-obj-chip { flex-shrink: 0; }
/* стан збереження -- крапка з підказкою; текстом лише на дуже широкому екрані (як у Statics) */
@media (max-width: 1760px) { header.topbar .save-state #saveStateText { display: none; } }

/* ---- Шапка модуля на вузькому екрані (п. 2, 8): рядок 1 -- логотип, назва модуля, довідка, користувач; рядок 2 --
   Файл, Зберегти, стан, об'єкт (гортається вбік, якщо не вміщається) */
@media (max-width: 820px) {
    header.topbar:has(.menu-strip) { flex-wrap: wrap !important; height: auto !important; min-height: 50px; padding: 6px 10px !important; gap: 6px 8px !important; position: relative; }
    header.topbar:has(.menu-strip) .brand { min-width: 0 !important; gap: 0 !important; flex: 0 0 auto; }
    header.topbar:has(.menu-strip) .brand img { height: 28px; }
    header.topbar:has(.menu-strip) .brand > div { display: none !important; }
    header.topbar:has(.menu-strip) .module-title { display: block !important; flex: 1 1 0 !important; min-width: 0 !important; padding-left: 10px !important; border-left: 1px solid rgba(255, 255, 255, .18); }
    header.topbar:has(.menu-strip) .module-title h1 { font-size: 15px !important; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; margin: 0; }
    header.topbar:has(.menu-strip) .module-title p { display: none !important; }
    header.topbar:has(.menu-strip) .userbox { margin-left: 0 !important; min-width: 0 !important; padding: 4px 8px !important; flex: 0 0 auto; }
    header.topbar:has(.menu-strip) .userbox .user-role { display: none !important; }
    header.topbar:has(.menu-strip) .userbox .user-name { max-width: 90px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
    header.topbar:has(.menu-strip) .menu-strip { order: 3; flex: 1 1 100% !important; min-width: 0 !important; height: auto !important; display: flex; align-items: center; gap: 8px !important; overflow-x: auto; scrollbar-width: none; padding-bottom: 2px; }
    header.topbar:has(.menu-strip) .menu-strip::-webkit-scrollbar { display: none; }
    header.topbar:has(.menu-strip) .menu-strip > * { flex-shrink: 0; }
    header.topbar:has(.menu-strip) .menu-strip .status-chip { flex-shrink: 1; min-width: 0; max-width: 60vw; }
    header.topbar:has(.menu-strip) .menu-strip .kmd-obj-chip { margin-left: 0 !important; max-width: 46vw; }
    header.topbar:has(.menu-strip) .menu { position: static !important; }
    header.topbar:has(.menu-strip) .menu-content { position: fixed !important; top: 96px !important; left: 10px !important; right: 10px !important; min-width: 0 !important; max-height: calc(100vh - 110px); overflow-y: auto; z-index: 3000; }
    header.topbar:has(.menu-strip) .save-state #saveStateText { display: none; }
}

/* ---- Вкладки, що не вміщаються (п. 7): гортаються вбік, а не обрізаються */
@media (max-width: 820px) {
    .tabs, .tabs-header, .sidebar-tabs, .tab-strip { overflow-x: auto !important; scrollbar-width: none; flex-wrap: nowrap !important; }
    .tabs::-webkit-scrollbar, .tabs-header::-webkit-scrollbar, .sidebar-tabs::-webkit-scrollbar, .tab-strip::-webkit-scrollbar { display: none; }
    .tabs > *, .tabs-header > *, .sidebar-tabs > *, .tab-strip > * { flex-shrink: 0 !important; white-space: nowrap; }
}

/* ---- Цілі для пальця (п. 16): на телефоні кнопки й поля не нижчі за 40 px */
@media (max-width: 560px) {
    :is(button, select, .btn, .form-control, input:not([type=checkbox]):not([type=radio]):not([type=range]):not([type=file]):not([type=color])) { min-height: 40px !important; }
    :is(svg button, .kmd-tip button) { min-height: 0 !important; }
    html body .tabs .tab-btn, html body .tabs > button { min-height: 40px !important; }
}