@import '~elements-sk/colors';

domain-picker-sk {
  .controls {
    justify-content: flex-end;
    display: flex;
  }

  .description {
    text-transform: initial;
  }

  p {
    font-style: italic;
  }

  .ranges > label {
    display: block;
    margin: 4px;
  }

  .ranges > label > span.prefix {
    display: inline-block;
    width: 50px;
  }

  .ranges > label > input {
    color: var(--on-surface);
    background: var(--surface-1dp);
    width: 64px;
  }

  input[type='number'] {
    width: 64px; // Because Safari has bad default sizing.
  }

  calendar-input-sk {
    display: inline-block;
  }
}