/*
    button
    checkbox
    color
    date
    datetime
    datetime-local
    email
    file
    hidden
    image
    month
    number
    password
    radio
    range
    reset
    search
    submit
    tel
    text
    time
    url
    week
*/

input,
button,
select,
textarea {
    font: inherit;
}



    input[type="color"],
    input[type="date"],
    input[type="datetime"],
    input[type="datetime-local"],
    input[type="email"],
    input[type="file"],
    input[type="image"],
    input[type="month"],
    input[type="number"],
    input[type="password"],
    input[type="search"],
    input[type="text"],
    input[type="url"],
    textarea,
    select,
    .formSelect {
        width: 100%;
        background-color: var(--form-background-color);
        color: var(--dark-color);
        border: var(--border-width) solid var(--form-border-color);
        border-radius: var(--border-radius-forms);
        padding: 1ex 2ex;
        margin: 0.1ex 0ex 1ex 0ex;
    }

        .formSelect .Small {
            width: min-content;
        }

    input:not([type="checkbox"], [type="radio"]) {
    }

    input[type="date"] {
        width: min-content;
        display:flex;
    }





    input[type="checkbox"] {
        /*outline: var(--border-width) solid var(--form-border-color);
        margin-right: 0.5rem;*/
        /*accent-color: var(--form-background-color);*/

    }


.checkbox-wrapper-23 *,
.checkbox-wrapper-23 *:after,
.checkbox-wrapper-23 *:before {
    box-sizing: border-box;
}

.checkbox-wrapper-23 input {
    position: absolute;
    opacity: 0;
}

    .checkbox-wrapper-23 input:checked + label svg path {
        stroke-dashoffset: 0;
    }

    .checkbox-wrapper-23 input:focus + label {
        transform: scale(1.03);
    }

    .checkbox-wrapper-23 input + label {
        display: block;
        border: 2px solid #333;
        width: var(--size);
        height: var(--size);
        border-radius: 6px;
        cursor: pointer;
        transition: all .2s ease;
        background-color: white;
    }

        .checkbox-wrapper-23 input + label:active {
            transform: scale(1.05);
            border-radius: 12px;
        }

        .checkbox-wrapper-23 input + label svg {
            pointer-events: none;
            padding: 5%;
        }

            .checkbox-wrapper-23 input + label svg path {
                fill: none;
                stroke: #333;
                stroke-width: 4px;
                stroke-linecap: round;
                stroke-linejoin: round;
                stroke-dasharray: 100;
                stroke-dashoffset: 101;
                transition: all 250ms cubic-bezier(1,0,.37,.91);
            }










input[type="file"]::file-selector-button {
    background-color: var(--default-color);
    color: white;
    padding: 10px 20px;
    border: none;
    border-radius: var(--border-radius-forms);
    cursor: pointer;
    width: fit-content;
}




form {
    display: grid;
}

.form-group {
    margin-bottom: 0.5rem;

}

.form-group-visual {
    background-color: var(--light-transparent-color);
    padding: 1rem;
    border-radius: var(--border-radius-boxes);
}


.Grid {
    /*background-color: blue;*/
    
}


.resizetextarea{
    height: 10rem;
    width: 100%;
}

label {
    /*text-transform: uppercase;*/

    font-size: 1rem;
}