/* ===== Cosmic: Статусы сотрудничества (вкладка "Сотрудники") ===== */

#coopStatusManager .card {
  background: linear-gradient(180deg, var(--surface) 0%, var(--surface-2) 100%);
  border: 1px solid var(--border);
  border-radius: 16px;
  transition: border-color .25s;
}
#coopStatusManager .card:hover { border-color: var(--border-2); }
#coopStatusManager .card h2 {
  font-size: 15.5px; font-weight: 600; color: var(--text);
  display: flex; align-items: center; gap: 8px;
}

#employees.active #coopStatusManager .card {
  animation: cosmicRise .55s cubic-bezier(.2,.8,.2,1) backwards;
}

#coopStatusManager table { border-collapse: separate; border-spacing: 0; }
#coopStatusManager thead th {
  color: var(--text-3); font-weight: 500; font-size: 12px;
  text-transform: uppercase; letter-spacing: .03em;
  border-bottom: 1px solid var(--border);
  padding-bottom: 10px;
}
#coopStatusManager tbody tr {
  position: relative;
  transition: background .2s;
}
#coopStatusManager tbody tr:hover { background: rgba(255,255,255,.02); }
#coopStatusManager tbody tr td { border-bottom: 1px solid var(--border); }
#coopStatusManager tbody tr:last-child td { border-bottom: none; }

#coopStatusManager .form-input {
  background: var(--surface-2);
  border: 1px solid var(--border);
  color: var(--text);
  border-radius: 8px;
  transition: border-color .15s;
}
#coopStatusManager .form-input:focus { border-color: var(--border-2); outline: none; }

#coopStatusManager .cs-icon-btn {
  background: transparent;
  border: 1px solid var(--border);
  color: var(--text-3);
  border-radius: 8px;
  width: 30px; height: 30px; padding: 0;
  display: inline-grid; place-items: center;
  cursor: pointer;
  transition: color .15s, border-color .15s;
}
#coopStatusManager .cs-icon-btn:hover { color: var(--text); border-color: var(--border-2); }
#coopStatusManager .cs-icon-btn.cs-danger:hover { color: var(--warn); border-color: var(--warn); }

#coopStatusManager .cs-add-btn {
  background: linear-gradient(135deg, var(--accent), var(--accent-2));
  border: none;
  color: #fff;
  border-radius: 8px;
  font-weight: 600;
  transition: transform .15s, box-shadow .15s;
}
#coopStatusManager .cs-add-btn:hover {
  transform: translateY(-1px);
  box-shadow: 0 4px 14px rgba(225,29,72,.3);
}

@media (prefers-reduced-motion: reduce) {
  #employees.active #coopStatusManager .card { animation: none !important; }
  #coopStatusManager .cs-add-btn:hover { transform: none; }
}