.frow {
    display: flex;
    flex-direction: row;
    align-items: flex-start;
    margin: 10px 0;
    padding: 0 10px;
}

.frow div {
    flex: 1;
    flex-direction: column;
    position: relative;
}

.frow div span {
    display: flex;
    font-family: 'Roboto-Regular';
    font-size: 12px;
    padding: 7px 5px;
}

.frow div i {
    position: absolute;
    right: 10px;
    top: 10px;
    cursor: default;
    display: none;
}

.frow div.fcheck, .frow div.fradio {
    flex-direction: row;
    gap: 5px;
    cursor: pointer;
    display: flex;
}

.frow .fradio-group {
    flex-direction: row;
    gap: 10px;
}

.frow div.fradio {
    flex-direction: row;
    flex: unset;
}

.frow .fcheck label, .frow .fradio label {
    cursor: pointer;
    font-family: Roboto-Regular;
}

.frow .fcheck i, .frow .fradio i {
    position: inherit;
    right: unset;
    top: unset;
    display: flex;
    color: var(--bg-secondary);
    cursor: pointer;
}

.frow .fcheck:hover i, .frow .fradio:hover i {
    color: var(--color-blue1);
}

.frow .fcheck.checked i {
    color: var(--bg-secondary);
}

.frow.error div i {
    color: var(--color-error);
    display: inherit;
}

.frow label {
    font-family: 'Roboto-Regular';
    color: var(--color-text);
    line-height: 44px;
    font-size: 14px;
}

.frow label.info {
    font-size: 12px;
    color: var(--color-gray1);
    line-height: 16px;
    padding-top: 4px;
}

.frow label.l {
    font-family: Roboto-Regular;
}

/* standart radio & checkbox */
.frow div.standart-radio, .frow div.standart-check { flex-direction: row; gap: 20px; }
.frow div.standart-radio label.radio, .frow div.standart-check label.check { display: flex; flex-direction: row; gap: 7px; align-items: center; font-family: Roboto-Regular; }
.frow div.standart-radio label.radio input, .frow div.standart-check label.check input { margin: -2px 0 0 0; padding: 0; }
.frow div.standart-radio.col, .frow div.standart-check.col { flex-direction: column; gap: unset; }
.frow div.standart-radio.col label.radio, .frow div.standart-check.col label.check { line-height: 32px; }

/* vertical form row */
.vertical .frow {
    flex-direction: column;
}

.vertical .frow label {
    line-height: unset;
    padding-bottom: 7px;
}

.vertical .frow div {
    width: 100%;
}

.vertical .frow .fradio {
    width: unset;
    align-items: center;
}

.vertical .frow .fcheck label, .vertical .frow .fradio label {
    padding-bottom: unset;
}

select {
    padding: 8px 12px;
    border: var(--color-light-gray4) 2px solid;
    border-radius: 4px;
    font-family: Roboto-Regular;
    font-size: 14px;
    color: var(--color-text);
    outline: none;
}

input[type], textarea, select {
    padding: 12px 15px;
    border-radius: 4px;
    border: var(--color-light-gray4) 2px solid;
    font-family: Roboto-Regular;
    font-size: 14px;
    color: var(--color-text);
    outline: none;
    width: 100%;
}

input[type="file"] { background-color: #f9f9f9; }

input[type]:focus, select:focus, textarea:focus {
    border: var(--color-blue1) 2px solid;
}

.frow.error input[type], .frow.error textarea {
    border: var(--color-error) 2px solid;
}

.frow.error select, .frow.error textarea, .frow.error input[type]:focus {
    border: var(--color-error) 2px solid;
}

.form-el.error input[type], .form-el.error textarea, .form-el.error select {
    border: var(--color-error) 2px solid;
}