/**
 * @file
 * Text input elements.
 */
[type=color],
[type=date],
[type=datetime-local],
[type=email],
[type=file],
[type=month],
[type=number],
[type=password],
[type=search],
[type=tel],
[type=text],
[type=time],
[type=url],
[type=week],
textarea {
  width: 100%;
  max-width: 100%;
  min-height: var(--sp-xl);
  padding-inline: var(--sp-s);
  color: var(--color-text-neutral-loud);
  border: 1px solid var(--color--gray-60);
  border-radius: var(--border-radius, 0.2rem);
  background-color: var(--color--white);
  font-family: inherit;
  font-size: inherit;
  appearance: none;
}
[type=color]:focus,
[type=date]:focus,
[type=datetime-local]:focus,
[type=email]:focus,
[type=file]:focus,
[type=month]:focus,
[type=number]:focus,
[type=password]:focus,
[type=search]:focus,
[type=tel]:focus,
[type=text]:focus,
[type=time]:focus,
[type=url]:focus,
[type=week]:focus,
textarea:focus {
  border: solid 2px var(--color--primary-50);
  outline: solid 2px var(--color--primary-50);
}
@supports (outline-style: double) {
  [type=color]:focus,
  [type=date]:focus,
  [type=datetime-local]:focus,
  [type=email]:focus,
  [type=file]:focus,
  [type=month]:focus,
  [type=number]:focus,
  [type=password]:focus,
  [type=search]:focus,
  [type=tel]:focus,
  [type=text]:focus,
  [type=time]:focus,
  [type=url]:focus,
  [type=week]:focus,
  textarea:focus {
    border-width: 1px;
    outline-width: 6px;
    outline-style: double;
    outline-offset: -1px;
  }
}
[type=color][disabled],
[type=date][disabled],
[type=datetime-local][disabled],
[type=email][disabled],
[type=file][disabled],
[type=month][disabled],
[type=number][disabled],
[type=password][disabled],
[type=search][disabled],
[type=tel][disabled],
[type=text][disabled],
[type=time][disabled],
[type=url][disabled],
[type=week][disabled],
textarea[disabled] {
  color: var(--color--gray-60);
  background-color: var(--color--gray-100);
}
[type=color].error,
[type=date].error,
[type=datetime-local].error,
[type=email].error,
[type=file].error,
[type=month].error,
[type=number].error,
[type=password].error,
[type=search].error,
[type=tel].error,
[type=text].error,
[type=time].error,
[type=url].error,
[type=week].error,
textarea.error {
  border: solid 2px var(--color--red);
}
[type=color].error:focus,
[type=date].error:focus,
[type=datetime-local].error:focus,
[type=email].error:focus,
[type=file].error:focus,
[type=month].error:focus,
[type=number].error:focus,
[type=password].error:focus,
[type=search].error:focus,
[type=tel].error:focus,
[type=text].error:focus,
[type=time].error:focus,
[type=url].error:focus,
[type=week].error:focus,
textarea.error:focus {
  outline-color: var(--color--red);
  outline-offset: -2px;
}
[type=color].error + .ck-editor > .ck-editor__main,
[type=date].error + .ck-editor > .ck-editor__main,
[type=datetime-local].error + .ck-editor > .ck-editor__main,
[type=email].error + .ck-editor > .ck-editor__main,
[type=file].error + .ck-editor > .ck-editor__main,
[type=month].error + .ck-editor > .ck-editor__main,
[type=number].error + .ck-editor > .ck-editor__main,
[type=password].error + .ck-editor > .ck-editor__main,
[type=search].error + .ck-editor > .ck-editor__main,
[type=tel].error + .ck-editor > .ck-editor__main,
[type=text].error + .ck-editor > .ck-editor__main,
[type=time].error + .ck-editor > .ck-editor__main,
[type=url].error + .ck-editor > .ck-editor__main,
[type=week].error + .ck-editor > .ck-editor__main,
textarea.error + .ck-editor > .ck-editor__main {
  border: solid 2px var(--color--red);
}
[type=color].form-element--small,
[type=date].form-element--small,
[type=datetime-local].form-element--small,
[type=email].form-element--small,
[type=file].form-element--small,
[type=month].form-element--small,
[type=number].form-element--small,
[type=password].form-element--small,
[type=search].form-element--small,
[type=tel].form-element--small,
[type=text].form-element--small,
[type=time].form-element--small,
[type=url].form-element--small,
[type=week].form-element--small,
textarea.form-element--small {
  min-height: var(--sp-l);
}
@media (--sm) {
  [type=color],
  [type=date],
  [type=datetime-local],
  [type=email],
  [type=file],
  [type=month],
  [type=number],
  [type=password],
  [type=search],
  [type=tel],
  [type=text],
  [type=time],
  [type=url],
  [type=week],
  textarea {
    width: auto;
  }
}

[type=date] {
  /* Ensure that date field isn't larger than other fields. */
}
[type=date]::-webkit-datetime-edit-fields-wrapper {
  padding-block: 0;
  padding-inline-start: 0;
  padding-inline-end: 0;
}

[type=file] {
  height: auto;
  padding-block: var(--sp-s);
}

[type=color] {
  width: var(--sp-xl);
  padding: 0;
}
