:root {
    --form_border: 1px solid var(--dark_color);
    --form_border_hover: 1px solid var(--black_color);
    --form_border_focus: 1px solid var(--transparent_color);
    --form_outline_focus: 3px solid var(--gold_translucent_color);
}

input,
input:-webkit-autofill,
input:-webkit-autofill:hover,
select,
select:-webkit-autofill,
select:-webkit-autofill:hover,
textarea,
textarea:-webkit-autofill,
textarea:-webkit-autofill:hover
{
    max-width: 100%;
    min-width: 100%;
    height: 3rem;
    color: var(--dark_color);
    border: var(--form_border);
    border-radius: var(--default_border_radius);
    background: none;
    font-size: 1rem;
    padding: 0.5rem 1rem;
    transition: background-color 5000s ease-in-out 0s;
}
input:focus,
input:focus:hover,
input:-webkit-autofill:focus,
input:-webkit-autofill:focus:hover,
select:focus,
select:focus:hover,
select:-webkit-autofill,
select:-webkit-autofill:hover,
select:-webkit-autofill:focus,
select:-webkit-autofill:focus:hover,
textarea:focus,
textarea:focus:hover,
textarea:-webkit-autofill,
textarea:-webkit-autofill:hover,
textarea:-webkit-autofill:focus,
textarea:-webkit-autofill:focus:hover {
    color: var(--black_color_2);
    border: var(--form_border_focus);
    outline: var(--form_outline_focus);
    font-size: 1rem;
    transition: background-color 5000s ease-in-out 0s;
}

input::placeholder, select::placeholder, textarea::placeholder {
    color: var(--form_gray_color_placeholder);
    font-size: 1rem;
    font-family: RobotoLight;
}

input:hover,
select:hover,
textarea:hover {
    color: var(--black_color);
    border: var(--form_border_hover);
}

textarea {
    resize: vertical;
}

.form_input {
    width: 100%;
    position: relative;
    display: flex;
    flex-direction: column;
    row-gap: 0.3rem;
    margin-top: 0.9rem;
}
    .form_input label {
        width: 100%;
        font-family: RobotoLight;
        color: var(--dark_color_2);
        font-size: 0.9rem;
        padding-left: 0.4rem;
    }
    .form_input:hover label {
        color: var(--black_color);
    }
    .form_input:focus-within label,
    .form_input:hover:focus-within label {
        color: var(--gold_color);
    }
    .form_input.req label:after {
        content: '*';
        color: var(--red_light_color);
        margin-left: 0.2rem;
    }

.form_input.min_textarea_6rem textarea {
    min-height: 6rem;
}
.form_input.min_textarea_10rem textarea {
    min-height: 10rem;
}
.form_input.min_textarea_15rem textarea {
    min-height: 15rem;
}

.checkbox_input,
.checkbox_form {
    width: 100%;
    position: relative;
    display: flex;
    align-items: center;
    row-gap: 0.5rem;
    font-size: 1rem;
}
.checkbox_input {
    margin-top: 0.6rem;
    padding-left: 0.2rem;
}
.checkbox_form {
    height: 1px;
    min-height: 3rem;
}
    .checkbox_input input,
    .checkbox_form input {
        position: absolute;
        z-index: -1;
        opacity: 0;
    }
    .checkbox_input label,
    .checkbox_form label {
        display: inline-flex;
        align-items: center;
        font-size: 1rem;
        color: var(--dark_color);
        user-select: none;
        cursor: pointer;
    }
    .checkbox_input label:hover,
    .checkbox_form label:hover {
        color: var(--black_color_2);
    }
    .checkbox_input label:hover:before,
    .checkbox_form label:hover:before {
        border-color: var(--black_color_2);
    }
    .checkbox_input label:before,
    .checkbox_form label:before {
        content: '';
        display: flex;
        justify-content: center;
        align-items: center;
        border: 1px solid var(--dark_color);
        border-radius: 0.25rem;
        margin-right: 0.5rem;
    }
    .checkbox_input label:before {
        width: 1.4rem;
        height: 1.4rem;
        font-size: 1.5rem;
    }
    .checkbox_form label:before {
        width: 1.5rem;
        height: 1.5rem;
        font-size: 1.6rem;
    }
    .checkbox_input input:checked+label:before,
    .checkbox_form input:checked+label:before {
        content: "\2713";
        border-color: var(--gold_color_lite);
        background-color: var(--gold_color_lite);
    }
    .checkbox_input input:checked+label:hover:before,
    .checkbox_form input:checked+label:hover:before {
        content: "\2713";
        border-color: var(--gold_color);
        background-color: var(--gold_color);
    }

.search_input_box {
    position: relative;
    margin-left: 20%;
    margin-right: 20%;
}
    .search_input_box input {
        padding-right: 2.5rem !important;
    }
    .search_input_box .input_search_btn_box {
        position: absolute;
        width: 2rem;
        height: 100%;
        top: 0;
        right: 0.5rem;
        display: flex;
        justify-content: center;
        align-items: center;
        border-radius: 50%;
    }
        .search_input_box .input_search_btn_box .input_search_btn {
            width: 2rem;
            height: 2rem;
            font-size: 1rem;
            color: var(--dark_color);
            background: none;
            border: none;
            border-radius: 50%;
            cursor: pointer;
        }
        .search_input_box .input_search_btn_box .input_search_btn:hover {
            /*color: var(--gold_color);*/
            color: var(--black_color);
            background-color: var(--hover_transparent_color);
        }

/* Buttons */
.btn {
    max-width: 100%;
    font-size: 1rem;
    font-family: Roboto;
    text-transform: uppercase;
    cursor: pointer;
    border: none;
    border-radius: var(--default_border_radius);
    padding: 0.8rem 4.5rem;
}
.btn_gold {
    color: var(--dark_color);
    border: none;
    background-color: var(--gold_color_lite);
}
.btn_gold:hover {
    color: var(--black_color_2);
    background-color: var(--gold_color);
}
.btn_gold:disabled {
    color: var(--gray_color);
    background-color: var(--form_gold_color_disabled);
}
.btn_gold_lite {
    color: var(--gold_color_lite);
}
.btn_gold_lite:hover {
    color: var(--gold_color);
    text-decoration: underline;
}
.btn_gray_lite {
    color: var(--dark_color);
    background-color: var(--gray_very_light_color);
}
.btn_gray_lite:hover {
    color: var(--black_color);
    background-color: var(--hover_gray_very_light_color);
}
.btn_error {
    color: var(--white_color);
    background-color: var(--red_light_color);
}
.btn_error:hover {
    background-color: var(--hover_red_light_color);
}

.message_block {
    width: 100%;
    display: flex;
    flex-direction: column;
    gap: 0.7rem 0.5rem;
}
.message_block_margin {
    margin-top: 1rem;
}
    .message_block .message {
        width: 100%;
        display: grid;
        grid-template-columns: 1fr 2rem;
        grid-gap: 0 0.6rem;
        padding: 1rem;
        border-radius: var(--default_border_radius);
    }
        .message.success_message {
            color: var(--success_color);
            background-color: var(--success_bg_color);
            border: 1px solid #22be83;
        }
        .message.success_message .message_body_box .message_context_block {
            color: var(--success_content_color);
        }
        .message.success_message .message_close_btn_box {
            color: var(--success_border_color);
        }
        .message.success_message .message_close_btn_box:hover {
            color: var(--success_border_color_hover);
        }
        .message.warning_message {
            color: var(--warning_color);
            background-color: var(--warning_bg_color);
            border: 1px solid var(--warning_border_color);
        }
        .message.warning_message .message_body_box .message_context_block {
            color: var(--warning_content_color);
        }
        .message.warning_message .message_close_btn_box {
            color: var(--warning_border_color);
        }
        .message.warning_message .message_close_btn_box:hover {
            color: var(--warning_border_color_hover);
        }
        .message.error_message {
            color: var(--error_color);
            background-color: var(--error_bg_color);
            border: 1px solid var(--error_border_color);
        }
        .message.error_message .message_body_box .message_context_block {
            color: var(--error_content_color);
        }
        .message.error_message .message_close_btn_box {
            color: var(--error_border_color);
        }
        .message.error_message .message_close_btn_box:hover {
            color: var(--error_border_color_hover);
        }
            .message .message_body_box {
                width: 100%;
                display: flex;
                justify-content: center;
                align-items: center;
                flex-wrap: wrap;
                word-break: break-all;
            }
                .message_body_box .message_text {
                    width: 100%;
                }
                .message_body_box .message_context_block {
                    width: 100%;
                    margin-top: 0.4rem;
                    padding-left: 0.4rem;
                }
                    .message_context_block .message_context_item {
                        width: 100%;
                    }
                    .message_context_block .message_context_item:before {
                        content: '-';
                        margin-right: 0.2rem;
                    }
            .message .message_close_btn_box {
                width: 100%;
                height: 100%;
                display: flex;
                justify-content: center;
                align-items: center;
            }
                .message .message_close_btn_box .close_icon_box {
                    width: 2rem;
                    height: 2rem;
                    display: flex;
                    justify-content: center;
                    align-items: center;
                    font-size: 1.2rem;
                    border-radius: 100%;
                    cursor: pointer;
                }
                .message .message_close_btn_box .close_icon_box:hover {
                    background-color: var(--hover_transparent_color);
                }


@media (max-width: 1200px) {
    .search_input_box {
        margin-left: 5%;
        margin-right: 5%;
    }
}
@media (max-width: 480px) {
    .search_input_box {
        margin-left: 0;
        margin-right: 0;
    }
}