/* Утилитарные классы поверх Tailwind CDN + бейджи статусов */

.inp {
  width: 100%;
  border-radius: 0.75rem;
  font-size: 0.875rem;
  padding: 0.55rem 0.75rem;
  background: #fff;
  border: 1px solid rgb(226 232 240);
  color: inherit;
}
.dark .inp { background: rgb(2 6 23 / 0.6); border-color: rgb(51 65 85); }
.inp:focus { outline: none; box-shadow: 0 0 0 2px rgb(99 102 241 / .5); border-color: transparent; }

.btn-ghost {
  font-size: 0.8125rem;
  padding: 0.45rem 0.75rem;
  border-radius: 0.625rem;
  border: 1px solid rgb(226 232 240);
  background: transparent;
  transition: all .15s;
  white-space: nowrap;
}
.dark .btn-ghost { border-color: rgb(51 65 85); }
.btn-ghost:hover { background: rgb(241 245 249); }
.dark .btn-ghost:hover { background: rgb(30 41 59); }

/* Бейджи статусов — спокойная палитра */
.badge { display: inline-flex; align-items: center; gap: .3rem; padding: .15rem .55rem;
  border-radius: 9999px; font-size: .72rem; font-weight: 600; white-space: nowrap; cursor: help; }

.b-hot_lead     { background: #dcfce7; color: #166534; }
.b-success      { background: #dcfce7; color: #166534; }
.b-replied      { background: #d1fae5; color: #065f46; }
.b-qualified    { background: #e0e7ff; color: #3730a3; }
.b-sent         { background: #dbeafe; color: #1e40af; }
.b-later        { background: #fef9c3; color: #854d0e; }
.b-objection    { background: #ffedd5; color: #9a3412; }
.b-refused      { background: #e2e8f0; color: #475569; }
.b-unsubscribed { background: #e2e8f0; color: #475569; }
.b-bounced      { background: #fee2e2; color: #991b1b; }
.b-failed       { background: #fee2e2; color: #991b1b; }
.b-pending      { background: #fef9c3; color: #854d0e; }
.b-fail         { background: #fee2e2; color: #991b1b; }

.dark .b-hot_lead, .dark .b-success { background: rgb(22 101 52 / .25); color: #86efac; }
.dark .b-replied    { background: rgb(6 95 70 / .3); color: #6ee7b7; }
.dark .b-qualified  { background: rgb(55 48 163 / .3); color: #a5b4fc; }
.dark .b-sent       { background: rgb(30 64 175 / .3); color: #93c5fd; }
.dark .b-later, .dark .b-pending { background: rgb(133 77 14 / .3); color: #fde047; }
.dark .b-objection  { background: rgb(154 52 18 / .3); color: #fdba74; }
.dark .b-refused, .dark .b-unsubscribed { background: rgb(71 85 105 / .35); color: #cbd5e1; }
.dark .b-bounced, .dark .b-failed, .dark .b-fail { background: rgb(153 27 27 / .3); color: #fca5a5; }

/* Инлайн-выпадашка статуса обзвона в таблице */
.call-select {
  font-size: .76rem; font-weight: 600; border-radius: 9999px;
  padding: .2rem .5rem; border: 1px solid rgb(226 232 240);
  background: #fff; color: inherit; cursor: pointer; max-width: 200px;
}
.dark .call-select { background: rgb(2 6 23 / .6); border-color: rgb(51 65 85); }
.call-select:focus { outline: none; box-shadow: 0 0 0 2px rgb(99 102 241 / .5); }
.call-select.cs-none      { color: #94a3b8; }
.call-select.cs-called    { background: #dcfce7; color: #166534; border-color: transparent; }
.call-select.cs-no_answer { background: #fee2e2; color: #991b1b; border-color: transparent; }
.call-select.cs-callback  { background: #ede9fe; color: #5b21b6; border-color: transparent; }
.call-select.cs-done      { background: #e2e8f0; color: #475569; border-color: transparent; }
.call-select.cs-emailed   { background: #dbeafe; color: #1e40af; border-color: transparent; }
.call-select.cs-postponed { background: #fef9c3; color: #854d0e; border-color: transparent; }
.call-select.cs-dead      { background: #f1f5f9; color: #64748b; border-color: transparent; text-decoration: line-through; }
.dark .call-select.cs-called    { background: rgb(22 101 52 / .3); color: #86efac; }
.dark .call-select.cs-no_answer { background: rgb(153 27 27 / .3); color: #fca5a5; }
.dark .call-select.cs-callback  { background: rgb(91 33 182 / .35); color: #c4b5fd; }
.dark .call-select.cs-done      { background: rgb(71 85 105 / .35); color: #cbd5e1; }
.dark .call-select.cs-emailed   { background: rgb(30 64 175 / .3); color: #93c5fd; }
.dark .call-select.cs-postponed { background: rgb(133 77 14 / .3); color: #fde047; }
.dark .call-select.cs-dead      { background: rgb(51 65 85 / .4); color: #94a3b8; }

/* Инлайн-поля в таблице: заметка и email */
.note-input, .email-input {
  width: 100%; min-width: 150px; font-size: .8rem;
  padding: .25rem .5rem; border-radius: .5rem;
  border: 1px solid transparent; background: rgb(248 250 252);
  color: inherit;
}
.dark .note-input, .dark .email-input { background: rgb(2 6 23 / .5); }
.note-input::placeholder, .email-input::placeholder { color: rgb(148 163 184); }
.note-input:hover, .email-input:hover { border-color: rgb(226 232 240); }
.dark .note-input:hover, .dark .email-input:hover { border-color: rgb(51 65 85); }
.note-input:focus, .email-input:focus { outline: none; border-color: rgb(99 102 241); background: #fff; }
.dark .note-input:focus, .dark .email-input:focus { background: rgb(2 6 23 / .8); }
.note-input.saved, .email-input.saved { border-color: rgb(34 197 94); background: rgb(220 252 231); }
.dark .note-input.saved, .dark .email-input.saved { background: rgb(22 101 52 / .3); }

/* email-ячейка: поле + ссылка «написать» */
.email-cell { display: flex; align-items: center; gap: .35rem; min-width: 190px; }
.mail-link { font-size: .9rem; text-decoration: none; opacity: .55; }
.mail-link:hover { opacity: 1; }

/* Метрика-карточка */
.metric { background: #fff; border: 1px solid rgb(226 232 240); border-radius: 1rem; padding: 0.9rem 1rem; }
.dark .metric { background: rgb(15 23 42); border-color: rgb(30 41 59); }
.metric .v { font-size: 1.5rem; font-weight: 700; line-height: 1.1; }
.metric .l { font-size: .72rem; color: rgb(100 116 139); margin-top: .15rem; }

/* Таблица: sticky первый столбец + заголовок */
#leadsTable th, #leadsTable td { padding: 0.6rem 0.75rem; text-align: left; vertical-align: top; }
#leadsTable tbody tr { border-top: 1px solid rgb(241 245 249); }
.dark #leadsTable tbody tr { border-top-color: rgb(30 41 59); }
#leadsTable tbody tr:hover { background: rgb(248 250 252); cursor: pointer; }
.dark #leadsTable tbody tr:hover { background: rgb(30 41 59 / .5); }

th.sortable { cursor: pointer; user-select: none; white-space: nowrap; }
th.sortable:hover { color: rgb(99 102 241); }

/* первый столбец (компания) — закреплён по горизонтали */
.sticky-col { position: sticky; left: 0; z-index: 2; background: #fff; }
.dark .sticky-col { background: rgb(15 23 42); }
thead .sticky-col { z-index: 3; background: rgb(248 250 252); }
.dark thead .sticky-col { background: rgb(30 41 59); }
#leadsTable tbody tr:hover .sticky-col { background: rgb(248 250 252); }
.dark #leadsTable tbody tr:hover .sticky-col { background: rgb(30 41 59); }

/* обрезка длинных полей с тултипом */
.clip { max-width: 220px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }