/* ---- Commissioner: фирменный шрифт карточек лунного календаря ---- */
@font-face { font-family: "Commissioner"; src: url("/static/fonts/Commissioner-Regular.ttf") format("truetype"); font-weight: 400; font-style: normal; font-display: swap; }
@font-face { font-family: "Commissioner"; src: url("/static/fonts/Commissioner-Medium.ttf") format("truetype"); font-weight: 500; font-style: normal; font-display: swap; }
@font-face { font-family: "Commissioner"; src: url("/static/fonts/Commissioner-SemiBold.ttf") format("truetype"); font-weight: 600; font-style: normal; font-display: swap; }
@font-face { font-family: "Commissioner"; src: url("/static/fonts/Commissioner-Bold.ttf") format("truetype"); font-weight: 700; font-style: normal; font-display: swap; }
@font-face { font-family: "Commissioner"; src: url("/static/fonts/Commissioner-ExtraBold.ttf") format("truetype"); font-weight: 800; font-style: normal; font-display: swap; }
@font-face { font-family: "Commissioner"; src: url("/static/fonts/Commissioner-Black.ttf") format("truetype"); font-weight: 900; font-style: normal; font-display: swap; }

/* ===== Дизайн-система: CSS-переменные ===== */
:root {
    --color-bg: #f4f6f2;
    --color-surface: #ffffff;
    --color-primary: #3f7d4f;
    --color-primary-dark: #2f6b3a;
    --color-primary-light: #eaf2ea;
    --color-accent: #e8b73f;
    --color-text: #1f2a1f;
    --color-muted: #7c8a7c;
    --color-border: #e2e8e0;
    --color-danger: #c0392b;
    --color-warn-bg: #fff4e5;
    --color-warn-border: #d97706;

    --status-planned: #d97706;
    --status-ordered: #2563eb;
    --status-transit: #7c3aed;
    --status-received: #16a34a;
    --priority-low: #94a3b8;
    --priority-normal: #2563eb;
    --priority-high: #dc2626;

    --radius: 12px;
    --radius-sm: 8px;
    --shadow: 0 1px 3px rgba(0,0,0,0.07), 0 1px 2px rgba(0,0,0,0.05);
    --shadow-lg: 0 8px 24px rgba(0,0,0,0.15);
    --transition: all 0.15s ease;
    --sidebar-width: 220px;
}

[data-theme="dark"] {
    --color-bg: #17201a;
    --color-surface: #202b23;
    --color-primary: #5fae72;
    --color-primary-dark: #4c9a5f;
    --color-primary-light: #26362a;
    --color-text: #e6ede6;
    --color-muted: #93a394;
    --color-border: #33443a;
    --color-warn-bg: #3a2f16;
}

* { box-sizing: border-box; }

body {
    margin: 0;
    font-family: -apple-system, "Segoe UI", Roboto, Arial, sans-serif;
    background: var(--color-bg);
    color: var(--color-text);
    transition: var(--transition);
}

a { color: var(--color-primary-dark); }

/* ===== Layout: сайдбар + контент ===== */
.app-layout { display: flex; min-height: 100vh; }

.sidebar {
    width: var(--sidebar-width);
    background: var(--color-surface);
    border-right: 1px solid var(--color-border);
    display: flex;
    flex-direction: column;
    padding: 16px 0;
    flex-shrink: 0;
    transition: var(--transition);
    position: sticky;
    top: 0;
    height: 100vh;
    align-self: flex-start;
}
.sidebar-brand { padding: 0 16px 16px; flex-shrink: 0; }
.sidebar-brand img { width: 100%; max-width: 160px; height: auto; display: block; margin: 0 auto; }

/* Пункты меню могут не поместиться по высоте — скроллится только этот
   блок, а магазин/футер ниже всегда остаются на месте (см. .sidebar). */
.sidebar-nav { display: flex; flex-direction: column; gap: 2px; flex: 1; min-height: 0; overflow-y: auto; padding: 0 10px; }
.sidebar-nav a {
    display: flex; align-items: center; gap: 10px;
    padding: 10px 12px; border-radius: var(--radius-sm);
    color: var(--color-text); text-decoration: none; font-size: 0.92em;
    transition: var(--transition);
}
.sidebar-nav a:hover { background: var(--color-primary-light); }
.sidebar-nav a.active { background: var(--color-primary); color: white; font-weight: 600; }

/* Пункты меню всегда в фиксированном порядке по важности (без перетаскивания) */
.sidebar-nav-list { display: flex; flex-direction: column; gap: 2px; }
.sidebar-nav-item { display: flex; align-items: center; border-radius: var(--radius-sm); }
.sidebar-nav-item a { flex: 1; min-width: 0; }

.sidebar-shop { padding: 6px 10px; margin-top: 4px; border-top: 1px solid var(--color-border); flex-shrink: 0; }

/* Личные настройки (/settings) */
.settings-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(320px, 1fr)); gap: 18px; margin-top: 16px; align-items: start; }
.settings-card { cursor: default; }
.settings-card:hover { transform: none; box-shadow: var(--shadow); }
.settings-card h3 { margin-top: 0; color: var(--color-primary-dark); }
.settings-checkbox-list { display: flex; flex-direction: column; gap: 10px; margin: 14px 0 18px; }
.settings-checkbox-row { display: flex; align-items: center; gap: 10px; font-size: 0.95em; cursor: pointer; }
.settings-checkbox-row input { width: auto; }
.settings-form { display: flex; flex-direction: column; gap: 4px; max-width: 340px; margin-top: 12px; }
.settings-form button { margin-top: 10px; align-self: flex-start; }

.connection-check-results { display: flex; flex-direction: column; gap: 8px; margin-top: 14px; }
.connection-check-row { display: flex; align-items: baseline; gap: 8px; flex-wrap: wrap; font-size: 0.92em; }
.connection-check-status { flex-shrink: 0; }
.connection-check-label { font-weight: 600; }
.connection-check-message { flex-basis: 100%; }

/* Аватарки — универсальный кружок, используется в сайдбаре, чате, комментариях, профиле */
.avatar-circle {
    display: inline-flex; align-items: center; justify-content: center; flex-shrink: 0;
    border-radius: 50%; background: var(--color-primary); color: #fff;
    font-weight: 700; overflow: hidden; line-height: 1;
}
.avatar-img { width: 100%; height: 100%; object-fit: cover; border-radius: 50%; display: block; }

.settings-card--profile { max-width: 460px; }
.settings-card--profile:target { box-shadow: 0 0 0 2px var(--color-primary); }
.profile-avatar-row { display: flex; align-items: center; gap: 16px; margin: 12px 0 18px; }
.profile-avatar-preview .avatar-circle { font-size: 1.6em; }
.profile-avatar-controls { display: flex; flex-direction: column; gap: 6px; align-items: flex-start; }
.profile-avatar-upload-btn { cursor: pointer; margin: 0; }
.profile-avatar-remove-row { font-size: 0.85em; }
.settings-profile-form textarea { resize: vertical; }

/* Сотрудники — справочник профилей */
.employee-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap: 14px; margin-top: 16px; }
.employee-card { display: flex; gap: 14px; align-items: flex-start; padding: 16px 18px; }
.employee-card-avatar { font-size: 1.3em; }
.employee-card-body { min-width: 0; }
.employee-card-name { font-weight: 600; }
.employee-card-position { margin-top: 2px; }
.employee-card-bio {
    margin-top: 8px; font-size: 0.85em; color: var(--color-text);
    display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden;
}

.employee-profile-card { max-width: 560px; margin: 0 auto; cursor: default; }
.employee-profile-card:hover { transform: none; box-shadow: var(--shadow); }
.employee-profile-head { display: flex; gap: 18px; align-items: center; margin-bottom: 16px; }
.employee-profile-avatar { font-size: 2em; }
.employee-profile-name { margin: 0 0 2px; }
.employee-profile-fields { display: flex; flex-direction: column; gap: 6px; margin-bottom: 10px; }
.employee-profile-field { display: flex; align-items: center; gap: 6px; color: var(--color-text); font-size: 0.95em; }
.employee-profile-bio { margin-top: 14px; padding-top: 14px; border-top: 1px solid var(--color-border); }
.employee-profile-bio h3 { margin: 0 0 6px; font-size: 0.95em; color: var(--color-primary-dark); }
.employee-profile-bio p { margin: 0; white-space: pre-wrap; line-height: 1.5; }
.employee-profile-actions { margin-top: 18px; }
.sidebar-shop a {
    display: flex; align-items: center; gap: 10px;
    padding: 10px 12px; border-radius: var(--radius-sm);
    color: var(--color-text); text-decoration: none; font-size: 0.92em;
    transition: var(--transition);
}
.sidebar-shop a:hover { background: var(--color-primary-light); }

/* Иконки-картинки: заливаются текущим цветом элемента (currentColor) через mask,
   поэтому сами подстраиваются под тему и под активное/неактивное состояние —
   отдельно перекрашивать PNG в чёрный не нужно. Базовый размер 20px, .icon-inline
   и .card-icon переопределяют размер под своё место. */
.icon {
    display: inline-block; width: 20px; height: 20px; flex-shrink: 0;
    background-color: currentColor; vertical-align: -5px;
    -webkit-mask-repeat: no-repeat; mask-repeat: no-repeat;
    -webkit-mask-position: center; mask-position: center;
    -webkit-mask-size: contain; mask-size: contain;
}
.icon-home     { -webkit-mask-image: url(/static/icons/home.png);     mask-image: url(/static/icons/home.png); }
.icon-products { -webkit-mask-image: url(/static/icons/products.png); mask-image: url(/static/icons/products.png); }
.icon-suppliers{ -webkit-mask-image: url(/static/icons/suppliers.png);mask-image: url(/static/icons/suppliers.png); }
.icon-orders   { -webkit-mask-image: url(/static/icons/orders.png);   mask-image: url(/static/icons/orders.png); }
.icon-logistics{ -webkit-mask-image: url(/static/icons/truck.png);    mask-image: url(/static/icons/truck.png); }
.icon-truck     { -webkit-mask-image: url(/static/icons/truck.png);   mask-image: url(/static/icons/truck.png); }
.icon-reports  { -webkit-mask-image: url(/static/icons/reports.png); mask-image: url(/static/icons/reports.png); }
.icon-tasks    { -webkit-mask-image: url(/static/icons/tasks.png);   mask-image: url(/static/icons/tasks.png); }
.icon-users    { -webkit-mask-image: url(/static/icons/users.png);   mask-image: url(/static/icons/users.png); }
.icon-chat      { -webkit-mask-image: url(/static/icons/chat.png);      mask-image: url(/static/icons/chat.png); }
.icon-lightning { -webkit-mask-image: url(/static/icons/lightning.png); mask-image: url(/static/icons/lightning.png); }
.icon-danger    { -webkit-mask-image: url(/static/icons/danger.png);    mask-image: url(/static/icons/danger.png); }
.icon-cancel    { -webkit-mask-image: url(/static/icons/cancel.png);    mask-image: url(/static/icons/cancel.png); }
.icon-list      { -webkit-mask-image: url(/static/icons/list.png);      mask-image: url(/static/icons/list.png); }
.icon-season    { -webkit-mask-image: url(/static/icons/season.png);    mask-image: url(/static/icons/season.png); }
.icon-notes     { -webkit-mask-image: url(/static/icons/notes.png);     mask-image: url(/static/icons/notes.png); }
.icon-fire      { -webkit-mask-image: url(/static/icons/fire.png);      mask-image: url(/static/icons/fire.png); }
.icon-moon      { -webkit-mask-image: url(/static/icons/moon.png);      mask-image: url(/static/icons/moon.png); }
.icon-sun       { -webkit-mask-image: url(/static/icons/sun.png);       mask-image: url(/static/icons/sun.png); }
.icon-paperclip { -webkit-mask-image: url(/static/icons/paperclip.png); mask-image: url(/static/icons/paperclip.png); }
.icon-link      { -webkit-mask-image: url(/static/icons/link.png);      mask-image: url(/static/icons/link.png); }
.icon-planogram { -webkit-mask-image: url(/static/icons/planogram.png); mask-image: url(/static/icons/planogram.png); }
.icon-notifications { -webkit-mask-image: url(/static/icons/notifications.png); mask-image: url(/static/icons/notifications.png); }
.icon-shop      { -webkit-mask-image: url(/static/icons/shop.png);      mask-image: url(/static/icons/shop.png); }
.icon-excel     { -webkit-mask-image: url(/static/icons/excel.png);     mask-image: url(/static/icons/excel.png); }
.icon-user-trash  { -webkit-mask-image: url(/static/icons/user-trash.png);  mask-image: url(/static/icons/user-trash.png); }
.icon-user-card   { -webkit-mask-image: url(/static/icons/user-card.png);   mask-image: url(/static/icons/user-card.png); }
.icon-user-object { -webkit-mask-image: url(/static/icons/user-object.png); mask-image: url(/static/icons/user-object.png); }
.icon-user-door   { -webkit-mask-image: url(/static/icons/user-door.png);   mask-image: url(/static/icons/user-door.png); }
.icon-user-money  { -webkit-mask-image: url(/static/icons/user-money.png);  mask-image: url(/static/icons/user-money.png); }
.icon-user-bulb   { -webkit-mask-image: url(/static/icons/user-bulb.png);   mask-image: url(/static/icons/user-bulb.png); }
.icon-user-cube   { -webkit-mask-image: url(/static/icons/user-cube.png);   mask-image: url(/static/icons/user-cube.png); }
.icon-trash     { -webkit-mask-image: url(/static/icons/trash.png);     mask-image: url(/static/icons/trash.png); }
.icon-box       { -webkit-mask-image: url(/static/icons/box.png);       mask-image: url(/static/icons/box.png); }
.icon-bulb      { -webkit-mask-image: url(/static/icons/bulb.png);      mask-image: url(/static/icons/bulb.png); }
.icon-knowledge { -webkit-mask-image: url(/static/icons/knowledge.png); mask-image: url(/static/icons/knowledge.png); }
.icon-analytics { -webkit-mask-image: url(/static/icons/analytics.png);mask-image: url(/static/icons/analytics.png); }
.icon-salesplan { -webkit-mask-image: url(/static/icons/salesplan.png);mask-image: url(/static/icons/salesplan.png); }
.icon-content-plan { -webkit-mask-image: url(/static/icons/content-plan.png); mask-image: url(/static/icons/content-plan.png); }
.icon-handshake { -webkit-mask-image: url(/static/icons/handshake.png);mask-image: url(/static/icons/handshake.png); }
.icon-person    { -webkit-mask-image: url(/static/icons/person.png);    mask-image: url(/static/icons/person.png); }
.icon-gear      { -webkit-mask-image: url(/static/icons/gear.png);      mask-image: url(/static/icons/gear.png); }
.icon-ruble     { -webkit-mask-image: url(/static/icons/ruble.png);     mask-image: url(/static/icons/ruble.png); }
.icon-phone     { -webkit-mask-image: url(/static/icons/phone.png);     mask-image: url(/static/icons/phone.png); }
.icon-book      { -webkit-mask-image: url(/static/icons/book.png);      mask-image: url(/static/icons/book.png); }
.icon-plane     { -webkit-mask-image: url(/static/icons/plane.png);     mask-image: url(/static/icons/plane.png); }
.icon-aibot     { -webkit-mask-image: url(/static/images/agrobot-mascot.png); mask-image: url(/static/images/agrobot-mascot.png); }
.icon-search    { -webkit-mask-image: url(/static/icons/search.png);    mask-image: url(/static/icons/search.png); }
.icon-more      { -webkit-mask-image: url(/static/icons/more.png);      mask-image: url(/static/icons/more.png); }
.icon-send      { -webkit-mask-image: url(/static/icons/send.png);      mask-image: url(/static/icons/send.png); }
.icon-reply     { -webkit-mask-image: url(/static/icons/reply.png);     mask-image: url(/static/icons/reply.png); }
.icon-forward   { -webkit-mask-image: url(/static/icons/forward.png);   mask-image: url(/static/icons/forward.png); }
.icon-copy      { -webkit-mask-image: url(/static/icons/copy.png);      mask-image: url(/static/icons/copy.png); }
.icon-document  { -webkit-mask-image: url(/static/icons/document.png); mask-image: url(/static/icons/document.png); }
.icon-sticker   { -webkit-mask-image: url(/static/icons/sticker.png);   mask-image: url(/static/icons/sticker.png); }
.icon-pin       { -webkit-mask-image: url(/static/icons/pin.png);       mask-image: url(/static/icons/pin.png); }
.icon-pin-fill  { -webkit-mask-image: url(/static/icons/pin-fill.png);  mask-image: url(/static/icons/pin-fill.png); }
.icon-megaphone { -webkit-mask-image: url(/static/icons/megaphone.png);mask-image: url(/static/icons/megaphone.png); }
.icon-calendar  { -webkit-mask-image: url(/static/icons/calendar.png); mask-image: url(/static/icons/calendar.png); }
.icon-cake      { -webkit-mask-image: url(/static/icons/cake.png);      mask-image: url(/static/icons/cake.png); }
.icon-check-circle { -webkit-mask-image: url(/static/icons/check-circle.png); mask-image: url(/static/icons/check-circle.png); }
.icon-edit      { -webkit-mask-image: url(/static/icons/edit.png);      mask-image: url(/static/icons/edit.png); }
.icon-play      { -webkit-mask-image: url(/static/icons/play.png);      mask-image: url(/static/icons/play.png); }
.icon-plus      { -webkit-mask-image: url(/static/icons/plus.png);      mask-image: url(/static/icons/plus.png); }
.icon-chart-bar { -webkit-mask-image: url(/static/icons/chart-bar.png); mask-image: url(/static/icons/chart-bar.png); }

/* Крупные иконки в карточках сводки */
.card-icon .icon { width: 28px; height: 28px; vertical-align: -7px; }
.card.warn .card-icon .icon { background-color: var(--status-planned); }
/* Мелкие иконки внутри заголовков и переключателей вида */
.icon-inline { width: 16px; height: 16px; vertical-align: -3px; margin-right: 2px; }
/* Совсем мелкие — на кнопках закрытия/удаления */
.icon-tiny { width: 12px; height: 12px; vertical-align: -1px; }

.sidebar-footer {
    padding: 8px 10px 6px; border-top: 1px solid var(--color-border);
    flex-shrink: 0;
}
.sidebar-footer-user {
    display: flex; align-items: center; gap: 6px; flex-wrap: wrap;
    padding: 6px 12px 8px; font-size: 0.82em; color: var(--color-muted);
}
.sidebar-footer-user--link {
    text-decoration: none; border-radius: var(--radius-sm); transition: var(--transition);
    margin: 0 -2px; padding-left: 8px; padding-right: 8px;
}
.sidebar-footer-user--link:hover { background: var(--color-primary-light); color: var(--color-text); }
.sidebar-footer-user-name { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; max-width: 140px; }
.sidebar-footer-role {
    font-size: 0.85em; font-weight: 600; padding: 1px 8px; border-radius: 999px;
    background: var(--color-primary-light); color: var(--color-primary-dark);
}
.sidebar-footer-actions { display: flex; flex-direction: column; gap: 2px; }
.sidebar-footer-btn {
    display: flex; align-items: center; gap: 10px;
    padding: 10px 12px; border-radius: var(--radius-sm);
    color: var(--color-text); text-decoration: none; font-size: 0.92em;
    transition: var(--transition);
}
.sidebar-footer-btn .icon { width: 18px; height: 18px; }
.sidebar-footer-btn:hover { background: var(--color-primary-light); }
.sidebar-footer-btn--logout:hover { background: #fbeceb; color: var(--color-danger); }
[data-theme="dark"] .sidebar-footer-btn--logout:hover { background: #3a2422; }

.burger {
    display: none; position: fixed; top: 12px; left: 12px; z-index: 50;
    background: var(--color-primary); color: white; border: none; border-radius: var(--radius-sm);
    width: 40px; height: 40px; font-size: 1.2em; cursor: pointer;
}

.main-content { flex: 1; min-width: 0; }

.topbar-mobile { display: none; }

.container { max-width: 1800px; margin: 0 auto; padding: 24px 70px 60px 24px; }

h1 { color: var(--color-primary-dark); margin-top: 0; word-break: break-word; }

/* ===== Топ-поиск (переключатель темы и колокольчик — см. .side-toolbar) ===== */
.topbar { display: flex; align-items: center; gap: 12px; margin-bottom: 20px; flex-wrap: wrap; }
.global-search { position: relative; width: 100%; max-width: 420px; flex: 1 1 240px; min-width: 0; margin-bottom: 0; }

/* Вертикальная колонка с колокольчиком/темой — зафиксирована у правого края экрана,
   не зависит от ширины контента, поэтому не «расползается» на любом разрешении. */
.side-toolbar {
    position: fixed; top: 42px; right: 18px; z-index: 45;
    display: flex; flex-direction: column; align-items: center; gap: 12px;
}
.global-search input {
    width: 100%; padding: 10px 14px; border-radius: var(--radius); border: 1px solid var(--color-border);
    background: var(--color-surface); color: var(--color-text); font-size: 0.95em;
}
.global-search .hint { position: absolute; right: 12px; top: 10px; font-size: 0.75em; color: var(--color-muted); border: 1px solid var(--color-border); border-radius: 4px; padding: 1px 5px; }
.search-results {
    position: absolute; top: 100%; left: 0; right: 0; margin-top: 4px;
    background: var(--color-surface); border-radius: var(--radius); box-shadow: var(--shadow-lg);
    max-height: 360px; overflow-y: auto; z-index: 40; display: none;
}
.search-results.show { display: block; }
.search-group-label { padding: 8px 14px 4px; font-size: 0.75em; text-transform: uppercase; color: var(--color-muted); }
.search-result-item { display: block; padding: 8px 14px; text-decoration: none; color: var(--color-text); font-size: 0.9em; }
.search-result-item:hover { background: var(--color-primary-light); }
.search-empty { padding: 14px; color: var(--color-muted); font-size: 0.9em; }

/* Живой поиск в базе знаний — тот же паттерн, что и глобальный поиск в топбаре */
.kb-search-wrap { position: relative; min-width: 280px; }
.kb-search-dropdown {
    position: absolute; top: 100%; left: 0; right: 0; margin-top: 4px;
    background: var(--color-surface); border-radius: var(--radius); box-shadow: var(--shadow-lg);
    max-height: 380px; overflow-y: auto; z-index: 40; display: none;
}
.kb-search-dropdown.show { display: block; }
.kb-search-result { display: block; padding: 10px 14px; text-decoration: none; color: var(--color-text); border-bottom: 1px solid var(--color-border); }
.kb-search-result:last-child { border-bottom: 0; }
.kb-search-result:hover { background: var(--color-primary-light); }
.kb-search-result strong { display: block; font-size: 0.92em; }
.kb-search-result span { display: block; margin-top: 2px; color: var(--color-muted); font-size: 0.82em; line-height: 1.4; }
.kb-search-result mark { background: #fff2b8; color: #3a2f0a; border-radius: 2px; padding: 0 1px; }
.kb-search-empty { padding: 14px; color: var(--color-muted); font-size: 0.9em; }

.theme-toggle-btn {
    flex-shrink: 0; width: 48px; height: 48px; padding: 0; border-radius: 50%;
    background: var(--color-surface); border: 1px solid var(--color-border);
    display: flex; align-items: center; justify-content: center;
    box-shadow: var(--shadow-sm);
}
.theme-toggle-btn:hover { background: var(--color-primary-light); }
.theme-toggle-btn .icon { width: 26px; height: 26px; background-color: var(--color-text); }

/* ===== Колокольчик уведомлений ===== */
.notif-bell-wrap { position: relative; flex-shrink: 0; }
.notif-bell-btn {
    position: relative; width: 48px; height: 48px; padding: 0; border-radius: 50%;
    background: var(--color-surface); border: 1px solid var(--color-border);
    display: flex; align-items: center; justify-content: center;
    box-shadow: var(--shadow-sm);
}
.notif-bell-btn:hover { background: var(--color-primary-light); }
.notif-bell-btn .icon { width: 26px; height: 26px; background-color: var(--color-text); }
.notif-badge {
    position: absolute; top: -4px; right: -4px; min-width: 16px; height: 16px; padding: 0 3px;
    background: var(--color-danger); color: white; border-radius: 999px; font-size: 0.62em;
    font-weight: 700; align-items: center; justify-content: center; line-height: 1;
    border: 2px solid var(--color-bg);
}
.notif-dropdown {
    display: none; position: absolute; top: 100%; right: 0; margin-top: 8px; width: 340px;
    background: var(--color-surface); border-radius: var(--radius); box-shadow: var(--shadow-lg);
    z-index: 50; overflow: hidden; border: 1px solid var(--color-border);
}
.notif-dropdown.show { display: block; }
.notif-dropdown-head {
    display: flex; justify-content: space-between; align-items: center; padding: 10px 14px;
    border-bottom: 1px solid var(--color-border); font-weight: 700; font-size: 0.9em;
}
.notif-dropdown-markall { background: none; border: none; color: var(--color-primary-dark); font-size: 0.78em; cursor: pointer; padding: 0; }
.notif-dropdown-list { max-height: 360px; overflow-y: auto; }
.notif-dd-item {
    display: flex; gap: 10px; padding: 10px 14px; text-decoration: none; color: var(--color-text);
    border-bottom: 1px solid var(--color-border);
}
.notif-dd-item:last-child { border-bottom: none; }
.notif-dd-item:hover { background: var(--color-primary-light); }
.notif-dd-item.unread { background: var(--color-primary-light); }
.notif-dd-icon { font-size: 1.2em; flex-shrink: 0; }
.notif-dd-icon .icon { width: 16px; height: 16px; vertical-align: -3px; }
.notif-dd-body { display: flex; flex-direction: column; gap: 1px; min-width: 0; }
.notif-dd-title { font-size: 0.86em; font-weight: 600; }
.notif-dd-text { font-size: 0.8em; color: var(--color-muted); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.notif-dd-time { font-size: 0.72em; color: var(--color-muted); margin-top: 2px; }
.notif-dropdown-foot {
    display: block; text-align: center; padding: 10px; font-size: 0.85em; color: var(--color-primary-dark);
    text-decoration: none; border-top: 1px solid var(--color-border);
}
.notif-dropdown-foot:hover { background: var(--color-primary-light); }

/* ===== Мини-чат в шапке ===== */
.mchat-wrap { position: relative; flex-shrink: 0; }
.mchat-btn {
    position: relative; width: 48px; height: 48px; padding: 0; border-radius: 50%;
    background: var(--color-surface); border: 1px solid var(--color-border);
    display: flex; align-items: center; justify-content: center;
    box-shadow: var(--shadow-sm);
}
.mchat-btn:hover { background: var(--color-primary-light); }
.mchat-btn .icon { width: 26px; height: 26px; background-color: var(--color-text); }

.mchat-panel {
    display: none; flex-direction: column; position: absolute; top: 100%; right: 0; margin-top: 8px;
    width: 360px; max-height: 480px;
    background: var(--color-surface); border-radius: var(--radius); box-shadow: var(--shadow-lg);
    z-index: 50; overflow: hidden; border: 1px solid var(--color-border);
}
.mchat-panel.show { display: flex; }
.mchat-panel-head {
    display: flex; align-items: center; gap: 8px; padding: 10px 14px;
    border-bottom: 1px solid var(--color-border); font-weight: 700; font-size: 0.9em; flex-shrink: 0;
}
.mchat-panel-title { flex: 1; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.mchat-back-btn {
    background: none; border: none; color: var(--color-text); cursor: pointer; font-size: 1.15em;
    padding: 0 2px; line-height: 1;
}
.mchat-back-btn:hover { color: var(--color-primary-dark); background: none; }
.mchat-open-full { color: var(--color-muted); text-decoration: none; font-size: 1.05em; flex-shrink: 0; }
.mchat-open-full:hover { color: var(--color-primary-dark); }

.mchat-list { overflow-y: auto; padding: 6px; }
.mchat-list .conv-item { cursor: pointer; }

.mchat-conv { display: flex; flex-direction: column; min-height: 0; flex: 1; }
.mchat-feed {
    flex: 1; overflow-y: auto; display: flex; flex-direction: column; gap: 8px;
    padding: 12px; min-height: 220px; max-height: 320px; scroll-behavior: smooth;
}
.mchat-feed .chat-bubble { max-width: 85%; font-size: 0.9em; }
.mchat-input-bar {
    display: flex; gap: 6px; align-items: center; padding: 8px 10px;
    border-top: 1px solid var(--color-border); flex-shrink: 0;
}
.mchat-input-bar textarea {
    flex: 1; resize: none; min-height: 36px; max-height: 90px; font-family: inherit; font-size: 0.88em;
    border-radius: var(--radius-sm); border: 1px solid var(--color-border); background: var(--color-bg);
    color: var(--color-text); padding: 7px 10px;
}
.mchat-input-bar button[type="submit"] {
    width: 36px; height: 36px; flex-shrink: 0; padding: 0; border-radius: 50%;
    display: flex; align-items: center; justify-content: center; font-size: 1.05em;
}

/* ===== AI-помощник («АгроБот AI») =====
   Живёт отдельно от .side-toolbar (там остались только колокольчик/чат/тема,
   как и раньше) — свой fixed-блок внизу экрана, чуть отступя от края, чтобы
   было удобно попадать пальцем/курсором. */
.aibot-wrap {
    position: fixed; bottom: 28px; right: 28px; z-index: 46; flex-shrink: 0;
}
.aibot-btn {
    position: relative; width: 64px; height: 64px; padding: 0; border-radius: 50%;
    background: var(--color-surface); border: 2px solid var(--color-primary);
    display: flex; align-items: center; justify-content: center;
    box-shadow: var(--shadow-lg); overflow: hidden; color: var(--color-primary);
}
.aibot-btn:hover { background: var(--color-primary-light); transform: scale(1.04); }
/* В тёмной теме — белым, как и остальные иконки (они красятся в var(--color-text),
   который в тёмной теме почти белый); в светлой теме значок остаётся зелёным. */
[data-theme="dark"] .aibot-btn { color: #fff; }
/* Значок — не картинка, а CSS-маска (заливается currentColor), поэтому сам
   перекрашивается под тему/фон, как и остальные иконки в сайдбаре. */
.aibot-btn-icon { width: 82%; height: 82%; }
.aibot-panel-logo { height: 26px; width: auto; display: block; }
.aibot-panel {
    display: none; flex-direction: column; position: absolute; bottom: 100%; right: 0; margin-bottom: 10px;
    width: 380px; max-height: 520px;
    background: var(--color-surface); border-radius: var(--radius); box-shadow: var(--shadow-lg);
    z-index: 50; overflow: hidden; border: 1px solid var(--color-border);
}
.aibot-panel.show { display: flex; }
.aibot-panel-head {
    display: flex; align-items: center; gap: 8px; padding: 10px 14px;
    border-bottom: 1px solid var(--color-border); font-weight: 700; font-size: 0.9em; flex-shrink: 0;
}
.aibot-panel-title { flex: 1; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.aibot-clear-btn {
    background: none; border: none; color: var(--color-muted); cursor: pointer;
    padding: 4px; display: flex; align-items: center; justify-content: center;
}
.aibot-clear-btn:hover { color: var(--status-received); background: none; }
.aibot-feed {
    flex: 1; overflow-y: auto; display: flex; flex-direction: column; gap: 8px;
    padding: 12px; min-height: 260px; max-height: 380px; scroll-behavior: smooth;
}
.aibot-feed .chat-bubble { max-width: 88%; font-size: 0.9em; white-space: pre-wrap; }
.aibot-empty { color: var(--color-muted); font-size: 0.88em; padding: 18px 14px; text-align: center; }
.aibot-typing { color: var(--color-muted); font-size: 0.85em; padding: 0 14px 6px; font-style: italic; }
.aibot-error-msg {
    background: rgba(220, 60, 60, 0.1); color: var(--status-received); border-radius: var(--radius-sm);
    padding: 8px 12px; font-size: 0.85em; margin: 0 12px 8px;
}
.aibot-disabled-msg { color: var(--color-muted); font-size: 0.85em; padding: 14px; text-align: center; }
.aibot-actions { display: flex; flex-direction: column; gap: 6px; margin: 0 12px 8px; }
.aibot-action-chip {
    display: flex; align-items: center; gap: 8px; padding: 8px 12px; border-radius: var(--radius-sm);
    background: var(--color-primary-light); color: var(--color-text); text-decoration: none;
    font-size: 0.85em; font-weight: 600; border: 1px solid var(--color-border);
}
.aibot-action-chip:hover { background: var(--color-primary); color: #fff; }
.aibot-action-chip-mark {
    flex-shrink: 0; width: 18px; height: 18px; border-radius: 50%; background: var(--color-primary);
    color: #fff; display: flex; align-items: center; justify-content: center; font-size: 0.75em;
}
.aibot-action-chip:hover .aibot-action-chip-mark { background: #fff; color: var(--color-primary); }
.aibot-input-bar {
    display: flex; gap: 6px; align-items: center; padding: 8px 10px;
    border-top: 1px solid var(--color-border); flex-shrink: 0;
}
.aibot-input-bar textarea {
    flex: 1; resize: none; min-height: 36px; max-height: 90px; font-family: inherit; font-size: 0.88em;
    border-radius: var(--radius-sm); border: 1px solid var(--color-border); background: var(--color-bg);
    color: var(--color-text); padding: 7px 10px;
}
.aibot-input-bar button[type="submit"] {
    width: 36px; height: 36px; flex-shrink: 0; padding: 0; border-radius: 50%;
    display: flex; align-items: center; justify-content: center; font-size: 1.05em;
}
.aibot-input-bar button[type="submit"]:disabled { opacity: 0.5; cursor: default; }

.aibot-attach-btn {
    width: 36px; height: 36px; flex-shrink: 0; padding: 0; border-radius: 50%;
    display: flex; align-items: center; justify-content: center; font-size: 1em;
    background: var(--color-bg); color: var(--color-text); border: 1px solid var(--color-border);
}
.aibot-attach-btn:hover { background: var(--color-primary-light); }
.aibot-pending-files {
    display: flex; flex-wrap: wrap; gap: 6px; padding: 8px 10px 0;
}
.aibot-pending-chip {
    display: inline-flex; align-items: center; gap: 6px; padding: 4px 8px; border-radius: 999px;
    background: var(--color-primary-light); font-size: 0.78em; max-width: 220px;
}
.aibot-pending-chip.uploading { opacity: 0.6; }
.aibot-pending-chip-name { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.aibot-pending-chip-del {
    background: none; border: none; padding: 0; line-height: 1; cursor: pointer;
    color: var(--color-muted); font-size: 1.05em;
}
.aibot-pending-chip-del:hover { color: var(--status-received); }
.aibot-attach-note {
    align-self: flex-end; font-size: 0.78em; color: var(--color-muted); margin: -4px 12px 4px;
}

/* Отдельная страница АгроБот AI (/ai) — своя вкладка в сайдбаре вместо только
   всплывающей панели: список диалогов слева, лента по центру, карточка
   возможностей справа. Переиспользует .chat-bubble/.conv-item/.aibot-*. */
.aipage {
    display: grid; grid-template-columns: 260px minmax(0, 1fr) 240px; gap: 16px;
    height: calc(100vh - 200px); min-height: 460px;
}
.aipage-sidebar {
    display: flex; flex-direction: column; gap: 8px; min-height: 0;
    background: var(--color-surface); border-radius: var(--radius); box-shadow: var(--shadow);
    padding: 10px; overflow: hidden;
}
.aipage-new-btn {
    width: 100%; border-radius: var(--radius-sm); padding: 9px 10px; font-size: 0.88em; font-weight: 700;
}
.aipage-knowledge-btn {
    display: flex; width: 100%; box-sizing: border-box; border-radius: var(--radius-sm);
    padding: 9px 10px; font-size: 0.88em; font-weight: 700; text-align: center;
    text-decoration: none; background: var(--color-bg); color: var(--color-text);
    border: 1px solid var(--color-border); align-items: center; justify-content: center; gap: 7px;
}
.aipage-knowledge-btn:hover { background: var(--color-primary-light); color: var(--color-primary-dark); }
.aipage-conv-list { flex: 1; overflow-y: auto; display: flex; flex-direction: column; gap: 2px; }
.aipage-conv-item { position: relative; padding-right: 32px; cursor: pointer; }
.aipage-conv-del {
    position: absolute; right: 6px; top: 50%; transform: translateY(-50%);
    width: 22px; height: 22px; border-radius: 50%; background: none; color: var(--color-muted);
    font-size: 1em; line-height: 1; padding: 0; display: flex; align-items: center; justify-content: center;
}
.aipage-conv-item:hover .aipage-conv-del { color: var(--status-received); }
.aipage-conv-del:hover { background: rgba(220, 60, 60, 0.12); color: var(--status-received); }

.aipage-title { margin: 0 0 16px; line-height: 0; }
.aipage-title-logo { height: 52px; width: auto; display: block; }

.aipage-main {
    display: flex; flex-direction: column; min-width: 0; min-height: 0;
}
.aipage-main-head {
    display: flex; align-items: center; gap: 10px; padding: 10px 16px; margin-bottom: 10px;
    background: var(--color-surface); border-radius: var(--radius); box-shadow: var(--shadow); flex-shrink: 0;
}
.aipage-conv-title {
    font-weight: 700; font-size: 0.95em; overflow: hidden; text-overflow: ellipsis;
    white-space: nowrap; min-width: 0;
}
.aipage-status {
    margin-left: auto; font-size: 0.76em; font-weight: 700; padding: 3px 9px; border-radius: 999px;
    color: var(--color-muted); background: var(--color-bg);
}
.aipage-status-on { color: var(--color-primary-dark); background: var(--color-primary-light); }
.aipage-status-off { color: var(--status-received); background: rgba(220, 60, 60, 0.1); }
.aipage-feed {
    flex: 1; overflow-y: auto; display: flex; flex-direction: column; gap: 10px; min-height: 0;
    padding: 16px; background: var(--color-surface); border-radius: var(--radius);
    box-shadow: var(--shadow); scroll-behavior: smooth;
}
.aipage-feed .chat-bubble { max-width: 78%; white-space: pre-wrap; }
.aipage-input-bar {
    background: var(--color-surface); border-radius: var(--radius); box-shadow: var(--shadow);
    border-top: none; margin-top: 10px; flex-shrink: 0;
}

.aipage-features {
    background: var(--color-surface); border-radius: var(--radius); box-shadow: var(--shadow);
    padding: 16px; overflow-y: auto;
}
.aipage-features-intro { display: flex; flex-direction: column; align-items: center; text-align: center; gap: 8px; margin-bottom: 16px; padding-bottom: 14px; border-bottom: 1px solid var(--color-border); }
.aipage-features-avatar { width: 52px; height: 52px; border-radius: 50%; object-fit: cover; background: var(--color-primary); padding: 6px; }
.aipage-features-intro p { margin: 0; font-size: 0.84em; color: var(--color-muted); line-height: 1.5; }
.aipage-features h3 { margin: 0 0 12px; font-size: 0.98em; }
.aipage-feature-list { list-style: none; margin: 0 0 14px; padding: 0; display: flex; flex-direction: column; gap: 10px; }
.aipage-feature-list li { display: flex; align-items: flex-start; gap: 8px; font-size: 0.86em; line-height: 1.4; }
.aipage-feature-list li .icon-inline { margin-top: 2px; flex-shrink: 0; }
.aipage-features-note { line-height: 1.5; }

/* ===== Шапка диалога + аватар "печатает" — делают страницу похожей на обычный AI-чат ===== */
.aipage-head-avatar { width: 26px; height: 26px; border-radius: 50%; object-fit: cover; background: var(--color-primary); padding: 3px; flex-shrink: 0; }
.aibot-typing { display: flex; align-items: center; gap: 8px; }
.aibot-typing-avatar { width: 20px; height: 20px; border-radius: 50%; object-fit: cover; background: var(--color-primary); padding: 2px; flex-shrink: 0; }

/* ===== Экран приветствия в пустом диалоге ===== */
.aibot-welcome {
    flex: 1; display: flex; flex-direction: column; align-items: center; justify-content: center;
    text-align: center; gap: 10px; padding: 24px 16px; max-width: 560px; margin: 0 auto;
}
.aibot-welcome-avatar { width: 72px; height: 72px; border-radius: 50%; object-fit: cover; background: var(--color-primary); padding: 10px; margin-bottom: 4px; }
.aibot-welcome h2 { margin: 0; font-size: 1.15em; }
.aibot-welcome p { margin: 0; color: var(--color-muted); font-size: 0.9em; line-height: 1.55; }
.aibot-suggest-row { display: flex; flex-wrap: wrap; gap: 8px; justify-content: center; margin-top: 10px; }
.aibot-suggest-chip {
    background: var(--color-surface); border: 1px solid var(--color-border); color: var(--color-text);
    border-radius: 999px; padding: 8px 14px; font-size: 0.83em; font-weight: 500; cursor: pointer;
    transition: var(--transition);
}
.aibot-suggest-chip:hover { background: var(--color-primary-light); border-color: var(--color-primary); }

@media (max-width: 1100px) {
    .aipage { grid-template-columns: 220px minmax(0, 1fr); }
    .aipage-features { display: none; }
}
@media (max-width: 760px) {
    .aipage { display: flex; flex-direction: column; height: auto; }
    .aipage-sidebar { max-height: 180px; }
}

/* ===== Страница уведомлений ===== */
.notif-filter-tabs { display: flex; gap: 4px; }
.notif-filter-tab {
    padding: 7px 14px; border-radius: 999px; font-size: 0.85em; text-decoration: none;
    color: var(--color-muted); background: var(--color-surface); border: 1px solid var(--color-border);
}
.notif-filter-tab.active { background: var(--color-primary); color: white; border-color: var(--color-primary); }
.notif-page-list { display: flex; flex-direction: column; gap: 8px; margin-top: 14px; }
.notif-row {
    display: flex; gap: 12px; align-items: flex-start; background: var(--color-surface);
    border-radius: var(--radius); padding: 12px 14px; box-shadow: var(--shadow);
    border-left: 4px solid transparent;
}
.notif-row.unread { border-left-color: var(--color-primary); }
.notif-row-icon { font-size: 1.3em; flex-shrink: 0; }
.notif-row-icon .icon { width: 18px; height: 18px; vertical-align: -3px; }
.notif-row-body { flex: 1; min-width: 0; }
.notif-row-top { display: flex; justify-content: space-between; gap: 10px; align-items: baseline; }
.notif-row-title { font-weight: 600; font-size: 0.95em; }
.notif-row-kind { font-size: 0.72em; color: var(--color-muted); background: var(--color-primary-light); padding: 2px 8px; border-radius: 999px; flex-shrink: 0; }
.notif-row-text { font-size: 0.85em; color: var(--color-muted); margin-top: 3px; }
.notif-row-foot { display: flex; gap: 12px; align-items: center; margin-top: 6px; }
.notif-row-link { font-size: 0.82em; }
.notif-row-actions { display: flex; flex-direction: column; gap: 4px; flex-shrink: 0; }

/* ===== Карточки ===== */
.cards { display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap: 16px; }
.card {
    background: var(--color-surface); border-radius: var(--radius); padding: 20px 24px;
    box-shadow: var(--shadow); text-decoration: none; color: inherit;
    border-left: 4px solid transparent; transition: var(--transition);
}
.card:hover { transform: translateY(-2px); box-shadow: var(--shadow-lg); }
.card.warn { border-left-color: var(--status-planned); }
.card.good { border-left-color: var(--status-received); }

/* Вертикальный ритм между блоками-секциями (отчёты, аналитика, карточки сущностей):
   без этого соседние .card/.dashboard-charts/.sp-top-grid визуально "слипаются". */
.card, .dashboard-charts, .sp-top-grid, .mini-stat-single { margin: 20px 0; }
.cards .card, .sp-top-grid .card { margin: 0; }
.card-icon { font-size: 1.6em; margin-bottom: 4px; }
.card-value { font-size: 2em; font-weight: 700; color: var(--color-primary-dark); }
.card-label { color: var(--color-muted); font-size: 0.88em; }

.mini-stat { background: var(--color-surface); border: 1px solid var(--color-border); border-radius: var(--radius); padding: 14px 16px; display: flex; justify-content: space-between; gap: 16px; align-items: center; }
.mini-stat span { color: var(--color-muted); font-size: 0.86em; }
.mini-stat strong { color: var(--color-primary-dark); font-size: 1.05em; white-space: nowrap; }
.audit-action { font-family: ui-monospace, SFMono-Regular, Menlo, monospace; font-size: 0.78em; background: var(--color-primary-light); padding: 4px 7px; border-radius: 6px; }
.nowrap { white-space: nowrap; }
.pagination { display: flex; gap: 12px; align-items: center; justify-content: center; margin-top: 18px; }
.dash-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); gap: 16px; }
.dash-panel { background: var(--color-surface); border-radius: var(--radius); padding: 18px 20px; box-shadow: var(--shadow); }
.dash-panel h3 { margin-top: 0; font-size: 1em; color: var(--color-primary-dark); }
.dash-list { list-style: none; padding: 0; margin: 0; }
.dash-list li { padding: 7px 0; border-bottom: 1px solid var(--color-border); font-size: 0.9em; }
.dash-list li:last-child { border-bottom: none; }
.dashboard-header { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; margin-bottom: 18px; }
.dashboard-header h1 { margin-bottom: 0; }
.dashboard-page > * + * { margin-top: 26px; }
.mini-stat-single { max-width: 360px; }

.season-banner {
    background: linear-gradient(135deg, var(--color-accent), #f4d374); color: #3a2f0a;
    border-radius: var(--radius); padding: 14px 20px; font-size: 0.95em;
}


/* ===== Графики главной страницы ===== */
.dashboard-charts { display: grid; grid-template-columns: minmax(0, 1.55fr) minmax(320px, 1fr); gap: 16px; }
.chart-card { background: var(--color-surface); border: 1px solid var(--color-border); border-radius: var(--radius); padding: 18px 20px; box-shadow: var(--shadow); min-width: 0; }
.chart-head h3 { margin: 0 0 4px; font-size: 1em; color: var(--color-primary-dark); }
.chart-head span { color: var(--color-muted); font-size: 0.82em; }
.chart-area { position: relative; padding: 20px 0 0 36px; }
.chart-empty { height: 210px; display: flex; align-items: center; justify-content: center; text-align: center; padding: 0 10px; }
.y-grid { position: absolute; inset: 33px auto 15px 0; display: flex; flex-direction: column; justify-content: space-between; align-items: flex-end; width: 34px; text-align: right; font-size: 0.7em; color: var(--color-muted); }
.bar-chart { height: 210px; display: grid; grid-template-columns: repeat(6, 1fr); gap: 12px; align-items: end; }
.bar-col { height: 100%; display: flex; flex-direction: column; align-items: center; justify-content: flex-end; min-width: 0; }
.bar-value { min-height: 18px; color: var(--color-muted); font-size: 0.68em; white-space: nowrap; }
.bar-track { height: 170px; width: min(38px, 70%); display: flex; align-items: flex-end; background: var(--color-primary-light); border-radius: 10px 10px 4px 4px; overflow: hidden; }
.bar-fill { width: 100%; min-height: 2px; background: var(--color-primary); border-radius: 10px 10px 4px 4px; transition: height 0.25s ease; }
.bar-label { margin-top: 7px; font-size: 0.78em; color: var(--color-muted); }
.donut-wrap { min-height: 220px; display: flex; align-items: center; gap: 26px; flex-wrap: wrap; padding-top: 10px; }
.donut-ring { position: relative; width: 170px; height: 170px; flex-shrink: 0; }
.donut { width: 170px; height: 170px; border-radius: 50%; background: conic-gradient(var(--color-primary) 0 var(--healthy), var(--color-accent) var(--healthy) calc(var(--healthy) + var(--low)), var(--color-danger) calc(var(--healthy) + var(--low)) 100%); position: relative; }
.donut.donut-empty { background: var(--color-border); }
.donut::after { content: ""; position: absolute; inset: 30px; border-radius: 50%; background: var(--color-surface); }
.donut-center { position: absolute; inset: 0; display: flex; flex-direction: column; align-items: center; justify-content: center; pointer-events: none; }
.donut-center strong { font-size: 1.55em; color: var(--color-primary-dark); }
.donut-center span { color: var(--color-muted); font-size: 0.76em; }
.chart-legend { display: flex; flex-direction: column; gap: 12px; flex: 1; min-width: 150px; }
.legend-row { display: grid; grid-template-columns: 10px 1fr auto; align-items: center; gap: 8px; font-size: 0.88em; }
.legend-row strong { color: var(--color-primary-dark); }
.legend-dot { width: 9px; height: 9px; border-radius: 50%; background: var(--color-primary); }
.legend-dot-2 { background: var(--color-accent); }
.legend-dot-3 { background: var(--color-danger); }
@media (max-width: 1050px) {
    .dashboard-charts { grid-template-columns: 1fr; }
}
@media (max-width: 520px) {
    .donut-wrap { flex-direction: column; }
    .chart-legend { width: 100%; }
}

/* ===== Тулбар / формы ===== */
.toolbar { display: flex; gap: 10px; align-items: center; margin: 16px 0; flex-wrap: wrap; }
.inline-form { display: flex; gap: 8px; align-items: center; }

input, select, textarea, button {
    font-size: 0.95em; padding: 9px 12px; border-radius: var(--radius-sm); border: 1px solid var(--color-border);
    background: var(--color-surface); color: var(--color-text); font-family: inherit;
}
button {
    background: var(--color-primary); color: white; border: none; cursor: pointer; font-weight: 500;
    transition: var(--transition);
}
button:hover { background: var(--color-primary-dark); }
.btn-danger { background: var(--color-danger); padding: 5px 11px; }
.btn-danger:hover { background: #96271c; }
.btn-secondary {
    display: inline-flex; align-items: center; gap: 6px;
    padding: 9px 12px; border-radius: var(--radius-sm); font-size: 0.95em; font-family: inherit;
    background: var(--color-surface); color: var(--color-text); border: 1px solid var(--color-border);
    text-decoration: none; cursor: pointer; transition: var(--transition);
}
.btn-secondary:hover { background: var(--color-primary-light); }

.add-block {
    background: var(--color-surface); border-radius: var(--radius); padding: 14px 20px; margin: 16px 0;
    box-shadow: var(--shadow);
}
.add-block summary { cursor: pointer; font-weight: 600; color: var(--color-primary-dark); }
.grid-form {
    display: grid; grid-template-columns: repeat(auto-fill, minmax(180px, 1fr));
    gap: 10px; margin-top: 12px;
}
.grid-form textarea { grid-column: 1 / -1; min-height: 60px; }

/* Поле пароля с кнопкой показать/скрыть + генерация логина/пароля */
.svgicon { width: 16px; height: 16px; flex-shrink: 0; vertical-align: -3px; margin-right: 6px; }
.pw-toggle-btn .svgicon { margin-right: 0; vertical-align: middle; }
.pw-field-wrap { position: relative; display: flex; }
.pw-field-wrap input { flex: 1; padding-right: 36px; }
.pw-toggle-btn {
    position: absolute; right: 4px; top: 50%; transform: translateY(-50%);
    background: none; border: none; padding: 4px 6px; line-height: 1; cursor: pointer;
    color: var(--color-muted); display: flex; align-items: center;
}
.pw-toggle-btn:hover { background: none; color: var(--color-text); }
.add-user-gen-row { display: flex; flex-wrap: wrap; gap: 8px; }
.add-user-gen-row .btn-secondary { display: inline-flex; align-items: center; }


/* ===== Таблицы ===== */
.data-table {
    width: 100%; border-collapse: collapse; background: var(--color-surface);
    border-radius: var(--radius); overflow: hidden; box-shadow: var(--shadow);
}
.table-scroll { width: 100%; overflow-x: auto; -webkit-overflow-scrolling: touch; border-radius: var(--radius); }
.table-scroll .data-table { box-shadow: none; }
.table-scroll .data-table { min-width: 560px; }
.data-table th, .data-table td { padding: 11px 14px; border-bottom: 1px solid var(--color-border); text-align: left; font-size: 0.92em; }
.data-table th { background: var(--color-primary-light); color: var(--color-primary-dark); }
.data-table th.sortable { cursor: pointer; user-select: none; }
.data-table th.sortable:hover { background: #dcebdc; }
.data-table th.sortable::after { content: "⇅"; opacity: 0.4; margin-left: 4px; font-size: 0.85em; }
.data-table th.sort-asc::after { content: "↑"; opacity: 1; }
.data-table th.sort-desc::after { content: "↓"; opacity: 1; }
.row-warn { background: var(--color-warn-bg); }
.row-critical { background: #fde8e6; }

/* ===== Бейджи статусов/приоритетов ===== */
.badge {
    display: inline-block; padding: 3px 10px; border-radius: 999px; font-size: 0.8em; font-weight: 600; color: white;
}
.badge-planned { background: var(--status-planned); }
.badge-ordered { background: var(--status-ordered); }
.badge-transit { background: var(--status-transit); }
.badge-received { background: var(--status-received); }
.badge-new { background: #94a3b8; }
.badge-progress { background: var(--status-ordered); }
.badge-done { background: var(--status-received); }
.badge-low { background: var(--priority-low); }
.badge-normal { background: var(--priority-normal); }
.badge-high { background: var(--priority-high); }

/* ===== Прочие блоки ===== */
.supplier-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap: 14px; }
.supplier-card { background: var(--color-surface); border-radius: var(--radius); padding: 16px 18px; box-shadow: var(--shadow); }
.supplier-card-head { display: flex; justify-content: space-between; align-items: center; margin-bottom: 8px; }
.supplier-fields div { font-size: 0.88em; margin-bottom: 3px; color: var(--color-text); }

.alert-block { background: var(--color-warn-bg); border-left: 4px solid var(--color-warn-border); padding: 12px 16px; border-radius: var(--radius-sm); margin: 16px 0; }
.alert { background: #fdecea; color: var(--color-danger); padding: 10px 14px; border-radius: var(--radius-sm); margin-bottom: 12px; }
.alert-danger { background: #fdecea; color: var(--color-danger); }
.alert-success { background: var(--color-primary-light); color: var(--color-primary-dark); }

.breadcrumbs { font-size: 0.85em; color: var(--color-muted); margin-bottom: 10px; }
.breadcrumbs a { color: var(--color-muted); }

.login-page {
    position: relative; overflow: hidden;
    min-height: 100vh; display: flex; align-items: center; justify-content: center; padding: 24px;
    background: linear-gradient(160deg, var(--color-primary-light) 0%, var(--color-bg) 65%);
}
.login-page::before {
    content: ""; position: absolute; top: -20px; right: -20px; bottom: -20px; left: -20px;
    background-image: url("/static/images/login-bg.jpg");
    background-size: cover; background-position: center;
    filter: blur(6px) saturate(90%) brightness(1.05);
    transform: scale(1.05); /* прячет размытые края от blur */
    z-index: 0;
}
.login-page::after {
    content: ""; position: absolute; top: 0; right: 0; bottom: 0; left: 0;
    background: linear-gradient(160deg, var(--color-primary-light) 0%, var(--color-bg) 70%);
    opacity: 0.72; /* лёгкая "дымка" поверх картинки, чтобы не перетягивала фокус */
    z-index: 1;
}
.login-page > * { position: relative; z-index: 2; }
.login-box {
    width: 100%; max-width: 380px; background: var(--color-surface); padding: 36px 34px 30px;
    border-radius: var(--radius); box-shadow: var(--shadow-lg); text-align: center;
    border-top: 4px solid var(--color-primary);
}
.login-box form { display: flex; flex-direction: column; gap: 5px; margin-top: 18px; text-align: left; }
.login-box label { font-size: 0.82em; color: var(--color-muted); margin-top: 8px; }
.login-box input { padding: 10px 12px; font-size: 0.97em; }
.login-box input:focus {
    outline: none; border-color: var(--color-primary);
    box-shadow: 0 0 0 3px var(--color-primary-light);
}
.login-box button[type="submit"] { margin-top: 16px; padding: 11px 12px; font-size: 0.98em; }
.login-box .alert { text-align: left; }
.login-box > p.muted { margin: 2px 0 0; }
.login-box .small { display: block; margin-top: 16px; }
.login-sunflower { width: 64px; height: 64px; display: block; margin: 0 auto 6px; }
.login-logo { width: 180px; height: auto; display: block; margin: 0 auto; }

.muted { color: var(--color-muted); }
.small { font-size: 0.8em; }
.columns-picker { display: flex; flex-wrap: wrap; gap: 12px; margin-bottom: 10px; }
.checkbox-label { font-size: 0.9em; display: flex; align-items: center; gap: 4px; }
.radio-label { font-size: 0.9em; display: flex; align-items: center; gap: 6px; margin: 3px 0; cursor: pointer; }

/* ===== Товары — массовая установка цен ===== */
.price-modal { max-width: 480px; }
.price-modal h2 { display: flex; align-items: center; gap: 8px; }
.price-modal-section {
    display: flex; flex-direction: column; gap: 2px; margin-bottom: 2px;
    padding-bottom: 10px; border-bottom: 1px dashed var(--color-border);
}
.price-modal-scope { border: 1px solid var(--color-border); border-radius: var(--radius-sm); padding: 10px 12px !important; background: var(--color-bg); }
.price-modal-scope .radio-label { font-weight: 500; }
.price-modal-label {
    font-size: 0.78em; text-transform: uppercase; letter-spacing: 0.03em;
    color: var(--color-muted); font-weight: 700; margin-bottom: 4px;
}

.view-toggle {
    padding: 7px 14px; border-radius: var(--radius-sm); background: var(--color-surface); color: var(--color-primary-dark);
    text-decoration: none; font-size: 0.9em; border: 1px solid var(--color-border);
}
.view-toggle.active { background: var(--color-primary); color: white; }

.legend { display: flex; gap: 16px; margin: 10px 0; flex-wrap: wrap; }
.legend-item { font-size: 0.85em; color: var(--color-muted); display: flex; align-items: center; gap: 5px; }
.dot { width: 10px; height: 10px; border-radius: 50%; display: inline-block; }
.dot-planned { background: var(--status-planned); }
.dot-ordered { background: var(--status-ordered); }
.dot-transit { background: var(--status-transit); }
.dot-received { background: var(--status-received); }

.calendar-grid { width: 100%; border-collapse: collapse; background: var(--color-surface); border-radius: var(--radius); overflow: hidden; box-shadow: var(--shadow); table-layout: fixed; }
.calendar-grid th { background: var(--color-primary-light); color: var(--color-primary-dark); padding: 8px; font-size: 0.85em; }

/* ---- Календарь заказов v2: сетка на CSS grid, статистика, модалки дня ---- */
.cal-stats-grid { margin: 14px 0 18px; }
.stat-card-danger { border-color: var(--color-danger); }
.stat-card-danger .stat-value { color: var(--color-danger); }
.cal-toolbar { justify-content: space-between; }
.cal-nav { display: flex; align-items: center; gap: 10px; }
.cal-nav-btn {
    display: inline-flex; align-items: center; justify-content: center; width: 30px; height: 30px;
    border-radius: 50%; background: var(--color-surface); box-shadow: var(--shadow); text-decoration: none;
    color: var(--color-text); font-weight: 700;
}
.cal-nav-btn:hover { background: var(--color-primary-light); }
.cal-nav-label { min-width: 160px; text-align: center; color: var(--color-primary-dark); }
.cal-today-link {
    font-size: 0.82em; padding: 5px 10px; border-radius: 999px; background: var(--color-primary-light);
    color: var(--color-primary-dark); text-decoration: none; font-weight: 600;
}
.cal-today-link:hover { background: var(--color-primary); color: #fff; }
.cal-filter-form { gap: 8px; }
.cal-reset-link { font-size: 0.82em; color: var(--color-muted); text-decoration: underline; }
.cal-legend { margin-top: 0; }

.cal-grid {
    display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); gap: 6px;
}
.cal-head {
    text-align: center; font-size: 0.8em; font-weight: 700; color: var(--color-primary-dark);
    padding: 6px 0; text-transform: uppercase; letter-spacing: 0.03em;
}
.cal-head-weekend { color: var(--color-danger); opacity: 0.75; }
.cal-cell {
    min-height: 112px; background: var(--color-surface); border-radius: var(--radius-sm);
    box-shadow: 0 1px 2px rgba(0,0,0,0.05); padding: 6px 6px 8px; display: flex; flex-direction: column;
    transition: box-shadow 0.12s ease;
}
.cal-cell:not(.cal-empty):hover { box-shadow: var(--shadow); }
.cal-cell.cal-empty { background: transparent; box-shadow: none; }
.cal-cell.cal-weekend { background: var(--color-bg); }
.cal-cell.cal-today { background: var(--color-warn-bg); box-shadow: 0 0 0 2px var(--color-primary) inset; }
.cal-cell-head { display: flex; align-items: center; justify-content: space-between; margin-bottom: 4px; }
.cal-day-num {
    font-weight: 700; font-size: 0.86em; color: var(--color-muted); background: none; border: none;
    padding: 1px 5px; border-radius: 999px; cursor: default;
}
.cal-day-num.has-events { color: var(--color-primary-dark); background: var(--color-primary-light); cursor: pointer; }
.cal-day-num.has-events:hover { background: var(--color-primary); color: #fff; }
.cal-today .cal-day-num { color: var(--color-primary-dark); }
.cal-add-btn {
    width: 18px; height: 18px; border-radius: 50%; border: none; background: none; color: var(--color-muted);
    font-size: 0.9em; line-height: 1; cursor: pointer; opacity: 0; transition: opacity 0.12s ease, background 0.12s ease;
    display: flex; align-items: center; justify-content: center;
}
.cal-cell:hover .cal-add-btn { opacity: 1; }
.cal-add-btn:hover { background: var(--color-primary-light); color: var(--color-primary-dark); }
@media (hover: none) { .cal-add-btn { opacity: 0.6; } }
.cal-cell-body { display: flex; flex-direction: column; gap: 3px; flex: 1; }
.cal-order {
    display: flex; align-items: center; gap: 3px; font-size: 0.74em; color: white; padding: 3px 6px; border-radius: 5px;
    text-decoration: none; white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.cal-order.dot-planned { background: var(--status-planned); }
.cal-order.dot-ordered { background: var(--status-ordered); }
.cal-order.dot-transit { background: var(--status-transit); }
.cal-order.dot-received { background: var(--status-received); }
.cal-order-arrival {
    background: var(--color-surface) !important; color: var(--color-text) !important;
    border: 1px dashed var(--color-primary); box-shadow: none;
}
.cal-order-arrival .icon { flex-shrink: 0; background-color: var(--color-primary); }
.cal-order-overdue { border-color: var(--color-danger); }
.cal-order-overdue .icon { background-color: var(--color-danger); }
.cal-order-overdue { color: var(--color-danger) !important; }
.cal-more-btn {
    align-self: flex-start; background: none; border: none; color: var(--color-muted); font-size: 0.72em;
    cursor: pointer; padding: 1px 4px; text-decoration: underline;
}
.cal-more-btn:hover { color: var(--color-primary-dark); }
@media (max-width: 860px) {
    .cal-grid { gap: 4px; }
    .cal-cell { min-height: 84px; padding: 4px; }
    .cal-nav-label { min-width: 120px; font-size: 0.9em; }
}
@media (max-width: 640px) {
    .cal-head span, .cal-head { font-size: 0.7em; }
    .cal-order span.icon { display: none; }
}

/* ---- Модалка дня / просроченных поставок ---- */
.day-modal-section-title { font-weight: 700; color: var(--color-primary-dark); margin: 14px 0 6px; font-size: 0.9em; }
.day-modal-section-title:first-child { margin-top: 0; }
.day-order-row {
    padding: 10px 0; border-bottom: 1px solid var(--color-border); display: flex; flex-direction: column; gap: 4px;
}
.day-order-row:last-child { border-bottom: none; }
.day-order-main { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.day-order-supplier { font-weight: 600; color: var(--color-text); text-decoration: none; }
.day-order-supplier:hover { color: var(--color-primary-dark); text-decoration: underline; }
.day-order-meta { font-size: 0.84em; color: var(--color-muted); }
.day-order-status-form select { font-size: 0.82em; margin-top: 2px; }
.day-order-arrival { background: rgba(124, 58, 237, 0.05); border-radius: var(--radius-sm); padding: 10px 8px; }
.overdue-tag {
    font-size: 0.72em; font-weight: 700; color: #fff; background: var(--color-danger);
    padding: 2px 7px; border-radius: 999px; text-transform: uppercase; letter-spacing: 0.02em;
}

/* ===== Модальные окна ===== */
.modal-overlay {
    display: none; position: fixed; inset: 0; background: rgba(0,0,0,0.45);
    align-items: center; justify-content: center; z-index: 100;
}
.modal-overlay.show { display: flex; }
.modal-box {
    background: var(--color-surface); border-radius: var(--radius); padding: 24px;
    width: 90%; max-width: 560px; max-height: 85vh; overflow-y: auto; box-shadow: var(--shadow-lg);
}
.modal-box h2 { margin-top: 0; color: var(--color-primary-dark); font-size: 1.15em; }
.modal-close { float: right; background: none; color: var(--color-muted); border: none; font-size: 1.3em; cursor: pointer; padding: 0; }

/* ===== Тосты ===== */
#toast-container { position: fixed; bottom: 20px; right: 20px; z-index: 200; display: flex; flex-direction: column; gap: 8px; }
.toast {
    background: var(--color-surface); color: var(--color-text); padding: 12px 18px; border-radius: var(--radius-sm);
    box-shadow: var(--shadow-lg); font-size: 0.9em; border-left: 4px solid var(--color-primary);
    animation: toast-in 0.2s ease;
}
.toast.toast-error { border-left-color: var(--color-danger); }
@keyframes toast-in { from { opacity: 0; transform: translateY(8px); } to { opacity: 1; transform: translateY(0); } }

/* ===== Кнопка-ссылка (визуально как button, но <a>) ===== */
.btn-link {
    display: inline-flex; align-items: center; font-size: 0.95em; padding: 9px 12px;
    border-radius: var(--radius-sm); background: var(--color-primary); color: white;
    text-decoration: none; font-weight: 500; border: none; transition: var(--transition);
}
.btn-link:hover { background: var(--color-primary-dark); }
.btn-link-secondary { background: var(--color-surface); color: var(--color-text); border: 1px solid var(--color-border); }
.btn-link-secondary:hover { background: var(--color-primary-light); }

/* ===== Чат: мессенджер (сайдбар диалогов + лента) ===== */
.messenger { display: flex; gap: 16px; height: calc(100vh - 200px); min-height: 420px; }

.messenger-sidebar {
    width: 280px; flex-shrink: 0; background: var(--color-surface); border-radius: var(--radius);
    box-shadow: var(--shadow); overflow-y: auto;
}
.messenger-list { display: flex; flex-direction: column; padding: 8px; }
.conv-section-label { padding: 12px 10px 4px; font-size: 0.72em; text-transform: uppercase; color: var(--color-muted); letter-spacing: 0.02em; }
.conv-item {
    display: flex; gap: 10px; align-items: center; padding: 9px 10px; border-radius: var(--radius-sm);
    text-decoration: none; color: var(--color-text); transition: var(--transition);
}
.conv-item:hover { background: var(--color-primary-light); }
.conv-item.active { background: var(--color-primary-light); }
.conv-item-contact { opacity: 0.85; }
.conv-avatar {
    width: 38px; height: 38px; border-radius: 50%; background: var(--color-primary); color: white;
    display: flex; align-items: center; justify-content: center; font-weight: 700; flex-shrink: 0; font-size: 0.95em;
    overflow: hidden;
}
.conv-avatar-general { background: var(--color-accent); }
.conv-avatar-muted { background: var(--color-muted); }
.conv-info { min-width: 0; flex: 1; }
.conv-name-row { display: flex; justify-content: space-between; gap: 8px; align-items: baseline; }
.conv-name { font-weight: 600; font-size: 0.92em; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.conv-time { font-size: 0.72em; color: var(--color-muted); flex-shrink: 0; }
.conv-preview-row { display: flex; justify-content: space-between; align-items: center; gap: 6px; margin-top: 1px; }
.conv-preview { font-size: 0.82em; color: var(--color-muted); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.conv-unread {
    background: var(--color-primary); color: white; border-radius: 999px; font-size: 0.72em; font-weight: 700;
    min-width: 18px; height: 18px; padding: 0 5px; display: flex; align-items: center; justify-content: center; flex-shrink: 0;
}

.messenger-main {
    flex: 1; min-width: 0; display: flex; flex-direction: column;
    background: transparent;
}
.messenger-header {
    display: flex; align-items: center; gap: 10px; padding: 12px 16px; margin-bottom: 10px;
    background: var(--color-surface); border-radius: var(--radius); box-shadow: var(--shadow);
}

.chat-feed {
    flex: 1; overflow-y: auto; display: flex; flex-direction: column; gap: 10px;
    padding: 16px; background: var(--color-surface); border-radius: var(--radius);
    box-shadow: var(--shadow); scroll-behavior: smooth;
}
.chat-bubble {
    max-width: 70%; padding: 8px 12px; border-radius: var(--radius-sm);
    background: var(--color-primary-light); align-self: flex-start; position: relative;
}
.chat-bubble.mine { align-self: flex-end; background: var(--color-primary); color: white; }
.chat-bubble.mine .chat-author, .chat-bubble.mine .chat-time { color: rgba(255,255,255,0.85); }
.chat-bubble-head { display: flex; justify-content: space-between; gap: 16px; font-size: 0.78em; color: var(--color-muted); margin-bottom: 2px; }
.chat-author { font-weight: 600; }
.chat-text { white-space: pre-wrap; word-break: break-word; font-size: 0.95em; }

/* Разметка Markdown в ответах АгроБота (заголовки, списки, таблицы) */
.chat-md { white-space: normal; word-break: break-word; font-size: 0.95em; line-height: 1.5; }
.chat-md > *:first-child { margin-top: 0; }
.chat-md > *:last-child { margin-bottom: 0; }
.chat-md p { margin: 0 0 8px; }
.chat-md h1, .chat-md h2, .chat-md h3, .chat-md h4, .chat-md h5, .chat-md h6 {
    margin: 12px 0 6px; line-height: 1.3; font-weight: 700;
}
.chat-md h1 { font-size: 1.25em; }
.chat-md h2 { font-size: 1.15em; }
.chat-md h3, .chat-md h4, .chat-md h5, .chat-md h6 { font-size: 1.05em; }
.chat-md ul, .chat-md ol { margin: 0 0 8px; padding-left: 1.3em; }
.chat-md li { margin-bottom: 3px; }
.chat-md strong { font-weight: 700; }
.chat-md code {
    background: rgba(0,0,0,0.08); border-radius: 4px; padding: 1px 5px;
    font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; font-size: 0.9em;
}
.chat-bubble.mine .chat-md code { background: rgba(255,255,255,0.22); }
.chat-md-hr { border: none; border-top: 1px solid var(--color-border); margin: 10px 0; }
.chat-md a { color: inherit; text-decoration: underline; }
.chat-table-wrap { overflow-x: auto; margin: 4px 0 10px; max-width: 100%; }
.chat-md-table { border-collapse: collapse; width: 100%; font-size: 0.92em; }
.chat-md-table th, .chat-md-table td {
    border: 1px solid var(--color-border); padding: 5px 8px; text-align: left; vertical-align: top;
}
.chat-md-table th { background: rgba(0,0,0,0.05); font-weight: 700; }
.chat-bubble.mine .chat-md-table th, .chat-bubble.mine .chat-md-table td { border-color: rgba(255,255,255,0.35); }
.chat-bubble.mine .chat-md-table th { background: rgba(255,255,255,0.15); }
@media (max-width: 720px) {
    .aipage-feed .chat-bubble, .aibot-feed .chat-bubble { max-width: 94%; }
}
.chat-delete-form { display: inline; }
.chat-delete-btn {
    background: none; border: none; color: inherit; opacity: 0.55; cursor: pointer;
    font-size: 0.75em; padding: 2px 0 0; margin-top: 2px;
}
.chat-delete-btn:hover { opacity: 1; background: none; }
.chat-input-bar { display: flex; gap: 8px; margin-top: 12px; align-items: center; }
.chat-input-bar textarea { flex: 1; resize: none; min-height: 44px; max-height: 140px; font-family: inherit; }
.chat-empty { color: var(--color-muted); text-align: center; padding: 20px; }
.chat-tool-btn {
    background: var(--color-surface); border: 1px solid var(--color-border); color: var(--color-text);
    border-radius: var(--radius-sm); width: 44px; height: 44px; flex-shrink: 0; padding: 0;
    display: flex; align-items: center; justify-content: center;
}
.chat-tool-btn .icon { width: 20px; height: 20px; margin-right: 0; }
.chat-tool-btn:hover { background: var(--color-primary-light); }
.chat-input-bar button[type="submit"] { height: 44px; padding: 0 20px; flex-shrink: 0; }

/* Вложения в сообщениях */
.chat-attachment-img { max-width: 260px; max-height: 220px; border-radius: var(--radius-sm); display: block; margin-top: 4px; }
.chat-attachment-file {
    display: flex; align-items: center; gap: 8px; margin-top: 4px; padding: 7px 10px;
    background: rgba(255,255,255,0.35); border-radius: var(--radius-sm); text-decoration: none; color: inherit;
}
.chat-bubble.theirs .chat-attachment-file { background: rgba(0,0,0,0.04); }
.chat-attachment-icon { width: 22px; height: 22px; flex-shrink: 0; }
.chat-attachment-meta { display: flex; flex-direction: column; min-width: 0; }
.chat-attachment-name { font-size: 0.88em; font-weight: 600; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; max-width: 220px; }
.chat-attachment-size { font-size: 0.75em; opacity: 0.75; }

/* Карточка «поделились объектом» в сообщении */
.chat-share-card {
    display: flex; align-items: center; gap: 8px; margin-top: 4px; padding: 8px 10px;
    background: rgba(255,255,255,0.35); border-radius: var(--radius-sm); text-decoration: none; color: inherit;
    border: 1px dashed rgba(0,0,0,0.15);
}
.chat-bubble.theirs .chat-share-card { background: rgba(0,0,0,0.04); }
.chat-share-card-body { display: flex; flex-direction: column; min-width: 0; }
.chat-share-card-type { font-size: 0.7em; text-transform: uppercase; opacity: 0.75; letter-spacing: 0.02em; }
.chat-share-card-label { font-size: 0.9em; font-weight: 600; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; max-width: 220px; }

/* Превью прикреплённого файла / шаринга над строкой ввода */
.chat-share-preview, .chat-file-preview {
    display: flex; align-items: center; gap: 8px; margin-top: 8px; padding: 6px 10px;
    background: var(--color-primary-light); border-radius: var(--radius-sm); width: fit-content;
}
.chat-share-chip { display: flex; align-items: center; gap: 6px; font-size: 0.88em; }
.chip-remove { background: none; border: none; color: var(--color-muted); cursor: pointer; padding: 0 2px; font-size: 0.9em; display: inline-flex; align-items: center; justify-content: center; }
.chip-remove:hover { background: none; color: var(--color-danger); }

/* Модалка «Поделиться» */
.share-type-tabs { display: flex; gap: 6px; flex-wrap: wrap; margin: 12px 0 10px; }
.share-type-tab {
    background: var(--color-surface); border: 1px solid var(--color-border); color: var(--color-text);
    border-radius: 999px; padding: 6px 14px; font-size: 0.85em; cursor: pointer;
}
.share-type-tab.active { background: var(--color-primary); color: white; border-color: var(--color-primary); }
#share-search-input { width: 100%; margin-bottom: 8px; }
.share-results { max-height: 280px; overflow-y: auto; display: flex; flex-direction: column; gap: 4px; }
.share-result-item {
    display: block; width: 100%; text-align: left; background: none; border: none; color: var(--color-text);
    padding: 9px 10px; border-radius: var(--radius-sm); font-size: 0.9em; cursor: pointer;
}
.share-result-item:hover { background: var(--color-primary-light); }

/* Подсветка строки/карточки при переходе из шаринга в чате */
@keyframes row-highlight-flash {
    0% { background: var(--color-accent); }
    100% { background: transparent; }
}
.row-highlight { animation: row-highlight-flash 2s ease; }

/* ===== Заметки ===== */
:root {
    --note-blue: #4f7bb0; --note-blue-bg: #dceaf8; --note-blue-title: #2e5480;
    --note-green: #4f9463; --note-green-bg: #ddf1e3; --note-green-title: #2f6b42;
    --note-yellow: #b98d2e; --note-yellow-bg: #faedc9; --note-yellow-title: #8a6a1e;
    --note-red: #c4544a; --note-red-bg: #f9dcd9; --note-red-title: #963a32;
    --note-purple: #7d63a8; --note-purple-bg: #eae2f6; --note-purple-title: #5c4680;
}
[data-theme="dark"] {
    --note-blue: #7ba3d9; --note-blue-bg: #223349; --note-blue-title: #aecdef;
    --note-green: #6fbb84; --note-green-bg: #1f3728; --note-green-title: #9de0af;
    --note-yellow: #d3a94e; --note-yellow-bg: #3c3018; --note-yellow-title: #eacd82;
    --note-red: #dd7d72; --note-red-bg: #3c2523; --note-red-title: #f2ada3;
    --note-purple: #a58ed1; --note-purple-bg: #2e2740; --note-purple-title: #cdbaee;
}

/* ---- Page head ---- */
.notes-page-head { display:flex; justify-content:space-between; align-items:flex-end; gap:20px; margin-bottom:18px; flex-wrap:wrap; }
.notes-page-head h1 { margin:0 0 4px; }
.notes-head-actions { display:flex; gap:8px; }

/* ---- Quick-create panel ---- */
.note-quick-create { margin:0 0 22px; padding:18px 20px; }
.note-quick-form { display:grid; grid-template-columns:minmax(0,1fr) 240px; gap:20px; }
.note-quick-main { display:flex; flex-direction:column; gap:10px; min-width:0; }
.note-quick-main input, .note-quick-main textarea { width:100%; }
.note-quick-main input[name="title"] { font-size:1.05em; font-weight:600; }
.note-quick-main textarea { min-height:74px; resize:vertical; line-height:1.5; }
.note-quick-side { display:flex; flex-direction:column; gap:8px; padding-left:20px; border-left:1px solid var(--color-border); }
.note-quick-side input:not([type="checkbox"]), .note-quick-side select { width:100%; }
.note-quick-side button[type="submit"] { margin-top:auto; font-weight:600; }
@media (max-width:760px) {
    .note-quick-form { grid-template-columns:1fr; }
    .note-quick-side { padding-left:0; border-left:none; border-top:1px solid var(--color-border); padding-top:12px; }
}

/* ---- Filters ---- */
.notes-filters { display:flex; gap:12px; align-items:center; flex-wrap:wrap; margin:0 0 18px; }
.notes-search-form { flex:1 1 280px; position:relative; }
.notes-search-form input { width:100%; padding-left:34px; }
.notes-search-form::before {
    content:"⌕"; position:absolute; left:11px; top:50%; transform:translateY(-50%);
    color:var(--color-muted); font-size:1.1em; pointer-events:none;
}
.notes-tags-filter { display:flex; gap:6px; flex-wrap:wrap; }
.filter-chip { text-decoration:none; color:var(--color-text); background:var(--color-surface); border:1px solid var(--color-border); border-radius:999px; padding:6px 12px; font-size:.82em; transition:var(--transition); }
.filter-chip:hover { border-color:var(--color-primary); }
.filter-chip.active { background:var(--color-primary); border-color:var(--color-primary); color:#fff; }

/* ---- Notes grid & card ---- */
.notes-grid, .notes-grid-rich { display:grid; grid-template-columns:repeat(auto-fill, minmax(272px, 1fr)); gap:16px; align-items:stretch; }
.note-card {
    position:relative; background:var(--color-surface); border-radius:var(--radius);
    padding:16px 17px 14px; box-shadow:var(--shadow); display:flex; flex-direction:column; gap:9px;
    border:1px solid var(--color-border); border-top:3px solid var(--color-border);
    min-height:190px; transition:var(--transition);
}
.note-card:hover { box-shadow:var(--shadow-lg); transform:translateY(-1px); }
.note-card.pinned { border-top-color:var(--color-accent); }
.note-color-blue { background:var(--note-blue-bg); border-color:var(--note-blue); }
.note-color-blue .note-title { color:var(--note-blue-title); }
.note-color-green { background:var(--note-green-bg); border-color:var(--note-green); }
.note-color-green .note-title { color:var(--note-green-title); }
.note-color-yellow { background:var(--note-yellow-bg); border-color:var(--note-yellow); }
.note-color-yellow .note-title { color:var(--note-yellow-title); }
.note-color-red { background:var(--note-red-bg); border-color:var(--note-red); }
.note-color-red .note-title { color:var(--note-red-title); }
.note-color-purple { background:var(--note-purple-bg); border-color:var(--note-purple); }
.note-color-purple .note-title { color:var(--note-purple-title); }
.note-card[class*="note-color-"] .note-card-foot { border-top-color:rgba(0,0,0,.08); }

.note-card-head { display:flex; justify-content:space-between; align-items:flex-start; gap:8px; }
.note-title { margin:0; font-size:1em; color:var(--color-primary-dark); word-break:break-word; line-height:1.35; }
.note-card.pinned .note-title::before { content:"📌 "; font-size:.85em; }
.note-preview { margin:0; font-size:.87em; color:var(--color-text); white-space:pre-wrap; word-break:break-word; flex:1; display:-webkit-box; -webkit-line-clamp:4; -webkit-box-orient:vertical; overflow:hidden; }

.note-meta-row { display:flex; gap:5px; flex-wrap:wrap; }
.note-badge { display:inline-flex; align-items:center; padding:3px 8px; border-radius:999px; background:var(--color-bg); color:var(--color-muted); font-size:.72em; white-space:nowrap; }
.priority-high .note-badge:first-child { background:rgba(217,119,6,.14); color:var(--status-planned); }
.priority-urgent .note-badge:first-child { background:rgba(196,84,74,.14); color:var(--note-red); }

.note-tags { display:flex; gap:5px; flex-wrap:wrap; }
.note-tags a { text-decoration:none; font-size:.78em; color:var(--color-primary); background:var(--color-primary-light); padding:2px 8px; border-radius:999px; }
.note-tags a:hover { background:var(--color-border); }

.note-related { display:flex; align-items:center; gap:5px; margin-top:-2px; padding:7px 10px; border-radius:8px; background:var(--color-primary-light); color:var(--color-primary-dark); text-decoration:none; font-size:.8em; }
.note-related::after { content:"→"; margin-left:auto; opacity:.7; }

.note-checklist-mini { display:grid; grid-template-columns:1fr auto; gap:3px 10px; align-items:center; font-size:.78em; color:var(--color-muted); }
.note-checklist-mini strong { color:var(--color-text); }
.check-progress { grid-column:1 / -1; height:5px; background:var(--color-bg); border-radius:999px; overflow:hidden; }
.check-progress i { display:block; height:100%; background:var(--color-primary); border-radius:999px; }

.note-card-foot { display:flex; flex-wrap:wrap; justify-content:space-between; align-items:center; gap:6px; margin-top:auto; padding-top:9px; border-top:1px solid var(--color-border); }
.note-date { font-size:.74em; }
.note-actions { display:flex; flex-wrap:wrap; gap:2px; }
.note-action-form { display:inline; }
.note-action-btn {
    background:none; border:1px solid transparent; cursor:pointer; font-size:.78em; padding:5px 8px;
    border-radius:var(--radius-sm); text-decoration:none; line-height:1; color:var(--color-muted);
}
.note-action-btn:hover { background:var(--color-primary-light); color:var(--color-primary-dark); }
.note-action-btn.danger:hover { background:rgba(192,57,43,.1); color:var(--color-danger); }

.notes-empty { text-align:center; padding:56px 20px; background:var(--color-surface); border-radius:var(--radius); box-shadow:var(--shadow); }
.notes-empty-icon { font-size:2.2em; color:var(--color-primary); margin-bottom:6px; }

/* ---- Editor ---- */
.note-editor-header { display:flex; justify-content:space-between; align-items:center; gap:20px; margin-bottom:10px; }
.note-editor-eyebrow { font-size:.78em; text-transform:uppercase; letter-spacing:.04em; color:var(--color-muted); font-weight:600; }
.note-autosave-pill { display:inline-flex; align-items:center; gap:5px; padding:5px 11px; border-radius:999px; background:var(--color-primary-light); }
.note-editor { max-width:1240px; margin-top:6px; }
#note-title { width:100%; font-size:1.5em; font-weight:700; padding:12px 14px; margin-bottom:14px; color:var(--color-primary-dark); }
.note-editor-grid { display:grid; grid-template-columns:minmax(0,1fr) 320px; gap:18px; align-items:start; }
.note-editor-main { min-width:0; }
.note-editor-main textarea { width:100%; min-height:560px; resize:vertical; line-height:1.65; border-radius:0 0 var(--radius) var(--radius); border-top:none; }
.note-toolbar { display:flex; align-items:center; gap:4px; flex-wrap:wrap; padding:7px; border:1px solid var(--color-border); border-bottom:none; background:var(--color-bg); border-radius:var(--radius) var(--radius) 0 0; }
.note-toolbar button { min-width:34px; border:1px solid var(--color-border); background:var(--color-surface); border-radius:6px; padding:6px 9px; cursor:pointer; color:var(--color-text); }
.note-toolbar button:hover { background:var(--color-primary-light); }
.toolbar-note { margin-left:auto; font-size:.74em; color:var(--color-muted); }

.note-editor-side { display:flex; flex-direction:column; gap:14px; }
.note-side-section { padding:16px; border:1px solid var(--color-border); background:var(--color-surface); border-radius:var(--radius); box-shadow:var(--shadow); }
.note-side-section h3 { margin:0 0 12px; font-size:.85em; text-transform:uppercase; letter-spacing:.03em; color:var(--color-muted); font-weight:600; }
.note-side-section label { display:block; font-size:.8em; color:var(--color-muted); margin:10px 0 5px; }
.note-side-section label:first-of-type { margin-top:0; }
.note-side-section input:not([type="checkbox"]), .note-side-section select { width:100%; }
.color-field { margin:10px 0 5px; }
.color-swatch-row { display:flex; gap:9px; flex-wrap:wrap; align-items:center; padding:3px 0 2px; }
.color-swatch {
    width:26px; height:26px; padding:0; border-radius:50%; cursor:pointer;
    border:2px solid transparent; box-shadow:inset 0 0 0 1px rgba(0,0,0,.08); transition:var(--transition);
}
.color-swatch:hover { transform:scale(1.14); }
.color-swatch.selected { border-color:var(--color-primary-dark); box-shadow:0 0 0 2px var(--color-surface), 0 0 0 4px var(--color-primary-dark); }
.color-swatch[data-color="default"] { background:var(--color-surface); box-shadow:inset 0 0 0 1px var(--color-border); }
.color-swatch[data-color="default"].selected { box-shadow:inset 0 0 0 1px var(--color-border), 0 0 0 2px var(--color-surface), 0 0 0 4px var(--color-primary-dark); }
.color-swatch[data-color="blue"] { background:var(--note-blue); }
.color-swatch[data-color="green"] { background:var(--note-green); }
.color-swatch[data-color="yellow"] { background:var(--note-yellow); }
.color-swatch[data-color="red"] { background:var(--note-red); }
.color-swatch[data-color="purple"] { background:var(--note-purple); }
.note-side-section .checkbox-label, .note-quick-side .checkbox-label {
    display:flex; align-items:center; gap:8px; margin:0; font-size:.85em; color:var(--color-text);
}
.note-side-toggles { display:flex; flex-direction:column; gap:9px; margin-top:10px; padding-top:12px; border-top:1px solid var(--color-border); }

#checklist-items { display:flex; flex-direction:column; gap:6px; margin-bottom:8px; }
.checklist-editor-row { display:grid; grid-template-columns:auto 1fr auto; gap:8px; align-items:center; }
.checklist-editor-row input[type="text"] { width:100%; }
.checklist-editor-row input[type="checkbox"] { accent-color:var(--color-primary); }
.checklist-editor-row button { border:0; background:none; cursor:pointer; color:var(--color-muted); font-size:1.15em; padding:2px 6px; line-height:1; }
.checklist-editor-row button:hover { color:var(--color-danger); }
#checklist-add { width:100%; text-align:center; }

.note-save-toolbar { margin:0 0 16px; display:flex; align-items:center; gap:10px; }

@media (max-width:920px) {
    .note-editor-grid { grid-template-columns:1fr; }
}

/* ===== Адаптив ===== */
@media (max-width: 1300px) {
    :root { --sidebar-width: 190px; }
    .container { padding: 24px 64px 50px 20px; }
}
@media (max-width: 860px) {
    .burger { display: block; }
    .sidebar {
        position: fixed; top: 0; left: 0; bottom: 0; z-index: 60;
        transform: translateX(-100%);
    }
    .sidebar.open { transform: translateX(0); }
    .container { padding: 70px 60px 40px 16px; }
    .grid-form { grid-template-columns: 1fr 1fr; }
    .side-toolbar { top: 10px; right: 12px; gap: 8px; }
    .side-toolbar .notif-bell-btn, .side-toolbar .theme-toggle-btn, .side-toolbar .mchat-btn { width: 44px; height: 44px; }
    .side-toolbar .notif-bell-btn .icon, .side-toolbar .theme-toggle-btn .icon, .side-toolbar .mchat-btn .icon { width: 24px; height: 24px; }
    .aibot-wrap { bottom: 20px; right: 20px; }
    .aibot-btn { width: 56px; height: 56px; }
    .mchat-panel { width: min(340px, calc(100vw - 24px)); }
    .aibot-panel { width: min(340px, calc(100vw - 24px)); }
}
@media (max-width: 480px) {
    .grid-form { grid-template-columns: 1fr; }
    .cards { grid-template-columns: 1fr; }
    .container { padding: 62px 50px 30px 12px; }
    .side-toolbar { right: 8px; gap: 6px; }
    .side-toolbar .notif-bell-btn, .side-toolbar .theme-toggle-btn, .side-toolbar .mchat-btn { width: 42px; height: 42px; }
    .side-toolbar .notif-bell-btn .icon, .side-toolbar .theme-toggle-btn .icon, .side-toolbar .mchat-btn .icon { width: 22px; height: 22px; }
    .aibot-wrap { bottom: 16px; right: 14px; }
    .aibot-btn { width: 52px; height: 52px; }
    .mchat-panel { width: min(300px, calc(100vw - 16px)); }
    .aibot-panel { width: min(300px, calc(100vw - 16px)); }
}
@media (max-width: 700px) {
    .messenger { flex-direction: column; height: auto; }
    .messenger-sidebar { width: 100%; max-height: 220px; }
    .chat-feed { height: 55vh; }
    .chat-attachment-name, .chat-share-card-label { max-width: 160px; }
}

/* ===== v4: CRM UX ===== */
.panel-head-row { display:flex; align-items:center; justify-content:space-between; gap:12px; margin-bottom:10px; }
.panel-head-row h3 { margin-bottom:0; }
.procurement-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(260px,1fr)); gap:10px; }
.procurement-item { display:flex; flex-direction:column; gap:7px; padding:13px 14px; border:1px solid var(--color-border); border-radius:10px; text-decoration:none; color:var(--color-text); background:var(--color-bg); border-left:4px solid var(--color-primary); transition:var(--transition); }
.procurement-item:hover { transform:translateY(-1px); box-shadow:var(--shadow); }
.procurement-critical { border-left-color:var(--color-danger); }
.procurement-high { border-left-color:var(--status-planned); }
.procurement-main { display:flex; justify-content:space-between; gap:8px; align-items:baseline; }
.procurement-main strong { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.procurement-main span { font-size:.74em; color:var(--color-danger); white-space:nowrap; }
.procurement-meta { display:flex; justify-content:space-between; color:var(--color-muted); font-size:.82em; }
.procurement-meta b { color:var(--color-primary-dark); }
.procurement-item small { color:var(--color-muted); }
.page-back { margin-bottom:8px; }
.entity-header { display:flex; justify-content:space-between; align-items:flex-start; gap:20px; }
.eyebrow { color:var(--color-muted); font-size:.78em; text-transform:uppercase; letter-spacing:.05em; }
.entity-header h1 { margin-bottom:4px; }
.btn-primary-link { display:inline-flex; align-items:center; padding:10px 15px; border-radius:var(--radius-sm); background:var(--color-primary); color:white; text-decoration:none; }
.entity-stats { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:12px; margin:16px 0; }
.entity-stat { background:var(--color-surface); border:1px solid var(--color-border); border-radius:var(--radius); padding:16px; box-shadow:var(--shadow); }
.entity-stat span { display:block; color:var(--color-muted); font-size:.8em; margin-bottom:5px; }
.entity-stat strong { font-size:1.25em; }
.stat-warn { border-color:var(--color-warn-border); background:var(--color-warn-bg); }
.recommendation-banner { padding:12px 15px; border-radius:var(--radius-sm); background:var(--color-primary-light); margin-bottom:16px; }
.detail-grid, .analytics-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:16px; }
.detail-list { display:grid; grid-template-columns:150px 1fr; gap:9px 15px; margin:0; }
.detail-list dt { color:var(--color-muted); }
.detail-list dd { margin:0; }
.empty-state { color:var(--color-muted); padding:12px; }
@media (max-width:860px) { .entity-stats { grid-template-columns:repeat(2,1fr); } .detail-grid, .analytics-grid { grid-template-columns:1fr; } .entity-header { flex-direction:column; } }
@media (max-width:480px) { .entity-stats { grid-template-columns:1fr 1fr; } .procurement-main { flex-direction:column; gap:2px; } }


/* ===== Встроенные стикеры мессенджера ===== */
.chat-sticker-btn { font-size: 24px; line-height: 1; }
.chat-sticker-face { display:inline-flex; width: 24px; height: 24px; align-items:center; justify-content:center; font-size: 24px; font-weight: 700; }
.chat-text { overflow-wrap: anywhere; }
.chat-sticker-inline {
    display: inline-block;
    width: 84px;
    height: 84px;
    object-fit: contain;
    vertical-align: middle;
    margin: 2px 3px;
    border-radius: 10px;
}
.modal-sticker-box { max-width: 720px !important; }
.sticker-modal-head h2 { margin: 0 0 2px; }
.sticker-modal-head p { margin: 0; }
.sticker-pack-tabs {
    display: flex;
    gap: 8px;
    overflow-x: auto;
    padding: 12px 0 10px;
    scrollbar-width: thin;
}
.sticker-pack-tab {
    flex: 0 0 auto;
    border: 1px solid var(--color-border);
    background: var(--color-surface);
    color: var(--color-text);
    border-radius: 999px;
    padding: 8px 14px;
    cursor: pointer;
    font-weight: 600;
}
.sticker-pack-tab:hover,
.sticker-pack-tab.active {
    background: var(--color-primary-light);
    border-color: var(--color-primary);
    color: var(--color-primary-dark);
}
.sticker-grid {
    display: grid;
    grid-template-columns: repeat(6, minmax(0, 1fr));
    gap: 8px;
    max-height: 58vh;
    overflow-y: auto;
    padding: 4px;
}
.sticker-choice {
    min-width: 0;
    aspect-ratio: 1;
    border: 1px solid transparent;
    border-radius: 12px;
    background: transparent;
    padding: 5px;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
}
.sticker-choice:hover {
    background: var(--color-primary-light);
    border-color: var(--color-border);
    transform: translateY(-1px);
}
.sticker-choice img {
    width: 100%;
    height: 100%;
    object-fit: contain;
    display: block;
}
@media (max-width: 720px) {
    .sticker-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); }
    .chat-sticker-inline { width: 72px; height: 72px; }
}
@media (max-width: 420px) {
    .sticker-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}


/* Сводка: быстрый контроль */


.summary-analytics { margin-top:16px; }

/* ---------- Corporate Knowledge Base ---------- */
.kb-shell{display:grid;grid-template-columns:250px minmax(0,1fr) 250px;gap:16px;align-items:start}
.kb-left,.kb-right{padding:15px;position:sticky;top:14px;max-height:calc(100vh - 28px);overflow:auto}
.kb-main{min-width:0}.kb-brand{display:flex;gap:10px;align-items:center;padding:4px 2px 14px;border-bottom:1px solid var(--color-border)}
.kb-brand>span{font-size:2em}.kb-brand strong{display:block}.kb-brand small{display:block;color:var(--color-muted);font-size:.75em;margin-top:2px}
.kb-brand .icon,.kb-space-link .icon,.kb-topline h1 .icon{width:18px;height:18px;vertical-align:-3px}
.kb-page-card-icon .icon{width:28px;height:28px;vertical-align:-6px}
.kb-page-icon-big .icon{width:32px;height:32px;vertical-align:-6px}
.kb-empty-icon .icon{width:42px;height:42px;vertical-align:-8px}
.kb-new-btn{display:block;text-decoration:none;text-align:center;padding:9px 10px;border-radius:9px;background:var(--color-primary);color:#fff;font-weight:600;margin:14px 0}
.kb-icon-picker{display:flex;gap:8px;align-items:center}.kb-icon-picker .icon{width:22px;height:22px;flex:none;background-color:var(--color-text)}.kb-icon-picker select{flex:1}
.kb-space-list{display:flex;flex-direction:column;gap:4px}.kb-space-link{display:flex;gap:9px;align-items:center;padding:8px 10px;border-radius:8px;text-decoration:none;color:var(--color-text);font-size:.9em}.kb-space-link:hover,.kb-space-link.active{background:var(--color-primary-light);color:var(--color-primary-dark)}
.kb-side-section{padding-top:16px;margin-top:12px;border-top:1px solid var(--color-border)}.kb-side-title{font-weight:700;margin-bottom:6px}
.kb-topline{display:flex;justify-content:space-between;align-items:end;gap:14px;margin-bottom:16px}.kb-topline h1{margin:0}.kb-search{display:flex;gap:8px;min-width:340px}.kb-search input{flex:1}.kb-page-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:14px}.kb-page-card{display:grid;grid-template-columns:40px 1fr;gap:12px;padding:16px;border:1px solid var(--color-border);background:var(--color-surface);border-radius:12px;text-decoration:none;color:inherit;box-shadow:var(--shadow);transition:transform .15s,box-shadow .15s}.kb-page-card:hover{transform:translateY(-2px)}.kb-page-card-icon{font-size:1.8em}.kb-page-card h3{margin:0 0 5px;font-size:1em}.kb-page-card p{margin:0;color:var(--color-muted);font-size:.84em;line-height:1.5}.kb-card-meta{display:flex;gap:8px;align-items:center;color:var(--color-muted);font-size:.73em;margin-top:10px}.kb-status{padding:3px 7px;border-radius:999px;font-size:.72em;font-weight:700}.kb-status-current{background:#e8f6ea;color:#287a37}.kb-status-review{background:#fff4d8;color:#8a6500}.kb-status-outdated{background:#fde7e7;color:#9b3131}
.kb-read-shell{grid-template-columns:230px minmax(0,1fr) 230px}.kb-tree{font-size:.86em}.kb-tree-item a{display:block;padding:6px 8px;border-radius:7px;text-decoration:none;color:var(--color-text)}.kb-tree-item.active>a,.kb-tree-item a:hover{background:var(--color-primary-light);color:var(--color-primary-dark)}.kb-tree-children{padding-left:12px;border-left:1px solid var(--color-border);margin-left:10px}.kb-breadcrumbs{display:flex;gap:8px;align-items:center;flex-wrap:wrap;color:var(--color-muted);font-size:.78em;margin-bottom:16px}.kb-breadcrumbs a{color:var(--color-muted);text-decoration:none}.kb-reader-head{display:flex;justify-content:space-between;gap:20px;align-items:start}.kb-title-line{display:flex;gap:10px;align-items:center}.kb-title-line h1{margin:0}.kb-page-icon-big{font-size:2.2em}.kb-page-actions{display:flex;gap:8px;align-items:center}.icon-action{width:42px;height:42px;border:1px solid var(--color-border);border-radius:10px;background:var(--color-surface);font-size:1.2em;cursor:pointer}.kb-article{padding:24px 4px;line-height:1.7;font-size:1em}.kb-article h2,.kb-article h3,.kb-article h4{scroll-margin-top:20px;color:var(--color-primary-dark)}.kb-article h2{font-size:1.55em;margin-top:26px}.kb-article h3{font-size:1.25em;margin-top:20px}.kb-article p{margin:0 0 13px}.kb-article blockquote{margin:14px 0;padding:10px 14px;border-left:4px solid var(--color-accent);background:var(--color-bg);border-radius:6px;color:var(--color-muted)}.kb-article pre{overflow:auto;padding:13px;background:#1e2329;color:#f4f5f6;border-radius:9px}.kb-article code{padding:2px 5px;background:var(--color-bg);border-radius:4px}.kb-article a{color:var(--color-primary)}.kb-wiki-link{font-weight:600}.kb-wiki-missing{color:var(--color-danger)}.kb-mention{background:var(--color-primary-light);padding:1px 5px;border-radius:6px}.kb-spacer{height:6px}.kb-tags,.kb-related-box,.kb-related-section{margin-top:18px}.kb-tags{display:flex;gap:6px;flex-wrap:wrap}.kb-tags span{padding:4px 8px;border-radius:999px;background:var(--color-bg);color:var(--color-muted);font-size:.78em}.kb-related-box{display:flex;gap:8px;flex-wrap:wrap;padding:12px;border-radius:10px;background:var(--color-primary-light)}.kb-link-grid{display:flex;flex-wrap:wrap;gap:8px}.kb-link-grid a{padding:8px 10px;border:1px solid var(--color-border);border-radius:8px;text-decoration:none;color:var(--color-text)}.kb-attachments{display:flex;flex-direction:column;gap:6px}.kb-attachments a{display:flex;justify-content:space-between;gap:8px;padding:8px 10px;background:var(--color-bg);border-radius:8px;text-decoration:none;color:var(--color-text)}.kb-attachments span{color:var(--color-muted);font-size:.8em}.kb-upload-form{display:flex;gap:8px;align-items:center;margin-top:10px}.kb-comments{margin-top:26px}.kb-comment{display:grid;grid-template-columns:36px 1fr;gap:10px;padding:10px 0;border-bottom:1px solid var(--color-border)}.kb-avatar{width:36px;height:36px;border-radius:50%;display:grid;place-items:center;background:var(--color-primary-light);color:var(--color-primary-dark);font-weight:700;overflow:hidden}.kb-comment small{display:block;color:var(--color-muted);font-size:.7em}.kb-comment p{margin:5px 0 0;white-space:pre-wrap}.kb-comment-form{margin-top:12px;display:flex;flex-direction:column;gap:8px}.kb-mini-list{display:flex;flex-direction:column;gap:7px}.kb-mini-list>div{display:flex;justify-content:space-between;font-size:.78em}.kb-mini-list span{color:var(--color-muted)}.kb-toc{display:flex;flex-direction:column;gap:5px}.kb-toc a{text-decoration:none;color:var(--color-muted);font-size:.77em}.kb-toc-h3{padding-left:8px}.kb-toc-h4{padding-left:16px}.kb-empty{padding:50px;text-align:center}.kb-empty-icon{font-size:3em}.kb-editor-page{max-width:1250px;margin:0 auto}.kb-editor-head{margin-bottom:15px}.kb-editor-head h1{margin:6px 0 2px}.kb-editor-grid{display:grid;grid-template-columns:minmax(0,1fr) 300px;gap:16px}.kb-title-input{font-size:1.8em;padding:12px 14px;margin-bottom:8px}.kb-editor-toolbar{display:flex;gap:5px;padding:7px;border:1px solid var(--color-border);background:var(--color-bg);border-radius:9px 9px 0 0}.kb-editor-toolbar button{min-width:36px;padding:7px;border:1px solid var(--color-border);border-radius:6px;background:var(--color-surface);cursor:pointer}.kb-editor-grid textarea{width:100%;min-height:520px;resize:vertical;border-radius:0 0 9px 9px;font-family:ui-monospace,SFMono-Regular,Consolas,monospace;line-height:1.6}.kb-editor-preview{margin-top:10px;border:1px solid var(--color-border);border-radius:9px;padding:12px;background:var(--color-surface)}.kb-editor-preview #kb-preview{margin-top:8px;line-height:1.55}.kb-wiki-preview{color:var(--color-primary)}.kb-editor-side{display:flex;flex-direction:column;gap:10px}.kb-side-section{padding:13px;border:1px solid var(--color-border);border-radius:10px;background:var(--color-surface)}.kb-side-section h3{margin:0 0 9px}.kb-side-section label{display:block;color:var(--color-muted);font-size:.78em;margin:8px 0 4px}.kb-side-section select,.kb-side-section input{width:100%}.kb-version-list{display:flex;flex-direction:column;gap:8px;font-size:.8em}.kb-version-list div{display:grid;grid-template-columns:1fr 1fr auto;gap:6px;align-items:center}.kb-version-list span{color:var(--color-muted)}.kb-editor-actions{display:flex;gap:8px;margin-top:12px}.btn-link-danger{border:1px solid var(--color-danger);color:var(--color-danger);background:transparent;border-radius:8px;padding:8px 12px;cursor:pointer}
@media(max-width:1100px){.kb-shell,.kb-read-shell{grid-template-columns:200px minmax(0,1fr)}.kb-right{display:none}.kb-search{min-width:240px}.kb-editor-grid{grid-template-columns:1fr}}
@media(max-width:720px){.kb-shell,.kb-read-shell{grid-template-columns:1fr}.kb-left{position:static;max-height:none}.kb-topline{display:block}.kb-search{margin-top:10px;min-width:0}.kb-page-grid{grid-template-columns:1fr}.kb-reader-head{display:block}.kb-page-actions{margin-top:10px}.kb-upload-form{display:block}.kb-upload-form input{width:100%;margin-bottom:6px}}

.kb-task-item{display:flex;gap:8px;align-items:flex-start;margin:5px 0}.kb-progress-label{font-size:.8em;color:var(--color-muted);margin-top:8px}.kb-check-row{display:flex;gap:8px;padding:6px 0;border-bottom:1px solid var(--color-border)}.kb-check-edit-row{display:grid;grid-template-columns:26px 1fr 30px;gap:5px;margin:6px 0}.kb-check-edit-row input[type=text]{min-width:0}.kb-check-edit-row button{border:0;background:transparent;cursor:pointer;color:var(--color-danger)}

/* v2.2 warehouse-aware dashboard/product card */
.product-stock-stats .entity-stat small { display:block; margin-top:5px; color:var(--color-muted); font-size:.78em; }
.warehouse-hero { display:flex; justify-content:space-between; align-items:center; gap:16px; background:var(--color-primary-light); border-radius:var(--radius); padding:14px 18px; margin:14px 0 4px; }
.warehouse-hero span { color:var(--color-primary-dark); font-size:.9em; font-weight:600; }
.warehouse-hero strong { color:var(--color-primary-dark); font-size:1.5em; white-space:nowrap; }
.warehouse-kpi-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:12px; margin:16px 0; }
.warehouse-kpi { display:flex; align-items:center; gap:12px; background:var(--color-surface); border:1px solid var(--color-border); border-radius:var(--radius); padding:14px 16px; box-shadow:var(--shadow); transition:var(--transition); }
.warehouse-kpi:hover { transform:translateY(-1px); box-shadow:var(--shadow-lg); }
/* Иконка КПИ — векторный SVG (чёткий на любом масштабе) на сплошной цветной плашке.
   Раньше здесь была растровая PNG-маска низкого разрешения тёмно-зелёным по светло-зелёному —
   почти нулевой контраст плюс размытие при масштабировании, отсюда и "смазанные" иконки. */
.warehouse-kpi-icon { position:relative; display:flex; align-items:center; justify-content:center; flex-shrink:0; width:48px; height:48px; border-radius:50%; background:var(--color-primary-light); color:var(--color-primary-dark); }
.warehouse-kpi-icon svg { position:absolute; top:50%; left:50%; transform:translate(-50%,-50%); width:26px; height:26px; }
/* У каждого показателя — свой акцентный цвет для быстрого визуального различения */
.warehouse-kpi-icon--reserved { background:rgba(217,119,6,.14); color:var(--status-planned); }
.warehouse-kpi-icon--available { background:rgba(37,99,235,.14); color:var(--status-ordered); }
.warehouse-kpi-icon--locations { background:rgba(124,58,237,.14); color:var(--status-transit); }
.warehouse-kpi span { display:block; color:var(--color-muted); font-size:.82em; }
.warehouse-kpi strong { display:block; margin-top:3px; font-size:1.3em; }
.warehouse-location-list { display:grid; gap:2px; align-content:start; }
.warehouse-location-row { display:flex; justify-content:space-between; align-items:center; gap:12px; padding:9px 8px; margin:0 -8px; border-radius:var(--radius-sm); border-bottom:1px solid var(--color-border); color:var(--color-text); text-decoration:none; transition:var(--transition); }
.warehouse-location-row:hover { background:var(--color-primary-light); color:var(--color-primary-dark); }
.warehouse-location-row span { text-decoration:underline; text-decoration-color:transparent; }
.warehouse-location-row:hover span { text-decoration-color:currentColor; }
.warehouse-location-row strong { font-variant-numeric:tabular-nums; }
.warehouse-location-row:last-child { border-bottom:0; }
.success-banner { margin:16px 0; padding:13px 16px; border-radius:var(--radius); background:var(--color-primary-light); color:var(--color-primary-dark); }
.text-danger { color:var(--color-danger); }
.text-success { color:var(--status-received); }

/* Общий заголовок страницы + сетка сводных карточек (аналитика и т.п.) */
.page-head { display:flex; justify-content:space-between; align-items:flex-start; gap:20px; margin-bottom:14px; }
.page-head h1 { margin-bottom:4px; }
.trend-badge { display:inline-flex; align-items:center; gap:2px; font-size:.7em; font-weight:700; padding:2px 7px; border-radius:999px; margin-left:7px; vertical-align:middle; }
.trend-badge.up { background:var(--color-primary-light); color:var(--color-primary-dark); }
.trend-badge.down { background:#fde8e6; color:var(--color-danger); }
.overview-section-head { display:flex; justify-content:space-between; align-items:center; gap:12px; margin-bottom:4px; }
.overview-section-head h2 { margin:0; }
.period-pills { display:flex; flex-wrap:wrap; gap:8px; margin-bottom:12px; }
.stats-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:12px; margin:16px 0; }
.stat-card { background:var(--color-surface); border:1px solid var(--color-border); border-radius:var(--radius); padding:16px; box-shadow:var(--shadow); }
.stat-card .stat-value { display:block; font-size:1.3em; font-weight:700; color:var(--color-primary-dark); }
.stat-card .stat-label { display:block; color:var(--color-muted); font-size:.8em; margin-top:5px; }
.table-wrap { width:100%; overflow-x:auto; -webkit-overflow-scrolling:touch; border-radius:var(--radius); }
.plan-progress { background:var(--color-border); border-radius:999px; height:10px; overflow:hidden; margin-top:8px; }
.plan-progress-fill { height:100%; background:var(--color-primary); border-radius:999px; transition:var(--transition); }
.plan-progress-fill.over { background:var(--status-received); }
.period-nav { display:flex; align-items:center; gap:10px; }
.period-nav strong { min-width:140px; text-align:center; }

@media (max-width:860px) { .warehouse-kpi-grid { grid-template-columns:repeat(2,minmax(0,1fr)); } .stats-grid { grid-template-columns:repeat(2,1fr); } .page-head { flex-direction:column; } }
@media (max-width:480px) { .warehouse-kpi-grid { grid-template-columns:1fr 1fr; } .stats-grid { grid-template-columns:1fr 1fr; } }
/* Панель управления: вкладки + матрица прав доступа */
.admin-tabs { display:flex; gap:6px; margin-bottom:16px; border-bottom:1px solid var(--color-border); }
.admin-tab-btn { padding:9px 16px; border:none; background:none; cursor:pointer; font-size:0.95em; color:var(--color-muted); border-bottom:2px solid transparent; margin-bottom:-1px; }
.admin-tab-btn:hover { color:var(--color-text); }
.admin-tab-btn.active { color:var(--color-primary-dark); border-bottom-color:var(--color-primary); font-weight:600; }
.admin-tab-panel { display:none; }
.admin-tab-panel.active { display:block; }
.perm-grid-wrap { max-height:60vh; overflow-y:auto; border:1px solid var(--color-border); border-radius:var(--radius); }
.perm-grid { width:100%; border-collapse:collapse; font-size:0.88em; }
.perm-grid th, .perm-grid td { padding:8px 10px; border-bottom:1px solid var(--color-border); text-align:center; }
.perm-grid th:first-child, .perm-grid td:first-child { text-align:left; }
.perm-grid thead th { background:var(--color-primary-light); color:var(--color-primary-dark); position:sticky; top:0; }
.perm-grid td.perm-dash { color:var(--color-muted); }
.perm-grid input[type="checkbox"] { accent-color:var(--color-primary); width:16px; height:16px; cursor:pointer; }
.perm-grid-actions { display:flex; gap:8px; margin:10px 0; }
.perm-note { margin:8px 0 0; }
.user-row-perms-btn { background:none; border:none; cursor:pointer; color:var(--color-primary-dark); text-decoration:underline; font-size:0.88em; padding:0; }

/* ======================================================================
   Мессенджер v2: редизайн полной страницы /chat в духе Telegram/WhatsApp.
   Все новые правила намеренно скопом (.messenger-main / .messenger-sidebar
   / #messenger), чтобы не задеть мини-чат в шапке (.mchat-*) и чат
   АгроБота (.aibot-*/.aipage-*), которые переиспользуют базовые классы
   .chat-bubble/.chat-feed/.conv-item, объявленные выше.
   ====================================================================== */

#messenger.messenger {
    height: calc(100vh - 64px); min-height: 480px; gap: 0;
    background: var(--color-surface); border-radius: var(--radius);
    box-shadow: var(--shadow-lg); overflow: hidden; border: 1px solid var(--color-border);
}

/* ---- Левая колонка: список диалогов ---- */
.messenger-sidebar {
    width: 320px; border-radius: 0; border-right: 1px solid var(--color-border);
    display: flex; flex-direction: column; box-shadow: none;
}
.messenger-sidebar-head { padding: 16px 16px 4px; flex-shrink: 0; }
.messenger-title { margin: 0; font-size: 1.3em; }
.messenger-search { position: relative; margin: 10px 14px 6px; flex-shrink: 0; }
.messenger-search-icon { position: absolute; left: 12px; top: 50%; transform: translateY(-50%); opacity: 0.5; pointer-events: none; }
.messenger-search-icon.icon { width: 14px; height: 14px; }
.messenger-search input {
    width: 100%; padding: 9px 12px 9px 34px; border-radius: 999px; border: 1px solid var(--color-border);
    background: var(--color-bg); font-size: 0.9em;
}
.messenger-search input:focus { border-color: var(--color-primary); }
.messenger-sidebar .messenger-list { flex: 1; overflow-y: auto; padding: 6px 8px 8px; }
.messenger-sidebar .conv-item { padding: 10px; border-radius: var(--radius-sm); gap: 12px; }
.messenger-sidebar .conv-item.active { background: var(--color-primary-light); }
.messenger-sidebar .conv-item.active .conv-name { color: var(--color-primary-dark); }
.messenger-sidebar .conv-avatar { width: 44px; height: 44px; font-size: 1.05em; }
.conv-search-empty { text-align: center; color: var(--color-muted); font-size: 0.88em; padding: 20px 10px; }

/* ---- Правая колонка: активный диалог ---- */
.messenger-main { background: var(--color-bg); }
.messenger-header {
    margin: 0; border-radius: 0; border-bottom: 1px solid var(--color-border);
    box-shadow: none; padding: 10px 18px; flex-shrink: 0; background: var(--color-surface);
}
.messenger-header-info { display: flex; flex-direction: column; line-height: 1.3; }
.messenger-back-btn {
    display: none; background: none; border: none; font-size: 1.3em; color: var(--color-text);
    cursor: pointer; padding: 4px 8px 4px 0; margin-right: 2px;
}

/* Лента сообщений — лёгкая точечная «обёрточная бумага», как в WhatsApp */
.messenger-main .chat-feed {
    border-radius: 0; box-shadow: none; padding: 18px 22px; gap: 3px;
    background-color: var(--color-bg);
    background-image: radial-gradient(circle, rgba(127,127,127,0.14) 1px, transparent 1px);
    background-size: 22px 22px;
}
[data-theme="dark"] .messenger-main .chat-feed { background-image: radial-gradient(circle, rgba(255,255,255,0.06) 1px, transparent 1px); }

.chat-date-sep { display: flex; justify-content: center; margin: 14px 0 10px; }
.chat-date-sep span {
    background: var(--color-surface); color: var(--color-muted); font-size: 0.76em; font-weight: 600;
    padding: 4px 12px; border-radius: 999px; box-shadow: var(--shadow); text-transform: capitalize;
}

/* ---- Строка сообщения: аватар + пузырь + кнопка действий рядом (не внутри) ---- */
.chat-row { display: flex; align-items: flex-start; gap: 6px; margin: 2px 0; }
.chat-row.mine { justify-content: flex-end; }
.chat-row.theirs { justify-content: flex-start; }
.chat-row.grouped { margin-top: -1px; }
.chat-row-avatar { width: 30px; height: 30px; flex-shrink: 0; margin-top: 2px; }
.chat-row-avatar:empty { visibility: hidden; }
.chat-msg-avatar { width: 30px !important; height: 30px !important; font-size: 0.78em; }
.chat-bubble-slot { position: relative; max-width: 62%; min-width: 0; }

/* ---- Пузыри сообщений: скруглённый угол-«хвостик», компактная группировка ---- */
.messenger-main .chat-bubble {
    max-width: 100%; padding: 7px 10px 6px; border-radius: 16px;
    background: var(--color-surface); box-shadow: 0 1px 1px rgba(0,0,0,0.06);
    position: relative;
}
.messenger-main .chat-bubble.theirs { border-bottom-left-radius: 4px; }
.messenger-main .chat-bubble.mine { border-bottom-right-radius: 4px; background: var(--color-primary); color: #fff; }
.messenger-main .chat-bubble.theirs.grouped { border-top-left-radius: 6px; }
.messenger-main .chat-bubble.mine.grouped { border-top-right-radius: 6px; }
.messenger-main .chat-bubble .chat-bubble-head { margin-bottom: 1px; font-size: 0.8em; }
.messenger-main .chat-bubble.mine .chat-author { color: rgba(255,255,255,0.92); }
.messenger-main .chat-author { color: var(--color-primary-dark); font-weight: 700; }
.messenger-main .chat-text { font-size: 0.94em; line-height: 1.4; }
.chat-bubble-foot { display: flex; justify-content: flex-end; margin-top: 2px; }
.chat-bubble-foot .chat-time { font-size: 0.7em; color: var(--color-muted); opacity: 0.85; }
.messenger-main .chat-bubble.mine .chat-bubble-foot .chat-time { color: rgba(255,255,255,0.8); }
.chat-row.flash-highlight .chat-bubble { animation: chatFlash 1.2s ease; }
@keyframes chatFlash {
    0% { background: var(--color-accent); }
    100% { background: inherit; }
}

/* ---- Меню действий над сообщением (⋯ рядом с пузырём, не внутри него) ---- */
.chat-bubble-menu-btn {
    align-self: center; flex-shrink: 0; width: 26px; height: 26px; border-radius: 50%;
    border: none; background: var(--color-primary-light); color: var(--color-text); cursor: pointer;
    opacity: 0; transition: opacity 0.12s ease; display: flex; align-items: center; justify-content: center;
}
.chat-bubble-menu-btn .icon { width: 15px; height: 15px; }
.chat-row:hover .chat-bubble-menu-btn,
.chat-bubble-menu-btn:focus { opacity: 1; }
@media (hover: none) { .chat-bubble-menu-btn { opacity: 0.55; } }
.chat-bubble-actions {
    position: absolute; top: 0; z-index: 20; min-width: 172px;
    background: var(--color-surface); color: var(--color-text); border-radius: var(--radius-sm);
    box-shadow: var(--shadow-lg); border: 1px solid var(--color-border); flex-direction: column; overflow: hidden;
}
.chat-row.theirs .chat-bubble-actions { left: 100%; margin-left: 6px; }
.chat-row.mine .chat-bubble-actions { right: 100%; margin-right: 6px; }
.chat-action-item {
    display: flex; align-items: center; gap: 8px; width: 100%; text-align: left; padding: 9px 12px;
    background: none; border: none; color: var(--color-text); font-size: 0.86em; cursor: pointer;
}
.chat-action-item .icon { flex-shrink: 0; }
.chat-action-item:hover { background: var(--color-primary-light); }
.chat-action-delete:hover { background: rgba(192,57,43,0.12); color: var(--color-danger); }

/* ---- Цитата «ответ на сообщение» внутри пузыря ---- */
.chat-reply-quote {
    display: flex; flex-direction: column; gap: 0; margin: 2px 0 5px; padding: 4px 8px;
    border-left: 3px solid var(--color-primary); background: rgba(0,0,0,0.05); border-radius: 6px;
    text-decoration: none; color: inherit; cursor: pointer;
}
.messenger-main .chat-bubble.mine .chat-reply-quote { border-left-color: rgba(255,255,255,0.85); background: rgba(255,255,255,0.16); }
.chat-reply-quote-author { font-size: 0.78em; font-weight: 700; color: var(--color-primary-dark); }
.messenger-main .chat-bubble.mine .chat-reply-quote-author { color: #fff; }
.chat-reply-quote-text { font-size: 0.83em; opacity: 0.85; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; max-width: 320px; display: inline-flex; align-items: center; gap: 3px; }

/* ---- Метка «Переслано от …» ---- */
.chat-forwarded-label { font-size: 0.76em; font-style: italic; opacity: 0.75; margin-bottom: 3px; display: flex; align-items: center; }
.chat-forwarded-arrow { margin-right: 3px; }

/* ---- Панель "Ответ на сообщение" над строкой ввода ---- */
.chat-reply-bar {
    display: flex; align-items: center; gap: 8px; margin: 8px 22px 0; padding: 6px 10px;
    background: var(--color-surface); border-radius: var(--radius-sm); box-shadow: var(--shadow);
}
.chat-reply-bar-accent { width: 3px; align-self: stretch; background: var(--color-primary); border-radius: 3px; flex-shrink: 0; }
.chat-reply-bar-body { display: flex; flex-direction: column; min-width: 0; flex: 1; }
.chat-reply-bar-title { font-size: 0.78em; font-weight: 700; color: var(--color-primary-dark); }
.chat-reply-bar-text { font-size: 0.85em; color: var(--color-muted); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

/* ---- Строка ввода ---- */
.messenger-main .chat-input-bar {
    margin: 10px 18px 16px; padding: 6px 8px; background: var(--color-surface);
    border-radius: 24px; box-shadow: var(--shadow); align-items: flex-end;
}
.messenger-main .chat-input-bar textarea {
    border: none; background: none; min-height: 30px; max-height: 140px; padding: 8px 4px;
}
.messenger-main .chat-input-bar textarea:focus { outline: none; box-shadow: none; }
.messenger-main .chat-tool-btn { border: none; background: none; width: 38px; height: 38px; }
.chat-tool-wrap { position: relative; flex-shrink: 0; }
.chat-send-btn {
    width: 40px; height: 40px; border-radius: 50%; border: none; background: var(--color-primary);
    color: #fff; flex-shrink: 0; padding: 0; display: flex; align-items: center; justify-content: center;
    cursor: pointer;
}
.chat-send-btn:hover { background: var(--color-primary-dark); }
.chat-send-icon { transform: translateX(-1px); }
.messenger-main .chat-share-preview, .messenger-main .chat-file-preview { margin: 8px 22px 0; }

/* ---- Панель выбора стикеров ---- */
.sticker-panel {
    position: absolute; bottom: calc(100% + 10px); left: 0; width: 300px; max-height: 320px;
    background: var(--color-surface); border: 1px solid var(--color-border); border-radius: var(--radius);
    box-shadow: var(--shadow-lg); flex-direction: column; overflow: hidden; z-index: 30;
}
.sticker-panel-tabs { display: flex; gap: 4px; padding: 8px; border-bottom: 1px solid var(--color-border); flex-shrink: 0; overflow-x: auto; }
.sticker-panel-tab {
    padding: 5px 10px; border-radius: 999px; border: none; background: none; cursor: pointer;
    font-size: 0.82em; color: var(--color-muted); white-space: nowrap; flex-shrink: 0;
}
.sticker-panel-tab:hover { background: var(--color-primary-light); }
.sticker-panel-tab.active { background: var(--color-primary-light); color: var(--color-primary-dark); font-weight: 600; }
.sticker-panel-grid { flex: 1; overflow-y: auto; display: grid; grid-template-columns: repeat(4, 1fr); gap: 6px; padding: 10px; }
.sticker-panel-item { border: none; background: none; cursor: pointer; padding: 4px; border-radius: var(--radius-sm); display: flex; align-items: center; justify-content: center; }
.sticker-panel-item:hover { background: var(--color-primary-light); }
.sticker-panel-item img { width: 100%; height: auto; max-height: 64px; object-fit: contain; display: block; }
@media (max-width: 480px) { .sticker-panel { width: min(300px, calc(100vw - 32px)); } }

/* ---- Модалка «Переслать» ---- */
.forward-preview {
    padding: 8px 10px; background: var(--color-primary-light); border-radius: var(--radius-sm);
    font-size: 0.88em; margin-bottom: 10px; max-height: 70px; overflow: hidden;
}
.forward-results { max-height: 260px; overflow-y: auto; margin-top: 8px; border: 1px solid var(--color-border); border-radius: var(--radius-sm); }
.forward-result-item {
    display: flex; align-items: center; gap: 10px; padding: 9px 10px; cursor: pointer; font-size: 0.9em;
    border-bottom: 1px solid var(--color-border);
}
.forward-result-item:last-child { border-bottom: none; }
.forward-result-item:hover { background: var(--color-primary-light); }
.forward-result-item input[type="checkbox"] { accent-color: var(--color-primary); width: 16px; height: 16px; flex-shrink: 0; }
.forward-result-name { font-weight: 600; flex: 1; }
.forward-result-sub { color: var(--color-muted); font-size: 0.82em; }
#forward-comment { width: 100%; margin-top: 10px; resize: none; font-family: inherit; }

/* ---- Мобильная адаптация: список диалогов и чат как два отдельных экрана ---- */
@media (max-width: 860px) {
    #messenger.messenger { height: calc(100vh - 130px); border-radius: var(--radius); }
    .messenger-sidebar { width: 100%; max-height: none; position: absolute; inset: 0; z-index: 2; background: var(--color-surface); }
    .messenger-main { position: absolute; inset: 0; z-index: 1; display: flex; }
    #messenger.messenger { position: relative; }
    .messenger-back-btn { display: inline-flex; }
    #messenger.chat-open-mobile .messenger-sidebar { display: none; }
    #messenger.chat-open-mobile .messenger-main { position: relative; z-index: 3; }
    #messenger:not(.chat-open-mobile) .messenger-main { display: none; }
    .chat-bubble-slot { max-width: 78%; }
    .chat-row-avatar { width: 26px; height: 26px; }
    .chat-msg-avatar { width: 26px !important; height: 26px !important; }
    .messenger-main .chat-input-bar, .chat-reply-bar { margin-left: 10px; margin-right: 10px; }
    .messenger-main .chat-feed { padding: 14px 12px; }
}

/* ===== Задачи: статистика, канбан, фильтры ===== */
.task-stats-cards { grid-template-columns: repeat(5, minmax(140px, 1fr)); }
.task-stat-card { padding: 16px 18px; cursor: default; }
.task-stat-card:hover { transform: none; box-shadow: var(--shadow); }
.task-stat-card .card-value { font-size: 1.7em; }

.task-progress-wrap { display: flex; align-items: center; gap: 12px; margin: 14px 0 4px; }
.task-progress-bar { flex: 1; height: 8px; border-radius: 999px; background: var(--color-border); overflow: hidden; }
.task-progress-fill { height: 100%; background: var(--color-primary); border-radius: 999px; transition: width 0.3s ease; }
.task-progress-label { white-space: nowrap; }

.task-toolbar { align-items: center; }
.task-search-wrap {
    display: flex; align-items: center; gap: 6px; background: var(--color-surface);
    border: 1px solid var(--color-border); border-radius: var(--radius-sm); padding: 0 10px;
    flex: 1; min-width: 200px; max-width: 320px;
}
.task-search-wrap .icon { color: var(--color-muted); background-color: var(--color-muted); }
.task-search-wrap input { border: none; padding: 8px 4px; flex: 1; background: transparent; }
.task-search-wrap input:focus { outline: none; }

.task-filter-chips { display: flex; gap: 6px; flex-wrap: wrap; }
.task-chip {
    padding: 7px 13px; border-radius: 999px; font-size: 0.85em; cursor: pointer;
    background: var(--color-surface); color: var(--color-text); border: 1px solid var(--color-border);
    font-weight: 500;
}
.task-chip:hover { background: var(--color-primary-light); }
.task-chip.active { background: var(--color-primary); color: white; border-color: var(--color-primary); }
.task-chip-danger.active { background: var(--color-danger); border-color: var(--color-danger); }

.task-view-toggle { display: flex; margin-left: auto; border: 1px solid var(--color-border); border-radius: var(--radius-sm); overflow: hidden; }
.task-view-btn { border: none; border-radius: 0; background: var(--color-surface); color: var(--color-text); padding: 8px 14px; }
.task-view-btn:hover { background: var(--color-primary-light); }
.task-view-btn.active { background: var(--color-primary); color: white; }

.task-empty-state { text-align: center; padding: 60px 20px; background: var(--color-surface); border-radius: var(--radius); box-shadow: var(--shadow); }
.task-empty-icon { width: 56px; height: 56px; margin: 0 auto 14px; border-radius: 50%; background: var(--color-primary-light); display: flex; align-items: center; justify-content: center; }
.task-empty-icon .icon { width: 26px; height: 26px; color: var(--color-primary); background-color: var(--color-primary); }

.task-board { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; margin-top: 18px; align-items: start; }
.task-column { background: var(--color-bg); border-radius: var(--radius); padding: 12px; min-height: 120px; }
.task-column-head { display: flex; align-items: center; gap: 8px; padding: 4px 6px 12px; }
.task-column-head h3 { margin: 0; font-size: 0.95em; color: var(--color-text); flex: 1; }
.task-column-dot { width: 10px; height: 10px; border-radius: 50%; flex-shrink: 0; }
.task-column-count {
    background: var(--color-surface); color: var(--color-muted); font-size: 0.78em; font-weight: 700;
    padding: 2px 9px; border-radius: 999px; border: 1px solid var(--color-border);
}
.task-column-body { display: flex; flex-direction: column; gap: 10px; min-height: 40px; border-radius: var(--radius-sm); transition: background 0.15s ease; padding: 2px; }
.task-column-body.drag-over { background: var(--color-primary-light); }
.task-column-empty { text-align: center; padding: 18px 8px; }

.task-card {
    background: var(--color-surface); border-radius: var(--radius-sm); padding: 12px 14px;
    box-shadow: var(--shadow); cursor: pointer; transition: var(--transition); border-left: 3px solid transparent;
}
.task-card:hover { transform: translateY(-2px); box-shadow: var(--shadow-lg); }
.task-card.dragging { opacity: 0.4; }
/* Цвет полосы слева — по приоритету задачи; просрочка перекрывает его красным */
.task-card-prio-low { border-left-color: var(--priority-low); }
.task-card-prio-normal { border-left-color: var(--priority-normal); }
.task-card-prio-high { border-left-color: var(--priority-high); }
.task-card-overdue { border-left-color: var(--color-danger); }
.task-card-top { display: flex; gap: 6px; flex-wrap: wrap; margin-bottom: 7px; }
.task-card-title { font-weight: 600; font-size: 0.95em; line-height: 1.35; word-break: break-word; }
.task-card-desc {
    margin-top: 5px; color: var(--color-muted); font-size: 0.82em; line-height: 1.4;
    display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden;
}
.task-card-foot { display: flex; justify-content: space-between; align-items: center; margin-top: 10px; gap: 8px; }
.task-card-due { font-size: 0.78em; color: var(--color-muted); white-space: nowrap; }
.task-card-assignee { flex-shrink: 0; }
.task-card-archive-btn {
    display: block; width: 100%; margin-top: 10px; padding: 5px 0; border: 1px dashed var(--color-border);
    border-radius: var(--radius-sm); background: transparent; color: var(--color-muted); font-size: 0.78em;
    cursor: pointer; transition: var(--transition);
}
.task-card-archive-btn:hover { background: var(--color-primary-light); color: var(--color-primary-dark); border-color: var(--color-primary); }

.task-header-actions { display: flex; gap: 8px; flex-wrap: wrap; }
.task-archive-toggle { white-space: nowrap; margin-left: auto; }

.task-list-row { cursor: default; }
.task-list-title-cell { cursor: pointer; }
.task-assignee-inline { display: inline-flex; align-items: center; gap: 6px; }
.task-status-badge { margin-right: 6px; }
.task-status-select { padding: 4px 8px; font-size: 0.82em; margin-top: 4px; }

.task-edit-actions { grid-column: 1 / -1; display: flex; gap: 10px; align-items: center; }
.task-edit-meta { margin-top: 6px; }
.task-view-desc { white-space: pre-wrap; color: var(--color-text); line-height: 1.5; }
.task-view-meta-row { display: flex; align-items: center; gap: 12px; margin: 10px 0 14px; }
.task-view-status-label { display: block; font-size: 0.85em; color: var(--color-muted); }

/* ---- Обсуждение задачи ---- */
.task-comments { margin-top: 18px; padding-top: 14px; border-top: 1px solid var(--color-border); }
.task-comments-title { margin: 0 0 8px; font-size: 0.9em; color: var(--color-muted); }
.task-comments-list { max-height: 220px; overflow-y: auto; display: flex; flex-direction: column; gap: 8px; margin-bottom: 10px; }
.task-comment { background: var(--color-bg); border-radius: var(--radius-sm); padding: 8px 10px; }
.task-comment-mine { background: var(--color-primary-light); }
.task-comment-head { display: flex; justify-content: space-between; gap: 8px; margin-bottom: 3px; }
.task-comment-author { font-weight: 600; font-size: 0.82em; }
.task-comment-time { font-size: 0.75em; white-space: nowrap; }
.task-comment-text { font-size: 0.85em; line-height: 1.4; white-space: pre-wrap; word-break: break-word; }
.task-comment-form { display: flex; gap: 8px; align-items: flex-end; }
.task-comment-form textarea { flex: 1; resize: vertical; min-height: 38px; }
.task-comment-form button { flex-shrink: 0; }
.task-view-status-label select { margin-top: 6px; width: 100%; }

@media (max-width: 900px) {
    .task-board { grid-template-columns: 1fr; }
    .task-stats-cards { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 560px) {
    .task-view-toggle { margin-left: 0; }
}

/* ===== План продаж: период, кольцо прогресса, инсайты, график по дням ===== */
.sp-toolbar { justify-content: space-between; }
.sp-period-nav { display: flex; align-items: center; gap: 14px; background: var(--color-surface); border: 1px solid var(--color-border); border-radius: var(--radius-sm); padding: 6px 14px; }
.sp-period-arrow { display: inline-flex; align-items: center; justify-content: center; width: 26px; height: 26px; border-radius: 50%; text-decoration: none; color: var(--color-text); font-size: 1.2em; font-weight: 700; }
.sp-period-arrow:hover { background: var(--color-primary-light); }
.sp-period-label { min-width: 140px; text-align: center; color: var(--color-primary-dark); }

.sp-hero { display: grid; grid-template-columns: minmax(220px, 320px) 1fr; gap: 16px; margin: 16px 0; }
.sp-ring-card {
    background: var(--color-surface); border-radius: var(--radius); box-shadow: var(--shadow);
    padding: 22px; display: flex; flex-direction: column; align-items: center; gap: 12px; text-align: center;
}
.sp-ring {
    --pct: 0; width: 132px; height: 132px; border-radius: 50%; position: relative; flex-shrink: 0;
    background: conic-gradient(var(--color-primary) calc(var(--pct) * 1%), var(--color-border) 0);
    display: flex; align-items: center; justify-content: center; transition: background 0.3s ease;
}
.sp-ring::after { content: ""; position: absolute; inset: 14px; border-radius: 50%; background: var(--color-surface); }
.sp-ring-empty { background: var(--color-border); }
.sp-ring-center { position: relative; z-index: 1; display: flex; flex-direction: column; align-items: center; }
.sp-ring-center strong { font-size: 1.55em; color: var(--color-primary-dark); }
.sp-ring-center span { font-size: 0.72em; color: var(--color-muted); }
.sp-ring-fact { font-size: 1.25em; font-weight: 700; color: var(--color-primary-dark); }

.sp-insights { display: flex; flex-direction: column; gap: 10px; justify-content: center; }
.sp-insight-row {
    display: flex; align-items: center; gap: 12px; background: var(--color-surface);
    border: 1px solid var(--color-border); border-radius: var(--radius-sm); padding: 12px 16px;
}
.sp-insight-icon { font-size: 1.3em; flex-shrink: 0; }
.sp-insight-row strong { display: block; color: var(--color-primary-dark); font-size: 1.05em; }
.sp-insight-row span { color: var(--color-muted); font-size: 0.85em; }
.sp-insight-good { border-left: 3px solid var(--status-received); }
.sp-insight-good strong { color: var(--status-received); }
.sp-insight-bad { border-left: 3px solid var(--color-danger); }
.sp-insight-bad strong { color: var(--color-danger); }

.sp-chart-card { overflow-x: auto; }
.sp-day-chart { display: flex; align-items: flex-end; gap: 4px; height: 150px; padding-top: 6px; min-width: 480px; }
.sp-day-col { flex: 1; display: flex; flex-direction: column; align-items: center; min-width: 0; height: 100%; }
.sp-day-track {
    position: relative; width: 100%; height: 120px; display: flex; align-items: flex-end;
    background: var(--color-primary-light); border-radius: 4px 4px 2px 2px; overflow: visible;
}
.sp-day-track::after {
    content: ""; position: absolute; left: -2px; right: -2px; bottom: var(--target-pct, -20px)%;
    border-top: 2px dashed var(--color-accent); height: 0; pointer-events: none;
}
.sp-day-fill { width: 100%; min-height: 2px; background: var(--color-primary); border-radius: 4px 4px 2px 2px; transition: height 0.25s ease; }
.sp-day-fill.sp-day-hit { background: var(--status-received); }
.sp-day-future .sp-day-track { opacity: 0.35; }
.sp-day-label { margin-top: 5px; font-size: 0.68em; color: var(--color-muted); }

.sp-top-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; }
.sp-bar-list { display: flex; flex-direction: column; gap: 12px; }
.sp-bar-row-top { display: flex; justify-content: space-between; gap: 10px; font-size: 0.9em; }
.sp-bar-row-name { font-weight: 600; }
.sp-bar-row-value { color: var(--color-primary-dark); font-weight: 600; white-space: nowrap; }
.sp-bar-track { height: 8px; border-radius: 999px; background: var(--color-primary-light); overflow: hidden; margin: 5px 0 3px; }
.sp-bar-fill { height: 100%; background: var(--color-primary); border-radius: 999px; }
.sp-bar-fill-accent { background: var(--color-accent); }

.sp-source-pill { display: inline-block; padding: 3px 10px; border-radius: 999px; font-size: 0.78em; background: var(--color-bg); color: var(--color-muted); }
.sp-source-pill-1c { background: var(--color-primary-light); color: var(--color-primary-dark); }

@media (max-width: 900px) {
    .sp-hero { grid-template-columns: 1fr; }
    .sp-top-grid { grid-template-columns: 1fr; }
}
@media (max-width: 560px) {
    .sp-toolbar { flex-direction: column; align-items: stretch; }
    .sp-period-nav { justify-content: center; }
}

/* ======================================================================
   Склад v2 — редизайн /warehouse: KPI по месту хранения, вкладки-переключатели
   мест хранения, статус-пилюли остатка, компактные иконки-действия в таблице
   вместо двух полных форм в каждой строке, лента движений с фильтром по типу.
   ====================================================================== */
.wh-kpi-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(168px,1fr)); gap:12px; margin:16px 0; }

.wh-loc-tabs { display:flex; flex-wrap:wrap; gap:8px; margin:14px 0; }
.wh-loc-tab {
    display:flex; align-items:center; gap:8px; padding:8px 14px; border-radius:999px;
    background:var(--color-surface); color:var(--color-text); border:1px solid var(--color-border);
    text-decoration:none; font-size:0.9em; transition:var(--transition);
}
.wh-loc-tab:hover { background:var(--color-primary-light); }
.wh-loc-tab.active { background:var(--color-primary); border-color:var(--color-primary); color:#fff; }
.wh-loc-tab .wh-loc-tab-count {
    font-size:0.82em; padding:1px 7px; border-radius:999px; background:rgba(0,0,0,0.08); white-space:nowrap;
}
.wh-loc-tab.active .wh-loc-tab-count { background:rgba(255,255,255,0.25); }
.wh-loc-add-btn {
    display:flex; align-items:center; gap:6px; padding:8px 14px; border-radius:999px;
    background:none; border:1px dashed var(--color-border); color:var(--color-muted);
    font-size:0.9em; cursor:pointer; transition:var(--transition);
}
.wh-loc-add-btn:hover { border-color:var(--color-primary); color:var(--color-primary-dark); }

.wh-inventory-banner {
    display:flex; align-items:center; justify-content:space-between; gap:16px; flex-wrap:wrap;
}
.wh-inventory-banner-progress { display:flex; align-items:center; gap:10px; min-width:180px; }
.wh-inventory-banner-track { flex:1; height:8px; border-radius:999px; background:rgba(0,0,0,0.08); overflow:hidden; min-width:100px; }
.wh-inventory-banner-fill { height:100%; background:var(--color-warn-border); border-radius:999px; }

:root {
    --stock-ok-bg:#e5f5e8; --stock-ok-fg:#1f7a34;
    --stock-low-bg:#fff4e5; --stock-low-fg:#a15c07;
    --stock-critical-bg:#fde8e6; --stock-critical-fg:#b3261e;
    --stock-none-bg:var(--color-primary-light); --stock-none-fg:var(--color-muted);
}
[data-theme="dark"] {
    --stock-ok-bg:#1f3728; --stock-ok-fg:#8fd6a2;
    --stock-low-bg:#3c3018; --stock-low-fg:#e0b45c;
    --stock-critical-bg:#3c2523; --stock-critical-fg:#f2ada3;
    --stock-none-bg:var(--color-primary-light); --stock-none-fg:var(--color-muted);
}
.stock-pill { display:inline-flex; align-items:center; gap:5px; padding:3px 10px; border-radius:999px; font-size:0.78em; font-weight:600; white-space:nowrap; }
.stock-pill-ok { background:var(--stock-ok-bg); color:var(--stock-ok-fg); }
.stock-pill-low { background:var(--stock-low-bg); color:var(--stock-low-fg); }
.stock-pill-critical { background:var(--stock-critical-bg); color:var(--stock-critical-fg); }
.stock-pill-none { background:var(--stock-none-bg); color:var(--stock-none-fg); }

.wh-avail-cell { display:flex; flex-direction:column; gap:5px; min-width:110px; }
.wh-avail-cell strong { font-size:0.98em; }
.wh-avail-bar { height:6px; border-radius:999px; background:var(--color-primary-light); overflow:hidden; }
.wh-avail-bar-fill { height:100%; border-radius:999px; background:var(--color-primary); }
.wh-avail-bar-fill.low { background:var(--color-warn-border); }
.wh-avail-bar-fill.critical { background:var(--color-danger); }

.wh-row-actions { display:flex; gap:6px; align-items:center; flex-wrap:nowrap; }
.wh-icon-btn {
    display:inline-flex; align-items:center; justify-content:center; width:32px; height:32px;
    border-radius:var(--radius-sm); border:1px solid var(--color-border); background:var(--color-surface);
    color:var(--color-primary-dark); cursor:pointer; transition:var(--transition); text-decoration:none;
}
.wh-icon-btn:hover { background:var(--color-primary-light); border-color:var(--color-primary); }
.wh-icon-btn svg { width:16px; height:16px; }

.wh-move-filters { display:flex; gap:8px; flex-wrap:wrap; margin-bottom:10px; }
.wh-move-filters button.view-toggle { font:inherit; cursor:pointer; }
.wh-move-type { display:inline-flex; align-items:center; gap:6px; padding:3px 10px; border-radius:999px; font-size:0.78em; font-weight:600; }
.wh-move-type-in { background:var(--stock-ok-bg); color:var(--stock-ok-fg); }
.wh-move-type-out { background:var(--stock-critical-bg); color:var(--stock-critical-fg); }
.wh-move-type-transfer { background:#e8edfb; color:#2f4fb0; }
.wh-move-type-adjust { background:var(--stock-low-bg); color:var(--stock-low-fg); }
[data-theme="dark"] .wh-move-type-transfer { background:#223349; color:#aecdef; }

.wh-modal-hint { font-size:0.85em; color:var(--color-muted); margin:-6px 0 4px; }
.wh-op-tabs { display:flex; gap:6px; margin-bottom:12px; border-bottom:1px solid var(--color-border); }
.wh-op-tab { padding:8px 14px; border:none; background:none; cursor:pointer; font-size:0.92em; color:var(--color-muted); border-bottom:2px solid transparent; margin-bottom:-1px; }
.wh-op-tab:hover { color:var(--color-text); }
.wh-op-tab.active { color:var(--color-primary-dark); border-bottom-color:var(--color-primary); font-weight:600; }
.wh-op-panel { display:none; }
.wh-op-panel.active { display:block; }

@media (max-width:760px) {
    .wh-row-actions { flex-wrap:wrap; }
}

/* ===== Товары — доработка вкладки ===== */
.search-input-wrap { position: relative; display: inline-flex; align-items: center; }
.search-input-wrap .icon { position: absolute; left: 10px; opacity: 0.5; pointer-events: none; }
.search-input-wrap input { padding-left: 32px; }
.table-link { color: var(--color-text); font-weight: 600; text-decoration: none; }
.table-link:hover { color: var(--color-primary-dark); text-decoration: underline; }
.table-actions-cell { display: flex; gap: 6px; align-items: center; white-space: nowrap; }
.stats-grid .icon-inline { margin-right: 4px; }

/* ===== Поставщики — доработка вкладки ===== */
.suppliers-toolbar { display: flex; gap: 10px; align-items: center; flex-wrap: wrap; margin: 16px 0; justify-content: space-between; }
.supplier-card { display: flex; flex-direction: column; gap: 10px; transition: var(--transition); }
.supplier-card:hover { box-shadow: var(--shadow-lg); transform: translateY(-2px); }
.supplier-card-head { align-items: flex-start; }
.supplier-card-id { display: flex; gap: 10px; align-items: center; min-width: 0; }
.supplier-card-id strong { display: block; overflow-wrap: anywhere; }
.supplier-avatar {
    flex-shrink: 0; width: 40px; height: 40px; border-radius: 50%;
    background: var(--color-primary-light); color: var(--color-primary-dark);
    display: flex; align-items: center; justify-content: center;
    font-weight: 700; font-size: 1em; color: #fff; box-shadow: 0 2px 6px rgba(0,0,0,0.16);
}
.supplier-avatar-lg { width: 56px; height: 56px; font-size: 1.4em; }
/* Палитра из 6 узнаваемых градиентов — цвет закреплён за id контрагента, не меняется между заходами */
.avatar-color-0 { background: linear-gradient(135deg, #3f7d4f, #2f6b3a); }
.avatar-color-1 { background: linear-gradient(135deg, #2f9494, #1f6b6b); }
.avatar-color-2 { background: linear-gradient(135deg, #4a7fd1, #2f5aa0); }
.avatar-color-3 { background: linear-gradient(135deg, #8a6bd6, #6247ab); }
.avatar-color-4 { background: linear-gradient(135deg, #d1a13f, #ad7f22); }
.avatar-color-5 { background: linear-gradient(135deg, #d1708f, #a84868); }
.supplier-card-meta { display: flex; gap: 6px; flex-wrap: wrap; }
.supplier-fields { display: flex; flex-direction: column; gap: 4px; }
.supplier-contact-link {
    display: flex; align-items: center; font-size: 0.88em; color: var(--color-text);
    text-decoration: none; gap: 2px;
}
.supplier-contact-link:hover { color: var(--color-primary-dark); text-decoration: underline; }
.supplier-tags { display: flex; flex-wrap: wrap; gap: 5px; margin-top: 2px; }
.tag-pill {
    background: var(--color-primary-light); color: var(--color-primary-dark);
    font-size: 0.76em; font-weight: 600; padding: 3px 9px; border-radius: 999px;
}
.supplier-notes { margin: 2px 0 0; border-top: 1px dashed var(--color-border); padding-top: 8px; }
.supplier-empty { grid-column: 1 / -1; }
@media (max-width: 760px) {
    .suppliers-toolbar { flex-direction: column; align-items: stretch; }
}

/* ===== Логистика — карточка перевозчика ===== */
.logi-avatar {
    flex-shrink: 0; width: 40px; height: 40px; border-radius: 12px;
    background: linear-gradient(135deg, var(--color-primary), var(--color-primary-dark));
    color: #fff; display: flex; align-items: center; justify-content: center;
    box-shadow: 0 2px 6px rgba(0,0,0,0.18);
}
.logi-avatar .icon { width: 19px; height: 19px; background-color: #fff; }
.logi-avatar-lg { width: 56px; height: 56px; border-radius: 15px; }
.logi-avatar-lg .icon { width: 26px; height: 26px; }

/* Аккуратная кнопка-иконка для удаления: незаметна, пока не наведёшься */
.icon-btn {
    flex-shrink: 0; width: 30px; height: 30px; border-radius: var(--radius-sm);
    background: none; border: 1px solid transparent; color: var(--color-muted);
    display: flex; align-items: center; justify-content: center; cursor: pointer;
    transition: var(--transition); padding: 0;
}
.icon-btn:hover { background: var(--color-primary-light); color: var(--color-primary-dark); }
.icon-btn-danger:hover { background: rgba(192,57,43,.1); color: var(--color-danger); border-color: rgba(192,57,43,.2); }

.logi-card { cursor: pointer; }

/* Общие элементы для кликабельных карточек (логистика + контрагенты) */
.card-notes-preview {
    display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical;
    overflow: hidden; white-space: normal !important;
}
.card-open-hint {
    display: flex; align-items: center; gap: 3px; font-size: 0.78em; color: var(--color-primary);
    margin-top: auto; padding-top: 6px; opacity: 0; transition: var(--transition);
}
.supplier-card:hover .card-open-hint { opacity: 1; }
.card-open-hint .icon { background-color: var(--color-primary); }

/* Модалка просмотра карточки перевозчика */
.entity-modal { max-width: 480px; position: relative; overflow: hidden; }
.entity-modal::before {
    content: ""; position: absolute; top: 0; left: 0; right: 0; height: 5px;
    background: linear-gradient(90deg, var(--color-primary), var(--color-accent));
}
.entity-view-head { display: flex; align-items: center; gap: 12px; margin: 8px 0 14px; }
.entity-view-meta { display: flex; gap: 6px; flex-wrap: wrap; margin-bottom: 6px; }
.entity-view-section {
    margin-top: 14px; padding-top: 12px; border-top: 1px dashed var(--color-border);
}
.entity-view-section h4 {
    margin: 0 0 8px; font-size: 0.78em; text-transform: uppercase; letter-spacing: 0.03em;
    color: var(--color-muted); font-weight: 700;
}
.entity-view-contacts { display: flex; flex-direction: column; gap: 6px; }
.entity-view-contacts .supplier-contact-link { font-size: 0.95em; }
.entity-view-text { margin: 0; white-space: pre-line; color: var(--color-text); font-size: 0.92em; line-height: 1.5; }
.entity-view-actions { margin-top: 18px; padding-top: 14px; border-top: 1px solid var(--color-border); display: flex; justify-content: flex-end; gap: 8px; }

/* ===== Контрагенты — быстрые фильтры по категории и сортировка ===== */
.supplier-filter-chips { display: flex; gap: 6px; flex-wrap: wrap; }
.filter-chip {
    background: var(--color-surface); border: 1px solid var(--color-border); color: var(--color-muted);
    font-size: 0.8em; font-weight: 600; padding: 5px 12px; border-radius: 999px; cursor: pointer;
    transition: var(--transition);
}
.filter-chip:hover { border-color: var(--color-primary); color: var(--color-primary-dark); }
.filter-chip.active { background: var(--color-primary); border-color: var(--color-primary); color: #fff; }
.supplier-sort-select { min-width: 168px; }

/* Карточка контрагента: доп. бейдж заказов */
.stock-pill-accent { background: #ece4fb; color: #6247ab; }
[data-theme="dark"] .stock-pill-accent { background: #322a4d; color: #bda6f2; }

/* Детальная карточка контрагента: список товаров и статистика заказов */
.entity-products-list { display: flex; flex-direction: column; gap: 0; max-height: 220px; overflow-y: auto; border: 1px solid var(--color-border); border-radius: var(--radius-sm); }
.entity-products-list a {
    display: flex; justify-content: space-between; gap: 10px; padding: 8px 10px; font-size: 0.88em;
    color: var(--color-text); text-decoration: none; border-bottom: 1px solid var(--color-border);
}
.entity-products-list a:last-child { border-bottom: none; }
.entity-products-list a:hover { background: var(--color-primary-light); color: var(--color-primary-dark); }
.entity-products-list .ep-price { color: var(--color-muted); white-space: nowrap; font-variant-numeric: tabular-nums; }
.entity-products-more { padding: 6px 10px; font-size: 0.8em; color: var(--color-muted); text-align: center; }
.entity-order-stats { display: flex; gap: 18px; flex-wrap: wrap; }
.entity-order-stat { display: flex; flex-direction: column; gap: 1px; }
.entity-order-stat strong { font-size: 1.15em; }
.entity-order-stat span { font-size: 0.76em; color: var(--color-muted); text-transform: uppercase; letter-spacing: 0.02em; }
.entity-view-link { font-size: 0.85em; color: var(--color-primary); text-decoration: none; font-weight: 600; }
.entity-view-link:hover { text-decoration: underline; }

/* ===== Ценообразование (карточка товара, настройки, согласование) ===== */
.pricing-panel {
    position: relative; overflow: hidden; border: 1px solid var(--color-border);
    padding-top: 24px;
}
.pricing-panel::before {
    content: ""; position: absolute; top: 0; left: 0; right: 0; height: 4px;
    background: linear-gradient(90deg, var(--color-accent), var(--color-primary));
}
.pricing-pending-banner { display: flex; flex-wrap: wrap; gap: 6px; align-items: center; }

/* --- Компактная карточка-сводка на странице товара + кнопка открытия модалки --- */
.pricing-summary {
    position: relative; overflow: hidden; border: 1px solid var(--color-border);
    padding-top: 24px;
}
.pricing-summary::before {
    content: ""; position: absolute; top: 0; left: 0; right: 0; height: 4px;
    background: linear-gradient(90deg, var(--color-accent), var(--color-primary));
}
.pricing-summary-head { display: flex; align-items: flex-start; gap: 14px; margin: 0 0 18px; }
.pricing-summary-stats {
    display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap: 14px;
    margin-bottom: 14px;
}
.pricing-summary-stat {
    display: flex; flex-direction: column; gap: 4px; padding: 12px 14px;
    background: var(--color-bg, #f7f7fb); border-radius: var(--radius-sm); border: 1px solid var(--color-border);
}
.pricing-summary-stat strong { font-size: 1.25em; font-variant-numeric: tabular-nums; color: var(--color-text); }
.pricing-summary-stat-accent {
    background: var(--color-primary-light); border-color: var(--color-primary-light);
}
.pricing-summary-stat-accent strong { color: var(--color-primary-dark); }
.pricing-delta-chip {
    align-self: flex-start; font-size: 0.78em; font-weight: 700; padding: 2px 8px; border-radius: 999px;
    background: var(--color-border); color: var(--color-muted);
}
.pricing-delta-chip.pricing-delta-up { background: #fdecea; color: var(--color-danger); }
.pricing-delta-chip.pricing-delta-down { background: #e9f7ee; color: var(--status-received); }
.pricing-gauge-track-mini { height: 6px; margin-top: 2px; }
.pricing-open-btn {
    display: inline-flex; align-items: center; gap: 8px; margin-top: 4px;
}

/* --- Карточка товара: вкладки верхнего уровня --- */
.page-tabs {
    display: flex; flex-wrap: wrap; gap: 4px; border-bottom: 1px solid var(--color-border);
    margin: 18px 0 20px; overflow-x: auto;
}
.page-tab {
    background: none; border: none; padding: 10px 16px; font-size: 0.94em; font-weight: 600;
    color: var(--color-muted); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -1px;
    display: flex; align-items: center; gap: 6px; white-space: nowrap; border-radius: var(--radius-sm) var(--radius-sm) 0 0;
    transition: var(--transition);
}
.page-tab:hover { color: var(--color-text); background: var(--color-primary-light); }
.page-tab.active { color: var(--color-primary-dark); border-bottom-color: var(--color-primary); }
.page-tab-panel.page-tab-hidden { display: none; }
.page-tab-panel { display: flex; flex-direction: column; gap: 16px; }
.page-tab-panel > .detail-grid,
.page-tab-panel > .entity-stats,
.page-tab-panel > .recommendation-banner,
.page-tab-panel > .success-banner { margin: 0; }
@media (max-width: 640px) {
    .page-tab { padding: 8px 11px; font-size: 0.88em; }
}

/* --- Модалка ценообразования: широкий вариант + вкладки --- */
.modal-pricing-box { max-width: 900px !important; }
.pricing-tabs {
    display: flex; flex-wrap: wrap; gap: 4px; border-bottom: 1px solid var(--color-border);
    margin: 4px 0 18px;
}
.pricing-tab {
    background: none; border: none; padding: 9px 14px; font-size: 0.9em; font-weight: 600;
    color: var(--color-muted); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -1px;
    display: flex; align-items: center; gap: 6px;
}
.pricing-tab:hover { color: var(--color-text); }
.pricing-tab.active { color: var(--color-primary-dark); border-bottom-color: var(--color-primary); }
.pricing-tab-panel.pricing-hidden { display: none; }
.pricing-add-adjustment { margin-top: 18px; }

/* --- Меню «Цены» на странице списка товаров (объединяет 4 действия в одну кнопку) --- */
.pricing-menu-wrap { position: relative; display: inline-block; }
.pricing-menu-caret { font-size: 0.75em; margin-left: 2px; opacity: 0.7; }
.pricing-menu-dropdown {
    display: none; position: absolute; top: 100%; left: 0; margin-top: 6px; min-width: 240px;
    background: var(--color-surface); border-radius: var(--radius); box-shadow: var(--shadow-lg);
    z-index: 50; overflow: hidden; border: 1px solid var(--color-border);
}
.pricing-menu-dropdown.show { display: block; }
.pricing-menu-item {
    display: flex; align-items: center; gap: 8px; width: 100%; text-align: left;
    padding: 10px 14px; font-size: 0.88em; color: var(--color-text); background: none; border: none;
    border-bottom: 1px solid var(--color-border); cursor: pointer; text-decoration: none; box-sizing: border-box;
}
.pricing-menu-item:last-child { border-bottom: none; }
.pricing-menu-item:hover { background: var(--color-primary-light); color: var(--color-primary-dark); }

/* --- Заголовок: круглая иконка + название + подпись + ссылка на настройки --- */
.pricing-panel-head { display: flex; align-items: flex-start; gap: 14px; margin: 0 0 20px; }
.pricing-panel-icon {
    width: 42px; height: 42px; border-radius: 50%; background: var(--color-primary-light);
    display: flex; align-items: center; justify-content: center; flex-shrink: 0;
}
.pricing-panel-icon .icon { width: 20px; height: 20px; background-color: var(--color-primary-dark); }
.pricing-panel-head-text { flex: 1; min-width: 160px; }
.pricing-panel-head-text h3 { margin: 3px 0 3px; font-size: 1.25em; color: var(--color-text); }
.pricing-panel-head-text p { margin: 0; }
.pricing-panel-settings-link { display: inline-flex; align-items: center; text-decoration: none; white-space: nowrap; align-self: center; }

.pricing-formula-card {
    background: var(--color-primary-light); color: var(--color-primary-dark);
    border-radius: var(--radius); padding: 16px 20px; margin: 4px 0 18px; font-size: 0.92em;
}
.pricing-formula-card .icon { flex-shrink: 0; background-color: var(--color-primary-dark); width: 22px; height: 22px; }
.pricing-formula-card .muted { display: block; margin-top: 4px; color: var(--color-primary-dark); opacity: 0.75; }
.pricing-formula-card .pricing-pipeline-step { background: var(--color-surface); }
.pricing-formula-card .pricing-pipeline-step-value { font-size: 0.85em; font-weight: 600; }
.pricing-formula-card .pricing-pipeline-step-final .pricing-pipeline-step-value { color: #fff; font-size: 0.85em; }

/* --- Двухколоночный расчёт: слева вводные, справа результат --- */
.pricing-layout { display: grid; grid-template-columns: minmax(230px, 0.8fr) minmax(320px, 1.2fr); gap: 20px; margin-top: 4px; align-items: start; }
@media (max-width: 900px) { .pricing-layout { grid-template-columns: 1fr; } }

.pricing-card {
    background: var(--color-bg); border: 1px solid var(--color-border); border-radius: var(--radius);
    padding: 18px 20px;
}
.pricing-card-title {
    font-size: 0.74em; font-weight: 700; text-transform: uppercase; letter-spacing: 0.05em;
    color: var(--color-muted); margin-bottom: 14px;
}

.pricing-inputs { display: flex; flex-direction: column; gap: 16px; }
.pricing-field { display: flex; flex-direction: column; gap: 5px; }
.pricing-field label { font-size: 0.82em; color: var(--color-muted); font-weight: 600; }
.pricing-field input {
    padding: 9px 10px; border: 1px solid var(--color-border); border-radius: var(--radius-sm);
    background: var(--color-surface); color: var(--color-text); font-size: 1.05em; font-variant-numeric: tabular-nums;
    width: 100%; transition: var(--transition);
}
.pricing-field input:focus { outline: none; border-color: var(--color-primary); box-shadow: 0 0 0 3px var(--color-primary-light); }
.pricing-input-wrap { position: relative; display: flex; align-items: center; }
.pricing-input-wrap input { padding-right: 30px; }
.pricing-input-suffix {
    position: absolute; right: 10px; font-size: 0.85em; color: var(--color-muted); pointer-events: none;
}
.pricing-static-value { font-weight: 700; font-size: 1.15em; padding: 9px 0; color: var(--color-primary-dark); }

/* Бейдж-«источник» значения: своё / категория / общее — цвет вместо курсива */
.pricing-source-tag, .pricing-source-chip {
    display: inline-flex; align-items: center; gap: 4px; align-self: flex-start;
    font-size: 0.74em; font-weight: 600; padding: 2px 9px; border-radius: 999px;
    background: var(--color-primary-light); color: var(--color-primary-dark);
}
.pricing-source-product { background: var(--color-primary-light); color: var(--color-primary-dark); }
.pricing-source-category { background: #fdf1d8; color: #92620c; }
.pricing-source-global { background: var(--color-border); color: var(--color-muted); }

.pricing-result { background: var(--color-surface); border-color: var(--color-border); box-shadow: var(--shadow); }

/* --- Формула-конвейер: шаги расчёта соединены стрелками --- */
.pricing-pipeline { display: flex; align-items: stretch; gap: 0; flex-wrap: wrap; margin-bottom: 16px; }
.pricing-pipeline-step {
    flex: 1 1 100px; min-width: 92px; background: var(--color-bg); border: 1px solid var(--color-border);
    border-radius: var(--radius-sm); padding: 10px 12px; display: flex; flex-direction: column; gap: 4px;
}
.pricing-pipeline-step-label {
    font-size: 0.68em; text-transform: uppercase; letter-spacing: 0.03em; font-weight: 700;
    color: var(--color-muted); white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.pricing-pipeline-step-value { font-size: 1.05em; font-weight: 700; color: var(--color-primary-dark); font-variant-numeric: tabular-nums; }
.pricing-pipeline-arrow { display: flex; align-items: center; justify-content: center; width: 26px; flex: 0 0 26px; color: var(--color-muted); font-size: 1.1em; }
.pricing-pipeline-step-final { background: var(--color-primary); border-color: var(--color-primary); flex-basis: 130px; }
.pricing-pipeline-step-final .pricing-pipeline-step-label { color: rgba(255,255,255,0.8); }
.pricing-pipeline-step-final .pricing-pipeline-step-value { color: #fff; font-size: 1.5em; line-height: 1.1; }
@media (max-width: 640px) {
    .pricing-pipeline { flex-direction: column; }
    .pricing-pipeline-arrow { width: auto; transform: rotate(90deg); padding: 2px 0; }
    .pricing-pipeline-step-final { flex-basis: auto; }
}

/* --- Сравнение текущей и расчётной цены --- */
.pricing-compare { display: flex; flex-wrap: wrap; gap: 10px; margin-bottom: 14px; }
.pricing-compare-item, .pricing-delta {
    flex: 1 1 160px; display: flex; flex-direction: column; gap: 3px;
    background: var(--color-bg); border-radius: var(--radius-sm); padding: 10px 14px;
}
.pricing-compare-item strong, .pricing-delta strong { font-size: 1.15em; font-variant-numeric: tabular-nums; }
.pricing-delta-up { background: #fdecea; }
.pricing-delta-up strong { color: var(--color-danger); }
.pricing-delta-up strong::before { content: "↑ "; }
.pricing-delta-down { background: #e9f7ee; }
.pricing-delta-down strong { color: var(--status-received); }
.pricing-delta-down strong::before { content: "↓ "; }

/* Мини-«градусник» маржи: где текущая цена относительно минимума */
.pricing-margin-gauge { margin: 4px 0 10px; }
.pricing-margin-gauge-labels { display: flex; justify-content: space-between; align-items: baseline; font-size: 0.82em; margin-bottom: 5px; }
.pricing-gauge-track {
    position: relative; height: 8px; border-radius: 999px; background: var(--color-border); overflow: visible;
}
.pricing-gauge-fill { position: absolute; top: 0; left: 0; height: 100%; border-radius: 999px; background: var(--color-primary); transition: var(--transition); }
.pricing-gauge-fill.pricing-gauge-danger { background: var(--color-danger); }
.pricing-gauge-min-marker {
    position: absolute; top: -3px; width: 2px; height: 14px; background: var(--color-muted); border-radius: 1px;
}
.pricing-margin-row { display: flex; gap: 18px; flex-wrap: wrap; font-size: 0.88em; }
.pricing-warn-text { color: var(--color-danger); font-weight: 600; }
.pricing-warn-block {
    display: flex; align-items: center; gap: 8px; background: #fdecea; color: var(--color-danger);
    border-radius: var(--radius-sm); padding: 8px 12px; font-weight: 600; margin: 0 0 4px;
}
.pricing-apply-btn { width: 100%; padding: 12px; font-size: 1.02em; }

.pricing-hidden { display: none !important; }

/* --- Второй уровень: корректировки --- */
.pricing-adjustments { margin-top: 26px; }
.pricing-adjustments h4 { margin: 0 0 10px; font-size: 0.95em; color: var(--color-primary-dark); display: flex; align-items: center; gap: 6px; }
.pricing-adjustment-inactive { opacity: 0.5; }
.pricing-adj-value { font-weight: 700; padding: 2px 8px; border-radius: 999px; font-size: 0.9em; }
.pricing-adj-up { background: #e9f7ee; color: var(--status-received); }
.pricing-adj-down { background: #fdecea; color: var(--color-danger); }

/* --- Второстепенные инструменты: раскрывающиеся карточки вместо кнопок-переключателей --- */
.pricing-tools-row { display: grid; grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); gap: 14px; margin-top: 18px; align-items: start; }
.pricing-tool-card {
    margin-top: 10px; border: 1px solid var(--color-border); border-radius: var(--radius); padding: 4px 16px; background: var(--color-bg);
}
.pricing-tools-row .pricing-tool-card { margin-top: 0; }
.pricing-tool-card[open] { padding-bottom: 16px; }
.pricing-tool-card summary {
    cursor: pointer; font-weight: 600; color: var(--color-primary-dark); padding: 12px 0; list-style: none;
    display: flex; align-items: center; gap: 8px;
}
.pricing-tool-card summary::-webkit-details-marker { display: none; }
.pricing-tool-card summary::after { content: "▸"; margin-left: auto; transition: transform 0.15s ease; color: var(--color-muted); }
.pricing-tool-card[open] summary::after { transform: rotate(90deg); }
.pricing-tool-card .grid-form { margin-top: 4px; }
.pricing-discount-fields { display: flex; flex-wrap: wrap; gap: 10px; align-items: end; margin-top: 6px; }
.pricing-discount-fields label { display: flex; flex-direction: column; gap: 4px; font-size: 0.82em; color: var(--color-muted); }
.pricing-discount-fields input { padding: 8px 10px; border: 1px solid var(--color-border); border-radius: var(--radius-sm); }
.pricing-discount-result { font-size: 0.92em; align-self: center; }

.pricing-nav-badge { margin-left: 4px; }
.btn-tab-active { background: var(--color-primary); color: #fff; border-color: var(--color-primary); }

/* --- Настройки формулы цен: подразделы вместо одного длинного списка полей --- */
.pricing-settings-fieldset { border: none; padding: 0; margin: 0 0 16px; }
.pricing-settings-fieldset:last-of-type { margin-bottom: 0; }
.pricing-settings-fieldset legend {
    font-size: 0.76em; font-weight: 700; text-transform: uppercase; letter-spacing: 0.04em;
    color: var(--color-muted); padding: 0 0 8px; width: 100%; border-bottom: 1px solid var(--color-border); margin-bottom: 10px;
}
.pricing-settings-fieldset .grid-form { margin-top: 0; }

/* --- Модалки массовой установки/пересчёта цен --- */
.price-modal-scope { display: flex; flex-direction: column; gap: 4px; }
.price-modal-mode-row { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; grid-column: 1 / -1; }
.price-modal-mode-row select { width: 100%; }
@media (max-width: 480px) { .price-modal-mode-row { grid-template-columns: 1fr; } }
.price-modal-preview {
    grid-column: 1 / -1; background: var(--color-primary-light); color: var(--color-primary-dark);
    border-radius: var(--radius-sm); padding: 10px 12px; font-size: 0.88em; display: flex; align-items: center; gap: 8px;
}


/* =====================================================================
   Главная — общий задачник (объявления, смены, задачи, движение товара)
   ===================================================================== */
.home > * + * { margin-top: 18px; }
.home--narrow { max-width: 880px; }
.home-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 16px; flex-wrap: wrap; }
.home-head h1 { margin: 0 0 2px; }
.home-date { margin: 0; }
.home-head-actions { display: flex; gap: 8px; flex-wrap: wrap; }
.home-head-actions button { display: inline-flex; align-items: center; gap: 6px; }

/* Шапка-баннер с приветствием и подсолнухом.
   Оформление задают атрибуты data-season (winter|spring|summer|autumn) и
   data-tod (dawn|day|dusk|night) — их выставляет скрипт в dashboard.html. */
.home-hero {
    position: relative; overflow: hidden; isolation: isolate; padding: 26px 32px; border-radius: 18px; color: #fff;
    background: linear-gradient(135deg, #2f6b3a, #74ab5c);  /* запасной фон до применения сцены */
    box-shadow: var(--shadow-lg);
}
.home-hero::after {
    content: ""; position: absolute; inset: 0; z-index: 0; pointer-events: none;
    background: linear-gradient(120deg, rgba(255,255,255,0.10) 0%, rgba(255,255,255,0) 35%);
}
.home-hero-sparks { transition: opacity 0.9s ease, filter 0.9s ease; }

/* Искры вокруг подсолнуха */
.home-hero-sparks { position: absolute; inset: 0; z-index: 0; overflow: hidden; pointer-events: none; }
.home-hero-sparks span {
    position: absolute; width: 5px; height: 5px; border-radius: 50%; opacity: 0;
    background: rgba(255, 244, 190, 0.95); box-shadow: 0 0 7px 1px rgba(255, 235, 150, 0.75);
}
.home-hero-sparks span:nth-child(1) { right: 55px; bottom: 35px; }
.home-hero-sparks span:nth-child(2) { right: 105px; bottom: 85px; }
.home-hero-sparks span:nth-child(3) { right: 35px; bottom: 100px; }
.home-hero-sparks span:nth-child(4) { right: 150px; bottom: 25px; }
.home-hero-sparks span:nth-child(5) { right: 85px; bottom: 130px; }
@media (prefers-reduced-motion: no-preference) {
    .home-hero-sparks span { animation: home-hero-spark 5s ease-in-out infinite; }
    .home-hero-sparks span:nth-child(1) { animation-duration: 4.5s; }
    .home-hero-sparks span:nth-child(2) { animation-duration: 5.5s; animation-delay: 0.8s; }
    .home-hero-sparks span:nth-child(3) { animation-duration: 5s; animation-delay: 1.6s; }
    .home-hero-sparks span:nth-child(4) { animation-duration: 6s; animation-delay: 2.3s; }
    .home-hero-sparks span:nth-child(5) { animation-duration: 4.8s; animation-delay: 3.1s; }
}
@keyframes home-hero-spark {
    0%, 100% { opacity: 0; transform: translateY(0) scale(0.6); }
    50% { opacity: 1; transform: translateY(-16px) scale(1); }
}
@media (prefers-reduced-motion: reduce) { .home-hero-sparks { display: none; } }
/* Ряд-контейнер контента шапки: текст, погода и подсолнух живут во flex-строке,
   поэтому виджет погоды всегда стоит по центру по вертикали и всё расставляется
   заново само, каким бы ни было содержимое (длинная подсказка, тема и т.д.) */
.home-hero-row {
    position: relative;
    z-index: 1;
    display: flex;
    align-items: center;
    /* Без погоды (сервис недоступен) — текст у левого края, подсолнух у правого */
    justify-content: space-between;
    gap: 24px;
    flex-wrap: nowrap;
    min-height: 148px;
}
.home-hero-text { position: relative; flex: 1 1 280px; min-width: 220px; max-width: 620px; }
.home-hero-date {
    display: inline-flex; align-items: center; gap: 6px; margin: 0 0 10px; padding: 4px 12px 4px 10px; border-radius: 999px;
    background: rgba(255, 255, 255, 0.16); border: 1px solid rgba(255, 255, 255, 0.22);
    font-size: 0.78em; font-weight: 700; letter-spacing: 0.05em; text-transform: uppercase; opacity: 0.95;
}
.home-hero-date .icon { width: 14px; height: 14px; opacity: 0.9; }
.home-hero h1 { margin: 0; color: #fff; font-size: 1.8em; line-height: 1.2; text-shadow: 0 1px 3px rgba(0,0,0,0.2), 0 2px 14px rgba(0,0,0,0.25); }
.home-hero-sub { margin: 8px 0 0; font-size: 0.97em; opacity: 0.96; max-width: 560px; text-shadow: 0 1px 8px rgba(0,0,0,0.28); }
.home-hero-sun-wrap {
    position: relative; flex: 0 0 auto;
    width: 148px; height: 148px; z-index: 1;
    transform-origin: 68% 78%; cursor: pointer;
    filter: drop-shadow(0 10px 18px rgba(0,0,0,0.25));
}
.home-hero-sun-wrap:hover { filter: drop-shadow(0 12px 20px rgba(0,0,0,0.3)) brightness(1.04); }
.home-hero-sun-wrap:focus-visible { outline: 2px solid #fff; outline-offset: 4px; border-radius: 50%; }
.home-hero-sun-wrap { transition: filter 0.9s ease; }
.home-hero[data-tod="dusk"] .home-hero-sun-wrap { filter: drop-shadow(0 10px 18px rgba(0,0,0,0.3)) brightness(0.92) saturate(0.95); }
.home-hero[data-tod="night"] .home-hero-sun-wrap {
    filter: drop-shadow(0 10px 18px rgba(0,0,0,0.35)) brightness(0.72) saturate(0.8);
}
/* Реплика-облачко рядом с подсолнухом */
.home-hero-sun-bubble {
    position: absolute; right: 100%; bottom: 58%; z-index: 2; margin-right: 14px;
    width: max-content; max-width: 190px; padding: 8px 13px; border-radius: 12px;
    background: #fff; color: #2f4c34; font-size: 0.85em; font-weight: 600; line-height: 1.3; text-align: center;
    box-shadow: var(--shadow-lg); opacity: 0; pointer-events: none;
    transform: translateY(6px) scale(0.92); transform-origin: bottom right;
    transition: opacity 0.18s ease, transform 0.18s ease;
}
.home-hero-sun-bubble::after {
    content: ""; position: absolute; right: -5px; top: 66%; width: 11px; height: 11px;
    background: #fff; transform: translateY(-50%) rotate(45deg);
}
.home-hero-sun-bubble.is-visible { opacity: 1; transform: translateY(0) scale(1); }
.home-hero-sun { display: block; width: 100%; height: 100%; opacity: 0.95; transition: opacity 0.6s ease; }

/* =====================================================================
   Сцена шапки: небо, облака, лучи, светила и «сезонные» частицы.
   ===================================================================== */

/* -- небо: градиент зависит от времени суток (днём — ещё и от сезона) --- */
.hh-sky {
    position: absolute; inset: 0; z-index: 0; pointer-events: none;
    background:
        radial-gradient(ellipse 640px 400px at 86% 58%, var(--glow) 0%, transparent 66%),
        var(--sky);
}
.home-hero { --glow: rgba(255, 238, 170, 0.55); --cloud-o: 0.9; --cloud-f: none; }
.home-hero[data-tod="day"][data-season="spring"] { --sky: linear-gradient(140deg, #2f87b0 0%, #63b7d0 38%, #a4d8a4 72%, #efdc7c 100%); --cloud-o: 0.85; }
.home-hero[data-tod="day"][data-season="summer"] { --sky: linear-gradient(140deg, #1f79c2 0%, #4fa9e2 38%, #98d6a2 72%, #f2d54a 100%); --cloud-o: 0.8; }
.home-hero[data-tod="day"][data-season="autumn"] { --sky: linear-gradient(140deg, #3c7c9a 0%, #6aa2b4 38%, #b3c69c 72%, #e8c26a 100%); --cloud-o: 0.95; }
.home-hero[data-tod="day"][data-season="winter"] { --sky: linear-gradient(140deg, #3d5c7d 0%, #5f86a6 38%, #97b3c6 72%, #e2dcc4 100%); --cloud-o: 0.9; --cloud-f: brightness(0.92); }
.home-hero[data-tod="dawn"] { --sky: linear-gradient(140deg, #43518c 0%, #8a70a2 34%, #e59b8c 68%, #ffd28c 100%); --glow: rgba(255, 196, 140, 0.6); --cloud-f: sepia(0.55) saturate(2.4) hue-rotate(-24deg) brightness(1.02); }
.home-hero[data-tod="dusk"] { --sky: linear-gradient(140deg, #2e3a6c 0%, #6a4a88 34%, #d2698b 66%, #f5a45a 100%); --glow: rgba(255, 158, 90, 0.55); --cloud-f: sepia(0.6) saturate(2.6) hue-rotate(-30deg) brightness(0.92); }
.home-hero[data-tod="night"] { --sky: linear-gradient(140deg, #080e21 0%, #121b38 30%, #1d2a4b 56%, #2f3d62 80%, #4a4a52 100%); --glow: rgba(120, 140, 220, 0.14); --cloud-o: 0.45; --cloud-f: brightness(0.32) saturate(0.6); }
.home-hero[data-tod="night"][data-season="winter"] { --sky: linear-gradient(140deg, #0c1428 0%, #172340 30%, #253556 58%, #3b4b6c 82%, #55606c 100%); }
[data-theme="dark"] .hh-sky { filter: brightness(0.86) saturate(0.92); }

.home-hero[data-tod="night"] .home-hero-sparks,
.home-hero[data-season="winter"] .home-hero-sparks { opacity: 0.2; }

/* -- облака: настоящая текстура cloud.png, плывут с разной скоростью ----- */
.hh-clouds {
    position: absolute; inset: 0; z-index: 0; overflow: hidden; pointer-events: none;
    /* слева, под текстом, облака приглушены — чтобы заголовок читался */
    -webkit-mask-image: linear-gradient(90deg, rgba(0,0,0,0.3) 0%, rgba(0,0,0,0.42) 40%, #000 72%);
    mask-image: linear-gradient(90deg, rgba(0,0,0,0.3) 0%, rgba(0,0,0,0.42) 40%, #000 72%);
}
.hh-cloud {
    position: absolute; left: -520px; background: url("/static/images/cloud.png") center / contain no-repeat;
    opacity: var(--cloud-o); filter: var(--cloud-f); will-change: transform;
    animation: hh-cloud-drift var(--dur, 110s) linear infinite; animation-delay: var(--delay, 0s);
}
.hh-cloud--1 { --dur: 120s; --delay: -40s;  width: 440px; height: 151px; top: -2%; }
.hh-cloud--2 { --dur: 150s; --delay: -105s; width: 330px; height: 113px; top: 34%; opacity: calc(var(--cloud-o) * 0.7); }
.hh-cloud--3 { --dur: 95s;  --delay: -18s;  width: 250px; height: 86px;  top: 8%;  opacity: calc(var(--cloud-o) * 0.6); filter: var(--cloud-f) blur(0.6px); }
.hh-cloud--4 { --dur: 170s; --delay: -75s;  width: 520px; height: 178px; top: 50%; opacity: calc(var(--cloud-o) * 0.5); filter: var(--cloud-f) blur(1px); }
.hh-cloud--5 { --dur: 135s; --delay: -120s; width: 280px; height: 96px;  top: 22%; opacity: calc(var(--cloud-o) * 0.55); }
@keyframes hh-cloud-drift { from { transform: translateX(0); } to { transform: translateX(calc(100vw + 1040px)); } }

/* -- лучи вокруг подсолнуха (картинка rays-sun.png), два слоя вразнобой -- */
.home-hero-stage { position: relative; flex: 0 0 auto; width: 148px; height: 148px; z-index: 1; }
.home-hero-stage .home-hero-sun-wrap { width: 100%; height: 100%; }
.hh-rays {
    position: absolute; left: 46%; top: 39%; width: 560px; height: auto; max-width: none;
    transform: translate(-50%, -50%); pointer-events: none; user-select: none;
    transition: opacity 0.9s ease, filter 0.9s ease;
}
.hh-rays--back { opacity: 0.42; width: 700px; }
.hh-rays--front { opacity: 0.82; }
@media (min-width: 901px) { .home-hero-stage { margin-right: 64px; } }
@media (prefers-reduced-motion: no-preference) {
    .hh-rays--back  { animation: hh-rays-a 26s linear infinite; }
    .hh-rays--front { animation: hh-rays-b 9s ease-in-out infinite; }
}
@keyframes hh-rays-a { from { transform: translate(-50%, -50%) rotate(0deg); } to { transform: translate(-50%, -50%) rotate(360deg); } }
@keyframes hh-rays-b { 0%, 100% { transform: translate(-50%, -50%) rotate(-3deg) scale(0.97); } 50% { transform: translate(-50%, -50%) rotate(3deg) scale(1.06); } }
.home-hero[data-tod="dawn"] .hh-rays { filter: hue-rotate(-12deg) saturate(1.25); }
.home-hero[data-tod="dusk"] .hh-rays { filter: hue-rotate(-20deg) saturate(1.4) brightness(0.95); }
.home-hero[data-tod="dusk"] .hh-rays--back { opacity: 0.4; }
.home-hero[data-tod="night"] .hh-rays { opacity: 0; }
.home-hero[data-season="winter"] .hh-rays--front { opacity: 0.65; }
.home-hero[data-season="winter"][data-tod="day"] .hh-rays--back { opacity: 0.35; }

/* -- луна ночью ---------------------------------------------------------- */
.hh-moon {
    position: absolute; z-index: 0; right: 27%; top: 14%; width: 44px; height: 44px; border-radius: 50%;
    background: transparent; box-shadow: inset -13px -4px 0 0 #f5efd3, 0 0 34px 8px rgba(240, 235, 200, 0.28);
    transform: rotate(-18deg); opacity: 0; transition: opacity 1s ease; pointer-events: none;
}
.home-hero[data-tod="night"] .hh-moon { opacity: 1; }

/* -- звёзды: только ночью ------------------------------------------------- */
.hh-stars { position: absolute; inset: 0; z-index: 0; overflow: hidden; pointer-events: none; opacity: 0; transition: opacity 1.1s ease; }
.home-hero[data-tod="night"] .hh-stars { opacity: 1; }
.hw-star {
    position: absolute; border-radius: 50%; background: #fff;
    box-shadow: 0 0 4px 0.5px rgba(255,255,255,0.7);
    animation: hw-star-twinkle var(--tw-dur, 3s) ease-in-out infinite;
    animation-delay: var(--tw-delay, 0s);
}
@keyframes hw-star-twinkle { 0%, 100% { opacity: var(--tw-min, 0.25); } 50% { opacity: 1; } }
@media (prefers-reduced-motion: reduce) { .hw-star { animation: none; opacity: 0.55; } }

/* -- слой частиц: листопад / лепестки / снег / пыльца --------------------- */
.hh-fx { position: absolute; inset: 0; z-index: 1; overflow: hidden; pointer-events: none; }
.hh-fall {
    position: absolute; top: -60px; display: block; will-change: transform;
    animation: hh-fall 12s linear infinite;
}
.hh-fall > * { display: block; width: 100%; height: 100%; will-change: transform; animation: hh-sway 4s ease-in-out infinite alternate; }
.hh-fall img { object-fit: contain; filter: drop-shadow(0 2px 3px rgba(0, 0, 0, 0.22)); }
@keyframes hh-fall { from { transform: translateY(0); } to { transform: translateY(400px); } }
@keyframes hh-sway {
    from { transform: translateX(-26px) rotate(-35deg) rotateY(0deg); }
    to   { transform: translateX(26px) rotate(45deg) rotateY(180deg); }
}
.home-hero[data-tod="dawn"] .hh-leaf img { filter: drop-shadow(0 2px 3px rgba(0,0,0,0.22)) brightness(0.95) saturate(1.05); }
.home-hero[data-tod="dusk"] .hh-leaf img { filter: drop-shadow(0 2px 3px rgba(0,0,0,0.25)) brightness(0.78) saturate(1.05); }
.home-hero[data-tod="night"] .hh-leaf img { filter: drop-shadow(0 2px 3px rgba(0,0,0,0.3)) brightness(0.42) saturate(0.85); }
.hh-petal-shape {
    border-radius: 80% 0 80% 0; background: linear-gradient(135deg, #fff5f8 0%, #ffc4d6 100%);
    box-shadow: 0 1px 3px rgba(120, 40, 70, 0.18);
}
.home-hero[data-tod="dusk"] .hh-petal { opacity: 0.85; }
.home-hero[data-tod="night"] .hh-petal { opacity: 0.45; }

/* Снегопад: бесшовная картинка, три слоя с разной скоростью/размером (параллакс) */
.hw-snow {
    position: absolute; left: -10%; width: 120%; top: calc(-1 * var(--h)); height: calc(100% + var(--h));
    background: url("/static/images/snow-tile.png") 0 0 / var(--w) var(--h) repeat;
    will-change: transform;
    animation: hw-snow-fall var(--dur) linear infinite, hw-snow-sway var(--sway) ease-in-out infinite alternate;
}
.hw-snow--1 { --w: 460px; --h: 170px; --dur: 16s; --sway: 9s;  opacity: 0.32; filter: blur(0.4px); }
.hw-snow--2 { --w: 700px; --h: 256px; --dur: 10s; --sway: 7s;  opacity: 0.65; background-position: 130px 0; }
.hw-snow--3 { --w: 1100px; --h: 402px; --dur: 6.5s; --sway: 6s; opacity: 0.8; background-position: 310px 0; }
@keyframes hw-snow-fall { from { translate: 0 0; } to { translate: 0 var(--h); } }
@keyframes hw-snow-sway { from { transform: translateX(-14px); } to { transform: translateX(14px); } }

/* Летняя золотая пыльца (ночью — светлячки) */
.hw-mote {
    position: absolute; bottom: -6%; border-radius: 50%;
    background: radial-gradient(circle, rgba(255, 246, 200, 0.95), rgba(255, 246, 200, 0));
    animation: hw-mote-rise var(--mote-dur, 9s) ease-in infinite; animation-delay: var(--mote-delay, 0s);
}
.home-hero[data-tod="night"] .hw-mote { background: radial-gradient(circle, rgba(214, 255, 130, 0.95), rgba(214, 255, 130, 0)); }
@keyframes hw-mote-rise {
    0% { transform: translateY(0) translateX(0); opacity: 0; }
    12% { opacity: 0.85; }
    100% { transform: translateY(-140%) translateX(var(--mote-drift, 0px)); opacity: 0; }
}

@media (prefers-reduced-motion: reduce) {
    .hh-cloud, .hw-snow, .hw-mote, .hh-fall, .hh-fall > * { animation: none !important; }
    .hh-cloud { left: var(--rest, 20%); }
    .hh-cloud--2 { --rest: 45%; } .hh-cloud--3 { --rest: 65%; } .hh-cloud--4 { --rest: 8%; } .hh-cloud--5 { --rest: 32%; }
}

/* Веки — кружки в цвет мордочки, которые быстро "прикрывают" глаза поверх картинки */
.home-hero-sun-eyelid {
    position: absolute; background: #ffe000; border-radius: 50%;
    transform: scaleY(0.04); transform-origin: 50% 12%;
}
.home-hero-sun-eyelid--l { left: 31.5%; top: 29.5%; width: 15%; height: 16.5%; }
.home-hero-sun-eyelid--r { left: 48.3%; top: 33%; width: 16%; height: 17.5%; }
@media (prefers-reduced-motion: no-preference) {
    .home-hero-sun-wrap { animation: home-hero-sun-sway 7s ease-in-out infinite; }
    .home-hero-sun-eyelid { animation: home-hero-sun-blink 5s ease-in-out infinite; }
}
/* Ночью подсолнух спит — глаза закрыты */
.home-hero[data-tod="night"] .home-hero-sun-eyelid { animation: none; transform: scaleY(1); }
@keyframes home-hero-sun-sway { 0%, 100% { transform: rotate(-9deg); } 50% { transform: rotate(-2deg); } }
@keyframes home-hero-sun-blink {
    0%, 92%, 100% { transform: scaleY(0.04); }
    94% { transform: scaleY(1); }
    96% { transform: scaleY(0.04); }
}
.hero-btn {
    display: inline-flex; align-items: center; gap: 6px; padding: 8px 14px; border: 1px solid transparent;
    border-radius: var(--radius-sm); background: #fff; color: #2f6b3a; font-size: 0.9em; font-weight: 600;
    text-decoration: none; cursor: pointer; transition: var(--transition);
}
.hero-btn:hover { background: #f1f7f1; transform: translateY(-1px); }
.hero-btn--ghost { background: rgba(255, 255, 255, 0.14); color: #fff; border-color: rgba(255, 255, 255, 0.42); }
.hero-btn--ghost:hover { background: rgba(255, 255, 255, 0.26); }
/* Плитки «главное за сегодня» */
.home-stats { display: grid; grid-template-columns: repeat(auto-fit, minmax(210px, 1fr)); gap: 12px; }
.home-stat {
    display: flex; align-items: center; gap: 14px; padding: 14px 16px; text-decoration: none;
    background: var(--color-surface); color: var(--color-text); border: 1px solid var(--color-border);
    border-radius: var(--radius); box-shadow: var(--shadow); transition: var(--transition);
}
.home-stat:hover { border-color: var(--ico-fg, var(--color-primary)); transform: translateY(-2px); box-shadow: var(--shadow-lg); }
.home-stat-ico {
    display: grid; place-items: center; flex-shrink: 0; width: 46px; height: 46px; border-radius: 13px;
    background: var(--ico-bg, var(--color-primary-light)); color: var(--ico-fg, var(--color-primary-dark));
}
.home-stat-ico .icon { width: 23px; height: 23px; vertical-align: 0; }
.home-stat--shifts, .home-stat--tasks, .home-stat--news, .home-stat--me {
    --ico-bg: var(--color-primary-light); --ico-fg: var(--color-primary-dark);
}
.home-stat--alert { --ico-bg: rgba(192, 57, 43, 0.15); --ico-fg: var(--color-danger); border-color: rgba(192, 57, 43, 0.5); }
.home-stat-body { display: flex; flex-direction: column; min-width: 0; }
.home-stat-label { font-size: 0.72em; font-weight: 700; letter-spacing: 0.06em; text-transform: uppercase; color: var(--color-muted); }
.home-stat-value { font-size: 1.75em; font-weight: 700; line-height: 1.15; color: var(--color-text); }
.home-stat-value--text { font-size: 1.12em; padding: 5px 0 2px; }
.home-stat-sub { font-size: 0.82em; color: var(--color-muted); }
.home-stat--alert .home-stat-value, .home-stat--alert .home-stat-sub { color: var(--color-danger); }

/* Две колонки; на узких экранах — одна, с осмысленным порядком блоков */
.home-cols { display: grid; grid-template-columns: minmax(0, 1.65fr) minmax(300px, 1fr); gap: 18px; align-items: start; }
.home-col { display: flex; flex-direction: column; gap: 18px; min-width: 0; }
@media (max-width: 960px) {
    .home-cols { display: flex; flex-direction: column; }
    .home-col { display: contents; }
    .hc-ann { order: 1; } .hc-shifts { order: 2; } .hc-tasks { order: 3; }
    .hc-orders { order: 4; } .hc-moves { order: 5; } .hc-bdays { order: 6; }
}

.home-card {
    background: var(--color-surface); border: 1px solid var(--color-border); border-radius: var(--radius);
    padding: 16px 20px 18px; box-shadow: var(--shadow); min-width: 0;
}
.home-card-head {
    display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap;
    margin-bottom: 12px; padding-bottom: 12px; border-bottom: 1px solid var(--color-border);
}
.home-card-head h3 { display: flex; align-items: center; gap: 10px; margin: 0; font-size: 1.05em; color: var(--color-text); }
.home-card-ico {
    display: inline-grid; place-items: center; flex-shrink: 0; width: 32px; height: 32px; border-radius: 10px;
    background: var(--color-primary-light); color: var(--color-primary-dark); font-size: 1em; line-height: 1;
}
.home-card-ico .icon { width: 17px; height: 17px; margin: 0; vertical-align: 0; }
.home-card-links { display: flex; align-items: center; gap: 14px; font-size: 0.86em; }
.home-card-links a { text-decoration: none; font-weight: 600; }
.home-card-links a:hover { text-decoration: underline; }
.home-link-btn { display: inline-flex; align-items: center; gap: 4px; background: none; border: none; padding: 0; font-size: 1em; font-weight: 600; color: var(--color-primary-dark); }
.home-link-btn:hover { background: none; text-decoration: underline; }
.home-link-btn .icon { background-color: currentColor; }
.home-more { display: block; margin-top: 10px; font-size: 0.86em; font-weight: 600; text-decoration: none; }
.home-more:hover { text-decoration: underline; }
.home-foot { margin: 10px 0 0; }

/* Пустые состояния */
.home-empty {
    display: flex; flex-direction: column; align-items: center; gap: 6px; padding: 22px 12px;
    text-align: center; font-size: 0.92em; line-height: 1.4; color: var(--color-muted);
}
.home-empty-ico {
    display: grid; place-items: center; width: 40px; height: 40px; border-radius: 50%;
    background: var(--color-primary-light); color: var(--color-muted);
}
.home-empty-ico .icon { width: 19px; height: 19px; vertical-align: 0; }

/* ============================================================
   Объявления — настоящая пробковая доска с приколотыми записками
   ============================================================ */
.ann-board {
    position: relative;
    padding: 26px 22px 30px;
    border-radius: 14px;
    background-color: #c69a63;
    background-image:
        radial-gradient(rgba(255, 255, 255, 0.12) 1px, transparent 1.5px),
        radial-gradient(rgba(76, 46, 20, 0.22) 1px, transparent 1.6px),
        radial-gradient(ellipse at 25% 15%, rgba(255, 255, 255, 0.16), transparent 55%),
        radial-gradient(ellipse at 80% 95%, rgba(0, 0, 0, 0.22), transparent 55%);
    background-size: 13px 13px, 9px 9px, 100% 100%, 100% 100%;
    background-position: 0 0, 4px 5px, 0 0, 0 0;
    box-shadow:
        inset 0 0 0 9px #96652f,
        inset 0 0 0 12px #7c4f24,
        inset 0 0 0 13px rgba(255, 255, 255, 0.12),
        inset 0 3px 14px rgba(0, 0, 0, 0.4),
        0 10px 26px rgba(60, 38, 15, 0.22);
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
    gap: 30px 20px;
    align-items: start;
}
[data-theme="dark"] .ann-board {
    background-color: #6b4b2c;
    background-image:
        radial-gradient(rgba(255, 255, 255, 0.07) 1px, transparent 1.5px),
        radial-gradient(rgba(0, 0, 0, 0.3) 1px, transparent 1.6px),
        radial-gradient(ellipse at 25% 15%, rgba(255, 255, 255, 0.06), transparent 55%),
        radial-gradient(ellipse at 80% 95%, rgba(0, 0, 0, 0.35), transparent 55%);
    box-shadow:
        inset 0 0 0 9px #4a331d,
        inset 0 0 0 12px #3a2716,
        inset 0 0 0 13px rgba(255, 255, 255, 0.05),
        inset 0 3px 14px rgba(0, 0, 0, 0.55),
        0 10px 26px rgba(0, 0, 0, 0.4);
}
.ann-board .ann-empty-state,
.ann-board .empty-state { grid-column: 1 / -1; background: rgba(255, 255, 255, 0.88); border-radius: 8px; }

/* Записка-стикер */
.ann-item {
    --note-bg: #fdf1a8; --pin-color: #d6473c;
    position: relative; padding: 18px 16px 14px; margin-top: 0 !important;
    background: var(--note-bg); color: #3b3122;
    border: none; border-radius: 2px 2px 10px 2px;
    box-shadow:
        2px 5px 4px rgba(0, 0, 0, 0.18),
        6px 12px 16px -6px rgba(0, 0, 0, 0.28);
    transform: rotate(var(--tilt, -1.4deg));
    transition: transform 0.18s ease, box-shadow 0.18s ease;
    min-height: 108px;
}
.ann-item::after {
    /* лёгкий загнутый уголок, как у настоящего бумажного стикера */
    content: ""; position: absolute; right: 0; bottom: 0; width: 0; height: 0;
    border-style: solid; border-width: 0 0 15px 15px;
    border-color: transparent transparent rgba(0, 0, 0, 0.12) transparent;
}
.ann-item::before {
    /* кнопка-кнопка, которой записка приколота к пробке */
    content: ""; position: absolute; top: -13px; left: 50%; transform: translateX(-50%);
    width: 18px; height: 18px; border-radius: 50%;
    background:
        radial-gradient(circle at 33% 28%, rgba(255, 255, 255, 0.9), rgba(255, 255, 255, 0) 45%),
        var(--pin-color);
    box-shadow: 0 3px 5px rgba(0, 0, 0, 0.45), 0 5px 3px -3px rgba(0, 0, 0, 0.25);
    z-index: 2;
}
.ann-item:hover {
    transform: rotate(0deg) translateY(-4px) scale(1.015);
    box-shadow: 3px 8px 10px rgba(0, 0, 0, 0.2), 8px 18px 22px -6px rgba(0, 0, 0, 0.34);
    z-index: 3;
}
/* Цвета записок — чередуются по кругу, как в жизни на доске */
.ann-note-0 { --note-bg: #fdf1a8; --pin-color: #3a7bd5; }
.ann-note-1 { --note-bg: #ffffff; --pin-color: #d6473c; }
.ann-note-2 { --note-bg: #f8cfe0; --pin-color: #2f2f2f; }
.ann-note-3 { --note-bg: #cfe8fb; --pin-color: #f2b705; }
.ann-note-4 { --note-bg: #ddf3d3; --pin-color: #7c3aed; }
.ann-note-5 { --note-bg: #fde3bb; --pin-color: #1f8a4c; }
/* Важное и закреплённое — сохраняем смысл поверх цветовой чехарды */
.ann-item.ann-item--important { --note-bg: #ffd9d3; --pin-color: #c0392b; }
.ann-item.ann-item--archived {
    filter: grayscale(0.45) brightness(0.96); opacity: 0.82;
    box-shadow: 1px 3px 5px rgba(0, 0, 0, 0.18); transform: rotate(calc(var(--tilt, -1deg) * 0.4)) !important;
}
.ann-item.ann-item--archived:hover { transform: rotate(0deg) !important; box-shadow: 2px 5px 8px rgba(0, 0, 0, 0.2); }
/* Бейдж «закреплено» — жёлтая ленточка в углу, отдельно от декоративной кнопки */
.ann-pin {
    position: absolute; top: -8px; right: 10px; z-index: 3;
    display: grid; place-items: center; width: 25px; height: 25px; border-radius: 7px 7px 2px 7px;
    background: linear-gradient(155deg, #ffd657, #e2a300); color: #4a3200;
    box-shadow: 0 3px 6px rgba(0, 0, 0, 0.35);
    transform: rotate(9deg);
}
.ann-pin .icon { width: 11px; height: 11px; background-color: #4a3200; }
.ann-top { display: flex; justify-content: space-between; align-items: flex-start; gap: 8px; }
.ann-title { display: flex; align-items: center; flex-wrap: wrap; gap: 6px; min-width: 0; font-size: 1.02em; }
.ann-title strong { font-family: "Segoe Print", "Bradley Hand", -apple-system, sans-serif; }
.ann-chip {
    font-size: 0.66em; font-weight: 700; padding: 2px 8px; border-radius: 999px; text-transform: uppercase;
    letter-spacing: 0.04em; background: rgba(0, 0, 0, 0.12); color: #4a3f2c;
}
.ann-chip--important { background: var(--color-danger); color: #fff; }
.ann-chip--new { background: var(--color-primary-dark); color: #fff; }
.ann-actions { display: flex; gap: 2px; flex-shrink: 0; }
.ann-actions form { margin: 0; }
.ann-icon-btn { background: none; color: rgba(58, 49, 34, 0.55); border: none; padding: 4px 7px; font-size: 0.95em; line-height: 1; border-radius: 6px; }
.ann-icon-btn .icon { background-color: currentColor; }
.ann-icon-btn:hover { background: rgba(0, 0, 0, 0.08); color: #3b3122; }
.ann-body { margin-top: 8px; white-space: pre-line; font-size: 0.93em; line-height: 1.5; overflow-wrap: anywhere; }
.ann-body.is-clamped { display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; cursor: pointer; }
.ann-meta { margin-top: 10px; color: rgba(58, 49, 34, 0.6) !important; }
.ann-archive summary { cursor: pointer; }
.ann-archive[open] summary { margin-bottom: 12px; }
.ann-form { display: flex; flex-direction: column; gap: 10px; }
.ann-form label { display: flex; flex-direction: column; gap: 4px; font-size: 0.86em; color: var(--color-muted); }
.ann-form-row { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.ann-form .ann-check { flex-direction: row; align-items: center; gap: 8px; color: var(--color-text); }
@media (max-width: 520px) { .ann-form-row { grid-template-columns: 1fr; } }
@media (max-width: 640px) { .ann-board { grid-template-columns: 1fr 1fr; gap: 26px 14px; padding: 20px 16px 24px; } }
@media (max-width: 420px) { .ann-board { grid-template-columns: 1fr; } }

/* Задачи */
.home-tabs { display: inline-flex; padding: 3px; background: var(--color-primary-light); border-radius: 999px; }
.home-tab { background: none; color: var(--color-muted); border: none; padding: 4px 13px; border-radius: 999px; font-size: 0.86em; font-weight: 600; }
.home-tab:hover { background: none; color: var(--color-text); }
.home-tab.active { background: var(--color-surface); color: var(--color-primary-dark); box-shadow: var(--shadow); }
.home-tab span { opacity: 0.7; margin-left: 2px; }
.home-tab-pane[hidden] { display: none; }
.home-task { display: flex; align-items: center; gap: 12px; padding: 10px 2px; border-bottom: 1px solid var(--color-border); transition: opacity 0.3s; }
.home-task:last-child { border-bottom: none; }
.home-task--done { opacity: 0.35; text-decoration: line-through; }
.home-task-check {
    display: inline-grid; place-items: center; flex-shrink: 0; width: 24px; height: 24px; padding: 0;
    border-radius: 50%; border: 2px solid var(--color-border); background: transparent;
}
.home-task-check::after { content: "✓"; font-size: 13px; font-weight: 700; line-height: 1; color: transparent; }
.home-task-check:hover { border-color: var(--color-primary); background: var(--color-primary-light); }
.home-task-check:hover::after { color: var(--color-primary); }
.home-task-check--off { cursor: default; }
.home-task-check--off::after { content: none; }
.home-task--overdue .home-task-check { border-color: var(--color-danger); }
.home-task-main { flex: 1; min-width: 0; }
.home-task-title { font-weight: 600; font-size: 0.95em; overflow-wrap: anywhere; }
.home-task-go {
    background: none; color: var(--color-primary-dark); border: 1px solid var(--color-border);
    padding: 3px 10px; font-size: 0.78em; font-weight: 600; border-radius: 999px; white-space: nowrap;
}
.home-task-go:hover { background: var(--color-primary-light); border-color: var(--color-primary); }

/* Движение товара */
.mv-legend { display: flex; gap: 16px; flex-wrap: wrap; margin-bottom: 10px; font-size: 0.84em; color: var(--color-muted); }
.mv-legend b { margin-left: 3px; color: var(--color-text); }
.mv-dot { display: inline-block; width: 10px; height: 10px; margin-right: 4px; border-radius: 3px; vertical-align: -1px; }
.mv-dot--in { background: #3f7d4f; } .mv-dot--out { background: #e0913b; } .mv-dot--move { background: #4a7fd0; }
.mv-bar--in { background: linear-gradient(180deg, #5aa06c, #3f7d4f); }
.mv-bar--out { background: linear-gradient(180deg, #efab5c, #e0913b); }
.mv-bar--move { background: linear-gradient(180deg, #6b9be0, #4a7fd0); }
.mv-scale { display: flex; justify-content: space-between; margin-bottom: 4px; font-size: 0.72em; color: var(--color-muted); }
.mv-chart { display: grid; grid-template-columns: repeat(var(--mv-days, 14), minmax(0, 1fr)); gap: 4px; }
.mv-day { display: flex; flex-direction: column; padding: 0 1px; border-radius: 6px; transition: background 0.12s; }
.mv-day:hover { background: var(--color-primary-light); }
.mv-day--weekend { background: rgba(127, 127, 127, 0.07); }
.mv-day--today { background: var(--color-primary-light); box-shadow: inset 0 -2px 0 var(--color-primary); }
.mv-bars {
    display: flex; align-items: flex-end; justify-content: center; gap: 2px; height: 116px;
    border-bottom: 1px solid var(--color-border);
    background-image: linear-gradient(to top, rgba(127, 127, 127, 0.2) 1px, transparent 1px);
    background-size: 100% 25%; background-position: bottom;
}
.mv-bar { flex: 1 1 0; max-width: 11px; border-radius: 3px 3px 0 0; }
.mv-label { padding-top: 4px; font-size: 0.66em; text-align: center; white-space: nowrap; overflow: hidden; color: var(--color-muted); }
.mv-day--today .mv-label { font-weight: 700; color: var(--color-primary-dark); }
@media (max-width: 520px) { .mv-day:nth-child(even) .mv-label { visibility: hidden; } }
.mv-lists { display: grid; grid-template-columns: 1.4fr 1fr; gap: 22px; margin-top: 18px; padding-top: 14px; border-top: 1px solid var(--color-border); }
.mv-lists h4 { margin: 0 0 6px; font-size: 0.74em; letter-spacing: 0.06em; text-transform: uppercase; color: var(--color-muted); }
.mv-transfer, .mv-route-row { display: flex; justify-content: space-between; gap: 10px; padding: 8px 0; border-bottom: 1px solid var(--color-border); font-size: 0.9em; }
.mv-transfer:last-child, .mv-route-row:last-child { border-bottom: none; }
.mv-transfer-main { display: flex; flex-direction: column; min-width: 0; }
.mv-transfer-main a { font-weight: 600; overflow-wrap: anywhere; }
.mv-route { font-size: 0.85em; color: var(--color-muted); }
.mv-transfer-side { display: flex; flex-direction: column; align-items: flex-end; flex-shrink: 0; }
@media (max-width: 640px) { .mv-lists { grid-template-columns: 1fr; gap: 14px; } }

/* Кто в смене */
.shift-place { margin: 14px 0 4px; font-size: 0.72em; font-weight: 700; letter-spacing: 0.06em; text-transform: uppercase; color: var(--color-muted); }
.hc-shifts .shift-place:first-of-type { margin-top: 0; }
.shift-row { display: flex; align-items: center; gap: 10px; padding: 8px 10px; border: 1px solid transparent; border-radius: var(--radius-sm); transition: var(--transition); }
.shift-row + .shift-row { margin-top: 3px; }
.shift-row--now { background: rgba(63, 177, 90, 0.09); border-color: rgba(63, 177, 90, 0.28); }
.shift-row--me .shift-name { color: var(--color-primary-dark); }
.shift-row--done { opacity: 0.5; }
.shift-who { flex: 1; min-width: 0; }
.shift-name { font-weight: 600; font-size: 0.92em; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.shift-time { display: flex; flex-direction: column; align-items: flex-end; gap: 2px; font-size: 0.85em; font-weight: 600; font-variant-numeric: tabular-nums; }
.shift-badge { display: inline-block; padding: 1px 8px; border-radius: 999px; background: var(--color-border); font-size: 0.78em; font-weight: 600; color: var(--color-muted); }
.shift-badge--now { background: rgba(63, 177, 90, 0.2); color: var(--color-primary-dark); }
.shift-badge--now::before { content: "●"; margin-right: 4px; color: #3fb15a; animation: shift-pulse 2s ease-in-out infinite; }
@keyframes shift-pulse { 50% { opacity: 0.3; } }
.shift-tomorrow { margin-top: 12px; padding-top: 12px; border-top: 1px dashed var(--color-border); }

/* Заказы на неделе */
.ord-row { display: flex; align-items: center; gap: 12px; padding: 9px 0; border-bottom: 1px solid var(--color-border); text-decoration: none; color: var(--color-text); }
.ord-row:last-of-type { border-bottom: none; }
.ord-row:hover strong { text-decoration: underline; }
.ord-date { min-width: 50px; padding: 5px 0; text-align: center; font-size: 0.82em; font-weight: 700; border-radius: 8px; background: var(--color-primary-light); color: var(--color-primary-dark); }
.ord-row--overdue .ord-date { background: rgba(192, 57, 43, 0.13); color: var(--color-danger); }
.ord-main { display: flex; flex-direction: column; flex: 1; min-width: 0; }

/* Дни рождения */
.bday-row { display: flex; align-items: center; gap: 10px; padding: 8px 0; border-bottom: 1px solid var(--color-border); }
.bday-row:last-child { border-bottom: none; }
.bday-row--today { padding-left: 8px; padding-right: 8px; border-radius: 10px; border-bottom-color: transparent; background: rgba(232, 183, 63, 0.18); }
.bday-who { flex: 1; min-width: 0; font-size: 0.92em; }
.bday-when { font-size: 0.8em; font-weight: 600; white-space: nowrap; color: var(--color-muted); }
.bday-row--today .bday-when { color: #b7791f; }

/* Появление блоков (только если пользователь не отключил анимацию) */
@keyframes home-rise { from { opacity: 0; transform: translateY(8px); } }
@media (prefers-reduced-motion: no-preference) {
    .home-hero, .home-stat, .home-card { animation: home-rise 0.4s ease backwards; }
    .home-stat:nth-child(2) { animation-delay: 0.04s; } .home-stat:nth-child(3) { animation-delay: 0.08s; }
    .home-stat:nth-child(4) { animation-delay: 0.12s; }
    .home-col .home-card:nth-child(2) { animation-delay: 0.06s; } .home-col .home-card:nth-child(3) { animation-delay: 0.12s; }
}
.home a:focus-visible, .home button:focus-visible, .shift-grid button:focus-visible { outline: 2px solid var(--color-primary); outline-offset: 2px; }

@media (max-width: 600px) {
    .home-hero { padding: 18px 18px 20px; }
    .home-hero-row { min-height: 0; gap: 12px; }
    .home-hero-text { flex: 1 1 100%; max-width: 100%; }
    .home-hero h1 { font-size: 1.4em; }
    .home-hero-stage { width: 92px; height: 92px; }
    .hh-rays { width: 340px; }
    .hh-rays--back { width: 430px; }
    .hh-moon { right: 30%; top: 10%; width: 32px; height: 32px; box-shadow: inset -9px -3px 0 0 #f5efd3, 0 0 26px 6px rgba(240, 235, 200, 0.26); }
    .hh-cloud--1 { width: 300px; height: 103px; } .hh-cloud--4 { width: 340px; height: 116px; }
    .home-hero-sun { opacity: 0.8; }
    .home-stats { grid-template-columns: 1fr 1fr; }
    .home-stat { flex-direction: column; align-items: flex-start; gap: 8px; }
    .home-card { padding: 14px 14px 16px; }
}

/* График смен (страница «Сотрудники → График смен») */
.shift-toolbar { display: flex; justify-content: space-between; align-items: center; gap: 12px; flex-wrap: wrap; margin-bottom: 14px; }
.shift-toolbar form { margin: 0; }
.shift-week-nav { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.shift-nav-btn {
    display: inline-flex; align-items: center; padding: 8px 12px; font-size: 0.92em; text-decoration: none;
    border-radius: var(--radius-sm); border: 1px solid var(--color-border); background: var(--color-surface); color: var(--color-text);
}
.shift-nav-btn:hover { background: var(--color-primary-light); }
.shift-week-label { min-width: 190px; padding: 7px 14px; text-align: center; font-weight: 700; border-radius: 999px; background: var(--color-primary-light); color: var(--color-primary-dark); }
.shift-grid-wrap { background: var(--color-surface); border: 1px solid var(--color-border); box-shadow: var(--shadow); }
.shift-grid { width: 100%; min-width: 860px; border-collapse: collapse; }
.shift-grid th, .shift-grid td { padding: 6px; vertical-align: top; border-bottom: 1px solid var(--color-border); border-right: 1px solid var(--color-border); }
.shift-grid th:last-child, .shift-grid td:last-child { border-right: none; }
.shift-grid tbody tr:last-child td { border-bottom: none; }
.shift-grid thead th { padding: 9px 6px; text-align: center; font-size: 0.85em; background: var(--color-primary-light); }
.shift-dow { display: block; font-weight: 700; color: var(--color-primary-dark); }
.shift-dom { color: var(--color-muted); font-weight: 500; }
.shift-grid thead th.is-today { background: var(--color-primary); }
.shift-grid thead th.is-today .shift-dow, .shift-grid thead th.is-today .shift-dom { color: #fff; }
.shift-grid .shift-grid-who { width: 200px; min-width: 170px; text-align: left; position: sticky; left: 0; z-index: 1; background: var(--color-surface); }
.shift-grid thead .shift-grid-who, .shift-grid tfoot .shift-grid-who { background: var(--color-primary-light); }
.shift-emp { display: flex; align-items: center; gap: 8px; }
.shift-emp-name { font-weight: 600; font-size: 0.9em; }
.shift-cell { min-width: 112px; height: 56px; }
.shift-grid tbody tr:hover td:not(.shift-grid-who) { background: rgba(63, 125, 79, 0.05); }
.shift-grid .is-weekend { background: rgba(127, 127, 127, 0.06); }
.shift-grid td.is-today { background: rgba(63, 125, 79, 0.12); }
.shift-chip {
    display: flex; align-items: center; gap: 4px; flex-wrap: wrap; margin-bottom: 4px; padding: 4px 7px;
    font-size: 0.78em; border-radius: 7px; background: var(--color-primary-light); border: 1px solid var(--color-border);
    border-left: 3px solid var(--color-primary);
}
.shift-chip-time { font-weight: 700; font-variant-numeric: tabular-nums; }
.shift-chip-place { color: var(--color-muted); }
.shift-chip form { margin: 0 0 0 auto; }
.shift-chip-x { background: none; color: var(--color-muted); border: none; padding: 0 4px; font-size: 1.1em; line-height: 1; }
.shift-chip-x:hover { background: none; color: var(--color-danger); }
.shift-add {
    width: 100%; padding: 1px 0; font-size: 0.85em; opacity: 0; border-radius: 6px;
    background: none; color: var(--color-muted); border: 1px dashed var(--color-border);
}
.shift-grid tbody tr:hover .shift-add { opacity: 0.45; }
.shift-cell:hover .shift-add, .shift-add:focus { opacity: 1; }
.shift-add:hover { background: var(--color-primary-light); color: var(--color-primary-dark); }
@media (hover: none) { .shift-add { opacity: 0.6; } }
.shift-grid tfoot td { background: var(--color-primary-light); }
.shift-count { text-align: center; font-weight: 700; font-size: 0.9em; color: var(--color-primary-dark); }

/* ===== Переключатель Неделя/Месяц и месячный печатный график смен ===== */
.shift-subtabs { display: flex; gap: 8px; margin: 2px 0 14px; }
.shift-subtab {
    padding: 6px 16px; border-radius: 999px; border: 1px solid var(--color-border);
    background: var(--color-surface); color: var(--color-text); text-decoration: none;
    font-size: 0.88em; font-weight: 600; transition: var(--transition);
}
.shift-subtab:hover { background: var(--color-primary-light); }
.shift-subtab.active { background: var(--color-primary); color: #fff; border-color: var(--color-primary); }
.shift-toolbar-actions { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.shift-toolbar-actions form { margin: 0; }

.shift-grid--month { min-width: 1100px; }
.shift-grid--month th, .shift-grid--month td { padding: 3px; }
.shift-grid--month .shift-grid-who { width: 168px; min-width: 150px; }
.shift-grid--month .shift-dom { display: block; font-weight: 700; }
.shift-grid--month th { font-size: 0.72em; }
.shift-cell--month { min-width: 40px; height: 44px; text-align: center; padding: 2px !important; }
.shift-cell--month .shift-chip {
    display: block; margin: 0 0 1px; padding: 1px 2px; border-radius: 4px;
    background: var(--color-primary-light); font-size: 0.78em; line-height: 1.2;
}
.shift-cell--month .shift-chip-time { display: block; font-weight: 700; }
.shift-cell--month .shift-chip-hours { display: block; color: var(--color-muted); font-size: 0.9em; }
.shift-cell--month .shift-chip form { display: inline; margin: 0; }
.shift-cell--month .shift-chip-x { padding: 0 2px; font-size: 0.95em; }
.shift-status-block {
    position: relative; display: flex; align-items: center; justify-content: center;
    height: 100%; min-height: 36px; border-radius: 4px; font-weight: 800; font-size: 0.95em; color: #fff;
}
.shift-status-block .shift-chip-x {
    position: absolute; top: -2px; right: 0; color: rgba(255,255,255,0.85); font-size: 0.85em; padding: 0 3px;
}
.shift-status-block .shift-chip-x:hover { color: #fff; }
.shift-status--dayoff { background: #3fb15a; }
.shift-status--vacation { background: #4a7fd6; }
.shift-status--sick { background: #d84f4f; }
.shift-hours-col { width: 62px; min-width: 56px; text-align: center; font-weight: 700; color: var(--color-primary-dark); background: var(--color-primary-light); }
.shift-legend { display: flex; flex-wrap: wrap; gap: 18px; margin-top: 14px; font-size: 0.85em; align-items: center; }
.shift-legend-item { display: flex; align-items: center; gap: 7px; }
.shift-legend-swatch { width: 18px; height: 18px; border-radius: 4px; display: inline-block; }

/* Переключатель типа записи (Смена/Выходной/Отпуск/Больничный) в модалке */
.kind-select { display: flex; flex-wrap: wrap; gap: 6px; }
.kind-select label {
    flex-direction: row !important; align-items: center; gap: 5px; cursor: pointer;
    padding: 6px 12px; border: 1px solid var(--color-border); border-radius: 999px; font-size: 0.86em !important;
    color: var(--color-text) !important;
}
.kind-select input { margin: 0; }
.kind-select input:checked + span { font-weight: 700; }
.weekday-check-group { display: flex; flex-wrap: wrap; gap: 6px; }
.weekday-check-group label {
    flex-direction: row !important; align-items: center; gap: 4px; cursor: pointer;
    padding: 5px 9px; border: 1px solid var(--color-border); border-radius: 8px; font-size: 0.84em !important;
}

@media print {
    .side-toolbar, .sidebar, .burger, #notif-bell-wrap, .no-print { display: none !important; }
    .app-layout, .main-content { display: block !important; margin: 0 !important; padding: 0 !important; width: 100% !important; }
    body { background: #fff !important; }
    .shift-grid-wrap { border: none; box-shadow: none; overflow: visible !important; }
    .shift-grid--month { min-width: 0; width: 100%; }
    .shift-grid, .shift-grid--month { font-size: 10px; }
    .shift-add { display: none !important; }
    .shift-chip-x, .shift-status-block .shift-chip-x { display: none !important; }
    .shift-grid th, .shift-grid td { border: 1px solid #999 !important; }
    @page { size: landscape; margin: 8mm; }
}

/* ===== Контент-план ===== */
.cp-toolbar { display:flex; align-items:center; gap:10px; flex-wrap:wrap; margin:12px 0 16px; }
.cp-period { display:flex; align-items:center; gap:10px; padding:7px 10px; border:1px solid var(--color-border); border-radius:var(--radius-sm); background:var(--color-surface); }
.cp-period a { text-decoration:none; color:var(--color-text); font-size:1.35em; line-height:1; padding:2px 7px; border-radius:6px; }
.cp-period a:hover { background:var(--color-primary-light); }
.cp-period-label { min-width:145px; text-align:center; }
.cp-filter-row { display:flex; gap:6px; flex-wrap:wrap; align-items:center; }
.cp-chip { border:1px solid var(--color-border); background:var(--color-surface); color:var(--color-text); border-radius:999px; padding:6px 10px; font-size:.82em; cursor:pointer; text-decoration:none; }
.cp-chip:hover { background:var(--color-primary-light); }
.cp-chip.active { background:var(--color-primary); color:#fff; border-color:var(--color-primary); }
.cp-stats { display:grid; grid-template-columns:repeat(4,minmax(130px,1fr)); gap:12px; margin:14px 0; }
.cp-stat { padding:14px 16px; }
.cp-stat-value { font-size:1.55em; font-weight:750; color:var(--color-primary-dark); }
.cp-stat-label { font-size:.78em; color:var(--color-muted); margin-top:2px; }
.cp-layout { display:grid; grid-template-columns:minmax(0,1fr) 340px; gap:16px; align-items:start; }
.cp-calendar-wrap { min-width:0; }
.cp-calendar { background:var(--color-surface); border:1px solid var(--color-border); border-radius:var(--radius); overflow:hidden; box-shadow:var(--shadow); }
.cp-weekdays { display:grid; grid-template-columns:repeat(7,1fr); background:var(--color-bg); border-bottom:1px solid var(--color-border); }
.cp-weekday { padding:9px 8px; font-size:.76em; font-weight:700; color:var(--color-muted); text-transform:uppercase; letter-spacing:.04em; }
.cp-weeks { display:flex; flex-direction:column; }
.cp-week { display:grid; grid-template-columns:repeat(7,1fr); min-height:128px; border-bottom:1px solid var(--color-border); }
.cp-week:last-child { border-bottom:0; }
.cp-day { min-width:0; padding:7px; border-right:1px solid var(--color-border); background:var(--color-surface); }
.cp-day:last-child { border-right:0; }
.cp-day.outside { background:var(--color-bg); opacity:.62; }
.cp-day.today { box-shadow:inset 0 0 0 2px var(--color-primary); }
.cp-day-head { display:flex; justify-content:space-between; align-items:center; margin-bottom:5px; }
.cp-day-num { font-size:.82em; font-weight:700; }
.cp-day-num.today-num { width:24px; height:24px; display:flex; align-items:center; justify-content:center; border-radius:50%; background:var(--color-primary); color:#fff; }
.cp-add-day { opacity:0; border:0; background:transparent; color:var(--color-primary); cursor:pointer; font-size:1.1em; }
.cp-day:hover .cp-add-day { opacity:1; }
.cp-item { display:block; width:100%; text-align:left; border:1px solid var(--color-border); border-left:3px solid var(--color-primary); border-radius:7px; padding:6px 7px; margin:4px 0; background:var(--color-surface); color:var(--color-text); cursor:pointer; box-shadow:0 1px 2px rgba(0,0,0,.05); }
.cp-item:hover { transform:translateY(-1px); box-shadow:var(--shadow); }
.cp-item.published { opacity:.72; }
.cp-item.high { border-left-color:var(--color-danger); }
.cp-item-title { display:block; font-size:.78em; font-weight:700; line-height:1.25; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.cp-item-meta { display:flex; gap:5px; align-items:center; margin-top:4px; font-size:.68em; color:var(--color-muted); }
.cp-dot { width:7px; height:7px; border-radius:50%; display:inline-block; background:var(--color-primary); flex-shrink:0; }
.cp-dot-instagram { background:#9b59b6; } .cp-dot-telegram { background:#3498db; } .cp-dot-max { background:#27ae60; } .cp-dot-vk { background:#4a76a8; } .cp-dot-site { background:#e67e22; } .cp-dot-reklama { background:#c0392b; }
.cp-more { font-size:.7em; color:var(--color-muted); padding:4px 6px; }
.cp-side { position:sticky; top:16px; }
.cp-panel { background:var(--color-surface); border:1px solid var(--color-border); border-radius:var(--radius); box-shadow:var(--shadow); overflow:hidden; margin-bottom:14px; }
.cp-panel-head { display:flex; justify-content:space-between; align-items:flex-start; gap:10px; padding:15px 16px 11px; border-bottom:1px solid var(--color-border); }
.cp-panel-head h2 { margin:0; font-size:1em; }
.cp-panel-head p { margin:3px 0 0; font-size:.76em; color:var(--color-muted); line-height:1.35; }
.cp-candidate { padding:11px 13px; border-bottom:1px solid var(--color-border); }
.cp-candidate:last-child { border-bottom:0; }
.cp-candidate-top { display:flex; align-items:flex-start; gap:8px; }
.cp-candidate-name { flex:1; min-width:0; font-weight:700; font-size:.85em; line-height:1.25; }
.cp-score { font-size:.7em; font-weight:700; padding:3px 6px; border-radius:999px; background:var(--color-primary-light); color:var(--color-primary-dark); white-space:nowrap; }
.cp-candidate-meta { display:flex; gap:8px; flex-wrap:wrap; margin-top:5px; font-size:.7em; color:var(--color-muted); }
.cp-reasons { display:flex; gap:4px; flex-wrap:wrap; margin-top:6px; }
.cp-reason { font-size:.66em; border-radius:999px; padding:3px 6px; background:var(--color-bg); color:var(--color-text); }
.cp-candidate-actions { display:flex; gap:6px; margin-top:8px; }
.cp-settings { padding:14px 16px; }
.cp-settings-grid { display:grid; grid-template-columns:1fr 1fr; gap:9px; }
.cp-settings label { font-size:.72em; color:var(--color-muted); display:flex; flex-direction:column; gap:4px; }
.cp-settings input { width:100%; }
.cp-settings .full { grid-column:1/-1; }
.cp-empty { padding:30px 12px; text-align:center; color:var(--color-muted); font-size:.82em; }
.cp-modal-wide { max-width:720px; }
.cp-form-grid { display:grid; grid-template-columns:1fr 1fr; gap:10px; }
.cp-form-grid .full { grid-column:1/-1; }
.cp-form-grid label { display:flex; flex-direction:column; gap:5px; font-size:.78em; color:var(--color-muted); }
.cp-form-grid textarea { min-height:100px; resize:vertical; }
.cp-form-actions { grid-column:1/-1; display:flex; gap:8px; align-items:center; margin-top:4px; }
.cp-danger { margin-left:auto; }
@media (max-width: 1150px) { .cp-layout { grid-template-columns:1fr; } .cp-side { position:static; display:grid; grid-template-columns:1fr 1fr; gap:14px; } }
@media (max-width: 760px) { .cp-stats { grid-template-columns:repeat(2,1fr); } .cp-calendar { overflow-x:auto; } .cp-weekdays,.cp-week { min-width:850px; } .cp-side { display:block; } .cp-form-grid { grid-template-columns:1fr; } .cp-form-grid .full { grid-column:auto; } }

/* ===== Контент-план: Kanban 2.0 ===== */
.cp-page-head { margin-bottom: 4px; }
.cp-head-actions { display:flex; gap:8px; align-items:center; flex-wrap:wrap; }
.cp-kanban-toolbar { margin-top:12px; }
.cp-kanban-stats { margin-top:10px; }
.cp-promo-strip { display:flex; gap:14px; align-items:stretch; background:var(--color-surface); border:1px solid var(--color-border); border-radius:var(--radius); box-shadow:var(--shadow); padding:13px; margin:0 0 18px; overflow:hidden; }
.cp-promo-intro { width:220px; min-width:220px; display:flex; align-items:center; gap:10px; padding:4px 5px; }
.cp-promo-icon { width:38px; height:38px; border-radius:11px; display:flex; align-items:center; justify-content:center; background:var(--color-primary-light); font-size:20px; flex-shrink:0; }
.cp-promo-intro strong { display:block; font-size:.9em; line-height:1.2; }
.cp-promo-intro span { display:block; margin-top:4px; font-size:.7em; line-height:1.35; color:var(--color-muted); }
.cp-promo-list { display:flex; gap:9px; overflow-x:auto; padding-bottom:2px; min-width:0; flex:1; }
.cp-promo-card { width:205px; min-width:205px; padding:10px; border:1px solid var(--color-border); border-radius:10px; background:var(--color-bg); }
.cp-promo-card-head { display:flex; gap:7px; align-items:flex-start; }
.cp-promo-card-head strong { flex:1; min-width:0; font-size:.76em; line-height:1.25; }
.cp-score { font-size:.64em; font-weight:800; padding:3px 6px; border-radius:999px; background:var(--color-primary-light); color:var(--color-primary-dark); white-space:nowrap; }
.cp-promo-meta { display:flex; gap:8px; margin-top:5px; font-size:.64em; color:var(--color-muted); }
.cp-promo-btn { width:100%; margin-top:8px; padding:6px 8px; border:1px solid var(--color-primary); border-radius:7px; background:var(--color-surface); color:var(--color-primary-dark); cursor:pointer; font-size:.7em; font-weight:700; }
.cp-promo-btn:hover { background:var(--color-primary-light); }
.cp-promo-empty { color:var(--color-muted); font-size:.8em; padding:16px; }
.cp-board-head { display:flex; justify-content:space-between; align-items:end; gap:10px; margin:4px 0 9px; }
.cp-board-head h2 { margin:0; font-size:1.05em; }
.cp-board-head span { display:block; margin-top:3px; font-size:.72em; color:var(--color-muted); }
.cp-board-hint { font-size:.72em; color:var(--color-muted); white-space:nowrap; }
.cp-kanban { display:grid; grid-template-columns:repeat(4,minmax(245px,1fr)); gap:12px; align-items:start; overflow-x:auto; padding-bottom:8px; }
.cp-column { min-width:245px; background:var(--color-bg); border:1px solid var(--color-border); border-radius:12px; overflow:hidden; }
.cp-column-head { display:flex; align-items:center; justify-content:space-between; padding:12px 12px 10px; border-bottom:1px solid var(--color-border); background:var(--color-surface); }
.cp-column-title { display:flex; align-items:center; gap:8px; min-width:0; }
.cp-column-icon { width:28px; height:28px; border-radius:8px; display:flex; align-items:center; justify-content:center; background:var(--color-bg); font-size:15px; }
.cp-column-title strong { display:block; font-size:.83em; }
.cp-column-title span:last-child { display:block; margin-top:2px; font-size:.62em; color:var(--color-muted); }
.cp-column-count { min-width:24px; height:24px; padding:0 7px; display:flex; align-items:center; justify-content:center; border-radius:999px; background:var(--color-bg); font-size:.7em; font-weight:800; }
.cp-column-idea .cp-column-icon { background:#fff4d6; }
.cp-column-work .cp-column-icon { background:#e9f1ff; }
.cp-column-scheduled .cp-column-icon { background:#e8f7ee; }
.cp-column-published .cp-column-icon { background:#e7f4ec; }
.cp-dropzone { min-height:230px; padding:8px; transition:background .15s, box-shadow .15s; }
.cp-dropzone.is-over { background:var(--color-primary-light); box-shadow:inset 0 0 0 2px var(--color-primary); }
.cp-card { position:relative; padding:10px; margin-bottom:8px; border:1px solid var(--color-border); border-radius:10px; background:var(--color-surface); box-shadow:0 2px 5px rgba(0,0,0,.05); transition:transform .12s, box-shadow .12s, opacity .12s; }
.cp-card:hover { transform:translateY(-1px); box-shadow:var(--shadow); }
.cp-card.is-high { border-left:3px solid var(--color-danger); }
.cp-card.is-dragging { opacity:.45; transform:rotate(1deg); }
.cp-card-top { display:flex; align-items:center; gap:5px; min-height:18px; }
.cp-channel { display:inline-flex; align-items:center; padding:3px 6px; border-radius:999px; background:var(--color-bg); font-size:.6em; font-weight:800; }
.cp-channel-instagram { color:#8e44ad; } .cp-channel-telegram { color:#2980b9; } .cp-channel-max { color:#218c54; } .cp-channel-vk { color:#4169a1; } .cp-channel-сайт { color:#b05d18; } .cp-channel-реклама { color:#b33b2e; }
.cp-priority { margin-left:auto; padding:3px 6px; border-radius:999px; background:#fff0ef; color:var(--color-danger); font-size:.58em; font-weight:800; }
.cp-card-menu { margin-left:auto; border:0; background:transparent; color:var(--color-muted); cursor:pointer; font-size:18px; line-height:18px; padding:0 2px; }
.cp-card-menu:hover { color:var(--color-text); }
.cp-card-main { width:100%; text-align:left; border:0; background:transparent; padding:7px 0 2px; color:var(--color-text); cursor:pointer; }
.cp-card-main strong { display:block; font-size:.8em; line-height:1.3; }
.cp-card-description { display:block; margin-top:4px; font-size:.66em; line-height:1.35; color:var(--color-muted); }
.cp-card-tags { display:flex; gap:5px; flex-wrap:wrap; margin-top:7px; }
.cp-card-tags > span { padding:3px 6px; border-radius:999px; background:var(--color-bg); color:var(--color-muted); font-size:.58em; }
.cp-card-tags .cp-product-tag { color:var(--color-primary-dark); background:var(--color-primary-light); }
.cp-card-bottom { display:flex; justify-content:space-between; gap:6px; margin-top:9px; padding-top:7px; border-top:1px solid var(--color-border); font-size:.6em; color:var(--color-muted); }
.cp-card-date, .cp-assignee { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.cp-column-empty { min-height:105px; display:flex; flex-direction:column; justify-content:center; align-items:center; text-align:center; color:var(--color-muted); font-size:.7em; line-height:1.45; }
.cp-column-empty button { border:0; background:transparent; color:var(--color-primary-dark); cursor:pointer; font-weight:700; padding:0; }
.cp-column-add { width:calc(100% - 16px); margin:0 8px 8px; padding:7px; border:1px dashed var(--color-border); border-radius:8px; background:transparent; color:var(--color-muted); cursor:pointer; font-size:.68em; }
.cp-column-add:hover { border-color:var(--color-primary); color:var(--color-primary-dark); background:var(--color-surface); }
.cp-board-empty { text-align:center; border:1px dashed var(--color-border); border-radius:12px; padding:35px 20px; margin-top:8px; background:var(--color-surface); }
.cp-board-empty-icon { font-size:30px; }
.cp-board-empty h3 { margin:7px 0 3px; }
.cp-board-empty p { margin:0 auto 14px; max-width:520px; font-size:.78em; color:var(--color-muted); }
@media (max-width: 1200px) { .cp-kanban { grid-template-columns:repeat(4,270px); } .cp-promo-intro { width:190px; min-width:190px; } }
@media (max-width: 760px) { .cp-head-actions { width:100%; } .cp-head-actions > * { flex:1; } .cp-promo-strip { display:block; } .cp-promo-intro { width:auto; min-width:0; margin-bottom:9px; } .cp-kanban { grid-template-columns:repeat(4,280px); } .cp-board-head { align-items:flex-start; flex-direction:column; } }

/* Контент-план: нативные иконки вместо эмодзи */
.cp-promo-icon .icon { width:20px; height:20px; }
.cp-column-icon .icon { width:16px; height:16px; }
.cp-column-idea .cp-column-icon { color:#8a6418; }
.cp-column-work .cp-column-icon { color:#3f679c; }
.cp-column-scheduled .cp-column-icon { color:#3d7b55; }
.cp-column-published .cp-column-icon { color:#2f7045; }
.cp-mini-icon { width:11px; height:11px; display:inline-block; vertical-align:-1px; margin-right:4px; }
.cp-card-date .cp-mini-icon { color:var(--color-muted); }
.cp-card-tags .cp-product-tag { display:inline-flex; align-items:center; }
.cp-board-empty-icon .icon { width:30px; height:30px; color:var(--color-primary); }
/* Тест погоды (Настройки): главная в iframe показывает только шапку */
html.wx-embed body > *:not(.app-layout) { display: none !important; }
html.wx-embed .sidebar,
html.wx-embed .topbar,
html.wx-embed .home > *:not(.home-hero) { display: none !important; }
html.wx-embed body, html.wx-embed .app-layout, html.wx-embed .main-content, html.wx-embed .container,
html.wx-embed .home { margin: 0 !important; padding: 0 !important; max-width: none !important; }
html.wx-embed body { overflow: hidden; }
html.wx-embed .home-hero { border-radius: 0; }

/* ===== Товары: фильтры, сортировка, пагинация, остатки ===== */
.stat-card-link { text-decoration:none; color:inherit; transition:transform .12s, box-shadow .12s; }
.stat-card-link:hover { transform:translateY(-1px); box-shadow:0 4px 14px rgba(0,0,0,.10); }

.stock-chips { display:flex; flex-wrap:wrap; gap:8px; margin:6px 0 14px; }
.stock-chip { display:inline-flex; align-items:center; gap:7px; padding:6px 13px; border-radius:999px; font-size:.86em; font-weight:600;
    background:var(--color-surface); border:1px solid var(--color-border); color:inherit; text-decoration:none; transition:background .12s, border-color .12s; }
.stock-chip:hover { border-color:var(--color-primary); }
.stock-chip-count { background:rgba(0,0,0,.07); border-radius:999px; padding:1px 8px; font-size:.86em; font-weight:700; }
[data-theme="dark"] .stock-chip-count { background:rgba(255,255,255,.12); }
.stock-chip.active { background:var(--color-primary); border-color:var(--color-primary); color:#fff; }
.stock-chip.active .stock-chip-count { background:rgba(255,255,255,.28); }
.stock-chip-critical:not(.active) .stock-chip-count { background:var(--stock-critical-bg); color:var(--stock-critical-fg); }
.stock-chip-attention:not(.active) .stock-chip-count, .stock-chip-low:not(.active) .stock-chip-count { background:var(--stock-low-bg); color:var(--stock-low-fg); }
.stock-chip-ok:not(.active) .stock-chip-count { background:var(--stock-ok-bg); color:var(--stock-ok-fg); }

.products-filters { display:flex; flex-wrap:wrap; gap:8px; align-items:center; margin:0 0 10px; }
.products-filters .search-input-wrap { flex:1 1 260px; min-width:220px; }
.products-filters .search-input-wrap input { width:100%; }
.products-filters select { max-width:210px; }

.active-filters { display:flex; flex-wrap:wrap; gap:6px; align-items:center; margin:0 0 10px; }
.filter-tag { display:inline-flex; gap:6px; align-items:center; padding:3px 10px; border-radius:999px; font-size:.82em;
    background:var(--color-surface); border:1px solid var(--color-primary); color:var(--color-primary-dark); text-decoration:none; }
.filter-tag:hover { background:var(--color-primary); color:#fff; }
.filter-tag-reset { border-color:var(--color-border); color:var(--color-muted); }

.list-info { display:flex; justify-content:space-between; align-items:center; gap:12px; flex-wrap:wrap; margin:4px 0 8px; }
.per-page-form select { margin-left:4px; }

.pager { display:flex; flex-wrap:wrap; gap:6px; align-items:center; justify-content:center; margin:12px 0; }
.pg { min-width:36px; height:36px; padding:0 10px; display:inline-flex; align-items:center; justify-content:center; border-radius:8px;
    background:var(--color-surface); border:1px solid var(--color-border); color:inherit; text-decoration:none; font-weight:600; }
.pg:hover { border-color:var(--color-primary); }
.pg-active { background:var(--color-primary); border-color:var(--color-primary); color:#fff; }
.pg-disabled { opacity:.4; pointer-events:none; }
.pg-gap { padding:0 4px; color:var(--color-muted); }
.pg-jump { display:inline-flex; gap:6px; align-items:center; margin-left:12px; }
.pg-jump input[type=number] { width:70px; }

.products-scroll { max-height:calc(100vh - 210px); overflow:auto; }
.products-table thead th { position:sticky; top:0; z-index:2; }
.products-table th.sort-th { padding:0; }
.products-table th.sort-th a { display:flex; align-items:center; gap:4px; padding:10px 12px; color:inherit; text-decoration:none; white-space:nowrap; }
.products-table th.sort-th a:hover { background:#dcebdc; }
[data-theme="dark"] .products-table th.sort-th a:hover { background:rgba(255,255,255,.08); }
.products-table .sort-arrow { opacity:.35; font-size:.8em; }
.products-table th.sort-active .sort-arrow { opacity:1; color:var(--color-primary); }
.products-table th.num a, .products-table td.num { text-align:right; justify-content:flex-end; }

.stk { min-width:110px; }
.stk-sub { font-size:.74em; color:var(--color-muted); margin-top:1px; white-space:nowrap; }
.stk-bar { position:relative; height:5px; margin-top:5px; border-radius:3px; background:rgba(0,0,0,.09); overflow:hidden; }
[data-theme="dark"] .stk-bar { background:rgba(255,255,255,.14); }
.stk-bar i { position:absolute; left:0; top:0; bottom:0; border-radius:3px; }
.stk-bar em { position:absolute; left:50%; top:-1px; bottom:-1px; width:2px; background:var(--color-muted); opacity:.7; }
.stk-bar-ok i { background:var(--stock-ok-fg); }
.stk-bar-low i { background:var(--stock-low-fg); }
.stk-bar-critical i { background:var(--stock-critical-fg); }
.stk-need { font-size:.74em; color:var(--stock-critical-fg); margin-top:3px; white-space:nowrap; font-weight:600; }
@media (max-width:700px) { .pg-jump { margin-left:0; width:100%; justify-content:center; } .products-scroll { max-height:none; } }

/* ===== Контент-план: сезонный фокус ===== */
.cp-now-badge { display:inline-flex; align-items:center; gap:5px; padding:6px 9px; border-radius:999px; background:var(--color-primary-light); color:var(--color-primary-dark); font-size:.68em; font-weight:800; }
.cp-season-card { display:grid; grid-template-columns:minmax(0,1.05fr) minmax(390px,.95fr); gap:18px; margin:0 0 18px; padding:18px; border:1px solid var(--color-border); border-radius:14px; background:linear-gradient(135deg,var(--color-surface),var(--color-bg)); box-shadow:var(--shadow); }
.cp-season-main { display:flex; gap:14px; min-width:0; align-items:flex-start; }
.cp-season-icon { width:46px; height:46px; min-width:46px; display:flex; align-items:center; justify-content:center; border-radius:13px; background:var(--color-primary-light); color:var(--color-primary-dark); }
.cp-season-icon .icon { width:22px; height:22px; }
.cp-season-copy { min-width:0; }
.cp-eyebrow { font-size:.65em; font-weight:800; text-transform:uppercase; letter-spacing:.07em; color:var(--color-primary-dark); }
.cp-season-copy h2 { margin:3px 0 4px; font-size:1.12em; }
.cp-season-copy p { margin:0; max-width:650px; font-size:.73em; line-height:1.45; color:var(--color-muted); }
.cp-season-focus { display:flex; flex-wrap:wrap; gap:6px; margin-top:11px; }
.cp-season-focus span { padding:5px 8px; border:1px solid var(--color-border); border-radius:999px; background:var(--color-surface); font-size:.62em; color:var(--color-text); }
.cp-season-ideas { min-width:0; padding-left:18px; border-left:1px solid var(--color-border); }
.cp-season-ideas-head { display:flex; justify-content:space-between; align-items:baseline; gap:8px; margin-bottom:7px; }
.cp-season-ideas-head strong { font-size:.78em; }
.cp-season-ideas-head span { font-size:.62em; color:var(--color-muted); }
.cp-season-idea { width:100%; display:flex; align-items:flex-start; gap:7px; padding:6px 0; border:0; border-bottom:1px solid var(--color-border); background:transparent; text-align:left; color:var(--color-text); font-size:.69em; line-height:1.35; cursor:pointer; }
.cp-season-idea:last-child { border-bottom:0; }
.cp-season-idea:hover { color:var(--color-primary-dark); }
.cp-season-plus { display:inline-flex; width:17px; height:17px; flex:0 0 17px; align-items:center; justify-content:center; border-radius:5px; background:var(--color-primary-light); color:var(--color-primary-dark); font-weight:800; }
.cp-season-idea.is-readonly { cursor:default; color:var(--color-muted); }
@media (max-width: 900px) { .cp-season-card { grid-template-columns:1fr; } .cp-season-ideas { padding-left:0; padding-top:14px; border-left:0; border-top:1px solid var(--color-border); } }
@media (max-width: 600px) { .cp-season-main { gap:10px; } .cp-season-icon { width:38px; height:38px; min-width:38px; } .cp-season-copy h2 { font-size:1em; } }

/* ===== Контент-план: календарь и настройки продвижения ===== */
.cp-view-switch { display:inline-flex; gap:3px; padding:4px; margin:10px 0 12px; border:1px solid var(--color-border); border-radius:10px; background:var(--color-surface); box-shadow:var(--shadow); }
.cp-view-tab { display:inline-flex; align-items:center; gap:6px; border:0; border-radius:7px; padding:7px 11px; background:transparent; color:var(--color-muted); font-size:.72em; font-weight:800; cursor:pointer; }
.cp-view-tab .icon { width:13px; height:13px; }
.cp-view-tab.active { background:var(--color-primary-light); color:var(--color-primary-dark); }
.cp-calendar-view { margin:0 0 18px; padding:16px; border:1px solid var(--color-border); border-radius:14px; background:var(--color-surface); box-shadow:var(--shadow); }
.cp-calendar-head { display:flex; justify-content:space-between; gap:18px; align-items:flex-end; margin-bottom:13px; }
.cp-calendar-head h2 { margin:2px 0 3px; font-size:1.05em; }
.cp-calendar-head p { margin:0; max-width:680px; font-size:.7em; color:var(--color-muted); line-height:1.4; }
.cp-calendar-legend { display:flex; gap:11px; flex-wrap:wrap; justify-content:flex-end; font-size:.62em; color:var(--color-muted); }
.cp-calendar-legend span { display:inline-flex; align-items:center; gap:5px; white-space:nowrap; }
.cp-dot { width:7px; height:7px; border-radius:50%; background:var(--color-muted); }
.cp-dot-idea { background:#d7a53a; } .cp-dot-scheduled { background:#4e9a6a; } .cp-dot-published { background:#347b51; }
.cp-calendar-grid { display:grid; grid-template-columns:repeat(7,minmax(0,1fr)); }
.cp-calendar-weekdays > div { padding:6px 8px; font-size:.62em; font-weight:800; color:var(--color-muted); text-transform:uppercase; }
.cp-calendar-days { border-top:1px solid var(--color-border); border-left:1px solid var(--color-border); }
.cp-day-cell { min-height:116px; padding:7px; border-right:1px solid var(--color-border); border-bottom:1px solid var(--color-border); background:var(--color-surface); transition:background .12s; }
.cp-day-cell:hover { background:var(--color-bg); }
.cp-day-cell.is-outside { background:var(--color-bg); opacity:.52; }
.cp-day-cell.is-today { box-shadow:inset 0 3px 0 var(--color-primary); }
.cp-day-top { display:flex; align-items:center; gap:5px; min-height:21px; }
.cp-day-number { font-size:.73em; font-weight:800; }
.cp-day-today { padding:2px 5px; border-radius:999px; background:var(--color-primary-light); color:var(--color-primary-dark); font-size:.5em; font-weight:800; }
.cp-day-add { margin-left:auto; width:20px; height:20px; border:1px dashed var(--color-border); border-radius:6px; background:transparent; color:var(--color-muted); cursor:pointer; font-size:14px; line-height:1; }
.cp-day-add:hover { color:var(--color-primary-dark); border-color:var(--color-primary); background:var(--color-primary-light); }
.cp-day-items { display:flex; flex-direction:column; gap:4px; margin-top:6px; }
.cp-day-item { display:flex; align-items:center; gap:5px; width:100%; min-width:0; border:0; border-radius:6px; padding:5px 6px; text-align:left; background:var(--color-bg); color:var(--color-text); cursor:pointer; }
.cp-day-item:hover { background:var(--color-primary-light); }
.cp-day-item-dot { width:5px; height:5px; flex:0 0 5px; border-radius:50%; background:#d7a53a; }
.cp-day-item-опубликовано .cp-day-item-dot { background:#347b51; } .cp-day-item-запланировано .cp-day-item-dot { background:#4e9a6a; } .cp-day-item-в-работе .cp-day-item-dot { background:#5b80b8; }
.cp-day-item-title { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font-size:.59em; }
.cp-day-more { border:0; background:transparent; color:var(--color-primary-dark); text-align:left; padding:2px 4px; font-size:.58em; font-weight:800; cursor:pointer; }
#cp-board-view { display:none; }
.cp-settings-modal { max-width:680px; }
.cp-settings-hero { display:flex; gap:12px; align-items:flex-start; padding-bottom:15px; border-bottom:1px solid var(--color-border); }
.cp-settings-hero-icon { width:42px; height:42px; flex:0 0 42px; display:flex; align-items:center; justify-content:center; border-radius:12px; background:var(--color-primary-light); color:var(--color-primary-dark); }
.cp-settings-hero-icon .icon { width:20px; height:20px; }
.cp-settings-hero h2 { margin:2px 0 4px; font-size:1.08em; }
.cp-settings-hero p { margin:0; color:var(--color-muted); font-size:.7em; line-height:1.4; }
.cp-settings-form { margin-top:15px; }
.cp-settings-section { padding:13px; border:1px solid var(--color-border); border-radius:11px; margin-bottom:10px; background:var(--color-bg); }
.cp-settings-section-title strong { display:block; font-size:.76em; }
.cp-settings-section-title span { display:block; margin-top:3px; color:var(--color-muted); font-size:.62em; line-height:1.35; }
.cp-settings-fields { display:grid; gap:9px; margin-top:11px; }
.cp-settings-fields-2 { grid-template-columns:1fr 1fr; }
.cp-settings-fields label { display:flex; flex-direction:column; gap:5px; font-size:.68em; color:var(--color-muted); }
.cp-settings-fields label > span { font-weight:700; color:var(--color-text); }
.cp-input-suffix { display:flex; align-items:center; gap:6px; }
.cp-input-suffix input { min-width:0; flex:1; }
.cp-input-suffix b { font-size:.85em; font-weight:600; color:var(--color-muted); }
.cp-weight-summary { display:flex; align-items:center; gap:7px; margin-top:10px; padding-top:9px; border-top:1px solid var(--color-border); font-size:.65em; color:var(--color-muted); }
.cp-weight-summary strong { font-size:1.1em; color:var(--color-text); }
.cp-weight-summary #cp-weight-note { margin-left:auto; }
.cp-weight-summary #cp-weight-note.is-good { color:var(--color-primary-dark); font-weight:700; }
.cp-weight-summary #cp-weight-note.is-warn { color:var(--color-danger); }
.cp-settings-tip { display:flex; gap:7px; align-items:flex-start; padding:9px 10px; border-radius:9px; background:var(--color-primary-light); color:var(--color-primary-dark); font-size:.64em; line-height:1.4; }
.cp-settings-tip .icon { width:14px; height:14px; flex:0 0 14px; margin-top:1px; }
@media (max-width:800px) { .cp-calendar-head { align-items:flex-start; flex-direction:column; } .cp-calendar-legend { justify-content:flex-start; } .cp-calendar-view { overflow-x:auto; } .cp-calendar-grid { min-width:760px; } .cp-settings-fields-2 { grid-template-columns:1fr; } }

/* ---- Лунный календарь огородника ---- */
.lunar-page-head { margin-bottom: 14px; }
.lunar-today-grid {
    display: grid; grid-template-columns: 1.35fr 1fr 1fr; gap: 14px; margin-bottom: 18px;
}
.lunar-today-card, .lunar-recommend-card { min-height: 168px; }
.lunar-today-label { color: var(--color-muted); font-size: .84em; margin-bottom: 10px; }
.lunar-phase-row { display:flex; align-items:center; gap:14px; }
.lunar-moon { width:64px; height:64px; display:flex; align-items:center; justify-content:center; font-size:46px; }
.lunar-phase-row h2 { margin:0 0 4px; font-size:1.35rem; color:var(--color-primary-dark); }
.lunar-meta { color:var(--color-muted); font-size:.88em; }
.lunar-disclaimer { margin-top:15px; color:var(--color-muted); font-size:.76em; line-height:1.4; }
.lunar-card-title { font-weight:700; color:var(--color-primary-dark); display:flex; align-items:center; gap:6px; }
.lunar-recommend-card ul { margin:10px 0 0; padding-left:20px; line-height:1.65; }
.lunar-good { border-top:3px solid var(--color-primary); }
.lunar-avoid { border-top:3px solid var(--color-border); }
.lunar-toolbar { display:flex; justify-content:space-between; align-items:center; gap:14px; margin:12px 0; flex-wrap:wrap; }
.lunar-month-nav { display:flex; align-items:center; gap:10px; }
.lunar-month-nav strong { min-width:180px; text-align:center; color:var(--color-primary-dark); }
.lunar-month-nav .cal-nav-btn { font-size:20px; }
.lunar-today-link {
    font-size:.82em; padding:5px 10px; border-radius:999px; background:var(--color-primary-light);
    color:var(--color-primary-dark); text-decoration:none; font-weight:600;
}
.lunar-legend { display:flex; gap:14px; flex-wrap:wrap; color:var(--color-muted); font-size:.82em; }
.lunar-legend span { display:flex; align-items:center; gap:5px; }
.lunar-dot { width:9px; height:9px; border-radius:50%; display:inline-block; background:var(--color-border); }
.lunar-dot.waxing { background:var(--color-primary); }
.lunar-dot.full { background:var(--color-warning, #d5a928); }
.lunar-dot.waning { background:var(--color-muted); }
.lunar-dot.new { background:var(--color-text); }
.lunar-calendar-grid {
    display:grid; grid-template-columns:repeat(7,minmax(0,1fr)); gap:6px;
}
.lunar-weekday {
    text-align:center; padding:7px 4px; font-size:.78em; font-weight:700;
    color:var(--color-primary-dark); text-transform:uppercase;
}
.lunar-weekday.weekend { color:var(--color-danger); opacity:.8; }
.lunar-cell {
    min-height:142px; background:var(--color-surface); border-radius:var(--radius-sm);
    box-shadow:1px 2px 6px rgba(0,0,0,.05); padding:8px; overflow:hidden;
    border-top:3px solid transparent;
}
.lunar-cell.is-today { box-shadow:0 0 0 2px var(--color-primary) inset, 1px 2px 6px rgba(0,0,0,.05); }
.lunar-kind-waxing { border-top-color:var(--color-primary); }
.lunar-kind-full { border-top-color:var(--color-warning, #d5a928); }
.lunar-kind-waning { border-top-color:var(--color-muted); }
.lunar-kind-new { border-top-color:var(--color-text); }
.lunar-empty { background:transparent; box-shadow:none; }
.lunar-cell-head { display:flex; justify-content:space-between; gap:5px; align-items:flex-start; }
.lunar-cell-head strong { font-size:1rem; }
.lunar-cell-phase { color:var(--color-muted); font-size:.67em; text-align:right; line-height:1.15; }
.lunar-cell-main { display:flex; align-items:center; gap:6px; margin:8px 0; font-size:.78em; color:var(--color-primary-dark); }
.lunar-small-moon { font-size:20px; line-height:1; }
.lunar-cell-recs { display:flex; flex-direction:column; gap:4px; font-size:.69em; line-height:1.25; color:var(--color-muted); }
.lunar-cell-recs span::before { content:"• "; color:var(--color-primary); }
.lunar-footnote { margin:10px 2px 20px; color:var(--color-muted); font-size:.74em; }
.lunar-footnote code { font-size:inherit; }
@media (max-width: 1000px) {
    .lunar-today-grid { grid-template-columns:1fr; }
    .lunar-cell { min-height:120px; }
}
@media (max-width: 680px) {
    .lunar-calendar-grid { gap:3px; }
    .lunar-cell { min-height:92px; padding:5px; }
    .lunar-cell-phase { display:none; }
    .lunar-cell-recs { display:none; }
    .lunar-small-moon { font-size:17px; }
}


/* ---- Карточка лунного дня ---- */
.lunar-day-button {
    width:100%; text-align:left; font:inherit; color:inherit; cursor:pointer;
    border:0; border-top:3px solid transparent; appearance:none; -webkit-appearance:none;
    transition:transform .12s ease, box-shadow .12s ease;
}
.lunar-day-button.lunar-kind-waxing { border-top-color:var(--color-primary); }
.lunar-day-button.lunar-kind-full { border-top-color:var(--color-warning, #d5a928); }
.lunar-day-button.lunar-kind-waning { border-top-color:var(--color-muted); }
.lunar-day-button.lunar-kind-new { border-top-color:var(--color-text); }
.lunar-day-button:hover { transform:translateY(-1px); box-shadow:0 4px 12px rgba(0,0,0,.09); }
.lunar-card-modal { position:fixed; inset:0; z-index:10000; display:none; align-items:center; justify-content:center; padding:22px; background:rgba(0,0,0,.48); }
.lunar-card-modal.is-open { display:flex; }
.lunar-card-dialog { width:min(980px,96vw); max-height:94vh; overflow:auto; background:var(--color-surface); border-radius:18px; box-shadow:0 24px 70px rgba(0,0,0,.28); padding:18px; }
.lunar-card-dialog-head { display:flex; align-items:center; justify-content:space-between; gap:12px; margin-bottom:14px; }
.lunar-card-dialog-head h2 { margin:0; font-size:1.05rem; color:var(--color-primary-dark); }
.lunar-card-actions { display:flex; gap:8px; }
.lunar-card-actions button { border:0; border-radius:9px; padding:9px 14px; cursor:pointer; font:inherit; font-weight:600; }
.lunar-card-download { background:var(--color-primary); color:#fff; }
.lunar-card-close { background:var(--color-primary-light); color:var(--color-primary-dark); }
.lunar-card-preview { display:block; width:min(816px,100%); height:auto; margin:0 auto; border-radius:10px; background:#fcefe6; }
@media (max-width:680px) { .lunar-card-modal { padding:8px; } .lunar-card-dialog { padding:10px; } .lunar-card-dialog-head { align-items:flex-start; } .lunar-card-actions { flex-wrap:wrap; justify-content:flex-end; } }


.saved-reports-grid{display:grid;gap:8px}.saved-report-row{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:10px 12px;border:1px solid var(--border,#e6e8eb);border-radius:10px}.saved-report-row .toolbar{margin:0}.report-save-form{margin-top:12px;padding-top:12px;border-top:1px solid var(--border,#e6e8eb)}