@charset "UTF-8";
/**
@todo разворт стрелки триггера когда открыт список
 */
.form-field__select {
  width: 100%;
  position: relative; }
  .form-field__select::after {
    --border-color: var(--default-dark-grey-color);
    display: block;
    content: '';
    position: absolute;
    right: var(--space);
    top: calc(50% + 8px);
    border-top: 8px solid var(--border-color);
    border-right: 6.5px solid transparent;
    border-bottom: 8px solid transparent;
    border-left: 6.5px solid transparent; }
  .form-field__select-label {
    font-size: var(--default-form-label-font-size);
    color: var(--default-form-label-color);
    line-height: var(--default-line-height);
    display: block;
    padding-bottom: 8px;
    margin-bottom: 0; }
  .form-field__select-control {
    --border-color: var(--default-dark-grey-color);
    --background: linear-gradient(180deg, var(--default-white-color) 0%, var(--default-light-grey-color) 100%);
    width: 100%;
    border: 1px solid var(--border-color);
    border-radius: var(--default-border-radius);
    overflow: hidden;
    background: var(--background);
    padding: calc(var(--space) - 4px);
    padding-right: calc(var(--space) * 2);
    -webkit-appearance: none;
       -moz-appearance: none;
            appearance: none;
    font-size: var(--default-form-field-font-size);
    line-height: var(--default-line-height);
    color: var(--default-dark-grey-color); }
    .form-field__select-control:disabled {
      --border-color: var(--default-disabled-grey-color);
      --background: #f4f4f4;
      color: var(--default-disabled-grey-color); }
  .form-field__select_is_disabled::after {
    --border-color: var(--default-disabled-grey-color); }