/*
 * Config pages
 *
 * Internal account, OAuth, training, and marketing administration screens.
 */

.config-page-actions,
.config-form-actions {
  display: flex;
  justify-content: flex-end;
}

.config-page-actions {
  margin-block-end: 1rem;
}

.config-form-actions {
  margin-block-start: 1.5rem;
  padding: 1rem;
}

.config-search-form {
  margin-block-end: 1.5rem;
}

.config-search-form__actions {
  display: flex;
  justify-content: flex-end;
}

@media (min-width: 768px) {
  .config-search-form__fields {
    grid-template-columns: repeat(4, minmax(0, 1fr));
    align-items: end;
  }
}

.config-table-block {
  margin-block-start: 1.5rem;
}

.config-account-summary__item {
  margin: 0;
}

.config-account-summary__actions {
  margin: 0;
}

@media (min-width: 768px) {
  .config-account-summary__actions {
    margin-inline-start: 1rem;
  }
}

.config-danger-zone {
  margin-block-start: 2.5rem;
}

.config-dashboard-charts {
  margin-block-start: 1rem;
}

.config-dashboard-charts__item {
  min-inline-size: 0;
}

@media (min-width: 768px) {
  .config-dashboard-stats {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .config-dashboard-charts {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    align-items: center;
  }
}

.config-empty-state {
  padding-block: 3rem;
  text-align: center;
}

.config-empty-state__icon {
  inline-size: 3rem;
  block-size: 3rem;
  margin-inline: auto;
  color: var(--color-ink-lighter);
}

.config-empty-state__title {
  margin-block-start: 0.5rem;
  color: var(--color-ink);
  font-size: 0.875rem;
  font-weight: 500;
  line-height: 1.25rem;
}


.config-empty-state__actions {
  margin-block-start: 1.5rem;
}

.config-form-stack--padded {
  gap: 1rem;
  padding: 1rem;
}

.config-form-label {
  display: block;
  margin-block-start: 1rem;
  margin-block-end: 0.5rem;
}

.config-choice-row {
  display: flex;
  align-items: center;
}

.config-choice-row__body {
  margin-inline-start: 0.5rem;
}



.config-oauth-detail__muted {
  color: var(--color-ink-lighter);
}

.config-oauth-detail__muted--italic {
  font-style: italic;
}

.config-oauth-detail__footer {
  padding-block-start: 1.25rem;
  border-block-start: 1px solid var(--color-border);
}

.config-oauth-detail__actions,
.config-assignment-form {
  display: flex;
  gap: 0.75rem;
}

.config-assignment-form {
  align-items: end;
  padding: 1rem;
}

.config-assignment-form__field {
  flex: 1 1 auto;
}

.config-code {
  display: inline-block;
  border-radius: var(--radius-sm);
  background-color: var(--color-surface-subtle);
  padding-block: 0.25rem;
  padding-inline: 0.5rem;
  font-size: 0.875rem;
  line-height: 1.25rem;
}

.config-truncate {
  display: block;
  max-inline-size: 100%;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.config-empty-note {
  padding: 1rem;
  color: var(--color-ink-lighter);
  font-size: 0.875rem;
  line-height: 1.25rem;
}

@media (min-width: 640px) {
  .config-oauth-detail__grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .config-oauth-detail__wide {
    grid-column: span 2;
  }
}

/* Admin settings forms and account cards */

.admin-settings-form,
.admin-account-card {
  margin-block-start: 1.5rem;
}

.admin-settings-form__description + .admin-settings-form__description {
  margin-block-start: 0.5rem;
}

.admin-settings-form__section-title {
  margin-block-start: 0.5rem;
  color: var(--color-ink);
  font-size: 1.125rem;
  font-weight: 500;
  line-height: 1.5rem;
}

.admin-settings-form__body {
  min-inline-size: 0;
}

.admin-settings-form__section {
  margin-block-start: 1.5rem;
}

.admin-settings-form__external-label {
  margin-block-end: 0.5rem;
}

.admin-settings-form__field {
  margin-block-start: 1rem;
}

.admin-settings-form__inline-actions {
  display: flex;
  justify-content: flex-end;
  margin-block: 1rem;
}

.admin-settings-form__hint {
  margin-block-start: 0.25rem;
  margin-inline-start: 1.75rem;
  color: var(--color-ink-lighter);
  font-size: 0.875rem;
  line-height: 1.25rem;
}

.admin-settings-form__file-row {
  display: grid;
  grid-template-columns: 1fr;
  gap: 0.5rem;
  margin-block-start: 1.5rem;
  padding-block-start: 1.25rem;
  border-block-start: 1px solid var(--color-border);
}

.admin-account-card__layout {
  display: flex;
  flex-direction: column;
  gap: 1.5rem;
  margin-block-start: 0.5rem;
}

.admin-account-card__body {
  max-inline-size: 36rem;
}

.admin-account-card__usage {
  margin-block-start: 1rem;
}

.admin-account-card__usage-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-block-end: 0.5rem;
  color: var(--color-ink-light);
  font-size: 0.875rem;
  line-height: 1.25rem;
}

.admin-account-card__usage-count {
  font-weight: 500;
}

@media (min-width: 640px) {
  .admin-settings-form__file-row {
    grid-template-columns: minmax(0, 1fr) minmax(0, 2fr);
    align-items: center;
    gap: 1rem;
  }

  .admin-account-card__layout {
    flex-direction: row;
    align-items: flex-start;
    justify-content: space-between;
  }
}

@media (min-width: 768px) {
  .admin-settings-form__layout {
    grid-template-columns: minmax(0, 1fr) minmax(0, 2fr);
  }
}

/* Admin templates, custom mail, and boarding setup */

.admin-template-copy {
  white-space: pre-line;
}

.admin-template-async-target,
.admin-template-detail__heading,
.boarding-template-actions,
.boarding-action-detail__body,
.admin-custom-mail-help,
.admin-template-auto-form,
.admin-template-auto-form__inner,
.admin-remove-account__form,
.admin-remove-account__thanks {
  margin-block-start: 1.5rem;
}

.admin-template-detail__heading {
  font-weight: 600;
}

.admin-template-detail__body,
.admin-custom-mail-help__selector {
  margin-block-start: 1rem;
}

.admin-template-detail__signatures {
  display: flex;
  align-items: center;
  margin-block-start: 2rem;
}

.admin-template-detail__signature {
  flex: 1 1 0;
}

.admin-template-auto-form__spinner {
  padding-block: 3rem;
  text-align: center;
}

.admin-template-auto-form__spinner-indicator {
  display: inline-block;
  inline-size: 3rem;
  block-size: 3rem;
  border-radius: var(--radius-pill);
  border-block-end: 2px solid var(--color-brand-strong);
  animation: admin-template-spin 1s linear infinite;
}



.admin-template-dropzone {
  margin-block-start: 0.5rem;
  cursor: pointer;
}

.admin-template-dropzone__label {
  display: block;
  padding-inline-start: 0.5rem;
  color: var(--color-ink-light);
  font-size: 0.875rem;
  font-weight: 500;
}


.admin-template-dropzone__title {
  color: var(--color-ink-light);
}

.admin-template-dropzone__description {
  font-size: 0.875rem;
}

.admin-custom-mail-help__selector {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  padding-inline: 1rem;
}

.boarding-template-actions {
  display: flex;
  flex-direction: column;
}

.boarding-action-status {
  gap: 0.5rem;
}

.boarding-action-status__icon {
  inline-size: 0.75rem;
  block-size: 0.75rem;
}

.boarding-action-detail__comments {
  margin-block-start: 2.5rem;
}

.admin-remove-account__warning-title {
  font-size: 1.125rem;
  line-height: 1.25rem;
}

.admin-remove-account__warning-text {
  margin-block-start: 0.5rem;
}

.admin-remove-account__warning-link {
  display: inline-flex;
  align-items: center;
  color: var(--color-danger-strong);
  font-weight: 500;
  transition: color 150ms ease;
}

.admin-remove-account__warning-link:hover {
  color: var(--color-danger);
}

.admin-remove-account__thanks {
  color: var(--color-ink-light);
  font-size: 1rem;
  font-weight: 500;
  line-height: 1.5rem;
}

@keyframes admin-template-spin {
  to {
    transform: rotate(360deg);
  }
}

.rule-config-detail {
  margin-block-start: 1.5rem;
}

.rule-config-detail__summary {
  display: flex;
  flex-wrap: wrap;
  gap: 1rem;
  margin-block-end: 1rem;
  padding-inline-start: 1rem;
  font-size: 1.125rem;
  line-height: 1.75rem;
}

.rule-config-detail__summary-item {
  margin: 0;
}

.rule-config-conditions__title {
  margin-block-end: 1rem;
  padding-inline-start: 1rem;
  font-size: 1.5rem;
  line-height: 2rem;
}

/* Admin finance settings */

.finance-nested-row__actions {
  padding-block-start: 0.5rem;
}


.finance-form-section {
  margin-block-start: 1.5rem;
}

.finance-form-checks {
  display: flex;
  align-items: center;
  justify-content: space-around;
  inline-size: 100%;
  margin-block-start: 2rem;
}

.finance-modal-fields {
  padding-block-start: 1.5rem;
}

.finance-modal-fields__check {
  padding-block-end: 0.75rem;
}

@media (min-width: 640px) {
  .finance-nested-row__actions {
    padding-block-start: 2.5rem;
  }

  .finance-discount-condition,
  .finance-discount-condition__receiver {
    flex-direction: row;
    align-items: center;
  }

  .finance-discount-condition__type {
    flex: 0 1 40%;
  }

  .finance-discount-condition__receiver {
    flex: 1 1 60%;
  }

  .finance-discount-condition__operator {
    flex: 1 1 66.666%;
  }

  .finance-discount-condition__value {
    flex: 1 1 33.333%;
  }
}

/* Admin miscellaneous settings and audit cleanup */

.admin-misc-section {
  margin-block-start: 1.5rem;
}

.admin-entity-tree-link {
  margin-inline-start: calc(var(--admin-entity-depth, 0) * 1rem);
}

.admin-filter-form {
  padding: 1rem 2.5rem;
}

.admin-filter-form--compact {
  padding-block: 0.5rem;
}

.admin-filter-form__field {
  min-inline-size: 0;
}

.admin-filter-form__actions {
  display: flex;
  align-items: flex-end;
}

.admin-reward-category-options {
  display: flex;
  align-items: center;
}

.admin-reward-category-field {
  max-inline-size: 32rem;
}

.admin-reward-category-options__choice {
  margin-inline-start: 1rem;
}

.admin-reward-summary {
  max-inline-size: 80rem;
  margin-inline: auto;
  padding: 1rem;
}

.admin-reward-summary__cards {
  display: grid;
  grid-template-columns: repeat(1, minmax(0, 1fr));
  gap: 1.25rem;
  margin-block-start: 0.5rem;
}

.admin-high5-timeline {
  position: relative;
  padding-block-end: 2rem;
}

.admin-high5-timeline__line {
  position: absolute;
  inset-block-start: 1.25rem;
  inset-block-end: 0;
  inset-inline-start: 1.25rem;
  inline-size: 0.125rem;
  margin-inline-start: -1px;
  background-color: var(--color-border);
}

.admin-high5-timeline__row {
  position: relative;
  display: flex;
  align-items: flex-start;
  gap: 0.75rem;
}

.admin-high5-timeline__avatar {
  position: relative;
}

.admin-high5-timeline__content {
  flex: 1 1 0;
  min-inline-size: 0;
}

.admin-high5-timeline__sender,
.admin-high5-timeline__date,
.admin-high5-timeline__description {
  font-size: 0.875rem;
  line-height: 1.25rem;
}

.admin-high5-timeline__sender-link {
  color: var(--color-ink);
  font-weight: 500;
}

.admin-high5-timeline__date {
  margin-block-start: 0.125rem;
  color: var(--color-ink-lighter);
}

.admin-high5-timeline__description {
  margin-block-start: 0.5rem;
  color: var(--color-ink-light);
}

.todo-item-form__fields {
  display: grid;
  grid-template-columns: 1fr;
  align-items: center;
}

.todo-item-row {
  position: relative;
  display: flex;
  align-items: center;
  margin: 0.5rem;
}

.todo-item-row__drag-icon {
  inline-size: 1.25rem;
  block-size: 1rem;
  margin-inline-end: 0.5rem;
  color: var(--color-border-medium);
}

.todo-item-row__name {
  font-size: 1rem;
  line-height: 1.5rem;
}

.todo-item-row__actions {
  display: none;
  margin-inline-start: 1rem;
  padding: 0;
  color: var(--color-ink-light);
  font-size: 0.75rem;
  line-height: 1rem;
}

.todo-item-row:hover .todo-item-row__actions,
.todo-item-row:focus-within .todo-item-row__actions {
  display: block;
}

.todo-item-row__icon {
  inline-size: 0.75rem;
  block-size: 0.75rem;
}

.todo-item-row__icon--edit {
  margin-inline-start: -0.25rem;
  color: rgb(var(--palette-teal-600));
}

.todo-item-row__icon--delete {
  color: var(--color-danger-strong);
}

.todo-template-items {
  margin-block-end: 2rem;
  margin-inline-start: 0.5rem;
}

.todo-template-items__list {
  margin-block-start: 0.5rem;
  list-style: none;
}

.todo-template-items__add {
  margin-block-start: 0.5rem;
}

.todo-template-items__inline-form,
.todo-template-items__add-link {
  margin-inline-start: 1rem;
}

.todo-template-items__inline-input {
  inline-size: min(24rem, 100%);
  border-radius: var(--radius-sm);
  font-size: 0.75rem;
  line-height: 1rem;
}

.todo-template-items__add-link {
  margin-block-start: 1rem;
}


.ticket-dropzone-message__title {
  color: var(--color-ink-light);
}

.ticket-dropzone-message__description {
  font-size: 0.875rem;
  line-height: 1.25rem;
}

.admin-notes-list {
  margin-block-start: 1.5rem;
}

.admin-notes-list__empty {
  color: var(--color-ink-light);
  font-weight: 500;
}

@media (min-width: 640px) {
  .admin-filter-form__fields {
    flex-direction: row;
    justify-content: space-between;
  }

  .admin-filter-form__field {
    margin-inline-end: 1rem;
  }

  .admin-reward-summary {
    padding-inline: 1.5rem;
  }

  .admin-reward-summary__cards {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (min-width: 768px) {
  .todo-item-form__fields {
    grid-template-columns: repeat(5, minmax(0, 1fr));
    column-gap: 1.5rem;
  }

  .todo-item-form__field {
    grid-column: span 4;
  }

  .admin-reward-summary {
    padding-inline: 2rem;
  }
}

@media (min-width: 1024px) {
  .admin-reward-summary__cards {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}