/* ===== АВТОКОМПЛИТ АДРЕСА ===== */

.addr-suggest-list {
  position: absolute;
  top: calc(100% + 3px);
  left: 0;
  right: 0;
  background: var(--color-background-primary);
  border: 0.5px solid var(--color-border-secondary);
  border-radius: var(--border-radius-md);
  box-shadow: 0 6px 20px rgba(0,0,0,0.13);
  z-index: 2000;
  max-height: 230px;
  overflow-y: auto;
}

.addr-suggest-item {
  padding: 8px 12px;
  font-size: 12px;
  line-height: 1.4;
  cursor: pointer;
  color: var(--color-text-primary);
  border-bottom: 0.5px solid var(--color-border-tertiary);
}
.addr-suggest-item:last-child { border-bottom: none; }
.addr-suggest-item:hover { background: var(--color-background-secondary); }

/* Поле времени (24ч): моноширинный шрифт, по центру.
   Клик открывает выпадающий список времени (как в Google Календаре) — поле само не редактируется. */
input.time-input {
  font-family: var(--font-mono, 'SFMono-Regular', 'Consolas', monospace);
  text-align: center;
  letter-spacing: 1px;
  max-width: 90px;
  cursor: pointer;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 24 24' fill='none' stroke='%2364748b' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'%3E%3C/polyline%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right 6px center;
  padding-right: 22px;
}
input.time-input:disabled { cursor: not-allowed; background-image: none; }

/* Выпадающий список времени — переиспользует стиль .status-select-popup */
.time-select-popup {
  max-height: 240px;
  overflow-y: auto;
  min-width: 92px;
}
.time-select-option {
  font-family: var(--font-mono, 'SFMono-Regular', 'Consolas', monospace);
  justify-content: center;
  font-size: 13px;
}
.time-select-option.active {
  background: rgba(37,99,235,0.1);
  color: var(--color-primary);
  font-weight: 700;
}

/* Переключатель "Весь день" + время начала/конца в одной компактной строке (как в Google Календаре) */
.allday-time-row {
  display: flex;
  align-items: flex-end;
  flex-wrap: wrap;
  gap: 16px;
  margin: -2px 0 12px;
}

.allday-check-row {
  display: flex;
  align-items: center;
  gap: 8px;
  margin: 0 0 9px;
  font-size: 13px;
  font-weight: 600;
  color: var(--color-text-primary);
  cursor: pointer;
  user-select: none;
  flex-shrink: 0;
}
.allday-check-row input[type="checkbox"] {
  width: 16px;
  height: 16px;
  accent-color: var(--color-primary);
  cursor: pointer;
}
.allday-check-row input[type="checkbox"]:disabled { cursor: not-allowed; }

.allday-time-fields {
  display: flex;
  align-items: flex-end;
  gap: 8px;
}
.allday-time-fields .form-row { margin-bottom: 0; }
.allday-time-sep {
  padding-bottom: 9px;
  color: var(--color-text-secondary);
  font-size: 13px;
}

/* ===== СКЛАД: СТРОКИ ТАБЛИЦЫ — HOVER ACTION ===== */

tr:hover .row-action-btn { opacity: 1 !important; }

/* ===== СКЛАД: КАТЕГОРИАЛЬНЫЕ ЧИПЫ ===== */

.stock-cat-filter {
  display: flex;
  gap: 6px;
  flex-wrap: wrap;
}

.stock-cat-btn {
  padding: 5px 13px;
  border-radius: 16px;
  border: 0.5px solid var(--color-border-secondary);
  background: var(--color-background-primary);
  font-size: 12px;
  cursor: pointer;
  color: var(--color-text-secondary);
  font-family: var(--font-sans);
  transition: all 0.12s;
  white-space: nowrap;
}
.stock-cat-btn:hover {
  border-color: var(--color-primary);
  color: var(--color-primary);
}
.stock-cat-btn.active {
  background: var(--color-primary);
  border-color: var(--color-primary);
  color: #fff;
}

/* ===== ПОСТАВЩИКИ: ТАБЛИЦА ===== */

.badge-best {
  background: rgba(22,163,74,0.12);
  color: var(--color-success);
  font-size: 10px;
  font-weight: 700;
  padding: 2px 7px;
  border-radius: 8px;
  white-space: nowrap;
  letter-spacing: 0.3px;
}

.badge-fast {
  background: rgba(37,99,235,0.1);
  color: var(--color-primary);
  font-size: 10px;
  font-weight: 600;
  padding: 2px 7px;
  border-radius: 8px;
  white-space: nowrap;
}

.supplier-row-best td { background: rgba(22,163,74,0.04); }

.supplier-specs {
  font-size: 11px;
  color: var(--color-text-secondary);
  line-height: 1.5;
}

/* ===== СРАВНЕНИЕ ПОСТАВЩИКОВ ===== */

.compare-grid {
  display: grid;
  gap: 0;
  border: 0.5px solid var(--color-border-tertiary);
  border-radius: var(--border-radius-md);
  overflow: hidden;
}

.compare-header {
  display: contents;
}
.compare-header > div {
  background: var(--color-background-secondary);
  padding: 10px 14px;
  font-size: 12px;
  font-weight: 600;
  border-bottom: 0.5px solid var(--color-border-tertiary);
}

.compare-row { display: contents; }
.compare-row > div {
  padding: 9px 14px;
  font-size: 12px;
  border-bottom: 0.5px solid var(--color-border-tertiary);
  vertical-align: top;
}
.compare-row > div:first-child {
  background: var(--color-background-secondary);
  font-size: 11px;
  font-weight: 500;
  color: var(--color-text-secondary);
  text-transform: uppercase;
  letter-spacing: 0.3px;
}

.compare-col-best > div { background: rgba(22,163,74,0.06) !important; }

/* ===== КАТАЛОГ ТОВАРОВ: GRID ===== */

.catalog-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(210px, 1fr));
  gap: 12px;
}

.catalog-card {
  background: var(--color-background-primary);
  border: 0.5px solid var(--color-border-tertiary);
  border-radius: var(--border-radius-lg);
  overflow: hidden;
  cursor: pointer;
  transition: box-shadow 0.15s, border-color 0.15s, transform 0.12s;
}
.catalog-card:hover {
  box-shadow: 0 4px 18px rgba(0,0,0,0.1);
  border-color: var(--color-border-secondary);
  transform: translateY(-1px);
}

.catalog-card-photo {
  width: 100%;
  height: 140px;
  background: var(--color-background-secondary);
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 44px;
  color: var(--color-text-secondary);
  opacity: 0.9;
  overflow: hidden;
  position: relative;
}
.catalog-card-photo img {
  width: 100%; height: 100%;
  object-fit: cover;
  opacity: 1;
  position: absolute; top: 0; left: 0;
}
.catalog-card-photo i { opacity: 0.25; }

.catalog-card-body { padding: 11px 12px; }

.catalog-card-name {
  font-size: 13px;
  font-weight: 600;
  color: var(--color-text-primary);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  margin-bottom: 4px;
}

.catalog-card-cat {
  display: inline-block;
  font-size: 10px;
  padding: 2px 7px;
  border-radius: 8px;
  background: rgba(37,99,235,0.1);
  color: var(--color-primary);
  margin-bottom: 6px;
}

.catalog-card-desc {
  font-size: 11px;
  color: var(--color-text-secondary);
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  line-height: 1.45;
  margin-bottom: 7px;
}

.catalog-card-tags {
  display: flex;
  flex-wrap: wrap;
  gap: 4px;
  margin-bottom: 8px;
}

.catalog-tag {
  font-size: 10px;
  padding: 2px 6px;
  border-radius: 6px;
  background: var(--color-background-secondary);
  color: var(--color-text-secondary);
  border: 0.5px solid var(--color-border-tertiary);
}

.catalog-card-foot {
  display: flex;
  gap: 4px;
  padding-top: 8px;
  border-top: 0.5px solid var(--color-border-tertiary);
}

/* ===== ЗАГРУЗКА ФОТО (в модале) ===== */

.catalog-photo-drop {
  width: 100%;
  height: 160px;
  border: 2px dashed var(--color-border-secondary);
  border-radius: var(--border-radius-md);
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  background: var(--color-background-secondary);
  transition: border-color 0.15s, background 0.15s;
  overflow: hidden;
  position: relative;
}
.catalog-photo-drop:hover {
  border-color: var(--color-primary);
  background: rgba(37,99,235,0.04);
}
.catalog-photo-drop img {
  width: 100%; height: 100%;
  object-fit: cover;
  position: absolute; top: 0; left: 0;
}
.catalog-photo-drop .photo-hint {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 6px;
  pointer-events: none;
}

/* ===== TASK TYPE COLORS (calendar) ===== */
.task-type-call      { border-left: 3px solid #2563eb; }
.task-type-email     { border-left: 3px solid #7c3aed; }
.task-type-meeting   { border-left: 3px solid #059669; }
.task-type-proposal  { border-left: 3px solid #d97706; }
.task-type-followup  { border-left: 3px solid #0891b2; }
.task-type-demo      { border-left: 3px solid #6d28d9; }
.task-type-deal      { border-left: 3px solid #065f46; }
.task-type-urgent    { border-left: 3px solid #dc2626; }
.task-type-task      { border-left: 3px solid #6b7280; }

.task-done      { opacity: 0.6; }
.task-done .crm-cal-title { text-decoration: line-through; }
.task-cancelled { opacity: 0.4; }
.task-cancelled .crm-cal-title { text-decoration: line-through; }
.task-overdue   { border-left-color: #dc2626 !important; background: rgba(220,38,38,0.05) !important; }

/* Type row inside card */
.cal-task-type-row {
  font-size: 10px;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.4px;
  opacity: 0.7;
  margin-bottom: 3px;
  display: flex;
  align-items: center;
  gap: 3px;
}

/* Status badge */
.cal-status-badge {
  display: inline-block;
  font-size: 10px;
  font-weight: 600;
  padding: 1px 5px;
  border-radius: 5px;
  margin-top: 4px;
}
.ts-new         { background: rgba(37,99,235,0.12);  color: #2563eb; }
.ts-in-progress { background: rgba(217,119,6,0.12);  color: #d97706; }
.ts-done        { background: rgba(5,150,105,0.12);  color: #059669; }
.ts-cancelled   { background: rgba(107,114,128,0.12);color: #6b7280; }
.badge-overdue  { background: rgba(220,38,38,0.12);  color: #dc2626; }

/* Priority badge (только календарь) */
.cal-priority-badge {
  display: inline-flex;
  align-items: center;
  gap: 3px;
  font-size: 10px;
  font-weight: 600;
  padding: 1px 5px;
  border-radius: 5px;
  margin-top: 4px;
  margin-left: 4px;
}
.pr-high   { background: rgba(225,29,72,0.12);   color: #e11d48; }
.pr-medium { background: rgba(217,119,6,0.12);   color: #d97706; }
.pr-low    { background: rgba(5,150,105,0.12);   color: #059669; }

/* Today column */
.cal-head-today  { background: rgba(111,92,242,0.10) !important; color: var(--color-primary); }
.cal-body-today  { background: rgba(111,92,242,0.04); }

/* Reminders bar chips */
.rem-chip {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  padding: 3px 8px;
  border-radius: 8px;
  font-size: 12px;
  font-weight: 600;
  border: none;
  cursor: pointer;
  font-family: inherit;
  transition: filter 0.12s, transform 0.12s;
}
.rem-chip:hover { filter: brightness(0.9); transform: translateY(-1px); }
.rem-overdue  { background: rgba(220,38,38,0.12);   color: #dc2626; }
.rem-today    { background: rgba(37,99,235,0.12);   color: #2563eb; }
.rem-tomorrow { background: rgba(217,119,6,0.12);   color: #d97706; }
.rem-week     { background: rgba(111,92,242,0.12);  color: #6f5cf2; }
.rem-ahead    { background: rgba(5,150,105,0.12);   color: #059669; }

/* ===== ПОЛЬЗОВАТЕЛИ ===== */

.user-role-badge {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  padding: 3px 9px;
  border-radius: 8px;
  font-size: 11px;
  font-weight: 600;
  white-space: nowrap;
}

.table-wrap {
  background: var(--color-background-primary);
  border: 0.5px solid var(--color-border-tertiary);
  border-radius: var(--border-radius-md);
  overflow: auto;
}

.data-table {
  width: 100%;
  border-collapse: collapse;
}

.data-table thead th {
  padding: 10px 14px;
  font-size: 11px;
  font-weight: 600;
  color: var(--color-text-secondary);
  text-transform: uppercase;
  letter-spacing: 0.04em;
  border-bottom: 0.5px solid var(--color-border-tertiary);
  white-space: nowrap;
  text-align: left;
}

.data-table tbody tr:hover {
  background: var(--color-background-secondary);
}

.data-table tbody tr:hover .row-action-btn {
  opacity: 1 !important;
}

.page-topbar {
  display: flex;
  align-items: center;
  gap: 10px;
}

/* ===== ПЕРЕКЛЮЧАТЕЛЬ ПОЛЬЗОВАТЕЛЯ (предпросмотр прав доступа) ===== */

.user-switcher-wrap {
  position: relative;
}
.user-switcher-wrap .user-avatar {
  cursor: pointer;
  transition: box-shadow 0.12s;
}
.user-switcher-wrap .user-avatar:hover {
  box-shadow: 0 0 0 3px rgba(37,99,235,0.15);
}

.user-switcher-menu {
  position: absolute;
  top: calc(100% + 10px);
  right: 0;
  width: 240px;
  background: var(--color-background-primary);
  border: 0.5px solid var(--color-border-secondary);
  border-radius: var(--border-radius-md);
  box-shadow: 0 12px 32px rgba(0,0,0,0.16);
  z-index: 3000;
  overflow: hidden;
}

.user-switcher-current {
  padding: 10px 14px;
  border-bottom: 0.5px solid var(--color-border-tertiary);
  background: var(--color-background-secondary);
}

.user-switcher-list {
  max-height: 280px;
  overflow-y: auto;
  padding: 4px 0;
}

.user-switch-item {
  display: flex;
  flex-direction: column;
  gap: 1px;
  padding: 7px 14px;
  cursor: pointer;
}
.user-switch-item:hover { background: var(--color-background-secondary); }
.user-switch-item.active { background: rgba(37,99,235,0.07); }
.user-switch-item i { font-size: 13px; }

.user-switcher-hint {
  display: flex;
  align-items: center;
  gap: 6px;
  padding: 8px 14px;
  border-top: 0.5px solid var(--color-border-tertiary);
  font-size: 10.5px;
  color: var(--color-text-secondary);
  line-height: 1.4;
}

/* ===== МАТРИЦА ПРАВ ДОСТУПА ===== */

.perm-matrix-table th, .perm-matrix-table td {
  padding: 9px 12px;
  border-bottom: 0.5px solid var(--color-border-tertiary);
  white-space: nowrap;
}
.perm-matrix-table thead th {
  text-transform: none;
  letter-spacing: normal;
  vertical-align: bottom;
}
.perm-checkbox {
  width: 16px;
  height: 16px;
  cursor: pointer;
  accent-color: var(--color-primary);
}

.perm-superadmin-note {
  display: flex;
  align-items: flex-start;
  gap: 9px;
  margin-top: 14px;
  padding: 11px 15px;
  background: rgba(124,58,237,0.06);
  border: 0.5px solid rgba(124,58,237,0.18);
  border-radius: var(--border-radius-md);
  font-size: 12px;
  line-height: 1.5;
  color: var(--color-text-secondary);
}
.perm-superadmin-note i {
  color: #7c3aed;
  font-size: 16px;
  flex-shrink: 0;
  margin-top: 1px;
}
.perm-superadmin-note b { color: #7c3aed; }

/* ===== СЧЕТА НА ОПЛАТУ ===== */

.payable-status-badge {
  display: inline-flex;
  align-items: center;
  padding: 3px 9px;
  border-radius: 8px;
  font-size: 11px;
  font-weight: 600;
  white-space: nowrap;
}
.pb-pending  { background: rgba(217,119,6,0.12);  color: #d97706; }
.pb-paid     { background: rgba(5,150,105,0.12);  color: #059669; }
.pb-rejected { background: rgba(220,38,38,0.12);  color: #dc2626; }

.payable-row-overdue td { background: rgba(220,38,38,0.04); }
.payable-overdue-tag {
  display: inline-block;
  margin-top: 3px;
  font-size: 10px;
  font-weight: 700;
  color: #dc2626;
  letter-spacing: 0.3px;
}

.payables-sum-chip {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 6px 13px;
  border-radius: 10px;
  font-size: 12px;
  font-weight: 600;
  margin-right: 8px;
}

.payable-file-link {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  font-size: 12px;
  color: var(--color-primary);
  text-decoration: none;
}
.payable-file-link:hover { text-decoration: underline; }
.payable-file-link i { font-size: 15px; color: #dc2626; }

.payable-file-drop {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 12px 14px;
  border: 2px dashed var(--color-border-secondary);
  border-radius: var(--border-radius-md);
  cursor: pointer;
  background: var(--color-background-secondary);
  transition: border-color 0.15s, background 0.15s;
  font-size: 12px;
  color: var(--color-text-secondary);
}
.payable-file-drop:hover {
  border-color: var(--color-primary);
  background: rgba(37,99,235,0.04);
}
.payable-file-drop i {
  font-size: 22px;
  color: #dc2626;
  flex-shrink: 0;
}

/* ===== Чек-лист доступа к разделам CRM (модалы создания/редактирования пользователя) ===== */
.perm-check-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 8px;
  margin-top: 6px;
}
.perm-check-item {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 9px 12px;
  border: 1px solid var(--color-border-secondary);
  border-radius: var(--border-radius-md);
  font-size: 12px;
  font-weight: 600;
  color: var(--color-text-primary);
  cursor: pointer;
  transition: border-color 0.15s, background 0.15s;
}
.perm-check-item:hover {
  border-color: var(--color-primary);
  background: rgba(37,99,235,0.04);
}
.perm-check-item input[type="checkbox"] {
  width: 15px;
  height: 15px;
  accent-color: var(--color-primary);
  cursor: pointer;
}
.perm-check-item i {
  font-size: 16px;
  color: var(--color-text-secondary);
}
.perm-check-item.disabled {
  opacity: 0.6;
  cursor: not-allowed;
  background: var(--color-background-secondary);
}
.perm-check-item.disabled input[type="checkbox"],
.perm-check-item.disabled i,
.perm-check-item.disabled span { cursor: not-allowed; }

.perm-superadmin-hint {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 10px 14px;
  margin-top: 6px;
  margin-bottom: 8px;
  border-radius: var(--border-radius-md);
  background: rgba(217,119,6,0.1);
  color: #d97706;
  font-size: 12px;
  font-weight: 600;
}
.perm-superadmin-hint i { font-size: 16px; }