/* The Prescriptions tab of the Settings page. */
.prescribers--eligibility-tag {
  display: inline-flex;
  flex-shrink: 0;
  align-items: center;
  gap: var(--rem-6);
  padding-block: var(--rem-2);
  font-size: var(--rem-12);
  font-variation-settings: 'wght' var(--text-medium);
  line-height: 1.2;
  color: var(--prescribers-tone);

  &[data-tone="success"] {
    --prescribers-tone: var(--text-success);
  }

  &[data-tone="warning"] {
    --prescribers-tone: var(--text-warning);
  }

  &[data-tone="error"] {
    --prescribers-tone: var(--text-error);
  }
}

.prescribers--eligibility-dot {
  width: var(--rem-6);
  height: var(--rem-6);
  border-radius: var(--radius-full);
  background-color: var(--prescribers-tone);
}

/* The search and filters above the table. */
.prescribers--toolbar {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  align-items: center;
  gap: var(--rem-8);

  .inputs--custom-search {
    width: 17rem;
    max-width: 100%;
    height: var(--rem-32);
    padding-block: 0;
  }

  .select {
    width: fit-content;
  }
}

/* The table's turbo frame, which is inline unless told otherwise. */
.prescribers--table {
  display: block;
}

/* The WENO section of the Edit prescribing window. */
.prescribers--weno-section {
  width: 100%;
  min-width: 0;
  margin: 0;
  padding: var(--rem-16) 0 0;
  border: none;
  border-top: solid 1px var(--border-primary);

  input[readonly] {
    background-color: var(--surface-subtle);
    color: var(--text-information);
  }
}

.prescribers--weno-title {
  float: left;
  width: 100%;
  margin-bottom: var(--rem-16);
  padding: 0;
  font-size: var(--rem-15);
  font-variation-settings: 'wght' var(--text-medium);
  line-height: 1.2;
  color: var(--text-heading);
}

.prescribers--hint {
  font-size: var(--rem-12);
  color: var(--text-information);
}