/* === Вкладка «Оборачиваемость» === */

/* Верхние карточки */
.to-cards{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:10px;margin-bottom:14px}
.to-card{background:#fff;border:1px solid #e5e7eb;border-radius:10px;padding:14px 16px;display:flex;flex-direction:column;gap:4px;cursor:default;transition:none}
.to-card.active{border-color:#2563eb;box-shadow:0 0 0 2px rgba(37,99,235,.15)}
/* Некликабельные карточки (Потенц. выручка / Заморожено) — нейтральный курсор, без hover */
.to-card-static{cursor:default}
.to-card-static:hover{border-color:#e5e7eb;box-shadow:none;transform:none}
.to-card-label{font-size:11px;color:#6b7280;font-weight:500;line-height:1.3}
.to-card-value{font-size:22px;font-weight:700;color:#111827;line-height:1.2}
.to-card-value.red{color:#dc2626}
.to-card-value.orange{color:#ea580c}
.to-card-value.green{color:#16a34a}
.to-card-value.blue{color:#2563eb}
.to-card-sub{font-size:10px;color:#9ca3af;line-height:1.2}

/* Фильтры */
.to-filters{display:flex;align-items:flex-end;gap:10px;margin-bottom:0;flex-wrap:wrap;background:#fff;padding:12px 16px;border:1px solid #e5e7eb;border-radius:12px 12px 0 0;box-shadow:0 2px 8px rgba(0,0,0,.06)}
.to-filter-group{display:flex;flex-direction:column;gap:2px}
.to-filter-label{font-size:11px;color:#6b7280}
.to-filter-input{font-size:13px;padding:6px 10px;border:1px solid #d1d5db;border-radius:6px;background:#fff;outline:none}
.to-filter-input:focus{border-color:#2563eb;box-shadow:0 0 0 2px rgba(37,99,235,.1)}

/* Статус загрузки */
.to-loading{text-align:center;padding:40px;color:#6b7280}
.to-loading .spin{display:inline-block;width:24px;height:24px;border:3px solid #e5e7eb;border-top-color:#2563eb;border-radius:50%;animation:spin .8s linear infinite;margin-bottom:8px}
@keyframes spin{to{transform:rotate(360deg)}}
.to-loading-status{font-size:13px;margin-top:6px;color:#6b7280}

/* Таблица */
.to-table{width:100%;border-collapse:separate;border-spacing:0;font-size:12px}
.to-table thead{background:#f9fafb;z-index:11}
.to-table th{background:#f9fafb;border:1px solid #e5e7eb;padding:8px 6px;font-size:11px;font-weight:600;color:#374151;text-align:left;white-space:nowrap;vertical-align:bottom;cursor:pointer;user-select:none;position:sticky;top:0;z-index:12;box-shadow:0 1px 0 #e5e7eb}
.to-table th:hover{background:#f3f4f6}
.to-table th .sort-arrow{font-size:9px;margin-left:2px;color:#9ca3af}
.to-table th .sort-arrow.active{color:#2563eb}
.to-table th .to-help{display:inline-block;width:14px;height:14px;line-height:14px;text-align:center;font-size:10px;background:#e5e7eb;color:#6b7280;border-radius:50%;cursor:help;margin-left:3px;vertical-align:middle;position:relative}
.to-table td{border:1px solid #f3f4f6;padding:6px;vertical-align:middle}
.to-table tr:hover td{background:#f0f9ff}
.to-table .num{text-align:right;font-variant-numeric:tabular-nums}
.to-table .money::after{content:' ₽'}

/* Строки по статусу */
.to-row-danger td{background:#fef2f2}
.to-row-warning td{background:#fffbeb}
.to-row-dead td{background:#f9fafb;color:#9ca3af}

/* Фото товара */
.to-photo{width:40px;height:40px;border-radius:6px;object-fit:cover;cursor:pointer;transition:transform .15s}
.to-photo-wrap{position:relative;display:inline-block;width:40px;height:40px}
.to-photo-big{display:none;position:absolute;top:-10px;left:50px;width:260px;height:340px;border-radius:10px;object-fit:contain;background:#fff;box-shadow:0 4px 20px rgba(0,0,0,.25);z-index:100;pointer-events:none;border:2px solid #fff}
.to-photo-wrap:hover .to-photo-big{display:block}

/* Бейджи решений */
.to-badge{display:inline-block;padding:2px 8px;border-radius:10px;font-size:10px;font-weight:600;white-space:nowrap;line-height:1.5}
.to-badge-red{background:#fef2f2;color:#dc2626;border:1px solid #fecaca}
.to-badge-orange{background:#fff7ed;color:#ea580c;border:1px solid #fed7aa}
.to-badge-yellow{background:#fffbeb;color:#a16207;border:1px solid #fde68a}
.to-badge-green{background:#f0fdf4;color:#16a34a;border:1px solid #bbf7d0}
.to-badge-gray{background:#f9fafb;color:#6b7280;border:1px solid #e5e7eb}
.to-badge-blue{background:#eff6ff;color:#2563eb;border:1px solid #bfdbfe}

/* Бейджи факторов риска */
.to-risk-badges{display:flex;flex-wrap:wrap;gap:3px;max-width:260px}

/* Решение */
.to-decision{font-weight:600;font-size:11px;white-space:nowrap}

/* Причина */
.to-reason{font-size:11px;color:#4b5563;line-height:1.4;max-width:260px}

/* Подсказки (tooltip) */
.to-tooltip{position:absolute;background:#1f2937;color:#fff;font-size:11px;padding:8px 12px;border-radius:8px;max-width:320px;line-height:1.5;z-index:200;pointer-events:none;box-shadow:0 4px 12px rgba(0,0,0,.2);white-space:normal}

/* Кнопка обновить */
.to-refresh-btn{font-size:12px;padding:6px 14px;background:#2563eb;color:#fff;border:none;border-radius:6px;cursor:pointer;font-weight:600;transition:background .15s}
.to-refresh-btn:hover{background:#1d4ed8}
.to-refresh-btn:disabled{background:#93c5fd;cursor:not-allowed}

/* Адаптив */
@media(max-width:1200px){
  .to-cards{grid-template-columns:repeat(3,1fr)}
}
@media(max-width:768px){
  .to-cards{grid-template-columns:repeat(2,1fr)}
  .to-filters{flex-direction:column;align-items:stretch}
}

/* Быстрые фильтры (Все артикулы / С заказами / Без заказов / Только с остатками) */
.to-quick-btn{font-size:12px;padding:6px 12px;background:#fff;color:#374151;border:1px solid #e5e7eb;border-radius:8px;cursor:pointer;font-weight:500;transition:background .12s,border-color .12s,color .12s}
.to-quick-btn:hover{background:#f9fafb;border-color:#d1d5db}
.to-quick-btn.active{background:#2563eb;color:#fff;border-color:#2563eb}
.to-quick-btn.active .to-quick-cnt{color:#dbeafe}
.to-quick-cnt{color:#9ca3af;font-weight:600;font-size:11px;margin-left:2px}

/* Карточки с фильтром */
.to-card-clickable{cursor:pointer;transition:transform .12s,box-shadow .12s,border-color .12s}
.to-card-clickable:hover{transform:translateY(-1px);box-shadow:0 4px 12px rgba(37,99,235,.12)}
.to-card-active{border-color:#2563eb !important;box-shadow:0 0 0 2px #bfdbfe inset}

/* === Спокойная подсветка строк по "Что сделать" (actionLabel) =============
   Заменяет агрессивные .to-row-danger / .to-row-warning по decision на
   мягкие цвета по action. Левая полоска шириной 3 px — через inset shadow,
   чтобы не нарушать структуру td.  ======================================== */
.to-row-act-ship    td{background:#F0FDF4}
.to-row-act-partial td{background:#FFFBEB}
.to-row-act-china   td{background:#FFF7ED}
.to-row-act-pause   td{background:#F8FAFC}
.to-row-act-nosale  td{background:#F9FAFB;color:#6B7280}
.to-row-act-link    td{background:#EEF2FF}
.to-row-act-check   td{background:#FFF1F2}

/* Левая 3px-полоска цвета действия — только на первой ячейке строки. */
.to-row-act-ship    td:first-child{box-shadow:inset 3px 0 0 0 #22C55E}
.to-row-act-partial td:first-child{box-shadow:inset 3px 0 0 0 #F59E0B}
.to-row-act-china   td:first-child{box-shadow:inset 3px 0 0 0 #F97316}
.to-row-act-pause   td:first-child{box-shadow:inset 3px 0 0 0 #94A3B8}
.to-row-act-nosale  td:first-child{box-shadow:inset 3px 0 0 0 #D1D5DB}
.to-row-act-link    td:first-child{box-shadow:inset 3px 0 0 0 #6366F1}
.to-row-act-check   td:first-child{box-shadow:inset 3px 0 0 0 #F43F5E}

/* Hover — лёгкое затемнение без резкого скачка. */
.to-row-act-ship:hover    td{background:#E6FCEC}
.to-row-act-partial:hover td{background:#FEF5DA}
.to-row-act-china:hover   td{background:#FFEDD5}
.to-row-act-pause:hover   td{background:#EFF3F8}
.to-row-act-nosale:hover  td{background:#F2F4F7}
.to-row-act-link:hover    td{background:#E1E7FF}
.to-row-act-check:hover   td{background:#FFE4E6}

/* Бейджи действий в колонке "Что сделать" — компактные, без кислотных
   акцентов; цвет фона и текста подобраны под палитру строк. */
.to-badge-act-ship   {background:#DCFCE7;color:#166534;border:1px solid #BBF7D0}
.to-badge-act-partial{background:#FEF3C7;color:#92400E;border:1px solid #FDE68A}
.to-badge-act-china  {background:#FFEDD5;color:#9A3412;border:1px solid #FED7AA}
.to-badge-act-pause  {background:#E2E8F0;color:#475569;border:1px solid #CBD5E1}
.to-badge-act-nosale {background:#F3F4F6;color:#6B7280;border:1px solid #E5E7EB}
.to-badge-act-link   {background:#E0E7FF;color:#3730A3;border:1px solid #C7D2FE}
.to-badge-act-check  {background:#FFE4E6;color:#9F1239;border:1px solid #FECDD3}

/* ════════════════════════════════════════════
   Закрепление колонок 📌 в Оборачиваемости.
   Используем общий класс .g-pin (как и в Заказах/Продажах), но привязываем
   правила к .to-table — чтобы не конфликтовать с другими таблицами и
   аккуратно встроиться в существующий sticky-thead + цвета строк.
   ════════════════════════════════════════════ */
.to-table th.g-pin,
.to-table td.g-pin{position:sticky;background:#fff;z-index:7}
.to-table thead th.g-pin{background:#f9fafb;z-index:16}
.to-table th.g-pin-last,
.to-table td.g-pin-last{box-shadow:2px 0 4px -2px rgba(0,0,0,.15)}

/* Пастельный фон строк должен сохраняться у пинутых TD. Специфичность
   (0,3,1) выше базового (0,2,1) — побеждает чисто. */
.to-table tbody .to-row-act-ship    td.g-pin{background:#F0FDF4}
.to-table tbody .to-row-act-partial td.g-pin{background:#FFFBEB}
.to-table tbody .to-row-act-china   td.g-pin{background:#FFF7ED}
.to-table tbody .to-row-act-pause   td.g-pin{background:#F8FAFC}
.to-table tbody .to-row-act-nosale  td.g-pin{background:#F9FAFB}
.to-table tbody .to-row-act-link    td.g-pin{background:#EEF2FF}
.to-table tbody .to-row-act-check   td.g-pin{background:#FFF1F2}

/* Hover у строки: мягкий, не белый. Согласован с tr:hover td{background:#f0f9ff}. */
.to-table tbody tr:hover td.g-pin{background:#f0f9ff}
.to-table tbody .to-row-act-ship:hover    td.g-pin{background:#E6FCEC}
.to-table tbody .to-row-act-partial:hover td.g-pin{background:#FEF6D7}
.to-table tbody .to-row-act-china:hover   td.g-pin{background:#FFE8CC}
.to-table tbody .to-row-act-pause:hover   td.g-pin{background:#EEF2F7}
.to-table tbody .to-row-act-nosale:hover  td.g-pin{background:#F3F4F6}
.to-table tbody .to-row-act-link:hover    td.g-pin{background:#DDE3FB}
.to-table tbody .to-row-act-check:hover   td.g-pin{background:#FFE0E4}

/* Кнопка 📌 в заголовках (тот же стиль, что в /goods и /sales). */
.to-table th .to-pin-btn{display:inline-block;margin-left:4px;cursor:pointer;font-size:11px;opacity:.35;user-select:none;vertical-align:middle}
.to-table th .to-pin-btn:hover{opacity:.8}
.to-table th .to-pin-btn.active{opacity:1;color:#2563eb}

/* ════════════════════════════════════════════
   Кнопки «В задачу» / «Создать задачу на отгрузку».
   Только в Оборачиваемости.
   ════════════════════════════════════════════ */
.to-task-btn{
  display:inline-flex;align-items:center;gap:4px;
  padding:3px 8px;border-radius:6px;
  font-size:11px;font-weight:600;line-height:1.4;cursor:pointer;
  background:#EFF6FF;color:#1d4ed8;border:1px solid #BFDBFE;
  white-space:nowrap;transition:background .12s,border-color .12s
}
.to-task-btn:hover{background:#DBEAFE;border-color:#93C5FD}
.to-task-btn:active{background:#BFDBFE}

.to-task-bulk-btn{
  display:inline-flex;align-items:center;gap:6px;
  padding:8px 14px;border-radius:8px;
  font-size:12px;font-weight:600;line-height:1.4;cursor:pointer;
  background:#2563EB;color:#fff;border:1px solid #1D4ED8;
  white-space:nowrap;transition:background .12s
}
.to-task-bulk-btn:hover{background:#1D4ED8}
.to-task-bulk-btn:active{background:#1E40AF}
