.scoped-invite-dialog textarea {
  width: 100%;
  min-height: 88px;
  box-sizing: border-box;
  border: 1px solid #d6e3e7;
  border-radius: 8px;
  padding: 10px 11px;
  background: #fff;
  color: #29485c;
  font: 14px inherit;
  line-height: 1.55;
  resize: vertical;
}

.scoped-invite-dialog select {
  width: 100%;
  box-sizing: border-box;
  border: 1px solid #d6e3e7;
  border-radius: 8px;
  padding: 10px 11px;
  background: #fff;
  color: #29485c;
  font: 14px inherit;
}

.scoped-invite-dialog textarea:focus,
.scoped-invite-dialog select:focus {
  border-color: #72b8b1;
  outline: 3px solid rgba(8, 127, 131, .12);
}

.scoped-dialog-notice {
  padding: 11px 12px;
  border: 1px solid #dcebea;
  border-radius: 9px;
  background: #f4faf9;
  color: #55747f;
  font-size: 12px;
  line-height: 1.65;
}

.scoped-dialog-notice.warning {
  border-color: #f2d4c6;
  background: #fff8f3;
  color: #8c563c;
}

.danger-button {
  height: 38px;
  border: 0;
  border-radius: 8px;
  padding: 0 16px;
  background: #b85443;
  color: #fff;
  font: 700 13px inherit;
  cursor: pointer;
}

.danger-button:hover { background: #a24738; }

.scoped-head-actions,
.scoped-row-actions {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 8px;
  flex-wrap: wrap;
}

.scoped-row-actions .outline,
.scoped-row-actions .publish { margin: 0; }
.scoped-danger-outline { border-color: #e6b4a9 !important; color: #a64d3f !important; }
.scoped-leave-state { display: grid; justify-items: end; gap: 4px; }
.scoped-leave-state small { color: #7a909d; font-size: 11px; }
.scoped-approval-card { border-color: #eaded3; background: linear-gradient(180deg, #fff, #fffcfa); }
.scoped-count { display: grid; place-items: center; min-width: 26px; height: 26px; border-radius: 999px; background: #fff0e5; color: #a85b2f; font-size: 12px; font-weight: 800; }
.scoped-nav-badge { margin-left: auto; border-radius: 999px; padding: 1px 6px; background: #dff2ef; color: #087f83; font-size: 10px; }

@media (max-width: 700px) {
  .scoped-head-actions,
  .scoped-row-actions { justify-content: flex-start; }
  .scoped-leave-state { justify-items: start; }
}
