.ids-select-input {
    position: relative;
    width: 100%;
    border-bottom: 1px solid var(--ids_color_border_medium);
}

.ids-select-input .custom-select-container {
    display: flex;
    position: relative;
}

.ids-select-input .select {
    width: 100%;
    padding: var(--ids_size_general_8x);
    background: transparent;
    appearance: none;
    outline: none;
    cursor: pointer;
    border: 0;
}

.ids-select-input .placeholder {
    color: var(--ids_color_action_neutral_base);
    font-size: var(--ids_size_general_14x);
    padding-left: var(--ids_size_general_8x);
}

.ids-select-input svg {
    position: absolute;
    right: var(--ids_size_general_8x);
    top: var(--ids_size_general_4x);
}

.ids-default-input {
    width: 100%;
}

.ids-default-input .input-main-body {
    padding: var(--ids_size_general_24x) 0 var(--ids_size_general_12x) 0;
}

.ids-default-input .input-wrapper {
    position: relative;
    width: 100%;
    height: 1.5625rem;
}

.ids-default-input .animated-input {
    z-index: 2;
    position: relative;
    width: 99%;
    height: 100%;
    font-weight: 400;
    font-size: var(--ids_size_general_14x);
    color: var(--ids_color_action_neutral_base);
    outline: none;
    background: none;
    border: none;
    border-bottom: 1px solid var(--ids_color_border_medium);
    padding-left: var(--ids_size_general_8x);
}

.ids-default-input .animated-input-label.error {
    color: var(--ids_color_feedback_error);
}

.ids-default-input .animated-input-label {
    position: absolute;
    color: var(--ids_color_action_neutral_base);
    left: var(--ids_size_general_8x);
    top: 0;
    font-weight: 400;
    font-size: var(--ids_size_general_14x);
    pointer-events: none;
    transition: all 100ms ease;
}

.ids-default-input .animated-input.error {
    border-color: var(--ids_color_feedback_error);
    border-bottom-width: var(--ids_size_general_2x);
}

.animated-input:focus + .animated-input-label, .animated-input:invalid + .animated-input-label, .animated-input.has-value + .animated-input-label, .animated-input.error + .animated-input-label, .animated-input:placeholder-shown + .animated-input-label, .animated-input.has-value + .animated-input-label {
    top: -1.4375rem;
}

.ids-form-message {
    font-size: var(--ids_size_general_14x);
}

.ids-form-message.error {
    color: var(--ids_color_feedback_error);
    padding-left: var(--ids_size_general_8x);
}

.custom-select-container {
    position: relative;
    display: inline-flex;
    align-items: center;
    width: 100%;
}

.custom-select-container select {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 2;
    cursor: pointer;
}

.custom-select-container svg {
    z-index: 1;
    pointer-events: none;
    margin-left: auto;
}