Grav-Admin-Plugin/themes/grav/scss/template/_forms.scss

// fieldset {
// 	border: 1px solid $core-border-color;
// }

// textarea, #{$all-text-inputs}, select[multiple=multiple] {
// 	background-color: white;
// 	border: 1px solid $core-border-color;
// 	box-shadow: $core-box-shadow;

// 	&:hover {
// 		border-color: $core-border-color-hover;
// 	}

// 	&:focus {
// 		border-color: $core-border-color-focus;
// 		box-shadow: $core-box-shadow-focus;
// 	}
// }

// label {
// 	@extend strong;
// }

// Forms
$form-label-width: 30%;
$form-border: darken($content-bg,10%);
$form-border-radius: 4px;
$form-border-width: 1px;
$form-label-pad: 5px 0 5px 3rem;
$form-input-pad: 5px 10px;
$form-select-pad: 5px 30px 5px 10px;

// Load Third Party Libraries
@import "template/modules/toggle-switch";

form {

    .form-field {
        margin-bottom: 1rem;
        padding-left: $padding-default;
    }

    .form-data {
        padding-right: $padding-default;
    }

    label {
        padding: 5px 0;
        font-weight: 400;
        margin:0;
    }

    input, select, textarea, button, .selectize-input {
        font-family: $font-family-default;
        font-size: $core-font-size;
        line-height: $core-line-height;
        border-radius: $form-border-radius;
        -webkit-font-smoothing: antialiased;
    }

    .form-select-wrapper, .selectize-control.single .selectize-input {
        position: relative;

        &:after {
            margin-top: 0;
            border: 0;
            position: absolute;
            content: '\f078';
            font-family: 'FontAwesome';
            right: 12px;
            top: 50%;
            line-height: 0;
            color: lighten($content-fg,15%);
            pointer-events: none;
        }
    }

    .selectize-input {
        box-shadow: none;
        color: $content-fg;
    }


    .selectize-control.multi .selectize-input {

        padding: ($leading-margin / 4) ($leading-margin / 4);

        &.has-items {
            padding-top: 6px;
            padding-bottom: 4px;
        }

        input {
            font-size: $core-font-size;
            line-height: $core-line-height;
        }

        > div {
            color: $content-fg;
            // background: $content-bg;
            border-radius: 2px;
            line-height: 1.5;
            &.active {
                background: darken($content-bg,10%);
            }
        }
    }

    .selectize-control.single .selectize-input {

        &:after {
            right: 24px;
        }
        &.dropdown-active {
            &:after {
                content: '\f077';
            }
        }
    }



    .x-small {

            max-width: 5rem !important;

    }

    .small {

            max-width: 10rem !important;

    }

    .medium {

            max-width: 20rem !important;

        textarea {
            height: 7rem;
        }
    }

    .large {

            max-width: 30rem !important;

         textarea {
            height: 10rem;
        }
    }

    .selectize-input {
        padding: $form-select-pad;
    }

    select {
        width: 100%;
        border: $form-border-width solid $form-border;
        background: $white;
        -webkit-appearance:none;
        -moz-appearance:none;
        appearance:none;
        padding: $form-select-pad;
        cursor: pointer;
        margin: 0;
    }

    input[type=text] {
        width: 100%;
        border: $form-border-width solid $form-border;
        background: $white;
    }

    textarea {
        width: 100%;
        border: $form-border-width solid $form-border;
        background: $white;
    }


    // input[type=text] {
    //     width: 65%;
    //     border: $form-border-width solid $form-border;
    //     padding: $form-input-pad;
    // }

    // input[type=date] {
    //     width: 200px;
    //     border: $form-border-width solid $form-border;
    //     padding: $form-input-pad;
    // }


    // textarea {
    //     width: 65%;
    //     height: 100px;
    //     border: $form-border-width solid $form-border;
    //     padding: $form-input-pad;
    // }


    .switch-toggle {
        // margin-left: 30%;

        label {
            cursor: pointer;
        }

        a,label {
            outline: none !important;
        }
    }

    .dynfields {

        input[type=text] {
            width: 40%;
            float: left;
            margin: 0 5px 5px 0;
        }

        .form-row {
            display: inline-block;
            span {
                padding: 0.5rem;
                display: inline-block;
                line-height: 1.7;
                cursor: pointer;
            }
        }


    }

    .button-bar {
        margin-top: 50px;
        background: lighten($form-border,7%);
        padding: $form-input-pad;
        padding-left: $form-label-width;
    }

    .checkboxes {
        display: inline-block;
        padding: 5px 0;

        label {
            display: inline;
            cursor: pointer;
            position: relative;
            padding: 0 0 0 2rem;
            margin-right: 15px;

        }
        label:before {
            content:"";
            display: inline-block;
            width: 1.5rem;
            height: 1.5rem;
            top: 50%;
            left: 0;
            margin-top: -0.75rem;
            margin-right: 10px;
            position: absolute;

            background: $white;
            border: $form-border-width solid $form-border;
            border-radius: $form-border-radius;
        }
        input[type=checkbox] {
            display: none;
        }
        input[type=checkbox]:checked + label:before {
            content:"\f00c";
            font-family: "FontAwesome";
            font-size: 1.2rem;
            line-height: 1.5rem;
            text-align: center;
        }
    }



}