/* ======================================================================
   СКИНЫ — внешний вид доски, который сотрудник выбирает себе сам
   (меню «Ещё» → «Вид» → «оформление»)

   Скин меняет только оформление: разметка и поведение доски те же.
   Класс kb-skin-<имя> ставится на <html>, а не на корень доски:
   окна, подсказки обучения и всплывающие сообщения живут в body, вне
   корня, и скин должен доставать до них.

   Почему в селекторах кнопок стоит #kanban-app-root и !important:
   основной файл задает кнопкам цвет правилом «#kanban-app-root .kb-btn»
   с !important (защита от темы сайта). Перебить его можно только
   правилом того же вида и большего веса.

   Значения записаны напрямую, без переменных — как в корпоративной теме:
   Edge Legacy и Internet Explorer переменные не понимают.
   ====================================================================== */


/* ======================================================================
   ПЛОСКИЙ
   Без теней, наклонов и подложек. Рамка в 1 px, одно скругление 2 px,
   цвета фирменного стандарта: синий #0079C2, темно-синий #003366
   ====================================================================== */

html.kb-skin-flat #kanban-app-root { background: #f3f6f9; color: #0f2740; }
html.kb-skin-flat .kb-modal-overlay { background: rgba(15, 39, 64, .5); color: #0f2740; }

html.kb-skin-flat .kb-toolbar {
    background: #ffffff;
    border-radius: 0;
    box-shadow: none;
    border-bottom: 1px solid #d5dee7;
}
html.kb-skin-flat #kanban-app-root .kb-toolbar select,
html.kb-skin-flat #kanban-app-root .kb-toolbar input {
    border: 1px solid #c3cfdb;
    border-radius: 2px;
    background: #ffffff;
    color: #0f2740;
}

/* Кнопки */
html.kb-skin-flat #kanban-app-root .kb-btn,
html.kb-skin-flat .kb-modal-overlay .kb-btn,
html.kb-skin-flat .kb-tour-tip .kb-btn {
    background: #0079c2 !important;
    color: #ffffff !important;
    border: 1px solid #0079c2 !important;
    border-radius: 2px;
}
html.kb-skin-flat #kanban-app-root .kb-btn:hover,
html.kb-skin-flat .kb-modal-overlay .kb-btn:hover,
html.kb-skin-flat .kb-tour-tip .kb-btn:hover { background: #005f99 !important; border-color: #005f99 !important; }
html.kb-skin-flat #kanban-app-root .kb-btn.kb-btn-secondary,
html.kb-skin-flat .kb-modal-overlay .kb-btn.kb-btn-secondary,
html.kb-skin-flat .kb-tour-tip .kb-btn.kb-btn-secondary {
    background: #ffffff !important;
    color: #0f2740 !important;
    border: 1px solid #c3cfdb !important;
}
html.kb-skin-flat #kanban-app-root .kb-btn.kb-btn-secondary:hover,
html.kb-skin-flat .kb-modal-overlay .kb-btn.kb-btn-secondary:hover,
html.kb-skin-flat .kb-tour-tip .kb-btn.kb-btn-secondary:hover { background: #eef3f8 !important; border-color: #9fb1c3 !important; }
html.kb-skin-flat #kanban-app-root .kb-btn.kb-btn-danger,
html.kb-skin-flat .kb-modal-overlay .kb-btn.kb-btn-danger { background: #c8003d !important; border-color: #c8003d !important; color: #ffffff !important; }
html.kb-skin-flat #kanban-app-root .kb-btn.kb-btn-success,
html.kb-skin-flat .kb-modal-overlay .kb-btn.kb-btn-success { background: #2e7d32 !important; border-color: #2e7d32 !important; color: #ffffff !important; }

/* Пункты меню «Ещё» — строки списка, а не кнопки */
html.kb-skin-flat #kanban-app-root .kb-toolbar .kb-more-menu .kb-btn,
html.kb-skin-flat #kanban-app-root .kb-toolbar .kb-more-menu .kb-btn.kb-btn-secondary {
    background: transparent !important;
    color: #0f2740 !important;
    border: 0 !important;
}
html.kb-skin-flat #kanban-app-root .kb-toolbar .kb-more-menu .kb-btn:hover,
html.kb-skin-flat #kanban-app-root .kb-toolbar .kb-more-menu .kb-btn.kb-btn-secondary:hover { background: #eef3f8 !important; }
html.kb-skin-flat .kb-more-menu,
html.kb-skin-flat .kb-export-dropdown {
    border: 1px solid #c3cfdb;
    border-radius: 2px;
    box-shadow: none;
}
html.kb-skin-flat .kb-more-check:hover,
html.kb-skin-flat .kb-export-dropdown a:hover { background: #eef3f8; }

/* Колонки: без подложки, заголовок подчеркнут темно-синей линией */
html.kb-skin-flat .kb-column {
    background: transparent;
    border-radius: 0;
}
html.kb-skin-flat .kb-column-header {
    color: #0f2740;
    border-bottom: 2px solid #003366;
    margin-bottom: 8px;
}

/* Карточки */
html.kb-skin-flat .kb-card {
    background: #ffffff;
    border: 1px solid #d5dee7;
    border-radius: 2px;
    box-shadow: none;
}
html.kb-skin-flat .kb-card:hover { background: #ffffff; border-color: #9fb1c3; }
html.kb-skin-flat .kb-card.kb-dragging {
    transform: none;
    opacity: 1;
    box-shadow: none;
    border: 2px solid #0079c2;
}
/* Просрочка — одной красной датой, без заливки и полосы */
html.kb-skin-flat .kb-card.kb-overdue { background: #ffffff; border-color: #d5dee7; }
html.kb-skin-flat .kb-card.kb-overdue:hover { background: #ffffff; border-color: #9fb1c3; }
html.kb-skin-flat .kb-card.kb-overdue .kb-card-title { color: #0f2740; }
html.kb-skin-flat .kb-due-badge { background: transparent; padding: 0; color: #5a6e83; }
html.kb-skin-flat .kb-due-badge.overdue { background: transparent; color: #c8003d; font-weight: 700; }
html.kb-skin-flat .kb-tag-pill { border-radius: 2px; padding: 1px 6px; }
html.kb-skin-flat .kb-assignee-chip { background: #e4ebf2; color: #003366; }
html.kb-skin-flat .kb-assignee-chip.kb-responsible { background: #003366; color: #ffffff; box-shadow: none; border: 0; }
html.kb-skin-flat .kb-assignee-more { background: #e4ebf2; color: #5a6e83; }
html.kb-skin-flat .kb-checklist-badge { background: transparent; color: #5a6e83; padding: 0; }
html.kb-skin-flat .kb-checklist-badge.complete { background: transparent; color: #2e7d32; }
html.kb-skin-flat .kb-role-badge,
html.kb-skin-flat .kb-widget,
html.kb-skin-flat .kb-widget-chip,
html.kb-skin-flat .kb-member-chip,
html.kb-skin-flat .kb-comp-status { border-radius: 2px; }

/* Окна */
html.kb-skin-flat .kb-modal { border-radius: 2px; box-shadow: none; }
html.kb-skin-flat .kb-modal h2 { color: #0f2740; }
html.kb-skin-flat .kb-field label { text-transform: none; font-weight: 600; color: #5a6e83; }
html.kb-skin-flat .kb-field input[type=text],
html.kb-skin-flat .kb-field input[type=date],
html.kb-skin-flat .kb-field select,
html.kb-skin-flat .kb-field textarea { border: 1px solid #c3cfdb; border-radius: 2px; }
html.kb-skin-flat .kb-tab.active { color: #0079c2; border-bottom-color: #0079c2; }
html.kb-skin-flat .kb-toast { background: #0f2740; border-radius: 2px; box-shadow: none; }


/* ======================================================================
   В ДУХЕ MICROSOFT 365
   Спокойный серый фон, белые карточки с мягкой тенью, скругление 4–8 px,
   синий #0F6CBD
   ====================================================================== */

html.kb-skin-fluent #kanban-app-root,
html.kb-skin-fluent .kb-modal-overlay {
    font-family: "Segoe UI", -apple-system, BlinkMacSystemFont, Roboto, "Helvetica Neue", "Segoe UI Emoji", "Segoe UI Symbol", "Apple Color Emoji", sans-serif;
    color: #242424;
}
html.kb-skin-fluent #kanban-app-root { background: #fafafa; }
html.kb-skin-fluent .kb-modal-overlay { background: rgba(0, 0, 0, .4); }

html.kb-skin-fluent .kb-toolbar {
    background: #ffffff;
    border-radius: 0;
    border-bottom: 1px solid #e0e0e0;
    box-shadow: 0 1px 2px rgba(0, 0, 0, .06);
}
html.kb-skin-fluent #kanban-app-root .kb-toolbar select,
html.kb-skin-fluent #kanban-app-root .kb-toolbar input {
    border: 1px solid #d1d1d1;
    border-bottom-color: #616161;
    border-radius: 4px;
    background: #ffffff;
    color: #242424;
}

html.kb-skin-fluent #kanban-app-root .kb-btn,
html.kb-skin-fluent .kb-modal-overlay .kb-btn,
html.kb-skin-fluent .kb-tour-tip .kb-btn {
    background: #0f6cbd !important;
    color: #ffffff !important;
    border: 1px solid #0f6cbd !important;
    border-radius: 4px;
}
html.kb-skin-fluent #kanban-app-root .kb-btn:hover,
html.kb-skin-fluent .kb-modal-overlay .kb-btn:hover,
html.kb-skin-fluent .kb-tour-tip .kb-btn:hover { background: #115ea3 !important; border-color: #115ea3 !important; }
html.kb-skin-fluent #kanban-app-root .kb-btn.kb-btn-secondary,
html.kb-skin-fluent .kb-modal-overlay .kb-btn.kb-btn-secondary,
html.kb-skin-fluent .kb-tour-tip .kb-btn.kb-btn-secondary {
    background: #ffffff !important;
    color: #242424 !important;
    border: 1px solid #d1d1d1 !important;
}
html.kb-skin-fluent #kanban-app-root .kb-btn.kb-btn-secondary:hover,
html.kb-skin-fluent .kb-modal-overlay .kb-btn.kb-btn-secondary:hover,
html.kb-skin-fluent .kb-tour-tip .kb-btn.kb-btn-secondary:hover { background: #f5f5f5 !important; border-color: #c7c7c7 !important; }
html.kb-skin-fluent #kanban-app-root .kb-btn.kb-btn-danger,
html.kb-skin-fluent .kb-modal-overlay .kb-btn.kb-btn-danger { background: #c50f1f !important; border-color: #c50f1f !important; color: #ffffff !important; }
html.kb-skin-fluent #kanban-app-root .kb-btn.kb-btn-success,
html.kb-skin-fluent .kb-modal-overlay .kb-btn.kb-btn-success { background: #107c10 !important; border-color: #107c10 !important; color: #ffffff !important; }

html.kb-skin-fluent #kanban-app-root .kb-toolbar .kb-more-menu .kb-btn,
html.kb-skin-fluent #kanban-app-root .kb-toolbar .kb-more-menu .kb-btn.kb-btn-secondary {
    background: transparent !important;
    color: #242424 !important;
    border: 0 !important;
    border-radius: 4px;
}
html.kb-skin-fluent #kanban-app-root .kb-toolbar .kb-more-menu .kb-btn:hover,
html.kb-skin-fluent #kanban-app-root .kb-toolbar .kb-more-menu .kb-btn.kb-btn-secondary:hover { background: #f5f5f5 !important; }
html.kb-skin-fluent .kb-more-menu,
html.kb-skin-fluent .kb-export-dropdown {
    border: 0;
    border-radius: 8px;
    box-shadow: 0 0 2px rgba(0, 0, 0, .12), 0 8px 16px rgba(0, 0, 0, .14);
}
html.kb-skin-fluent .kb-more-check:hover,
html.kb-skin-fluent .kb-export-dropdown a:hover { background: #f5f5f5; }

html.kb-skin-fluent .kb-column { background: #f0f0f0; border-radius: 8px; }
html.kb-skin-fluent .kb-column-header { color: #242424; font-weight: 600; }

html.kb-skin-fluent .kb-card {
    background: #ffffff;
    border: 0;
    border-radius: 8px;
    padding: 12px;
    box-shadow: 0 0 2px rgba(0, 0, 0, .12), 0 2px 4px rgba(0, 0, 0, .14);
}
html.kb-skin-fluent .kb-card:hover { background: #ffffff; box-shadow: 0 0 2px rgba(0, 0, 0, .12), 0 4px 8px rgba(0, 0, 0, .14); }
html.kb-skin-fluent .kb-card.kb-dragging {
    transform: none;
    opacity: 1;
    box-shadow: 0 0 2px rgba(0, 0, 0, .12), 0 14px 28px rgba(0, 0, 0, .24);
}
html.kb-skin-fluent .kb-card.kb-overdue { background: #ffffff; }
html.kb-skin-fluent .kb-card.kb-overdue:hover { background: #ffffff; }
html.kb-skin-fluent .kb-card.kb-overdue .kb-card-title { color: #242424; }
html.kb-skin-fluent .kb-due-badge { background: transparent; color: #616161; padding: 2px 0; }
html.kb-skin-fluent .kb-due-badge.overdue { background: #fdf3f4; color: #b10e1c; padding: 2px 6px; font-weight: 600; }
html.kb-skin-fluent .kb-tag-pill { border-radius: 4px; }
html.kb-skin-fluent .kb-assignee-chip { background: #ebf3fc; color: #0f6cbd; }
html.kb-skin-fluent .kb-assignee-chip.kb-responsible { background: #0f6cbd; color: #ffffff; box-shadow: none; border: 0; }
html.kb-skin-fluent .kb-assignee-more { background: #f0f0f0; color: #616161; }
html.kb-skin-fluent .kb-checklist-badge { background: transparent; color: #616161; padding: 0; }
html.kb-skin-fluent .kb-checklist-badge.complete { background: transparent; color: #107c10; }
html.kb-skin-fluent .kb-widget { border-radius: 8px; border-color: #e0e0e0; }
html.kb-skin-fluent .kb-widget-chip,
html.kb-skin-fluent .kb-role-badge,
html.kb-skin-fluent .kb-comp-status { border-radius: 4px; }

html.kb-skin-fluent .kb-modal {
    border-radius: 8px;
    box-shadow: 0 0 8px rgba(0, 0, 0, .12), 0 32px 64px rgba(0, 0, 0, .14);
}
html.kb-skin-fluent .kb-modal h2 { font-size: 20px; font-weight: 600; color: #242424; }
html.kb-skin-fluent .kb-field label { text-transform: none; font-size: 13px; font-weight: 600; color: #242424; }
html.kb-skin-fluent .kb-field input[type=text],
html.kb-skin-fluent .kb-field input[type=date],
html.kb-skin-fluent .kb-field select,
html.kb-skin-fluent .kb-field textarea {
    border: 1px solid #d1d1d1;
    border-bottom-color: #616161;
    border-radius: 4px;
}
html.kb-skin-fluent .kb-tab { color: #616161; }
html.kb-skin-fluent .kb-tab.active { color: #242424; border-bottom: 3px solid #0f6cbd; }
html.kb-skin-fluent .kb-toast {
    background: #ffffff;
    color: #242424;
    border-radius: 8px;
    box-shadow: 0 0 2px rgba(0, 0, 0, .12), 0 8px 16px rgba(0, 0, 0, .14);
}
html.kb-skin-fluent .kb-toast:hover { background: #f5f5f5; }


/* ======================================================================
   В ДУХЕ GOOGLE
   Светло-голубой фон, крупные скругления, кнопки-«капсулы»,
   синий #0B57D0 и тоновые кнопки #D3E3FD
   ====================================================================== */

html.kb-skin-material #kanban-app-root,
html.kb-skin-material .kb-modal-overlay {
    font-family: "Google Sans", Roboto, Arial, "Segoe UI Emoji", "Segoe UI Symbol", "Apple Color Emoji", sans-serif;
    color: #1f1f1f;
}
html.kb-skin-material #kanban-app-root { background: #f8fafd; }
html.kb-skin-material .kb-modal-overlay { background: rgba(0, 0, 0, .32); }

html.kb-skin-material .kb-toolbar {
    background: #f8fafd;
    border-radius: 0;
    box-shadow: none;
}
html.kb-skin-material #kanban-app-root .kb-toolbar select,
html.kb-skin-material #kanban-app-root .kb-toolbar input {
    border: 1px solid #747775;
    border-radius: 8px;
    background: #ffffff;
    color: #1f1f1f;
}

html.kb-skin-material #kanban-app-root .kb-btn,
html.kb-skin-material .kb-modal-overlay .kb-btn,
html.kb-skin-material .kb-tour-tip .kb-btn {
    background: #0b57d0 !important;
    color: #ffffff !important;
    border: 0 !important;
    border-radius: 20px;
    font-weight: 500;
}
html.kb-skin-material #kanban-app-root .kb-btn:hover,
html.kb-skin-material .kb-modal-overlay .kb-btn:hover,
html.kb-skin-material .kb-tour-tip .kb-btn:hover { background: #0842a0 !important; }
html.kb-skin-material #kanban-app-root .kb-btn.kb-btn-secondary,
html.kb-skin-material .kb-modal-overlay .kb-btn.kb-btn-secondary,
html.kb-skin-material .kb-tour-tip .kb-btn.kb-btn-secondary {
    background: #d3e3fd !important;
    color: #041e49 !important;
}
html.kb-skin-material #kanban-app-root .kb-btn.kb-btn-secondary:hover,
html.kb-skin-material .kb-modal-overlay .kb-btn.kb-btn-secondary:hover,
html.kb-skin-material .kb-tour-tip .kb-btn.kb-btn-secondary:hover { background: #c2d7fb !important; }
html.kb-skin-material #kanban-app-root .kb-btn.kb-btn-danger,
html.kb-skin-material .kb-modal-overlay .kb-btn.kb-btn-danger { background: #b3261e !important; color: #ffffff !important; }
html.kb-skin-material #kanban-app-root .kb-btn.kb-btn-success,
html.kb-skin-material .kb-modal-overlay .kb-btn.kb-btn-success { background: #146c2e !important; color: #ffffff !important; }

html.kb-skin-material #kanban-app-root .kb-toolbar .kb-more-menu .kb-btn,
html.kb-skin-material #kanban-app-root .kb-toolbar .kb-more-menu .kb-btn.kb-btn-secondary {
    background: transparent !important;
    color: #1f1f1f !important;
    border-radius: 0;
}
html.kb-skin-material #kanban-app-root .kb-toolbar .kb-more-menu .kb-btn:hover,
html.kb-skin-material #kanban-app-root .kb-toolbar .kb-more-menu .kb-btn.kb-btn-secondary:hover { background: #e9eef6 !important; }
html.kb-skin-material .kb-more-menu,
html.kb-skin-material .kb-export-dropdown {
    background: #f0f4f9;
    border: 0;
    border-radius: 4px;
    box-shadow: 0 1px 2px rgba(0, 0, 0, .3), 0 2px 6px 2px rgba(0, 0, 0, .15);
}
html.kb-skin-material .kb-more-check:hover,
html.kb-skin-material .kb-export-dropdown a:hover { background: #e9eef6; }

html.kb-skin-material .kb-column { background: #f0f4f9; border-radius: 16px; }
html.kb-skin-material .kb-column-header { color: #1f1f1f; font-weight: 500; }

html.kb-skin-material .kb-card {
    background: #ffffff;
    border: 0;
    border-radius: 12px;
    box-shadow: none;
}
html.kb-skin-material .kb-card:hover { background: #ffffff; box-shadow: 0 1px 2px rgba(0, 0, 0, .3), 0 1px 3px 1px rgba(0, 0, 0, .15); }
html.kb-skin-material .kb-card.kb-dragging {
    transform: none;
    opacity: 1;
    box-shadow: 0 1px 3px rgba(0, 0, 0, .3), 0 4px 8px 3px rgba(0, 0, 0, .15);
}
html.kb-skin-material .kb-card.kb-overdue { background: #ffffff; }
html.kb-skin-material .kb-card.kb-overdue:hover { background: #ffffff; }
html.kb-skin-material .kb-card.kb-overdue .kb-card-title { color: #1f1f1f; }
html.kb-skin-material .kb-due-badge { background: transparent; color: #444746; padding: 2px 0; }
html.kb-skin-material .kb-due-badge.overdue { background: #f9dedc; color: #410e0b; padding: 2px 8px; border-radius: 8px; }
html.kb-skin-material .kb-tag-pill { border-radius: 8px; font-weight: 500; }
html.kb-skin-material .kb-assignee-chip { background: #c2e7ff; color: #001d35; }
html.kb-skin-material .kb-assignee-chip.kb-responsible { background: #0b57d0; color: #ffffff; box-shadow: none; border: 0; }
html.kb-skin-material .kb-assignee-more { background: #e9eef6; color: #444746; }
html.kb-skin-material .kb-checklist-badge { background: transparent; color: #444746; padding: 0; }
html.kb-skin-material .kb-checklist-badge.complete { background: transparent; color: #146c2e; }
html.kb-skin-material .kb-widget { border: 0; border-radius: 16px; }
html.kb-skin-material .kb-widget-chip,
html.kb-skin-material .kb-member-chip,
html.kb-skin-material .kb-comp-status,
html.kb-skin-material .kb-role-badge { border-radius: 8px; }

html.kb-skin-material .kb-modal { border-radius: 28px; box-shadow: none; }
html.kb-skin-material .kb-modal h2 { font-size: 22px; font-weight: 400; color: #1f1f1f; }
html.kb-skin-material .kb-field label { text-transform: none; font-weight: 500; color: #444746; }
html.kb-skin-material .kb-field input[type=text],
html.kb-skin-material .kb-field input[type=date],
html.kb-skin-material .kb-field select,
html.kb-skin-material .kb-field textarea { border: 1px solid #747775; border-radius: 4px; }
html.kb-skin-material .kb-field input[type=text]:focus,
html.kb-skin-material .kb-field input[type=date]:focus,
html.kb-skin-material .kb-field select:focus,
html.kb-skin-material .kb-field textarea:focus { outline: 2px solid #0b57d0; outline-offset: -1px; }
html.kb-skin-material .kb-tab { color: #444746; font-weight: 500; }
html.kb-skin-material .kb-tab.active { color: #0b57d0; border-bottom: 3px solid #0b57d0; }
html.kb-skin-material .kb-toast { background: #303030; color: #f2f2f2; border-radius: 4px; }


/* ======================================================================
   В ДУХЕ SAP
   Серый фон, белые карточки со скруглением 12 px, заголовок задачи —
   синей ссылкой, статус — словом и цветом
   ====================================================================== */

html.kb-skin-sap #kanban-app-root,
html.kb-skin-sap .kb-modal-overlay {
    font-family: "72", "72full", Arial, Helvetica, "Segoe UI Emoji", "Segoe UI Symbol", "Apple Color Emoji", sans-serif;
    color: #1d2d3e;
}
html.kb-skin-sap #kanban-app-root { background: #f5f6f7; }
html.kb-skin-sap .kb-modal-overlay { background: rgba(29, 45, 62, .45); }

html.kb-skin-sap .kb-toolbar {
    background: #ffffff;
    border-radius: 0;
    box-shadow: 0 1px 0 #d9d9d9;
}
html.kb-skin-sap #kanban-app-root .kb-toolbar select,
html.kb-skin-sap #kanban-app-root .kb-toolbar input {
    border: 1px solid #bcc3ca;
    border-radius: 6px;
    background: #ffffff;
    color: #1d2d3e;
}

html.kb-skin-sap #kanban-app-root .kb-btn,
html.kb-skin-sap .kb-modal-overlay .kb-btn,
html.kb-skin-sap .kb-tour-tip .kb-btn {
    background: #0070f2 !important;
    color: #ffffff !important;
    border: 1px solid #0070f2 !important;
    border-radius: 8px;
}
html.kb-skin-sap #kanban-app-root .kb-btn:hover,
html.kb-skin-sap .kb-modal-overlay .kb-btn:hover,
html.kb-skin-sap .kb-tour-tip .kb-btn:hover { background: #0064d9 !important; border-color: #0064d9 !important; }
html.kb-skin-sap #kanban-app-root .kb-btn.kb-btn-secondary,
html.kb-skin-sap .kb-modal-overlay .kb-btn.kb-btn-secondary,
html.kb-skin-sap .kb-tour-tip .kb-btn.kb-btn-secondary {
    background: #ffffff !important;
    color: #0064d9 !important;
    border: 1px solid #bcc3ca !important;
}
html.kb-skin-sap #kanban-app-root .kb-btn.kb-btn-secondary:hover,
html.kb-skin-sap .kb-modal-overlay .kb-btn.kb-btn-secondary:hover,
html.kb-skin-sap .kb-tour-tip .kb-btn.kb-btn-secondary:hover { background: #eaecee !important; }
html.kb-skin-sap #kanban-app-root .kb-btn.kb-btn-danger,
html.kb-skin-sap .kb-modal-overlay .kb-btn.kb-btn-danger { background: #ffffff !important; color: #aa0808 !important; border-color: #f53232 !important; }
html.kb-skin-sap #kanban-app-root .kb-btn.kb-btn-danger:hover,
html.kb-skin-sap .kb-modal-overlay .kb-btn.kb-btn-danger:hover { background: #ffd6e9 !important; }
html.kb-skin-sap #kanban-app-root .kb-btn.kb-btn-success,
html.kb-skin-sap .kb-modal-overlay .kb-btn.kb-btn-success { background: #f5fae5 !important; color: #256f3a !important; border-color: #256f3a !important; }

html.kb-skin-sap #kanban-app-root .kb-toolbar .kb-more-menu .kb-btn,
html.kb-skin-sap #kanban-app-root .kb-toolbar .kb-more-menu .kb-btn.kb-btn-secondary {
    background: transparent !important;
    color: #1d2d3e !important;
    border: 0 !important;
}
html.kb-skin-sap #kanban-app-root .kb-toolbar .kb-more-menu .kb-btn:hover,
html.kb-skin-sap #kanban-app-root .kb-toolbar .kb-more-menu .kb-btn.kb-btn-secondary:hover { background: #eaecee !important; }
html.kb-skin-sap .kb-more-menu,
html.kb-skin-sap .kb-export-dropdown {
    border: 0;
    border-radius: 12px;
    box-shadow: 0 0 2px rgba(34, 53, 72, .16), 0 8px 16px rgba(34, 53, 72, .16);
}
html.kb-skin-sap .kb-more-check:hover,
html.kb-skin-sap .kb-export-dropdown a:hover { background: #eaecee; }

html.kb-skin-sap .kb-column { background: transparent; border-radius: 0; }
html.kb-skin-sap .kb-column-header { color: #1d2d3e; }
html.kb-skin-sap .kb-column-count { color: #556b82; }

html.kb-skin-sap .kb-card {
    background: #ffffff;
    border: 0;
    border-radius: 12px;
    padding: 12px 14px;
    box-shadow: 0 0 2px rgba(34, 53, 72, .2), 0 2px 4px rgba(34, 53, 72, .2);
}
html.kb-skin-sap .kb-card:hover { background: #ffffff; box-shadow: 0 0 2px rgba(34, 53, 72, .2), 0 4px 8px rgba(34, 53, 72, .2); }
html.kb-skin-sap .kb-card.kb-dragging {
    transform: none;
    opacity: 1;
    box-shadow: 0 0 0 2px #0064d9, 0 8px 16px rgba(34, 53, 72, .2);
}
html.kb-skin-sap .kb-card-title { color: #0064d9; font-weight: 700; }
html.kb-skin-sap .kb-card.kb-overdue { background: #ffffff; }
html.kb-skin-sap .kb-card.kb-overdue:hover { background: #ffffff; }
html.kb-skin-sap .kb-card.kb-overdue .kb-card-title { color: #0064d9; }
html.kb-skin-sap .kb-due-badge { background: transparent; color: #556b82; padding: 0; }
html.kb-skin-sap .kb-due-badge.overdue { background: transparent; color: #aa0808; font-weight: 700; }
html.kb-skin-sap .kb-tag-pill { border-radius: 4px; font-weight: 400; }
html.kb-skin-sap .kb-assignee-chip { background: #d2efff; color: #0064d9; }
html.kb-skin-sap .kb-assignee-chip.kb-responsible { background: #0064d9; color: #ffffff; box-shadow: none; border: 0; }
html.kb-skin-sap .kb-assignee-more { background: #eaecee; color: #556b82; }
html.kb-skin-sap .kb-checklist-badge { background: transparent; color: #556b82; padding: 0; }
html.kb-skin-sap .kb-checklist-badge.complete { background: transparent; color: #256f3a; }
html.kb-skin-sap .kb-comp-status { border-radius: 8px; }
html.kb-skin-sap .kb-comp-status.pending { background: #fff8d6; color: #e76500; border-color: #e76500; }
html.kb-skin-sap .kb-comp-status.approved { background: #f5fae5; color: #256f3a; border-color: #256f3a; }
html.kb-skin-sap .kb-comp-status.rework { background: #ffeaf4; color: #aa0808; border-color: #f53232; }
html.kb-skin-sap .kb-widget {
    border: 0;
    border-radius: 12px;
    box-shadow: 0 0 2px rgba(34, 53, 72, .2), 0 2px 4px rgba(34, 53, 72, .2);
}
html.kb-skin-sap .kb-widget-chip,
html.kb-skin-sap .kb-role-badge { border-radius: 6px; }

html.kb-skin-sap .kb-modal {
    border-radius: 16px;
    box-shadow: 0 0 2px rgba(34, 53, 72, .2), 0 16px 32px rgba(34, 53, 72, .2);
}
html.kb-skin-sap .kb-modal h2 { font-weight: 700; color: #1d2d3e; }
html.kb-skin-sap .kb-field label { text-transform: none; font-size: 13px; font-weight: 400; color: #556b82; }
html.kb-skin-sap .kb-field input[type=text],
html.kb-skin-sap .kb-field input[type=date],
html.kb-skin-sap .kb-field select,
html.kb-skin-sap .kb-field textarea { border: 1px solid #bcc3ca; border-radius: 6px; }
html.kb-skin-sap .kb-tab { color: #556b82; }
html.kb-skin-sap .kb-tab.active { color: #0064d9; border-bottom: 3px solid #0064d9; }
html.kb-skin-sap .kb-toast { background: #1d2d3e; border-radius: 8px; }


/* ======================================================================
   В ДУХЕ 1С
   Серые панели, Arial, жёлтая главная кнопка и жёлтое выделение,
   прямые углы и плотные строки
   ====================================================================== */

html.kb-skin-1c #kanban-app-root,
html.kb-skin-1c .kb-modal-overlay {
    font-family: Arial, Helvetica, "Segoe UI Emoji", "Segoe UI Symbol", "Apple Color Emoji", sans-serif;
    color: #333333;
}
html.kb-skin-1c #kanban-app-root { background: #ffffff; }
html.kb-skin-1c .kb-modal-overlay { background: rgba(0, 0, 0, .3); }

html.kb-skin-1c .kb-toolbar {
    background: #f2f2f2;
    border-radius: 0;
    box-shadow: none;
    border-bottom: 1px solid #d4d4d4;
}
html.kb-skin-1c #kanban-app-root .kb-toolbar select,
html.kb-skin-1c #kanban-app-root .kb-toolbar input {
    border: 1px solid #b9b9b9;
    border-radius: 2px;
    background: #ffffff;
    color: #333333;
}

html.kb-skin-1c #kanban-app-root .kb-btn,
html.kb-skin-1c .kb-modal-overlay .kb-btn,
html.kb-skin-1c .kb-tour-tip .kb-btn {
    background: #f5c80a !important;
    background: linear-gradient(#ffe57a, #f5c80a) !important;
    color: #333333 !important;
    border: 1px solid #c9a300 !important;
    border-radius: 3px;
    font-weight: 700;
}
html.kb-skin-1c #kanban-app-root .kb-btn:hover,
html.kb-skin-1c .kb-modal-overlay .kb-btn:hover,
html.kb-skin-1c .kb-tour-tip .kb-btn:hover {
    background: #f7d23a !important;
    background: linear-gradient(#ffeb99, #f7d23a) !important;
}
html.kb-skin-1c #kanban-app-root .kb-btn.kb-btn-secondary,
html.kb-skin-1c .kb-modal-overlay .kb-btn.kb-btn-secondary,
html.kb-skin-1c .kb-tour-tip .kb-btn.kb-btn-secondary,
html.kb-skin-1c #kanban-app-root .kb-btn.kb-btn-danger,
html.kb-skin-1c .kb-modal-overlay .kb-btn.kb-btn-danger,
html.kb-skin-1c #kanban-app-root .kb-btn.kb-btn-success,
html.kb-skin-1c .kb-modal-overlay .kb-btn.kb-btn-success {
    background: #ececec !important;
    background: linear-gradient(#ffffff, #e6e6e6) !important;
    color: #333333 !important;
    border: 1px solid #b9b9b9 !important;
    font-weight: 400;
}
html.kb-skin-1c #kanban-app-root .kb-btn.kb-btn-secondary:hover,
html.kb-skin-1c .kb-modal-overlay .kb-btn.kb-btn-secondary:hover,
html.kb-skin-1c .kb-tour-tip .kb-btn.kb-btn-secondary:hover,
html.kb-skin-1c #kanban-app-root .kb-btn.kb-btn-danger:hover,
html.kb-skin-1c .kb-modal-overlay .kb-btn.kb-btn-danger:hover,
html.kb-skin-1c #kanban-app-root .kb-btn.kb-btn-success:hover,
html.kb-skin-1c .kb-modal-overlay .kb-btn.kb-btn-success:hover {
    background: #f5f5f5 !important;
    background: linear-gradient(#ffffff, #f0f0f0) !important;
}
html.kb-skin-1c #kanban-app-root .kb-btn.kb-btn-danger,
html.kb-skin-1c .kb-modal-overlay .kb-btn.kb-btn-danger { color: #cc0000 !important; }

html.kb-skin-1c #kanban-app-root .kb-toolbar .kb-more-menu .kb-btn,
html.kb-skin-1c #kanban-app-root .kb-toolbar .kb-more-menu .kb-btn.kb-btn-secondary {
    background: transparent !important;
    color: #333333 !important;
    border: 0 !important;
    border-radius: 0;
    font-weight: 400;
}
html.kb-skin-1c #kanban-app-root .kb-toolbar .kb-more-menu .kb-btn:hover,
html.kb-skin-1c #kanban-app-root .kb-toolbar .kb-more-menu .kb-btn.kb-btn-secondary:hover { background: #fbeea6 !important; }
html.kb-skin-1c .kb-more-menu,
html.kb-skin-1c .kb-export-dropdown {
    border: 1px solid #b9b9b9;
    border-radius: 0;
    box-shadow: 0 2px 6px rgba(0, 0, 0, .2);
}
html.kb-skin-1c .kb-more-check:hover,
html.kb-skin-1c .kb-export-dropdown a:hover { background: #fbeea6; }

html.kb-skin-1c .kb-column {
    background: #f7f7f7;
    border: 1px solid #d4d4d4;
    border-radius: 0;
}
html.kb-skin-1c .kb-column-header {
    background: #ececec;
    border-bottom: 1px solid #d4d4d4;
    color: #333333;
    font-size: 13px;
    margin-bottom: 6px;
}

html.kb-skin-1c .kb-card {
    background: #ffffff;
    border: 1px solid #e0e0e0;
    border-radius: 0;
    box-shadow: none;
    padding: 6px 8px;
    margin-bottom: 3px;
}
html.kb-skin-1c .kb-card:hover { background: #fbeea6; }
html.kb-skin-1c .kb-card-title { font-size: 13px; margin-bottom: 4px; }
html.kb-skin-1c .kb-card.kb-dragging {
    transform: none;
    opacity: 1;
    box-shadow: none;
    background: #fbeea6;
    border: 1px dashed #c9a300;
}
html.kb-skin-1c .kb-card.kb-overdue { background: #ffffff; border-color: #e0e0e0; }
html.kb-skin-1c .kb-card.kb-overdue:hover { background: #fbeea6; }
html.kb-skin-1c .kb-card.kb-overdue .kb-card-title { color: #cc0000; }
html.kb-skin-1c .kb-due-badge { background: transparent; color: #555555; padding: 0; border-radius: 0; }
html.kb-skin-1c .kb-due-badge.overdue { background: transparent; color: #cc0000; font-weight: 700; }
html.kb-skin-1c .kb-tag-pill { border-radius: 0; font-weight: 400; padding: 0 5px; }
html.kb-skin-1c .kb-assignee-chip { background: #e8e8e8; color: #333333; border-radius: 2px; }
html.kb-skin-1c .kb-assignee-chip.kb-responsible { background: #fbeea6; color: #333333; border: 1px solid #c9a300; box-shadow: none; }
html.kb-skin-1c .kb-assignee-more { background: #e8e8e8; color: #555555; }
html.kb-skin-1c .kb-checklist-badge { background: transparent; color: #555555; padding: 0; border-radius: 0; }
html.kb-skin-1c .kb-checklist-badge.complete { background: transparent; color: #2e7d32; }
html.kb-skin-1c .kb-widget,
html.kb-skin-1c .kb-widget-chip,
html.kb-skin-1c .kb-member-chip,
html.kb-skin-1c .kb-role-badge,
html.kb-skin-1c .kb-comp-status { border-radius: 0; }

html.kb-skin-1c .kb-modal {
    border-radius: 0;
    box-shadow: 0 0 0 1px #b9b9b9, 0 4px 16px rgba(0, 0, 0, .25);
}
html.kb-skin-1c .kb-modal h2 { font-size: 20px; font-weight: 400; color: #333333; }
html.kb-skin-1c .kb-field label { text-transform: none; font-size: 13px; font-weight: 400; color: #555555; }
html.kb-skin-1c .kb-field input[type=text],
html.kb-skin-1c .kb-field input[type=date],
html.kb-skin-1c .kb-field select,
html.kb-skin-1c .kb-field textarea {
    border: 1px solid #b9b9b9;
    border-radius: 0;
    padding: 4px 6px;
    font-size: 13px;
}
html.kb-skin-1c .kb-tab {
    color: #333333;
    font-weight: 400;
    background: #ececec;
    border: 1px solid #d4d4d4;
    border-bottom: 0;
    margin-bottom: 0;
}
html.kb-skin-1c .kb-tab.active {
    color: #333333;
    font-weight: 700;
    background: #ffffff;
    border-bottom: 0;
}
html.kb-skin-1c .kb-toast {
    background: #fffbe0;
    color: #333333;
    border: 1px solid #c9a300;
    border-radius: 0;
    box-shadow: 0 2px 6px rgba(0, 0, 0, .2);
}
html.kb-skin-1c .kb-toast:hover { background: #fbeea6; }


/* ======================================================================
   В ДУХЕ DOCSVISION
   Строгая темная панель, светлые колонки-списки, заголовки разделов
   прописными, синий #2F7AC4
   ====================================================================== */

html.kb-skin-docsvision #kanban-app-root,
html.kb-skin-docsvision .kb-modal-overlay {
    font-family: "Segoe UI", Tahoma, Arial, "Segoe UI Emoji", "Segoe UI Symbol", "Apple Color Emoji", sans-serif;
    color: #2d3a45;
}
html.kb-skin-docsvision #kanban-app-root { background: #ffffff; }
html.kb-skin-docsvision .kb-modal-overlay { background: rgba(52, 73, 94, .45); }

html.kb-skin-docsvision .kb-toolbar {
    background: #34495e;
    color: #dfe6ec;
    border-radius: 0;
    box-shadow: none;
}
html.kb-skin-docsvision #kanban-app-root .kb-toolbar select,
html.kb-skin-docsvision #kanban-app-root .kb-toolbar input {
    border: 1px solid #4a6075;
    border-radius: 2px;
    background: #ffffff;
    color: #2d3a45;
}
/* Подписи на темной панели: светлые, иначе серый текст пропадает */
html.kb-skin-docsvision .kb-toolbar .kb-refresh-stamp,
html.kb-skin-docsvision .kb-toolbar .kb-auto-label,
html.kb-skin-docsvision .kb-toolbar .kb-version { color: #b7c4d0; }

html.kb-skin-docsvision #kanban-app-root .kb-btn,
html.kb-skin-docsvision .kb-modal-overlay .kb-btn,
html.kb-skin-docsvision .kb-tour-tip .kb-btn {
    background: #2f7ac4 !important;
    color: #ffffff !important;
    border: 1px solid #2f7ac4 !important;
    border-radius: 2px;
}
html.kb-skin-docsvision #kanban-app-root .kb-btn:hover,
html.kb-skin-docsvision .kb-modal-overlay .kb-btn:hover,
html.kb-skin-docsvision .kb-tour-tip .kb-btn:hover { background: #2567a8 !important; border-color: #2567a8 !important; }
html.kb-skin-docsvision #kanban-app-root .kb-btn.kb-btn-secondary,
html.kb-skin-docsvision .kb-modal-overlay .kb-btn.kb-btn-secondary,
html.kb-skin-docsvision .kb-tour-tip .kb-btn.kb-btn-secondary {
    background: #ffffff !important;
    color: #2d3a45 !important;
    border: 1px solid #b8c4cf !important;
}
html.kb-skin-docsvision #kanban-app-root .kb-btn.kb-btn-secondary:hover,
html.kb-skin-docsvision .kb-modal-overlay .kb-btn.kb-btn-secondary:hover,
html.kb-skin-docsvision .kb-tour-tip .kb-btn.kb-btn-secondary:hover { background: #eef3f8 !important; }
/* Второстепенные кнопки на самой панели — в тон темной полосе */
html.kb-skin-docsvision #kanban-app-root .kb-toolbar .kb-btn.kb-btn-secondary {
    background: #4a6075 !important;
    color: #ffffff !important;
    border: 1px solid #5d7389 !important;
}
html.kb-skin-docsvision #kanban-app-root .kb-toolbar .kb-btn.kb-btn-secondary:hover { background: #5d7389 !important; }
html.kb-skin-docsvision #kanban-app-root .kb-btn.kb-btn-danger,
html.kb-skin-docsvision .kb-modal-overlay .kb-btn.kb-btn-danger { background: #c0392b !important; border-color: #c0392b !important; color: #ffffff !important; }
html.kb-skin-docsvision #kanban-app-root .kb-btn.kb-btn-success,
html.kb-skin-docsvision .kb-modal-overlay .kb-btn.kb-btn-success { background: #27ae60 !important; border-color: #27ae60 !important; color: #ffffff !important; }

html.kb-skin-docsvision #kanban-app-root .kb-toolbar .kb-more-menu .kb-btn,
html.kb-skin-docsvision #kanban-app-root .kb-toolbar .kb-more-menu .kb-btn.kb-btn-secondary {
    background: transparent !important;
    color: #2d3a45 !important;
    border: 0 !important;
}
html.kb-skin-docsvision #kanban-app-root .kb-toolbar .kb-more-menu .kb-btn:hover,
html.kb-skin-docsvision #kanban-app-root .kb-toolbar .kb-more-menu .kb-btn.kb-btn-secondary:hover { background: #dbe7f3 !important; }
html.kb-skin-docsvision .kb-more-menu,
html.kb-skin-docsvision .kb-export-dropdown {
    border: 1px solid #b8c4cf;
    border-radius: 2px;
    box-shadow: 0 4px 12px rgba(0, 0, 0, .18);
}
html.kb-skin-docsvision .kb-more-check:hover,
html.kb-skin-docsvision .kb-export-dropdown a:hover { background: #dbe7f3; }

html.kb-skin-docsvision .kb-column {
    background: #f3f5f7;
    border: 1px solid #d6dce2;
    border-radius: 0;
}
html.kb-skin-docsvision .kb-column-header {
    color: #5b6b79;
    font-size: 11px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: .05em;
    border-bottom: 1px solid #d6dce2;
    margin-bottom: 8px;
}

html.kb-skin-docsvision .kb-card {
    background: #ffffff;
    border: 1px solid #d6dce2;
    border-radius: 2px;
    box-shadow: none;
}
html.kb-skin-docsvision .kb-card:hover { background: #dbe7f3; border-color: #b9cde0; }
html.kb-skin-docsvision .kb-card-title { font-size: 13px; }
html.kb-skin-docsvision .kb-card.kb-dragging {
    transform: none;
    opacity: 1;
    box-shadow: none;
    border: 2px solid #2f7ac4;
}
html.kb-skin-docsvision .kb-card.kb-overdue { background: #ffffff; border-color: #d6dce2; }
html.kb-skin-docsvision .kb-card.kb-overdue:hover { background: #dbe7f3; }
html.kb-skin-docsvision .kb-card.kb-overdue .kb-card-title { color: #2d3a45; font-weight: 700; }
html.kb-skin-docsvision .kb-due-badge { background: transparent; color: #5b6b79; padding: 0; }
html.kb-skin-docsvision .kb-due-badge.overdue { background: transparent; color: #c0392b; font-weight: 700; }
html.kb-skin-docsvision .kb-tag-pill { border-radius: 2px; font-weight: 400; }
html.kb-skin-docsvision .kb-assignee-chip { background: #dbe7f3; color: #2f5f8f; }
html.kb-skin-docsvision .kb-assignee-chip.kb-responsible { background: #2f7ac4; color: #ffffff; box-shadow: none; border: 0; }
html.kb-skin-docsvision .kb-assignee-more { background: #e6ebf0; color: #5b6b79; }
html.kb-skin-docsvision .kb-checklist-badge { background: transparent; color: #5b6b79; padding: 0; }
html.kb-skin-docsvision .kb-checklist-badge.complete { background: transparent; color: #27ae60; }
html.kb-skin-docsvision .kb-widget,
html.kb-skin-docsvision .kb-widget-chip,
html.kb-skin-docsvision .kb-member-chip,
html.kb-skin-docsvision .kb-role-badge,
html.kb-skin-docsvision .kb-comp-status { border-radius: 2px; }

html.kb-skin-docsvision .kb-modal {
    border-radius: 2px;
    box-shadow: 0 6px 24px rgba(0, 0, 0, .25);
}
html.kb-skin-docsvision .kb-modal h2 {
    font-size: 16px;
    font-weight: 600;
    color: #2d3a45;
    padding-bottom: 8px;
    border-bottom: 1px solid #d6dce2;
}
html.kb-skin-docsvision .kb-field label {
    font-size: 11px;
    font-weight: 600;
    letter-spacing: .05em;
    color: #5b6b79;
}
html.kb-skin-docsvision .kb-field input[type=text],
html.kb-skin-docsvision .kb-field input[type=date],
html.kb-skin-docsvision .kb-field select,
html.kb-skin-docsvision .kb-field textarea { border: 1px solid #b8c4cf; border-radius: 2px; }
html.kb-skin-docsvision .kb-tab { color: #5b6b79; }
html.kb-skin-docsvision .kb-tab.active { color: #2f7ac4; border-bottom-color: #2f7ac4; }
html.kb-skin-docsvision .kb-toast { background: #34495e; border-radius: 2px; }


/* ======================================================================
   В ДУХЕ БИТРИКС24
   Синий фон-градиент, цветные стадии-стрелки, салатовая кнопка,
   срок цветной плашкой
   ====================================================================== */

html.kb-skin-bitrix #kanban-app-root,
html.kb-skin-bitrix .kb-modal-overlay {
    font-family: "Open Sans", "Helvetica Neue", Helvetica, Arial, "Segoe UI Emoji", "Segoe UI Symbol", "Apple Color Emoji", sans-serif;
    color: #333333;
}
html.kb-skin-bitrix #kanban-app-root {
    background: #2fa3d8;
    background: linear-gradient(135deg, #1a6fb0 0%, #2fa3d8 55%, #6ccbe8 100%);
    padding: 12px;
}
html.kb-skin-bitrix .kb-modal-overlay { background: rgba(0, 0, 0, .4); }

html.kb-skin-bitrix .kb-toolbar {
    background: #ffffff;
    background: rgba(255, 255, 255, .96);
    border-radius: 2px;
    box-shadow: none;
}
/* Блоки над доской и пустое состояние лежат прямо на градиенте —
   даем им светлую подложку, чтобы текст читался */
html.kb-skin-bitrix .kb-widgets,
html.kb-skin-bitrix .kb-empty-state,
html.kb-skin-bitrix #kb-archive-hits:not(:empty) {
    background: #ffffff;
    background: rgba(255, 255, 255, .95);
    border-radius: 2px;
    padding: 6px 10px;
}
html.kb-skin-bitrix #kanban-app-root .kb-toolbar select,
html.kb-skin-bitrix #kanban-app-root .kb-toolbar input {
    border: 1px solid #c6cdd3;
    border-radius: 2px;
    background: #ffffff;
    color: #333333;
}

html.kb-skin-bitrix #kanban-app-root .kb-btn,
html.kb-skin-bitrix .kb-modal-overlay .kb-btn,
html.kb-skin-bitrix .kb-tour-tip .kb-btn {
    background: #bbed21 !important;
    color: #535c69 !important;
    border: 0 !important;
    border-radius: 2px;
    font-weight: 700;
}
html.kb-skin-bitrix #kanban-app-root .kb-btn:hover,
html.kb-skin-bitrix .kb-modal-overlay .kb-btn:hover,
html.kb-skin-bitrix .kb-tour-tip .kb-btn:hover { background: #d2f95f !important; }
html.kb-skin-bitrix #kanban-app-root .kb-btn.kb-btn-secondary,
html.kb-skin-bitrix .kb-modal-overlay .kb-btn.kb-btn-secondary,
html.kb-skin-bitrix .kb-tour-tip .kb-btn.kb-btn-secondary {
    background: #ffffff !important;
    color: #535c69 !important;
    border: 1px solid #c6cdd3 !important;
    font-weight: 600;
}
html.kb-skin-bitrix #kanban-app-root .kb-btn.kb-btn-secondary:hover,
html.kb-skin-bitrix .kb-modal-overlay .kb-btn.kb-btn-secondary:hover,
html.kb-skin-bitrix .kb-tour-tip .kb-btn.kb-btn-secondary:hover { background: #f0f2f4 !important; border-color: #a8adb4 !important; }
html.kb-skin-bitrix #kanban-app-root .kb-btn.kb-btn-danger,
html.kb-skin-bitrix .kb-modal-overlay .kb-btn.kb-btn-danger { background: #ff5752 !important; color: #ffffff !important; }
html.kb-skin-bitrix #kanban-app-root .kb-btn.kb-btn-success,
html.kb-skin-bitrix .kb-modal-overlay .kb-btn.kb-btn-success { background: #bbed21 !important; color: #535c69 !important; }

html.kb-skin-bitrix #kanban-app-root .kb-toolbar .kb-more-menu .kb-btn,
html.kb-skin-bitrix #kanban-app-root .kb-toolbar .kb-more-menu .kb-btn.kb-btn-secondary {
    background: transparent !important;
    color: #333333 !important;
    border: 0 !important;
    font-weight: 400;
}
html.kb-skin-bitrix #kanban-app-root .kb-toolbar .kb-more-menu .kb-btn:hover,
html.kb-skin-bitrix #kanban-app-root .kb-toolbar .kb-more-menu .kb-btn.kb-btn-secondary:hover { background: #eef2f4 !important; }
html.kb-skin-bitrix .kb-more-menu,
html.kb-skin-bitrix .kb-export-dropdown {
    border: 0;
    border-radius: 2px;
    box-shadow: 0 7px 21px rgba(83, 92, 105, .12), 0 -1px 6px rgba(83, 92, 105, .06);
}
html.kb-skin-bitrix .kb-more-check:hover,
html.kb-skin-bitrix .kb-export-dropdown a:hover { background: #eef2f4; }

html.kb-skin-bitrix .kb-column {
    background: #eef2f4;
    background: rgba(238, 242, 244, .96);
    border-radius: 2px;
}
/* Заголовок колонки — цветная стадия-стрелка. Цвета идут по кругу.
   Свернутую колонку не трогаем: ее заголовок стоит вертикально */
html.kb-skin-bitrix .kb-column:not(.kb-col-collapsed) .kb-column-header {
    color: #ffffff;
    background: #2fc6f6;
    padding-right: 22px;
    margin-bottom: 8px;
    -webkit-clip-path: polygon(0 0, calc(100% - 12px) 0, 100% 50%, calc(100% - 12px) 100%, 0 100%);
    clip-path: polygon(0 0, calc(100% - 12px) 0, 100% 50%, calc(100% - 12px) 100%, 0 100%);
}
html.kb-skin-bitrix .kb-column:not(.kb-col-collapsed):nth-child(4n+2) .kb-column-header { background: #55d0e0; }
html.kb-skin-bitrix .kb-column:not(.kb-col-collapsed):nth-child(4n+3) .kb-column-header { background: #ffa900; }
html.kb-skin-bitrix .kb-column:not(.kb-col-collapsed):nth-child(4n+4) .kb-column-header { background: #9dcf00; }
html.kb-skin-bitrix .kb-column:not(.kb-col-collapsed) .kb-column-count { color: #ffffff; color: rgba(255, 255, 255, .85); }

html.kb-skin-bitrix .kb-card {
    background: #ffffff;
    border: 0;
    border-radius: 2px;
    box-shadow: 0 1px 2px rgba(0, 0, 0, .08);
}
html.kb-skin-bitrix .kb-card:hover { background: #ffffff; box-shadow: 0 2px 6px rgba(0, 0, 0, .14); }
html.kb-skin-bitrix .kb-card.kb-dragging {
    transform: none;
    opacity: 1;
    box-shadow: 0 6px 16px rgba(0, 0, 0, .2);
}
html.kb-skin-bitrix .kb-card.kb-overdue { background: #ffffff; }
html.kb-skin-bitrix .kb-card.kb-overdue:hover { background: #ffffff; }
html.kb-skin-bitrix .kb-card.kb-overdue .kb-card-title { color: #333333; }
html.kb-skin-bitrix .kb-due-badge {
    background: #e4f5d3;
    color: #5c8a17;
    border-radius: 10px;
    padding: 2px 8px;
    font-size: 11px;
    font-weight: 600;
}
html.kb-skin-bitrix .kb-due-badge.overdue { background: #ff5752; color: #ffffff; }
html.kb-skin-bitrix .kb-tag-pill { border-radius: 10px; }
html.kb-skin-bitrix .kb-assignee-chip { background: #2fc6f6; color: #ffffff; border: 2px solid #ffffff; }
html.kb-skin-bitrix .kb-assignee-chip.kb-responsible { background: #2067b0; box-shadow: none; border: 2px solid #ffffff; }
html.kb-skin-bitrix .kb-assignee-more { background: #a8adb4; }
html.kb-skin-bitrix .kb-checklist-badge { background: #eef2f4; color: #535c69; border-radius: 10px; }
html.kb-skin-bitrix .kb-checklist-badge.complete { background: #bbed21; color: #535c69; }
html.kb-skin-bitrix .kb-widget,
html.kb-skin-bitrix .kb-role-badge { border-radius: 2px; }

html.kb-skin-bitrix .kb-modal {
    border-radius: 2px;
    box-shadow: 0 8px 32px rgba(0, 0, 0, .25);
}
html.kb-skin-bitrix .kb-modal h2 { font-size: 22px; font-weight: 300; color: #333333; }
html.kb-skin-bitrix .kb-field label { text-transform: none; font-size: 13px; font-weight: 400; color: #80868e; }
html.kb-skin-bitrix .kb-field input[type=text],
html.kb-skin-bitrix .kb-field input[type=date],
html.kb-skin-bitrix .kb-field select,
html.kb-skin-bitrix .kb-field textarea { border: 1px solid #c6cdd3; border-radius: 2px; }
html.kb-skin-bitrix .kb-tab { color: #535c69; }
html.kb-skin-bitrix .kb-tab.active { color: #2067b0; border-bottom-color: #2fc6f6; }
html.kb-skin-bitrix .kb-toast { background: #333333; background: rgba(0, 0, 0, .78); border-radius: 2px; }


/* ======================================================================
   ОБЩЕЕ ДЛЯ ВСЕХ СКИНОВ
   ====================================================================== */

/* Цвета колонок, выбранные в «Оформлении личной доски», сильнее скина:
   это личный выбор человека, скин его не перекрашивает */
html[class*="kb-skin-"] .kb-column.kb-col-blue   { background: #dcebfa; }
html[class*="kb-skin-"] .kb-column.kb-col-green  { background: #ddf3e4; }
html[class*="kb-skin-"] .kb-column.kb-col-yellow { background: #fbf3d5; }
html[class*="kb-skin-"] .kb-column.kb-col-orange { background: #fbe7d5; }
html[class*="kb-skin-"] .kb-column.kb-col-red    { background: #fadcda; }
html[class*="kb-skin-"] .kb-column.kb-col-purple { background: #ece3fa; }
html[class*="kb-skin-"] .kb-column.kb-col-gray   { background: #e3e5e8; }

/* В строгих скинах значки на карточке серые: цветные картинки пестрят
   сильнее заголовка. Смысл значков и подсказки при наведении те же */
html.kb-skin-flat .kb-card-kind,
html.kb-skin-flat .kb-card-mark,
html.kb-skin-flat .kb-card-sticker,
html.kb-skin-fluent .kb-card-kind,
html.kb-skin-fluent .kb-card-mark,
html.kb-skin-fluent .kb-card-sticker,
html.kb-skin-sap .kb-card-kind,
html.kb-skin-sap .kb-card-mark,
html.kb-skin-sap .kb-card-sticker,
html.kb-skin-1c .kb-card-kind,
html.kb-skin-1c .kb-card-mark,
html.kb-skin-1c .kb-card-sticker,
html.kb-skin-docsvision .kb-card-kind,
html.kb-skin-docsvision .kb-card-mark,
html.kb-skin-docsvision .kb-card-sticker {
    -webkit-filter: grayscale(1);
    filter: grayscale(1);
}