.event-card-crew {
  margin-top: 10px;
  padding-top: 9px;
  border-top: 1px solid var(--line);
  color: var(--muted);
  font-size: 11px;
}

.event-hero-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 18px;
}

.event-hero-actions {
  display: flex;
  justify-content: flex-end;
  flex-wrap: wrap;
  gap: 8px;
}

.detail-hero .calendar-button {
  border-color: #454a54;
  background: #24272d;
  color: #fff;
}

.detail-hero .company-calendar-button {
  background: #fff;
  color: #17191e;
  border-color: #fff;
}

.detail-hero .device-calendar-button { background: transparent; }
.event-crew-panel { margin-bottom: 16px; }

.event-crew-list {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
}

.event-crew-person {
  display: grid;
  grid-template-columns: 40px minmax(0, 1fr) 38px;
  align-items: center;
  gap: 10px;
  border: 1px solid var(--line);
  border-radius: 12px;
  padding: 10px;
}

.event-crew-person .avatar,
.crew-pick .avatar { width: 40px; height: 40px; }
.event-crew-person strong,
.event-crew-person span,
.crew-pick strong,
.crew-pick small { display: block; }
.event-crew-person span,
.crew-pick small { font-size: 11px; color: var(--muted); }

.event-crew-person > a {
  width: 36px;
  height: 36px;
  border-radius: 9px;
  background: var(--brand);
  color: var(--brand-ink);
  display: grid;
  place-items: center;
  text-decoration: none;
}

.crew-empty {
  grid-column: 1 / -1;
  padding: 18px;
  border: 1px dashed var(--line);
  border-radius: 12px;
  color: var(--muted);
  font-size: 13px;
}

.crew-picker-field > p { margin: 0; color: var(--muted); font-size: 12px; }
.crew-picker { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 9px; }

.crew-pick {
  position: relative;
  display: grid;
  grid-template-columns: 40px minmax(0, 1fr) 24px;
  align-items: center;
  gap: 9px;
  padding: 10px;
  border: 1px solid var(--line);
  border-radius: 12px;
  cursor: pointer;
}

.crew-pick:has(input:checked) {
  border-color: #a5b74d;
  background: #f8ffdf;
  box-shadow: inset 0 0 0 1px #c9df62;
}

.crew-pick input { position: absolute; opacity: 0; pointer-events: none; }
.crew-pick i {
  width: 22px;
  height: 22px;
  border: 1px solid var(--line);
  border-radius: 7px;
  display: grid;
  place-items: center;
  color: transparent;
  font-style: normal;
}
.crew-pick:has(input:checked) i { background: var(--brand); border-color: var(--brand); color: var(--brand-ink); }

@media (max-width: 820px) {
  .event-hero-head { display: block; }
  .event-hero-actions { justify-content: flex-start; margin-top: 16px; }
  .event-hero-actions .btn { flex: 1; }
  .event-crew-list { grid-template-columns: 1fr; }
}

@media (max-width: 540px) {
  .crew-picker { grid-template-columns: 1fr; }
  .event-hero-actions { display: grid; grid-template-columns: 1fr; }
  .event-hero-actions .btn { width: 100%; }
  .event-crew-panel .section-title { align-items: flex-start; gap: 12px; }
  .event-crew-panel .section-title .btn { min-width: max-content; }
}
@media (max-width: 540px) {
  .event-hero-actions { display: grid; grid-template-columns: minmax(0,1fr) minmax(0,1fr); gap: 7px; width: 100%; min-width: 0; }
  .event-hero-actions .calendar-button { flex: 1 1 0; width: auto; min-width: 0; padding-inline: 8px; font-size: 0; }
  .event-hero-actions .calendar-button::before { font-size: 15px; }
  .event-hero-actions .company-calendar-button::before { content: "G+"; color: #34a853; }
  .event-hero-actions .device-calendar-button::before { content: "▣+"; color: #4b8cff; }
  .event-hero-actions .event-edit { grid-column: 1/-1; justify-self:stretch; width: 100%; min-width: 0; min-height: 38px; padding-inline: 10px; }
  .event-hero-head,.detail-hero{min-width:0;overflow:hidden}
}
.event-crew-person .event-crew-skill{font-weight:750}.event-crew-skill.role-color-blue{color:#4b8cff}.event-crew-skill.role-color-purple{color:#9b6cff}.event-crew-skill.role-color-cyan{color:#18a9b8}.event-crew-skill.role-color-orange{color:#d97706}.event-crew-skill.role-color-red{color:#e65f65}.event-crew-skill.role-color-pink{color:#db5ca8}.event-crew-skill.role-color-green{color:#46b97b}.event-crew-skill.role-color-gray{color:#8b909a}
