/* Project Card Styles */

/* Project Avatar Styles */
.project-avatars {
  gap: 8px;
}

.project-avatar, .project-avatar-more {
  width: 28px;
  height: 28px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  margin-right: 8px;
  line-height: 1;
}

.project-avatar img, .project-avatar i {
  border-radius: 50%;
  line-height: 1;
}

.project-avatar i {
  font-size: 28px;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 28px;
  height: 28px;
  line-height: 1;
  text-align: center;
  font-style: normal;
}

.project-avatar-more {
  font-size: 0.85rem;
}

/* Add Button for Project */
.project-add-btn {
  width: 28px;
  height: 28px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 50%;
  background-color: #e9ecef; /* light grey */
  color: #495057;
  border: 1px solid #dcdcdc;
  padding: 0;
  line-height: 1;
  font-size: 14px;
  text-align: center;
}

.project-add-btn i {
  line-height: 1;
  font-style: normal;
}

/* Project Card Dropdown - Prevent overflow clipping */
.project-card .dropdown-menu {
  position: absolute !important;
  z-index: 1070 !important;
}

/* Deal Selector Multi-Select Styles */
[data-controller*="deal-select"] .dropdown-menu {
  position: absolute !important;
  z-index: 1070 !important;
}

[data-controller*="deal-select"] .dropdown-menu.show {
  display: block;
}

[data-controller*="deal-select"] .dropdown-item {
  cursor: pointer;
  transition: background-color 0.15s ease-in-out;
}

[data-controller*="deal-select"] .dropdown-item:hover {
  background-color: #f8f9fa;
}

[data-controller*="deal-select"] .dropdown-item label {
  cursor: pointer;
  margin-bottom: 0;
  width: 100%;
}

[data-controller*="deal-select"] .form-check-input {
  cursor: pointer;
  flex-shrink: 0;
}
/* Project Consultants tab: the consultant cell wraps, so keep the avatar from
   being squeezed into an oval (avatar_and_name_link is shared, so scope here). */
.project-consultants-table .consultant-avatar > :first-child {
  flex-shrink: 0;
}

/* Consultants tab "Timesheet codes": the code line and details panel are styled
   in timesheet_codes.css; here only the table-cell density. */
.project-consultants-table .ts-code-details {
  margin-top: 0.35rem;
  font-size: 0.78rem;
}
