input, textarea {
    width:100%;
    padding:0.75rem 1rem;
    border:2px solid transparent;
    border-radius:8px;
    background:var(--ingite-color-input);
    color:     var(--ingite-color-on-input);
    font-size:16px;
    box-sizing:border-box;
    transition:all .15s;
    font-family:inherit;

    &:focus{
        outline:none;
        border-color:var(--ingite-color-button);
    }
}

/** surface */
.card {
    input, textarea {
        background:var(--ingite-color-surface-input);
        color:     var(--ingite-color-on-surface-input);
    }
}

input::placeholder, textarea::placeholder {
    color:inherit;
    opacity:0.9;
}

textarea {
    grid-column:span 2;
    resize:none;
    margin-bottom:25px;
}

/* Custom Checkbox Styling */
.checkbox-group {
    margin-bottom:30px;
}

.ingite-checkbox {
    display:flex;
    align-items:center;
    margin-bottom:15px;
    cursor:pointer;
    font-size:16px;

    .checkmark {
        width:20px;
        height:20px;
        border-radius:4px;
        margin-right:12px;
        position:relative;
        display:inline-block;
        background-color:rgba(0,0,0,0.025);
        transition:all .15s;
    }
    input {
        position:absolute;
        opacity:0;
        width:20px;
        height:20px;
        margin:0;
        pointer-events:none;

        &:checked + .checkmark{
            background-color:var(--ingite-color-button);
            &::after {
                content:'✓';
                color:var(--ingite-color-on-button);
                position:absolute;
                left:4px;
                top:-2px;
            }
        }
    }

    a {
        font-weight:600;
        color:#2980b9;
        text-decoration:underline;
    }
}