/* WERX CRM — светлая тема Espo + фон, «стекло», цветные стадии канбана */
@import url("../../css/espo/espo.css");
/* Open Sans — локальные файлы шрифта на нашем хостинге (без запросов к Google) */
@font-face { font-family: 'Open Sans'; font-style: normal; font-weight: 400; font-display: swap; src: url('../fonts/open-sans-cyrillic-400-normal.woff2') format('woff2'); unicode-range: U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116; }
@font-face { font-family: 'Open Sans'; font-style: normal; font-weight: 600; font-display: swap; src: url('../fonts/open-sans-cyrillic-600-normal.woff2') format('woff2'); unicode-range: U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116; }
@font-face { font-family: 'Open Sans'; font-style: normal; font-weight: 700; font-display: swap; src: url('../fonts/open-sans-cyrillic-700-normal.woff2') format('woff2'); unicode-range: U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116; }
@font-face { font-family: 'Open Sans'; font-style: normal; font-weight: 400; font-display: swap; src: url('../fonts/open-sans-latin-400-normal.woff2') format('woff2'); unicode-range: U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+2074,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD; }
@font-face { font-family: 'Open Sans'; font-style: normal; font-weight: 600; font-display: swap; src: url('../fonts/open-sans-latin-600-normal.woff2') format('woff2'); unicode-range: U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+2074,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD; }
@font-face { font-family: 'Open Sans'; font-style: normal; font-weight: 700; font-display: swap; src: url('../fonts/open-sans-latin-700-normal.woff2') format('woff2'); unicode-range: U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+2074,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD; }
@font-face { font-family: 'Open Sans'; font-style: normal; font-weight: 400; font-display: swap; src: url('../fonts/open-sans-latin-ext-400-normal.woff2') format('woff2'); unicode-range: U+0100-02AF,U+0304,U+0308,U+0329,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF; }
@font-face { font-family: 'Open Sans'; font-style: normal; font-weight: 600; font-display: swap; src: url('../fonts/open-sans-latin-ext-600-normal.woff2') format('woff2'); unicode-range: U+0100-02AF,U+0304,U+0308,U+0329,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF; }
@font-face { font-family: 'Open Sans'; font-style: normal; font-weight: 700; font-display: swap; src: url('../fonts/open-sans-latin-ext-700-normal.woff2') format('woff2'); unicode-range: U+0100-02AF,U+0304,U+0308,U+0329,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF; }
:root {
  --body-bg: transparent;
  --brand-primary: #0593c6; --brand-primary-5: #0586b5; --brand-primary-10: #0479a3;
  --brand-primary-lighten-10: #23afe2; --brand-primary-lighten-30: #a6def3;
  --btn-primary-bg: #0593c6; --btn-primary-border: #0593c6;
  --btn-primary-hover-bg: #0479a3; --btn-primary-hover-border: #0479a3;
  --btn-primary-active-bg: #03678b; --btn-primary-active-border: #035f80;
  --state-primary-bg: #e3f4fb; --state-primary-text: #0479a3; --state-primary-border: #bfe6f5;
  --panel-primary-bg: #d9f0fa; --panel-primary-text: #0479a3; --panel-primary-border: #d9f0fa;
  --link-color: #0577a1; --link-hover-color: #035f80; --text-link-color: #0577a1; --text-link-hover-color: #035f80;
  --brand-danger: #db3996; --brand-danger-10: #c02a80;
  /* боковая панель — тёмное «стекло» */
  --navbar-inverse-bg: rgba(8, 22, 46, .55); --navbar-inverse-bg-7: rgba(8, 22, 46, .7);
  --navbar-inverse-color: #a9bdd6; --navbar-inverse-border: transparent;
  --navbar-inverse-link-color: #eef4fb; --navbar-inverse-link-icon-color: #bcd6f0; --navbar-inverse-link-icon-hover-color: #fff;
  --navbar-inverse-link-hover-color: #fff; --navbar-inverse-link-hover-bg: rgba(255,255,255,.10);
  --navbar-inverse-link-active-bg: rgba(255,255,255,.20); --navbar-inverse-toggle-hover-bg: rgba(255,255,255,.12);
  --navbar-inverse-link-disabled-color: #8aa0b8;
  --navbar-bg: rgba(8, 22, 46, .55); --navbar-link-color: #eef4fb; --navbar-link-icon-color: #bcd6f0;
  --navbar-link-hover-color: #fff; --navbar-link-hover-bg: rgba(255,255,255,.10); --navbar-link-active-bg: rgba(255,255,255,.20);
}

/* Фон (свой, в цветах WERX) */
html, body {
  background:
    radial-gradient(1100px 700px at 82% 72%, rgba(5,147,198,.60), transparent 62%),
    radial-gradient(800px 560px at 18% 8%, rgba(219,57,150,.32), transparent 60%),
    radial-gradient(900px 900px at 58% 28%, rgba(96,72,214,.42), transparent 66%),
    linear-gradient(135deg, #0a1a36 0%, #172e6a 46%, #2b1f70 100%) fixed !important;
  background-color: #0f2350 !important;
}

/* Боковая панель: размытие под «стеклом», скруглённый активный пункт */
#navbar .navbar { backdrop-filter: blur(14px); -webkit-backdrop-filter: blur(14px); }
/* верхняя правая панель (поиск, уведомления) — прозрачная */
#navbar .navbar-right, #navbar .navbar-right-container { background: transparent !important; }
#navbar .navbar .tabs > li > a { border-radius: 8px; margin: 1px 8px; }
#navbar .navbar .tabs > li.active > a, #navbar .navbar .tabs > li.active > a * { color: #fff !important; }
#navbar .navbar .tabs .tab-divider .label-text { color: #8fa9c6; text-transform: uppercase; font-size: 11px; letter-spacing: .04em; }
#navbar .navbar .tabs > li > a .short-label span[class*="fa"] { color: #bcd6f0 !important; }
#navbar .navbar-logo-container { padding-top: 8px; }
#navbar .navbar-brand img.logo { max-height: 30px; }

/* Обычные страницы — светлая подложка, чтобы текст читался */
#main {
  background: rgba(244, 247, 250, .96);
  border-radius: 14px;
  margin: 14px 16px 16px;
  padding: 4px 20px 20px;
  min-height: calc(100vh - 80px);
  box-shadow: 0 8px 30px rgba(6, 18, 40, .25);
}
/* Канбан и Главная — прозрачно, видно фон */
#main:has(.list-kanban), #main:has(.dashlet) {
  background: transparent; box-shadow: none; padding-top: 4px;
}
#main:has(.list-kanban) .page-header .header-title, #main:has(.list-kanban) .page-header .header-title a,
#main:has(.dashlet) .page-header .header-title, #main:has(.dashlet) .page-header .header-title a {
  color: #fff !important; text-shadow: 0 1px 2px rgba(0,0,0,.35);
}
#main:has(.list-kanban) .total-count, #main:has(.list-kanban) .text-muted.total-count { color: #dbe7f5 !important; }

/* Канбан: цветные ленты стадий со стрелкой */
.list-kanban .kanban-head th.group-header > div:first-child {
  position: relative; color: #fff; font-weight: 600; font-size: 12px;
  display: flex; align-items: center; gap: 6px; min-height: 30px; line-height: 16px;
  padding: 0 22px 0 12px; margin-right: 6px; border-radius: 6px 0 0 6px;
  background: #39a8ef !important;
  clip-path: polygon(0 0, calc(100% - 12px) 0, 100% 50%, calc(100% - 12px) 100%, 0 100%);
}
.list-kanban .kanban-head th.group-header > div:first-child .kanban-group-label { color: #fff !important; }
.list-kanban .kanban-head th.group-header > div:first-child .create-button, .list-kanban .kanban-head th.group-header > div:first-child .create-button * { color: #fff !important; }
.list-kanban[data-scope="Opportunity"] th[data-name="New"] > div:first-child        { background: #39a8ef !important; }
.list-kanban[data-scope="Opportunity"] th[data-name="StockCheck"] > div:first-child { background: #2fc6f6 !important; }
.list-kanban[data-scope="Opportunity"] th[data-name="Invoiced"] > div:first-child   { background: #3dc9d8 !important; }
.list-kanban[data-scope="Opportunity"] th[data-name="Paid"] > div:first-child       { background: #2ed3a3 !important; }
.list-kanban[data-scope="Opportunity"] th[data-name="Shipped"] > div:first-child    { background: #ffa900 !important; }
.list-kanban[data-scope="Opportunity"] th[data-name="Closed Won"] > div:first-child { background: #7bd500 !important; }
.list-kanban[data-scope="Opportunity"] th[data-name="Closed Lost"] > div:first-child{ background: #ff5752 !important; }
.list-kanban[data-scope="Opportunity"] th[data-name="Refund"] > div:first-child     { background: #e0565a !important; }
.list-kanban .kanban-head-container, .list-kanban .kanban-head, .list-kanban .kanban-head th { background: transparent !important; border: 0 !important; }
/* колонки с пунктирными разделителями */
.list-kanban .kanban-columns td.group-column { background: transparent !important; border-right: 1px dashed rgba(255,255,255,.28) !important; vertical-align: top; }
.list-kanban .kanban-columns td.group-column:last-child { border-right: 0 !important; }
/* карточки сделок */
.list-kanban .item > .panel { background: #fff; border: 0; border-radius: 8px; box-shadow: 0 2px 6px rgba(6,18,40,.25); margin: 0 4px 8px; }
.list-kanban .item > .panel:hover { box-shadow: 0 4px 14px rgba(6,18,40,.35); }
.list-kanban .show-more .btn-link { color: #dbe7f5; }

/* Главная: дэшлеты как белые карточки */
.dashlet.panel, .dashlet .panel { border-radius: 10px; border: 0; box-shadow: 0 4px 16px rgba(6,18,40,.25); }

/* Кнопка «Создать …» — яркая, как главное действие */
.page-header a.btn[data-action="create"], .page-header .btn[data-name="create"] {
  background: #0593c6 !important; border-color: #0593c6 !important; color: #fff !important; font-weight: 600;
}
.page-header a.btn[data-action="create"]:hover, .page-header .btn[data-name="create"]:hover { background: #0479a3 !important; border-color: #0479a3 !important; }
.page-header a.btn[data-action="create"] span { color: #fff !important; }
/* На канбане служебные кнопки и счётчик — светлые */
#main:has(.list-kanban) .btn-text, #main:has(.list-kanban) [data-action="switchViewMode"],
#main:has(.list-kanban) .total-count, #main:has(.list-kanban) .total-count-span { color: #e3ecf2 !important; }
#main:has(.list-kanban) [data-action="switchViewMode"].active { color: #fff !important; border-bottom-color: #fff !important; }
/* Все 8 стадий помещаются на широком экране; на узком — прокрутка */
.list-kanban { min-width: 1180px !important; }
/* Главная: вкладки панели светлые на фоне */
#main:has(.dashlet) .btn-text { color: #cfe0f2 !important; }
#main:has(.dashlet) .btn-text.active, #main:has(.dashlet) .btn-text:hover { color: #fff !important; border-bottom-color: #fff !important; }
/* Длинные названия стадий — перенос на вторую строку вместо обрезки */
.list-kanban .kanban-head th.group-header > div:first-child, .list-kanban .kanban-head th.group-header > div:first-child .kanban-group-label {
  white-space: normal !important; overflow: visible !important; text-overflow: clip !important; word-break: normal;
}
.list-kanban .kanban-head th.group-header > div:first-child { min-height: 34px; font-size: 11.5px; line-height: 14px; }

/* ===== Шрифт и плотность ===== */
body, .navbar, .panel, .btn, input, select, textarea { font-family: "Open Sans", "Helvetica Neue", Arial, sans-serif; }
body { font-size: 13px; }

/* ===== Верхнее меню раздела CRM ===== */
.werx-crm-nav { display: flex; gap: 2px; flex-wrap: wrap; margin: 0 0 6px; padding: 4px; }
.werx-crm-nav a { color: #e9f1fb; font-size: 13px; padding: 5px 12px; border-radius: 6px; text-decoration: none !important; }
.werx-crm-nav a:hover { background: rgba(255,255,255,.12); color: #fff; }
.werx-crm-nav a.active { background: rgba(255,255,255,.22); color: #fff; font-weight: 600; }
#main:not(:has(.list-kanban)):not(:has(.dashlet)) .werx-crm-nav a { color: #31536e; }
#main:not(:has(.list-kanban)):not(:has(.dashlet)) .werx-crm-nav a.active { background: #dbeef7; color: #0479a3; }
#main:not(:has(.list-kanban)):not(:has(.dashlet)) .werx-crm-nav a:hover { background: #e8f3f9; }

/* ===== Кнопка «Создать ▾» (зелёная) ===== */
.page-header .header-buttons .werx-create, .page-header a.btn.werx-create {
  background: #3bc8a0 !important; background: #2fb67c !important; border-color: #2fb67c !important; color: #fff !important; font-weight: 600;
}
.page-header .header-buttons .werx-create:hover { background: #26a06c !important; border-color: #26a06c !important; }
.page-header .header-buttons .werx-create span { color: #fff !important; }
.werx-create-more { margin-left: 1px; }
.werx-create-more .werx-caret { padding-left: 9px; padding-right: 9px; border-left: 1px solid rgba(255,255,255,.35) !important; }

/* ===== Переключатель видов и счётчики ===== */
.werx-views { display: flex; align-items: center; gap: 14px; margin: 2px 0 10px; flex-wrap: wrap; }
.werx-pills { display: inline-flex; background: rgba(255,255,255,.14); border-radius: 8px; padding: 2px; }
.werx-pills a { color: #e9f1fb !important; padding: 4px 12px; border-radius: 6px; font-size: 12px; cursor: pointer; text-decoration: none !important; }
.werx-pills a.active { background: rgba(255,255,255,.9); color: #13324a !important; font-weight: 600; }
.werx-counters { display: inline-flex; gap: 10px; }
.werx-counters a { color: #e9f1fb !important; font-size: 12px; background: rgba(255,255,255,.14); padding: 4px 10px; border-radius: 8px; text-decoration: none !important; }
.werx-counters a b { display: inline-block; min-width: 18px; text-align: center; border-radius: 9px; background: rgba(255,255,255,.25); margin-right: 4px; padding: 0 4px; }
.werx-counters a.werx-cnt-over.has b { background: #ff5752; color: #fff; }
#main:not(:has(.list-kanban)) .werx-pills { background: #e3edf4; }
#main:not(:has(.list-kanban)) .werx-pills a { color: #31536e !important; }
#main:not(:has(.list-kanban)) .werx-pills a.active { background: #fff; color: #0479a3 !important; }
#main:not(:has(.list-kanban)) .werx-counters a { background: #e3edf4; color: #31536e !important; }
#main:has(.list-kanban) .view-mode-switcher-buttons-group { visibility: hidden; }

/* ===== Канбан: сумма, количество, быстрая сделка ===== */
.list-kanban .kanban-head th.group-header { vertical-align: top; }
.werx-n { opacity: .85; font-weight: 400; margin-left: 2px; }
.werx-sub { margin: 6px 6px 0 0; text-align: center; }
.werx-sum { display: inline-block; color: #fff; font-size: 15px; font-weight: 600; padding: 2px 10px; border-radius: 6px; background: rgba(255,255,255,.14); margin-bottom: 6px; }
.werx-quick { display: block; color: #e9f1fb !important; cursor: pointer; border-radius: 6px; padding: 4px 0; font-size: 12px; text-decoration: none !important; }
.werx-quick:not(.werx-plus) { background: rgba(255,255,255,.22); }
.werx-quick:hover { background: rgba(255,255,255,.3); color: #fff !important; }
.werx-plus { font-size: 18px; line-height: 18px; }

/* ===== Карточка сделки ===== */
.list-kanban .item.werx-pending .panel-body > div { visibility: hidden; }
.list-kanban .item.werx-done .panel-body .form-group { display: none; }
.list-kanban .item.werx-done .panel-body { padding: 10px 10px 8px; position: relative; }
.list-kanban .item.werx-done .item-menu-container { position: absolute; right: 2px; bottom: 30px; opacity: 0; transition: opacity .15s; }
.list-kanban .item.werx-done:hover .item-menu-container { opacity: 1; }
.werx-card { position: relative; font-size: 12px; line-height: 1.35; padding-right: 22px; }
.werx-head { display: flex; gap: 6px; align-items: flex-start; }
.werx-title { color: #1d2b36 !important; font-weight: 600; font-size: 12.5px; flex: 1; }
.werx-badge { position: absolute; right: -6px; top: -2px; background: #ff5752; color: #fff; border-radius: 9px; min-width: 18px; height: 18px; font-size: 11px; line-height: 18px; text-align: center; padding: 0 4px; }
.werx-planned { position: absolute; right: -4px; top: 0; color: #9aa9b4; font-size: 13px; }
.werx-amount { margin: 6px 0 4px; color: #333; font-size: 13px; }
.werx-link { display: block; color: #0b7fd1 !important; margin-bottom: 2px; word-break: break-word; }
.werx-time { color: #8f9ba5; font-size: 11px; margin-top: 3px; }
.werx-icons { position: absolute; right: -6px; top: 22px; display: flex; flex-direction: column; gap: 9px; }
.werx-icons a { color: #2b9de6 !important; cursor: pointer; font-size: 12px; }
.werx-icons a:hover { color: #0479a3 !important; }
.werx-foot { display: flex; justify-content: space-between; align-items: center; margin: 10px -10px -8px; padding: 6px 10px; border-top: 1px solid #eef1f4; color: #8f9ba5; font-size: 11px; }
.werx-foot a { color: #8f9ba5 !important; cursor: pointer; }
.werx-foot a:hover { color: #0479a3 !important; }
.werx-foot-r { display: inline-flex; align-items: center; gap: 6px; }
.werx-ava { width: 20px; height: 20px; border-radius: 50%; object-fit: cover; }
.list-kanban .item > .panel { border-radius: 4px; }

/* ===== Правки v3 ===== */
.list-kanban .kanban-head-container, .list-kanban .kanban-head, .list-kanban .kanban-head th.group-header { height: auto !important; max-height: none !important; overflow: visible !important; }
.list-kanban .kanban-head th.group-header > div:first-child { white-space: nowrap !important; overflow: hidden !important; text-overflow: ellipsis !important; min-height: 30px; font-size: 11.5px; }
.list-kanban .kanban-head th.group-header > div:first-child .kanban-group-label { white-space: nowrap !important; overflow: hidden; text-overflow: ellipsis; }
.list-kanban { min-width: 1480px !important; }
#main:has(.list-kanban) .list-buttons-container .total-count { display: none; }
.werx-foot { white-space: nowrap; }
.werx-foot-r { font-size: 0; }
.werx-foot-r .werx-ava { font-size: 11px; }
.werx-card { padding-right: 20px; }
.werx-title { font-size: 12px; }
/* шапка стадии: лента сверху, под ней сумма и «+» */
.list-kanban .kanban-head th.group-header { display: table-cell !important; }
.list-kanban .kanban-head th.group-header > div { height: auto !important; }
.list-kanban .kanban-head th.group-header > div:first-child { display: flex !important; width: auto; }
.list-kanban .kanban-head th.group-header > .werx-sub { display: block !important; width: auto; float: none; }
.list-kanban .kanban-head th.group-header > .werx-sub, .list-kanban .kanban-head th[class*="group-header-"] > .werx-sub {
  background: transparent !important; color: #fff !important; clip-path: none !important; padding: 0 !important; border: 0 !important; box-shadow: none !important;
}
/* Сделки: «Фильтр + поиск» в одной строке с заголовком (на широких экранах) */
@media (min-width: 1200px) {
  #main:has(.list-kanban) .page-header { margin-bottom: 0; }
  #main:has(.list-kanban) .search-container { position: relative; z-index: 3; margin: -38px 230px 12px 160px; }
  #main:has(.list-kanban) .search-container .search-row > .form-group:first-child { width: 100%; max-width: 560px; }
  #main:has(.list-kanban) .search-container .search-row > .form-group:last-child { display: none; }
}
/* подсказка графика воронки не «залипает» на других страницах */
body:not(:has(#main .dashlet)) .flotr-mouse-value { display: none !important; }
/* Во всю ширину экрана (без ограничения ширины контента) */
:root { --container-max-width: 100000px; }
body[data-navbar=side] .container, body[data-navbar=side].has-navbar > .content { max-width: none !important; }
/* на широком экране колонки растягиваются, на узком — прокрутка */
.list-kanban { min-width: 1480px !important; width: 100%; }

/* ===== Окно «Оплата» ===== */
.werx-modal { position: fixed; inset: 0; background: rgba(6,18,40,.55); z-index: 3000; display: flex; align-items: center; justify-content: center; padding: 16px; }
.werx-modal-box { position: relative; background: #fff; border-radius: 12px; padding: 20px 22px; width: 720px; max-width: 100%; max-height: 92vh; overflow: auto; box-shadow: 0 20px 60px rgba(0,0,0,.35); color: #1d2b36; }
.werx-modal-box h4 { margin: 0 0 6px; font-weight: 600; }
.werx-x { position: absolute; right: 12px; top: 8px; border: 0; background: none; font-size: 24px; color: #8f9ba5; cursor: pointer; }
.werx-pay-sum { font-size: 22px; font-weight: 700; color: #0479a3; margin-bottom: 10px; }
.werx-pay-note { background: #fff6dd; border-radius: 8px; padding: 8px 10px; margin-bottom: 10px; font-size: 12.5px; }
.werx-pay-note.ok { background: #e3f7ec; }
.werx-pay-grid { display: grid; grid-template-columns: 220px 1fr; gap: 18px; align-items: start; }
.werx-qr { width: 220px; height: 220px; border: 1px solid #e6ebef; border-radius: 10px; padding: 6px; display: flex; align-items: center; justify-content: center; color: #8f9ba5; }
.werx-qr svg { width: 100%; height: 100%; }
.werx-pay-r label { display: block; font-size: 12px; color: #6b7a86; margin: 4px 0 3px; }
.werx-pay-r input, .werx-pay-r textarea { width: 100%; border: 1px solid #d9e1e7; border-radius: 6px; padding: 6px 8px; font-size: 12.5px; }
.werx-row { display: flex; gap: 6px; margin: 4px 0 8px; }
.werx-row input { flex: 1; }
.werx-pay-hint { font-size: 11.5px; color: #8f9ba5; }
@media (max-width: 640px) { .werx-pay-grid { grid-template-columns: 1fr; } .werx-qr { margin: 0 auto; } }
.werx-pay-btn { margin-left: 4px; }

.detail-button-container { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; }
.detail-button-container .werx-pay-btn { margin-left: 0; }

/* ===== Чат с клиентом ===== */
.werx-chat .panel-body { padding: 10px 12px; }
.werx-chat-list { max-height: 380px; overflow: auto; display: flex; flex-direction: column; gap: 8px; padding: 6px 2px 10px; background: #f3f6f9; border-radius: 8px; }
.werx-chat-empty { color: #8f9ba5; font-size: 12.5px; padding: 10px; }
.werx-msg { max-width: 78%; display: flex; flex-direction: column; }
.werx-msg.in { align-self: flex-start; } .werx-msg.out { align-self: flex-end; align-items: flex-end; }
.werx-msg-b { padding: 7px 11px; border-radius: 12px; font-size: 13px; line-height: 1.4; background: #fff; box-shadow: 0 1px 2px rgba(0,0,0,.08); word-break: break-word; margin: 0 6px; }
.werx-msg.out .werx-msg-b { background: #d9f0fa; }
.werx-msg.err .werx-msg-b { background: #fde4e4; }
.werx-msg-m { font-size: 11px; color: #8f9ba5; margin: 2px 10px 0; }
.werx-chat-send { display: grid; grid-template-columns: 170px 1fr auto; gap: 8px; margin-top: 10px; align-items: start; }
.werx-chat-hint { font-size: 11.5px; color: #8f9ba5; margin-top: 6px; }
@media (max-width: 700px) { .werx-chat-send { grid-template-columns: 1fr; } }

/* ===== Карточка сделки ===== */
.werx-deal { margin: 4px 0 16px; }
.werx-deal-loading { color: #8f9ba5; padding: 10px 0; }
.werx-stagebar { display: flex; gap: 3px; margin: 0 0 14px; flex-wrap: nowrap; }
.werx-st { position: relative; flex: 1; min-width: 0; display: block; padding: 8px 16px 8px 12px; font-size: 12px; font-weight: 600; color: #4b5a66 !important;
  background: #e9eef2; border-bottom: 3px solid var(--c); cursor: pointer; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; text-decoration: none !important;
  clip-path: polygon(0 0, calc(100% - 10px) 0, 100% 50%, calc(100% - 10px) 100%, 0 100%, 10px 50%); }
.werx-st:first-child { clip-path: polygon(0 0, calc(100% - 10px) 0, 100% 50%, calc(100% - 10px) 100%, 0 100%); border-radius: 6px 0 0 6px; }
.werx-st.cur, .werx-st.done { background: var(--c); color: #fff !important; }
.werx-st.done { opacity: .75; }
.werx-st.off { opacity: .45; }
.werx-st:hover { filter: brightness(1.05); }
.werx-st-final { position: relative; flex: 1.1; display: flex; }
.werx-st-final .werx-st { flex: 1; }
.werx-st-menu { display: none; position: absolute; right: 0; top: 100%; z-index: 20; background: #fff; border-radius: 8px; box-shadow: 0 8px 24px rgba(0,0,0,.18); padding: 6px; min-width: 200px; }
.werx-st-final.open .werx-st-menu { display: block; }
.werx-st-menu a { display: flex; align-items: center; gap: 8px; padding: 7px 10px; border-radius: 6px; color: #1d2b36 !important; cursor: pointer; text-decoration: none !important; }
.werx-st-menu a:hover { background: #f1f5f8; }
.werx-st-menu i { width: 10px; height: 10px; border-radius: 50%; display: inline-block; }
.werx-deal-grid { display: grid; grid-template-columns: minmax(300px, 400px) 1fr; gap: 16px; align-items: start; }
@media (max-width: 1000px) { .werx-deal-grid { grid-template-columns: 1fr; } }
.werx-card-b { background: #fff; border-radius: 10px; padding: 14px 16px; box-shadow: 0 1px 3px rgba(6,18,40,.08); }
.werx-cap { font-size: 11px; font-weight: 700; letter-spacing: .04em; text-transform: uppercase; color: #4b5a66; padding-bottom: 8px; border-bottom: 1px solid #eef1f4; margin-bottom: 10px; }
.werx-f { margin: 10px 0; font-size: 13.5px; color: #1d2b36; }
.werx-f > span { display: block; font-size: 11.5px; color: #8f9ba5; margin-bottom: 2px; }
.werx-sum-row { display: flex; align-items: center; justify-content: space-between; gap: 10px; }
.werx-big { font-size: 30px; font-weight: 600; color: #1d2b36; }
.werx-paid { color: #2e9e5b; font-weight: 600; }
.werx-sub-card { border: 1px solid #e6ebef; border-radius: 10px; padding: 10px 12px; margin: 8px 0 12px; }
.werx-sub-t { font-size: 12.5px; font-weight: 600; margin-bottom: 6px; }
.werx-kv { font-size: 12.5px; margin: 4px 0; color: #1d2b36; }
.werx-kv > span { color: #8f9ba5; margin-right: 6px; }
.werx-kv.werx-items { line-height: 1.4; }
.werx-kv.werx-total { display: flex; justify-content: space-between; border-top: 1px solid #eef1f4; padding-top: 8px; margin-top: 8px; }
.werx-client { display: flex; justify-content: space-between; align-items: center; gap: 10px; border: 1px solid #e6ebef; border-radius: 10px; padding: 10px 12px; margin: 6px 0; }
.werx-cl-l small { display: block; color: #8f9ba5; font-size: 11px; }
.werx-cl-l a { font-weight: 600; font-size: 14px; }
.werx-cl-c { color: #8f9ba5; font-size: 12px; margin-top: 2px; }
.werx-cl-i { display: flex; gap: 12px; }
.werx-cl-i a { color: #2b9de6 !important; cursor: pointer; font-size: 15px; }
.werx-composer { padding: 10px 14px 14px; }
.werx-tabs { display: flex; gap: 4px; flex-wrap: wrap; margin-bottom: 10px; }
.werx-tabs a { padding: 5px 11px; border-radius: 6px; color: #4b5a66 !important; cursor: pointer; font-size: 13px; text-decoration: none !important; }
.werx-tabs a.active { background: #e3f4fb; color: #0479a3 !important; font-weight: 600; }
.werx-fake-input { border: 1px solid #d9e1e7; border-radius: 8px; padding: 12px; color: #8f9ba5; cursor: text; }
.werx-sep { text-align: center; margin: 14px 0 10px; position: relative; }
.werx-sep:before { content: ""; position: absolute; left: 0; right: 0; top: 50%; border-top: 1px solid rgba(255,255,255,.35); }
.werx-sep span { position: relative; background: #4aa3e0; color: #fff; font-size: 11.5px; font-weight: 600; padding: 3px 12px; border-radius: 10px; }
.werx-sep span.g { background: #2fb67c; }
.werx-todo { background: #fff8e6; border-radius: 10px; padding: 12px 14px; margin-bottom: 8px; box-shadow: 0 1px 3px rgba(6,18,40,.08); }
.werx-todo.over { border-left: 4px solid #ff5752; }
.werx-todo label { font-weight: normal; cursor: pointer; margin: 0; }
.werx-todo-m { font-size: 12px; color: #6b7a86; margin: 4px 0 6px 20px; }
.werx-due { background: #fdecc8; padding: 2px 8px; border-radius: 6px; }
.werx-due.over { background: #fde0de; color: #c0392b; }
.werx-todo-d { background: #fff; border: 1px solid #f0e3c0; border-radius: 8px; padding: 8px 10px; font-size: 12.5px; margin: 0 0 8px 20px; }
.werx-todo-b { margin-left: 20px; }
.werx-h { background: #fff; border-radius: 10px; padding: 10px 14px; margin-bottom: 8px; box-shadow: 0 1px 3px rgba(6,18,40,.06); }
.werx-h-t { font-weight: 600; font-size: 12.5px; color: #4b5a66; }
.werx-h-t span { font-weight: normal; color: #8f9ba5; margin-left: 4px; }
.werx-h-b { font-size: 13px; color: #1d2b36; margin-top: 3px; }
.werx-empty { color: #8f9ba5; font-size: 12.5px; padding: 8px 2px; }
/* на странице сделки: старые панели дел/истории/ленты спрятаны (их кнопки используются новой карточкой) */
#main.werx-deal-page .panel[data-name="activities"], #main.werx-deal-page .panel[data-name="history"],
#main.werx-deal-page .panel[data-name="tasks"], #main.werx-deal-page .panel[data-name="stream"] { position: absolute !important; left: -10000px !important; width: 600px; }
#main.werx-deal-page .werx-pay-btn { display: none; }
/* «Дополнительно» — стандартные поля ниже */
#main.werx-deal-page .record:before { content: "Дополнительно"; display: block; font-size: 11px; font-weight: 700; letter-spacing: .04em; text-transform: uppercase; color: #4b5a66; margin: 6px 0 8px; }

/* подсказка по ИНН */
.werx-inn-hint { font-size: 12px; color: #6b7a86; margin-top: 4px; line-height: 1.4; }
.werx-inn-hint.ok { color: #1d2b36; background: #e9f7ef; border-radius: 6px; padding: 6px 8px; }
.werx-inn-hint.err { color: #c0392b; }

/* ===== Заказ на сайте из сделки ===== */
.werx-order-box { width: 820px; }
.werx-order-body label { display: block; font-size: 12px; color: #6b7a86; margin: 10px 0 4px; }
.werx-order-body label.werx-o-chk { color: #1d2b36; font-size: 13px; }
.werx-o-table { width: 100%; border-collapse: collapse; margin: 6px 0; font-size: 13px; }
.werx-o-table th { text-align: left; font-weight: 600; color: #6b7a86; font-size: 12px; border-bottom: 1px solid #e6ebef; padding: 6px 4px; }
.werx-o-table td { border-bottom: 1px solid #f0f3f6; padding: 6px 4px; vertical-align: middle; }
.werx-o-table input { width: 90px; border: 1px solid #d9e1e7; border-radius: 6px; padding: 4px 6px; }
.werx-o-table a { color: #c0392b; cursor: pointer; font-size: 18px; }
.werx-o-grid { display: grid; grid-template-columns: 1fr 200px; gap: 12px; }
.werx-o-total { text-align: right; font-size: 16px; margin: 12px 0 6px; }
.werx-site-order { white-space: nowrap; }

.werx-create-hint { margin: 0 0 12px; line-height: 1.5; }

.werx-edit-items { display: inline-block; margin-top: 8px; font-size: 12.5px; cursor: pointer; }

/* воронка продаж на дашборде */
.werx-fn-body > :not(.werx-funnel) { display: none !important; }
.werx-fn-body { overflow: auto; }
.werx-funnel { font-size: 13px; color: #333; padding: 4px 6px; }
.werx-fn-top { display: flex; justify-content: space-between; align-items: center; margin-bottom: 10px; gap: 8px; flex-wrap: wrap; }
.werx-fn-per a { cursor: pointer; padding: 3px 10px; border-radius: 12px; color: #4b5a66; margin-left: 2px; }
.werx-fn-per a.active { background: #e3f3fb; color: #0479a3; font-weight: 600; }
.werx-fn-head, .werx-fn-row { display: grid; grid-template-columns: 150px 1fr 120px 110px 80px; gap: 10px; align-items: center; }
.werx-fn-head { font-size: 11px; color: #8a96a0; text-transform: uppercase; letter-spacing: .03em; padding-bottom: 4px; border-bottom: 1px solid #eef1f4; }
.werx-fn-row { padding: 7px 0; border-bottom: 1px solid #f3f5f7; }
.werx-fn-name { display: flex; align-items: center; gap: 7px; font-weight: 600; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.werx-fn-name i, .werx-fn-foot i { width: 10px; height: 10px; border-radius: 3px; display: inline-block; flex: none; }
.werx-fn-bar { position: relative; height: 22px; background: #f2f5f8; border-radius: 6px; overflow: hidden; }
.werx-fn-bar span { position: absolute; left: 0; top: 0; bottom: 0; border-radius: 6px; opacity: .85; }
.werx-fn-bar b { position: relative; line-height: 22px; padding-left: 8px; color: #1d2a33; }
.werx-fn-sum { text-align: right; white-space: nowrap; }
.werx-fn-conv { text-align: right; font-weight: 600; }
.werx-fn-conv small { display: block; font-weight: 400; color: #8a96a0; font-size: 11px; }
.werx-fn-now { font-size: 11px; color: #8a96a0; }
.werx-fn-foot { display: flex; gap: 18px; flex-wrap: wrap; margin-top: 12px; }
.werx-fn-foot span { display: inline-flex; align-items: center; gap: 6px; }
.werx-fn-hint { margin-top: 10px; font-size: 11px; color: #8a96a0; }
.werx-fn-load { padding: 20px; color: #8a96a0; }
@media (max-width: 700px) { .werx-fn-head, .werx-fn-row { grid-template-columns: 110px 1fr 70px; } .werx-fn-sum, .werx-fn-now { display: none; } }
@media (max-width: 700px) { .werx-fn-head span:nth-child(3), .werx-fn-head span:nth-child(5) { display: none; } }

/* зоны внизу при перетаскивании сделки: одна строка, варианты — столбцами (как в Б24) */
.werx-dropzones { position: fixed; left: 0; right: 0; bottom: 0; z-index: 2000; display: grid; grid-auto-flow: column; grid-auto-columns: 1fr; align-items: end; height: 72px; padding: 0; pointer-events: none; transform: translateY(110%); transition: transform .18s ease; }
.werx-dropzones.werx-dz-on { transform: translateY(0); }
.werx-dz { display: flex; align-items: center; justify-content: center; height: 60px; color: #fff; font-weight: 600; font-size: 14px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; padding: 0 8px; background: var(--c); opacity: .9; border-right: 1px solid rgba(255,255,255,.35); transition: height .12s, opacity .12s; }
.werx-dz:last-child { border-right: 0; }
.werx-dz.hover { height: 72px; opacity: 1; }

/* карточка: счётчик дел, иконки, полоска стадии, футер */
.list-kanban .item { position: relative; }
.list-kanban .item:hover::before { content: ''; position: absolute; left: 0; top: 0; bottom: 0; width: 4px; border-radius: 10px 0 0 10px; background: var(--werx-st, #39a8ef); opacity: .65; z-index: 3; pointer-events: none; }
.werx-badge { cursor: pointer; }
.werx-badge.plan { background: #8fb7d6; }
.werx-badge.zero { background: #c9ccd0; }
.werx-icons a.off { color: #c9ccd0 !important; cursor: default; }
.werx-foot-r .werx-act-t { font-size: 11px; color: #959ca4; }
.list-kanban .item.werx-hide { display: none !important; }
/* фильтры и счётчики в шапке */
.werx-fpills { margin-left: 4px; }
.werx-counters a { cursor: pointer; }
.werx-counters a.has b { background: #ff5752; color: #fff; }
.werx-counters a.werx-cnt-in.has b { background: #2fc6f6; }
.werx-counters a.on { outline: 2px solid #fff; outline-offset: 0; }
#main:not(:has(.list-kanban)) .werx-counters a.on { outline-color: #2b9de6; }
/* всплывающий список дел */
.werx-pop { position: fixed; z-index: 2100; width: 320px; max-height: 300px; display: flex; flex-direction: column; background: #fff; border-radius: 10px; box-shadow: 0 8px 28px rgba(6,18,40,.28); font-size: 13px; color: #333; }
.werx-pop-h { padding: 10px 12px 6px; font-weight: 600; }
.werx-pop-l { overflow: auto; padding: 0 12px; }
.werx-pop-t { display: flex; gap: 8px; align-items: flex-start; padding: 6px 0; border-bottom: 1px solid #f0f2f4; font-weight: 400; margin: 0; cursor: default; }
.werx-pop-t input { margin-top: 3px; cursor: pointer; }
.werx-pop-t small { display: block; color: #8a96a0; }
.werx-pop-t small.od { color: #ff5752; }
.werx-pop-t.done a { text-decoration: line-through; color: #9aa3ad; }
.werx-pop-empty { color: #8a96a0; padding: 6px 0 10px; }
.werx-pop-f { padding: 8px 12px; border-top: 1px solid #eef1f4; }
.werx-pop-f a { cursor: pointer; color: #2b9de6; font-weight: 600; }
/* форма «Дело» */
.werx-task-box { max-width: 460px; }
.werx-task-row { display: flex; gap: 10px; margin: 10px 0; }
.werx-task-row label { flex: 1; font-weight: 400; font-size: 12px; color: #6b7785; }
.werx-task-btns { gap: 8px; }
/* быстрая сделка в колонке */
.werx-qd { position: fixed; z-index: 2050; background: #fff; border-radius: 10px; padding: 12px; text-align: left; box-shadow: 0 10px 30px rgba(6,18,40,.35); color: #333; font-weight: 400; white-space: normal; font-size: 13px; }
.werx-qd .form-control { height: 32px; font-size: 13px; margin-bottom: 6px; }
.werx-qd-t { font-weight: 600; font-size: 12px; margin-bottom: 8px; }
.werx-qd-row { display: flex; gap: 6px; }
.werx-qd-row > * { flex: 1; }
.werx-qd-client { position: relative; }
.werx-qd-res a { display: block; padding: 5px 6px; border-radius: 6px; cursor: pointer; color: #1d2a33; font-size: 12.5px; }
.werx-qd-res a:hover { background: #eef6fb; }
.werx-qd-res small { display: block; color: #8a96a0; font-size: 11px; }
.werx-qd-new { font-size: 11.5px; color: #8a96a0; padding: 0 2px 6px; }
.werx-qd-sel { font-size: 12.5px; margin-bottom: 6px; }
.werx-qd-sel a { cursor: pointer; color: #ff5752; margin-left: 4px; }
.werx-qd-hint { font-size: 11px; color: #8a96a0; margin: 0 0 8px; }
.werx-qd-btns { display: flex; gap: 6px; }

/* карточка сделки: Б1 превью стадий, окно завершения */
.werx-stagebar.pv-on .werx-st.pv { background: var(--pc) !important; color: #fff !important; opacity: 1 !important; }
.werx-stagebar.pv-on .werx-st:not(.pv) { background: #eef2f5 !important; color: #4b5a66 !important; opacity: 1; }
.werx-st { cursor: pointer; }
.werx-fin-box { max-width: 460px; text-align: center; }
.werx-fin-p { color: #6b7785; margin: 6px 0 14px; }
.werx-fin-btns { display: flex; gap: 10px; justify-content: center; flex-wrap: wrap; }
.werx-fin-btns .btn { min-width: 150px; color: #fff; border: 0; font-weight: 600; }
.werx-fin-won { background: #7bd500; } .werx-fin-lost { background: #ff5752; }
.werx-fin-l { background: #c9555a; }
.werx-fin-sub { margin-top: 16px; border-top: 1px solid #eef1f4; padding-top: 6px; }
.werx-fin-note { font-size: 12px; color: #8a96a0; margin-top: 10px; }
/* Б2 дела */
.werx-snooze { position: relative; display: inline-block; margin: 0 4px; }
.werx-snz-menu { display: none; position: absolute; left: 0; top: 100%; z-index: 30; background: #fff; border-radius: 8px; box-shadow: 0 8px 24px rgba(0,0,0,.18); padding: 6px; min-width: 180px; }
.werx-snooze.open .werx-snz-menu { display: block; }
.werx-snz-menu a { display: block; padding: 6px 10px; border-radius: 6px; cursor: pointer; color: #1d2b36 !important; text-decoration: none !important; }
.werx-snz-menu a:hover { background: #f1f5f8; }
.werx-todo-empty { display: flex; flex-direction: column; gap: 4px; align-items: flex-start; padding: 12px 14px; border: 1px dashed #cfd8df; border-radius: 10px; color: #6b7785; margin-bottom: 8px; }
.werx-todo-empty b { color: #1d2b36; }
/* Б6 иконки связи */
.werx-deal-acts { display: flex; justify-content: flex-end; margin: -4px 0 8px; }
.werx-ic { display: inline-flex; gap: 6px; }
.werx-ic a { width: 30px; height: 30px; border-radius: 50%; display: inline-flex; align-items: center; justify-content: center; background: #e8f4fc; color: #2b9de6 !important; cursor: pointer; text-decoration: none !important; font-size: 13px; }
.werx-ic a:hover { background: #d4ecfa; }
.werx-ic a.off { background: #f1f3f5; color: #c3c9cf !important; cursor: default; }
.werx-ic.top a { background: rgba(255,255,255,.85); }
.werx-cl-chat { color: #2e9b6b !important; }
/* Б3/Б4 */
.werx-msg-send { display: grid; grid-template-columns: 140px 1fr; gap: 8px; }
.werx-lbl { display: block; font-size: 12px; color: #6b7785; font-weight: 400; margin: 8px 0 4px; }
/* Б5 лента */
.werx-sep-feed { display: flex; align-items: center; justify-content: space-between; gap: 8px; flex-wrap: wrap; }
.werx-feed-f { display: inline-flex; gap: 2px; flex-wrap: wrap; }
.werx-feed-f a { cursor: pointer; font-size: 11.5px; padding: 2px 9px; border-radius: 10px; color: #6b7785 !important; text-decoration: none !important; background: rgba(255,255,255,.75); }
.werx-feed-f a.active { background: #2b9de6; color: #fff !important; }
.werx-day { display: inline-block; margin: 10px 0 6px; padding: 2px 10px; border-radius: 10px; background: #dfe6ec; color: #4b5a66; font-size: 11.5px; font-weight: 600; }
.werx-day.today { background: #2b9de6; color: #fff; }
.werx-day.pin { background: #fff3cd; color: #7a5a00; }
.werx-feed .werx-h { display: flex; gap: 10px; align-items: flex-start; }
.werx-h-ic { flex: none; width: 26px; height: 26px; border-radius: 50%; background: #e8eef3; color: #6b7785; display: inline-flex; align-items: center; justify-content: center; font-size: 11px; margin-top: 2px; }
.werx-h.k-comment .werx-h-ic { background: #fff3cd; color: #b08400; }
.werx-h.k-msg .werx-h-ic { background: #dff5ea; color: #2e9b6b; }
.werx-h.k-stage .werx-h-ic { background: #e3f3fb; color: #1d8ac0; }
.werx-h.k-task .werx-h-ic { background: #ece8fb; color: #6a4fc9; }
.werx-h-main { flex: 1; min-width: 0; }
.werx-pin { float: right; cursor: pointer; opacity: .25; text-decoration: none !important; }
.werx-h:hover .werx-pin, .werx-pin.on { opacity: 1; }
.werx-chip { display: inline-block; background: #eef2f5; border-radius: 10px; padding: 1px 9px; font-size: 12px; }
.werx-bubble { display: inline-block; max-width: 100%; padding: 6px 10px; border-radius: 10px; background: #f1f5f8; white-space: normal; }
.werx-bubble.out { background: #dff1fb; }

/* В1: вид «Дела» */
#main.werx-tasks-view .list-kanban, #main.werx-tasks-view .list-container, #main.werx-tasks-view .list-buttons-container, #main.werx-tasks-view .werx-fpills ~ .werx-counters { }
#main.werx-tasks-view .list-container { display: none !important; }
.werx-tboard { margin-top: 12px; overflow-x: auto; padding-bottom: 12px; }
.werx-tb-cols { display: flex; gap: 12px; min-width: min-content; }
.werx-tb-col { width: 280px; flex: none; }
.werx-tb-h { background: var(--c); color: #fff; font-size: 12px; font-weight: 600; padding: 7px 12px; border-radius: 6px 0 0 6px; clip-path: polygon(0 0, calc(100% - 10px) 0, 100% 50%, calc(100% - 10px) 100%, 0 100%); }
.werx-tb-h b { opacity: .8; margin-left: 4px; }
.werx-tb-sum { text-align: center; margin: 8px 0; color: #fff; font-weight: 600; font-size: 13px; }
.werx-tb-load { color: #cfe0f2; padding: 20px; }
.werx-tb-card { background: #fff; border-radius: 10px; padding: 10px 12px 8px; margin-bottom: 10px; font-size: 13px; color: #333; position: relative; }
.werx-tb-card.over { box-shadow: inset 4px 0 0 #ff5752; }
.werx-tb-t { display: flex; justify-content: space-between; gap: 6px; }
.werx-tb-t a { color: #1d2b36 !important; font-weight: 600; }
.werx-tb-card .werx-badge { position: static; flex: none; }
.werx-tb-cl { color: #2066b0; font-size: 12.5px; }
.werx-tb-st { display: inline-block; margin: 6px 0 4px; font-size: 11px; padding: 1px 8px; border-radius: 9px; background: var(--c); color: #fff; }
.werx-tb-task { font-size: 12px; background: #f6f8fa; border-radius: 6px; padding: 5px 8px; margin-top: 4px; }
.werx-tb-task small { display: block; color: #8a96a0; }
.werx-tb-task.od small { color: #ff5752; font-weight: 600; }
.werx-tb-task.none { color: #9aa3ad; }
.werx-tb-card .werx-foot { margin: 8px -12px -8px; }
/* В3: аналитика на главной */
.werx-kpi { display: grid; grid-template-columns: repeat(4, 1fr); gap: 10px; margin-bottom: 12px; }
.werx-kpi > div { background: #f6f8fa; border-radius: 10px; padding: 10px 12px; }
.werx-kpi > div.won { background: #eefadf; }
.werx-kpi small { display: block; color: #8a96a0; font-size: 11px; }
.werx-kpi b { display: block; font-size: 20px; color: #1d2b36; }
.werx-kpi span { font-size: 11.5px; color: #6b7785; }
.werx-fn-sec { font-weight: 600; margin: 14px 0 8px; color: #1d2b36; }
.werx-fn-sec a { font-weight: 400; font-size: 12px; margin-left: 8px; cursor: pointer; }
.werx-plan-bar { position: relative; height: 12px; background: #eef1f4; border-radius: 6px; overflow: visible; }
.werx-plan-bar span { position: absolute; left: 0; top: 0; bottom: 0; background: #7bd500; border-radius: 6px; }
.werx-plan-bar i { position: absolute; top: -4px; bottom: -4px; width: 2px; background: #2b9de6; }
.werx-plan-kv { display: flex; gap: 18px; flex-wrap: wrap; margin-top: 8px; font-size: 12.5px; color: #6b7785; }
.werx-plan-kv b { color: #1d2b36; }
.werx-mgr { width: 100%; font-size: 12.5px; border-collapse: collapse; }
.werx-mgr th { font-weight: 400; color: #8a96a0; font-size: 11px; text-align: left; padding: 4px 6px; border-bottom: 1px solid #eef1f4; }
.werx-mgr td { padding: 6px; border-bottom: 1px solid #f3f5f7; }
@media (max-width: 900px) { .werx-kpi { grid-template-columns: repeat(2, 1fr); } }
/* В4: сделки клиента */
.werx-cdeals .panel-title { display: flex; justify-content: space-between; align-items: center; }
.werx-cd-row { display: grid; grid-template-columns: 1fr 170px 100px; gap: 10px; align-items: center; padding: 8px 0; border-bottom: 1px solid #f0f2f4; color: #1d2b36 !important; text-decoration: none !important; }
.werx-cd-row:hover { background: #f8fafb; }
.werx-cd-n small { display: block; color: #8a96a0; font-size: 11px; }
.werx-cd-bar { display: flex; gap: 2px; align-items: center; flex-wrap: wrap; }
.werx-cd-bar i { width: 26px; height: 6px; border-radius: 3px; }
.werx-cd-bar small { width: 100%; color: #6b7785; font-size: 11px; }
.werx-cd-row b { text-align: right; }
/* В5: режим CRM */
.werx-mode { display: flex; gap: 10px; align-items: center; flex-wrap: wrap; background: rgba(255,255,255,.92); border-radius: 10px; padding: 8px 14px; margin: 0 0 12px; font-size: 13px; color: #1d2b36; }
.werx-mode .werx-pills a { cursor: pointer; }
.werx-mode-h { color: #6b7785; font-size: 12px; flex: 1; min-width: 240px; }

.werx-noq { visibility: hidden; }

/* стадия «Ожидает поставки» */
.list-kanban[data-scope="Opportunity"] th[data-name="AwaitingStock"] > div:first-child { background: #9d7ae0 !important; }
.werx-supply { display: inline-block; margin-top: 4px; font-size: 11.5px; padding: 2px 8px; border-radius: 9px; background: #efe8fc; color: #5b3aa8 !important; cursor: pointer; text-decoration: none !important; }
.werx-supply.late { background: #ffe3e2; color: #d93a35 !important; font-weight: 600; }
.werx-chk { display: flex; gap: 8px; align-items: flex-start; font-weight: 400; font-size: 13px; margin: 8px 0 0; color: #1d2b36; }
.werx-chk input { margin-top: 3px; }
.werx-sup-edit { cursor: pointer; font-size: 12px; margin-left: 6px; }

/* без обращений «Г-н / Мисс / Г-жа» во всех формах: имя и фамилия на всю ширину */
.row:has(> div > select[data-name^="salutation"]) > div:first-child { display: none !important; }
.row:has(> div > select[data-name^="salutation"]) > div:nth-child(2) { width: 45% !important; }
.row:has(> div > select[data-name^="salutation"]) > div:nth-child(3) { width: 55% !important; }
/* телефон: всегда Россия +7, без выбора страны */
.iti__selected-flag, .iti__selected-country, .iti__flag-container button { pointer-events: none !important; cursor: default !important; }
.iti__arrow, .iti__country-list, .iti__dropdown-content { display: none !important; }

.werx-dt b { font-weight: 600; }
.werx-dt-e { cursor: pointer; opacity: .55; text-decoration: none !important; margin-left: 4px; }
.werx-dt-e:hover { opacity: 1; }
.werx-dt-in { display: inline-block; width: 150px; height: 28px; padding: 2px 6px; }

.werx-fn-mode { display: inline-flex; margin-right: 14px; border: 1px solid #d5e3ec; border-radius: 12px; padding: 1px; }
.werx-fn-mode a { cursor: pointer; padding: 2px 10px; border-radius: 10px; color: #6b7785; font-size: 12px; text-decoration: none !important; }
.werx-fn-mode a.active { background: #2b9de6; color: #fff !important; font-weight: 600; }

.werx-resend { display: block; margin-top: 6px; cursor: pointer; }

.werx-o-rcomm { margin: 4px 0 8px; }

/* масштаб канбана */
.werx-scale { margin-left: auto; }
#main.werx-kb-fit .list-kanban, #main.werx-kb-compact .list-kanban { min-width: 0 !important; width: 100% !important; }
#main.werx-kb-fit .list-kanban table, #main.werx-kb-compact .list-kanban table { table-layout: fixed; width: 100% !important; }
#main.werx-kb-compact .list-kanban .werx-card { font-size: 11.5px; }
#main.werx-kb-compact .list-kanban .werx-title { font-size: 12px; line-height: 1.3; }
#main.werx-kb-compact .list-kanban .werx-amount { font-size: 12.5px; }
#main.werx-kb-compact .list-kanban .werx-link { font-size: 11.5px; }
#main.werx-kb-compact .list-kanban .item { margin-bottom: 6px !important; }
#main.werx-kb-compact .list-kanban .item .panel-body { padding: 7px 9px !important; }
#main.werx-kb-compact .list-kanban th.group-header > div:first-child { font-size: 10.5px !important; }
#main.werx-kb-compact .werx-sum { font-size: 12px !important; }
/* заметная полоса прокрутки, если доска шире экрана */
#main .list-kanban-container, #main .list-container:has(.list-kanban) { scrollbar-width: auto; scrollbar-color: rgba(255,255,255,.55) rgba(255,255,255,.12); }

/* ================= МОБИЛЬНАЯ ВЕРСИЯ (телефон, до 768 px) ================= */
.werx-mob-st { display: none; }
@media (max-width: 768px) {
  #main { margin: 8px 6px 12px !important; padding: 4px 10px 14px !important; border-radius: 12px; }
  #main:has(.list-kanban), #main:has(.dashlet) { margin: 4px 0 !important; padding: 4px 6px 10px !important; }
  #content { padding-left: 0 !important; padding-right: 0 !important; }
  body { overflow-x: hidden; }
  /* меню разделов — одна строка с прокруткой */
  .werx-crm-nav { flex-wrap: nowrap !important; overflow-x: auto; white-space: nowrap; scrollbar-width: none; -webkit-overflow-scrolling: touch; margin: 0 -4px 8px; padding: 2px 4px; }
  .werx-crm-nav::-webkit-scrollbar { display: none; }
  .werx-crm-nav a { flex: none; }
  /* шапка списка: заголовок и «Создать» в строку, поиск на всю ширину */
  #main .page-header { margin: 4px 0 6px !important; }
  #main .page-header .row { display: flex; align-items: center; flex-wrap: wrap; }
  #main .page-header .header-title { font-size: 20px !important; }
  #main .page-header .page-header-column-2 .header-buttons { float: none; text-align: right; }
  #main .search-container { width: 100% !important; }
  #main .search-container .search-row > .form-group:first-child, #main .search-container .input-group { width: 100% !important; max-width: none !important; }
  /* переключатели видов, фильтры и счётчики — одна прокручиваемая строка */
  .werx-views { display: flex !important; flex-wrap: nowrap !important; overflow-x: auto; gap: 8px; scrollbar-width: none; padding-bottom: 4px; margin-top: 6px; }
  .werx-views::-webkit-scrollbar { display: none; }
  .werx-views > * { flex: none; white-space: nowrap; }
  .werx-scale { display: none !important; }
  /* без пустых полос: строка поиска одной линией, служебная строка списка над канбаном скрыта */
  #main .search-container .search-row { display: flex !important; flex-wrap: nowrap; align-items: center; gap: 6px; height: auto !important; }
  #main .search-container .search-row > * { margin: 0 !important; float: none !important; }
  #main .search-container .search-row > :first-child { flex: 1 1 0 !important; min-width: 0; width: auto !important; max-width: none !important; }
  #main .search-container .search-row > :first-child .input-group { display: flex !important; width: 100% !important; }
  #main .search-container .search-row > :first-child .input-group > .input-group-btn { display: flex !important; width: auto !important; flex: none; }
  #main .search-container .search-row > :first-child .input-group > input.text-filter { flex: 1 1 auto; width: auto !important; min-width: 0; }
  #main .search-container .search-row > :first-child .input-group > .input-group-btn:last-child:not(:nth-child(3)) { display: none !important; }
  #main .search-container .search-row > .form-group:has(.view-mode-switcher-buttons-group) { display: none !important; }
  #main .search-container .search-row > :not(:first-child) { flex: none; width: auto !important; }
  #main:has(.list-kanban) .list-buttons-container { display: none !important; }
  /* панель «Редактировать» не плавает поверх карточки при прокрутке */
  #main .detail-button-container.stick-sub { display: none !important; }
  /* канбан: по одной колонке на экран, листается пальцем */
  #main[class] .list-kanban.list-kanban, #main .list-kanban.list-kanban { width: calc(var(--werx-kn, 7) * 86vw) !important; min-width: 0 !important; }
  #main[class] .list-kanban.list-kanban table { width: 100% !important; table-layout: fixed; }
  #main .list-kanban-container { overflow-x: auto !important; scroll-snap-type: x mandatory; -webkit-overflow-scrolling: touch; scrollbar-width: none; }
  #main .list-kanban-container::-webkit-scrollbar { display: none; }
  #main .list-kanban th.group-header, #main .list-kanban .kanban-columns td { scroll-snap-align: start; }
  #main .list-kanban .werx-card { font-size: 13px; }
  .werx-mob-st { display: inline; margin-left: 10px; color: #2b9de6 !important; font-weight: 600; }
  .werx-dropzones { display: none !important; }
  /* вид «Дела» */
  .werx-tboard { scroll-snap-type: x mandatory; scrollbar-width: none; }
  .werx-tb-col { width: 84vw; scroll-snap-align: start; }
  /* быстрая сделка — на всю ширину */
  .werx-qd { left: 8px !important; right: 8px !important; width: auto !important; top: 70px !important; max-height: calc(100vh - 90px); overflow: auto; }
  /* карточка сделки */
  .werx-stagebar { overflow-x: auto; scrollbar-width: none; padding-bottom: 2px; -webkit-overflow-scrolling: touch; }
  .werx-stagebar::-webkit-scrollbar { display: none; }
  .werx-stagebar .werx-st { flex: none !important; min-width: 128px; }
  .werx-deal-grid { grid-template-columns: minmax(0, 1fr) !important; gap: 10px !important; }
  .werx-deal-left, .werx-deal-right { min-width: 0; }
  .werx-kv { flex-wrap: wrap; } .werx-kv span { min-width: 0; }
  #main .page-header .breadcrumb-item, #main .page-header .header-title span { white-space: normal !important; overflow-wrap: anywhere; }
  .werx-tabs { flex-wrap: nowrap !important; overflow-x: auto; white-space: nowrap; scrollbar-width: none; }
  .werx-tabs::-webkit-scrollbar { display: none; }
  .werx-tabs a { flex: none; }
  .werx-ic a { width: 40px; height: 40px; font-size: 16px; }
  .werx-sum-row { flex-wrap: wrap; gap: 8px; }
  .werx-task-row { flex-direction: column; }
  .werx-msg-send { grid-template-columns: 1fr; }
  .werx-sep-feed { flex-direction: column; align-items: flex-start; }
  .werx-feed-f { overflow-x: auto; flex-wrap: nowrap; max-width: 100%; scrollbar-width: none; }
  .werx-feed-f a { flex: none; }
  .werx-todo-b { display: flex; flex-wrap: wrap; gap: 6px; }
  /* окна — на весь экран */
  .werx-modal { align-items: flex-end !important; padding: 0 !important; }
  .werx-modal-box { width: 100% !important; max-width: none !important; max-height: 92vh; overflow-y: auto; border-radius: 16px 16px 0 0 !important; padding: 18px 16px 24px !important; }
  .werx-modal-box .btn { min-height: 42px; }
  .werx-pop { left: 8px !important; right: 8px !important; width: auto !important; }
  /* главная */
  .werx-kpi { grid-template-columns: repeat(2, 1fr) !important; gap: 8px; }
  .werx-kpi b { font-size: 18px; }
  .werx-fn-top { flex-direction: column; align-items: flex-start; }
  .werx-fn-per { overflow-x: auto; white-space: nowrap; max-width: 100%; }
  .werx-mgr { display: block; overflow-x: auto; white-space: nowrap; }
  /* сделки клиента */
  .werx-cd-row { grid-template-columns: 1fr auto; }
  .werx-cd-bar { grid-column: 1 / -1; order: 3; }
}
/* выбор стадии снизу экрана */
.werx-sheet-st { display: flex; align-items: center; gap: 10px; padding: 12px 10px; border-radius: 10px; color: #1d2b36 !important; text-decoration: none !important; font-size: 15px; cursor: pointer; }
.werx-sheet-st:hover { background: #f1f5f8; }
.werx-sheet-st.cur { background: #eef6fb; font-weight: 600; }
.werx-sheet-st i { width: 12px; height: 12px; border-radius: 50%; }

.werx-o-disc { margin: 10px 0 4px; padding: 10px 12px; background: #f6f8fa; border-radius: 10px; }
.werx-o-disc label { font-size: 12px; color: #6b7785; font-weight: 400; }
.werx-o-disc .werx-row { gap: 6px; align-items: center; }
.werx-o-dpct { max-width: 130px; }
.werx-o-off { display: block; color: #2e9b6b; font-size: 11px; }

.werx-o-search { position: relative; margin-bottom: 8px; }
.werx-o-res { position: absolute; left: 0; right: 0; top: 100%; z-index: 30; background: #fff; border-radius: 8px; box-shadow: 0 8px 24px rgba(0,0,0,.18); max-height: 320px; overflow-y: auto; }
.werx-o-res:empty { display: none; }
.werx-o-res a { display: flex; gap: 10px; align-items: baseline; padding: 8px 12px; cursor: pointer; color: #1d2b36 !important; text-decoration: none !important; border-bottom: 1px solid #f0f2f4; }
.werx-o-res a span { flex: 1; min-width: 0; }
.werx-o-res a small { color: #8a96a0; margin-left: 4px; }
.werx-o-res a b { white-space: nowrap; }
.werx-o-res a em { font-style: normal; font-size: 11px; color: #d93a35; white-space: nowrap; }
.werx-o-res a.hl, .werx-o-res a:hover { background: #eef6fb; }
.werx-o-none { padding: 10px 12px; color: #8a96a0; }

.werx-o-search .werx-row { gap: 6px; }
.werx-o-search .werx-o-q { flex: 1; min-width: 0; }
.werx-o-all { white-space: nowrap; }

.werx-dt-in.werx-dt-txt { width: 100%; max-width: 360px; }

.werx-next-box .btn-block { margin-top: 8px; min-height: 42px; font-weight: 600; }
.werx-next-box { max-width: 440px; }

.list-kanban[data-scope="Opportunity"] th[data-name="Assembly"] > div:first-child { background: #e0b400 !important; }

/* «Показать ещё» в колонке канбана */
.list-kanban .show-more { text-align: center; padding: 4px 6px 10px 0; }
.list-kanban .show-more a.werx-more:not(.hidden) { display: block; width: 100%; padding: 9px 10px; border-radius: 10px; background: rgba(255,255,255,.9); color: #0479a3 !important; font-weight: 600; font-size: 13px; text-decoration: none !important; box-shadow: 0 2px 8px rgba(6,18,40,.15); }
.list-kanban .show-more a.werx-more:hover { background: #fff; }

/* Доставка ТК */
.werx-tk-new { display: inline-block; margin: 8px 0 2px; font-weight: 600; cursor: pointer; }
.werx-tk-card { margin: 8px 0 4px; padding: 8px 10px; border: 1px solid #cfe3f7; background: #f3f9ff; border-radius: 8px; }
.werx-tk-h { font-size: 13px; }
.werx-tk-a { display: flex; flex-wrap: wrap; gap: 4px 12px; margin-top: 4px; font-size: 12px; }
.werx-tk-a a { cursor: pointer; }
.werx-tk-box { max-width: 760px; }
.werx-tk-sec { border-top: 1px solid #eef1f4; padding: 10px 0 6px; }
.werx-tk-sec .werx-sub-t { margin-bottom: 6px; }
.werx-tk-tks { display: flex; gap: 6px; flex-wrap: wrap; margin: 6px 0 4px; }
.werx-tk-tks span { padding: 3px 10px; border-radius: 14px; font-size: 12px; border: 1px solid #d7dde3; color: #8a96a3; }
.werx-tk-tks span.on { background: #2f80ed; border-color: #2f80ed; color: #fff; }
.werx-tk-warn { background: #fff6e5; border: 1px solid #ffd58a; border-radius: 8px; padding: 7px 10px; margin: 6px 0; font-size: 12.5px; }
.werx-tk-hint { color: #6b7785; font-size: 12.5px; margin: 4px 0; }
.werx-tk-pl { width: 100%; border-collapse: collapse; margin-top: 4px; }
.werx-tk-pl th { font-size: 11px; color: #6b7785; font-weight: 400; padding: 2px 3px; }
.werx-tk-pl td { padding: 2px 3px; }
.werx-tk-pl input { padding: 4px 6px; height: 30px; }
.werx-tk-pl tr.werx-tk-pn td { font-size: 11px; color: #8a96a3; padding-top: 0; }
.werx-tk-del { cursor: pointer; color: #c0392b; }
.werx-tk-plb { display: flex; justify-content: space-between; align-items: center; margin-top: 4px; font-size: 12.5px; }
.werx-tk-plb a { cursor: pointer; }
.werx-tk-tot { color: #1d2b36; font-weight: 600; }
.werx-tk-city { position: relative; }
.werx-tk-sug { position: absolute; z-index: 5; left: 0; right: 0; top: 100%; background: #fff; border: 1px solid #d7dde3; border-radius: 6px; box-shadow: 0 6px 18px rgba(0,0,0,.12); max-height: 220px; overflow: auto; }
.werx-tk-sug a, .werx-tk-sug span { display: block; padding: 6px 10px; cursor: pointer; font-size: 13px; }
.werx-tk-sug a:hover { background: #f3f9ff; }
.werx-tk-term, .werx-tk-addr { margin: 4px 0 2px; }
.werx-tk-q { background: #effaf1; border: 1px solid #b8e6c1; border-radius: 8px; padding: 8px 10px; margin: 8px 0; font-size: 13px; }
.werx-tk-q b:first-child { font-size: 18px; }
@media (max-width: 768px) {
  .werx-tk-pl th { font-size: 10px; }
  .werx-tk-pl input { padding: 3px 4px; font-size: 13px; }
  .werx-tk-plb { flex-direction: column; align-items: flex-start; gap: 4px; }
}