body {
    .ui-inputtext {
        font-size: $fontSize;
        color: $textColor;
        background: $inputBgColor;
        padding: $inputPadding;
        border: $inputBorder;
        @include transition($inputTransition);
        @include appearance(none);

        &:enabled:hover:not(.ui-state-error) {
            border-color: $inputHoverBorderColor;
        }

        &:enabled:focus:not(.ui-state-error) {
            @include focused-input();
        }
    }

    .ui-chkbox {
        display: inline-block;
        vertical-align: middle;
        margin: 0;
        width: $checkboxWidth;
        height: $checkboxHeight;

        .ui-chkbox-box {
            border: $inputBorder;
            background-color: $inputBgColor;
            width: $checkboxWidth;
            height: $checkboxHeight;
            text-align: center;
            @include border-radius($borderRadius);
            @include transition($checkboxTransition);

            &:not(.ui-state-disabled):hover {
                border-color: $inputHoverBorderColor;
            }

            &.ui-state-focus {
                border-color: $checkboxFocusBorderColor;
                background-color: $checkboxFocusBgColor;
                color: $checkboxFocusTextColor;
                @include shadow($checkboxFocusShadow);
            }

            &.ui-state-active {
                border-color: $checkboxActiveBorderColor;
                background-color: $checkboxActiveBgColor;
                color: $checkboxActiveTextColor;

                &:not(.ui-state-disabled):hover {
                    border-color: $checkboxActiveHoverBorderColor;
                    background-color: $checkboxActiveHoverBgColor;
                    color: $checkboxActiveHoverTextColor;
                }

                &.ui-state-focus {
                    border-color: $checkboxActiveFocusBorderColor;
                    background-color: $checkboxActiveFocusBgColor;
                    color: $checkboxActiveFocusTextColor;
                }
            }

            .ui-chkbox-icon {
                overflow: hidden;
                position: relative;
                font-size: $fontSize + 4;
            }
        }
    }

    .ui-chkbox-label {
        margin: 0 0 0 $inlineSpacing;
    }

    .ui-radiobutton {
        display: inline-block;
        vertical-align: middle;
        margin: 0;
        width: $radiobuttonWidth;
        height: $radiobuttonHeight;

        .ui-radiobutton-box {
            border: $inputBorder;
            background-color: $inputBgColor;
            width: $radiobuttonWidth;
            height: $radiobuttonHeight;
            text-align: center;
            position: relative;
            @include transition($radiobuttonTransition);
            @include border-radius(50%);

            &:not(.ui-state-disabled):not(.ui-state-active):hover {
                border-color: $inputHoverBorderColor;
            }

            &.ui-state-focus {
                border-color: $radiobuttonFocusBorderColor;
                background-color: $radiobuttonFocusBgColor;
                color: $radiobuttonFocusTextColor;
                @include shadow($checkboxFocusShadow);
            }

            &.ui-state-active {
                border-color: $radiobuttonActiveBorderColor;
                background-color: $radiobuttonActiveBgColor;
                color: $radiobuttonActiveTextColor;

                .ui-radiobutton-icon {
                    background-color: $radiobuttonActiveTextColor;
                }

                &:not(.ui-state-disabled):hover {
                    border-color: $radiobuttonActiveHoverBorderColor;
                    background-color: $radiobuttonActiveHoverBgColor;
                    color: $radiobuttonActiveHoverTextColor;
                }

                &.ui-state-focus {
                    border-color: $radiobuttonActiveFocusBorderColor;
                    background-color: $radiobuttonActiveFocusBgColor;
                    color: $radiobuttonActiveFocusTextColor;
                }
            }

            .ui-radiobutton-icon {
                background: transparent;
                width: $radiobuttonWidth / 2;
                height: $radiobuttonHeight / 2;
                display: inline-block;
                position: absolute;
                left: 50%;
                top: 50%;
                margin-left: -1 * $radiobuttonWidth / 4;
                margin-top: -1 * $radiobuttonWidth / 4;
                @include transition(background-color $transitionDuration);
                @include border-radius(50%);

                &:before {
                    display: none;
                }
            }
        }
    }

    .ui-radiobutton-label {
        margin: 0 0 0 .5em;
    }

    .ui-inputswitch {
        width: $inputSwitchWidth;
        height: $inputSwitchHeight;

        .ui-inputswitch-slider {
            @include transition($inputSwitchTransition);
            border-radius: $inputSwitchBorderRadius;
            background: $inputSwitchSliderOffBgColor;
            border: $inputBorder;

            &:before {
                background-color: $inputSwitchHandleOffBgColor;
                height: 1.538em;
                width: 1.538em;
                left: 0;
                bottom: -.27em;
                border-radius: 50%;
                -webkit-transition: $transitionDuration;
                transition: $transitionDuration;
            }
        }

        &.ui-inputswitch-checked {
            .ui-inputswitch-slider:before {
                -webkit-transform: translateX(1.250em);
                -ms-transform: translateX(1.250em);
                transform: translateX(1.250em);
            }
        }

        &.ui-inputswitch-focus {
            .ui-inputswitch-slider {
                background: $inputSwitchSliderOffFocusBgColor;
                &:before {
                    @include focused-input();
                }
            }
        }

        &:not(.ui-state-disabled):hover {
            .ui-inputswitch-slider {
                background-color: $inputSwitchSliderOffHoverBgColor;
            }
        }

        &.ui-inputswitch-checked {
            .ui-inputswitch-slider {
                background-color: $inputSwitchSliderOnBgColor;
                border: 1px solid $inputSwitchSliderOnBgColor;

                &:before {
                    background-color: $inputSwitchHandleOnBgColor;
                }
            }

            &:not(.ui-state-disabled):hover {
                .ui-inputswitch-slider {
                    background-color: $inputSwitchSliderOnHoverBgColor;
                }
            }

            &.ui-inputswitch-focus {
                .ui-inputswitch-slider {
                    background: $inputSwitchSliderOnFocusBgColor;
                }
            }
        }
    }

    .ui-autocomplete {
        .ui-autocomplete-dropdown {
            .ui-button-icon-left {
                @include icon_override("\e902");
            }
        }

        .ui-autocomplete-input {
            padding: $inputPadding;
        }

        &.ui-autocomplete-multiple {
            .ui-autocomplete-multiple-container {
                padding: $inputPadding / 2 $inputPadding;

                &:not(.ui-state-disabled):hover {
                    border-color: $inputHoverBorderColor;
                }

                &:not(.ui-state-disabled).ui-state-focus {
                    @include focused-input();
                }

                .ui-autocomplete-input-token {
                    margin: 0;
                    padding: $inputPadding / 2 0;
                    color: $textColor;

                    input {
                        font-family: $fontFamily;
                        font-size: $fontSize;
                        padding: 0;
                        margin: 0;
                    }
                }

                .ui-autocomplete-token {
                    font-size: $fontSize;
                    padding: $inputPadding / 2 $inputPadding;
                    margin: $chipsItemMargin;
                    background: $highlightBgColor;
                    color: $highlightColorText;
                }
            }
        }
    }

    .ui-autocomplete-panel {
        padding: 0;
        border: $inputOverlayBorder;
        background-color: $inputListBgColor;
        @include shadow($inputOverlayShadow);

        .ui-autocomplete-items {
            padding: $inputListPadding;

            .ui-autocomplete-list-item {
                margin: $inputListItemMargin;
                padding: $inputListItemPadding;
                border: $inputListItemBorder;
                color: $inputListItemTextColor;
                background-color: $inputListItemBgColor;
                @include border-radius(0);

                &.ui-state-highlight {
                    color: $inputListItemHighlightTextColor;
                    background-color: $inputListItemHighlightBgColor;
                }
            }

            .ui-autocomplete-group {
                padding: $inputListItemPadding;
                background-color: $inputListItemDividerColor;
                color: $textColor;
            }
        }
    }

    .ui-fluid {
        .ui-autocomplete {
            .ui-autocomplete-dropdown.ui-button {
                width: $buttonIconOnlyWidth;
            }

            &.ui-autocomplete-multiple.ui-autocomplete-dd {
                .ui-autocomplete-multiple-container {
                    border-right: 0 none;
                    width: calc(100% - #{$buttonIconOnlyWidth});
                }
            }

            &.ui-autocomplete-dd {
                .ui-inputtext {
                    border-right: 0 none;
                    width: calc(100% - #{$buttonIconOnlyWidth});
                }
            }
        }
    }

    .ui-chips {
        > ul.ui-inputtext {
            padding: $inputPadding / 2 $inputPadding;
            display: inline-block;

            &:not(.ui-state-disabled):hover {
                border-color: $inputHoverBorderColor;
            }

            &:not(.ui-state-disabled).ui-state-focus {
                @include focused-input();
            }

            .ui-chips-input-token {
                padding: $inputPadding / 2 0;

                input {
                    font-family: $fontFamily;
                    font-size: $fontSize;
                    padding: 0;
                    margin: 0;
                    color: $textColor;

                    &:hover {
                        border: 0 none;
                    }

                    &:focus {
                        border: 0 none;
                    }
                }
            }

            .ui-chips-token {
                font-size: $fontSize;
                padding: $inputPadding / 2 $inputPadding;
                margin: $chipsItemMargin;
                background: $highlightBgColor;
                color: $highlightColorText;
            }
        }
    }

    .ui-dropdown {
        background: $inputBgColor;
        border: $inputBorder;
        @include transition($inputTransition);

        &:not(.ui-state-disabled):hover {
            border-color: $inputHoverBorderColor;
        }

        &:not(.ui-state-disabled).ui-state-focus {
            @include focused-input();
        }

        .ui-dropdown-label {
            padding-right: 2em;
        }

        .ui-dropdown-trigger {
            background-color: $inputBgColor;
            width: 2em;
            line-height: 2em;
            text-align: center;
            padding: 0;
            color: $inputDropdownIconColor;

            .ui-dropdown-trigger-icon {
                @include icon_override("\e902");
            }
        }

        .ui-dropdown-clear-icon {
            color: $inputDropdownIconColor;
        }
    }

    .ui-dropdown-panel {
        padding: 0;
        border: $inputOverlayBorder;
        background-color: $inputListBgColor;
        @include shadow($inputOverlayShadow);

        .ui-dropdown-filter-container {
            padding: $inputListHeaderPaddingTop $inputListHeaderPaddingRight $inputListHeaderPaddingBottom $inputListHeaderPaddingLeft;
            border-bottom: $inputListHeaderBorder;
            color: $inputListHeaderTextColor;
            background-color: $inputListHeaderBgColor;
            margin: $inputListHeaderMargin;

            .ui-dropdown-filter {
                width: 100%;
                padding-right: 2em;
            }

            .ui-dropdown-filter-icon {
                top: 50%;
                margin-top: -.5em;
                right: $inputListHeaderPaddingRight + .5em;
                color: $inputListHeaderSearchIconColor;
            }
        }

        .ui-dropdown-items {
            padding: $inputListPadding;

            .ui-dropdown-item, .ui-dropdown-item-group {
                margin: $inputListItemMargin;
                padding: $inputListItemPadding;
                border: $inputListItemBorder;
                color: $inputListItemTextColor;
                background-color: $inputListItemBgColor;
                @include border-radius(0);

                &.ui-state-highlight {
                    color: $inputListItemHighlightTextColor;
                    background-color: $inputListItemHighlightBgColor;
                }

                &:not(.ui-state-highlight):not(.ui-state-disabled):hover {
                    color: $inputListItemHoverTextColor;
                    background-color: $inputListItemHoverBgColor;
                }
            }
        }
    }

    .ui-multiselect {
        background: $inputBgColor;
        border: $inputBorder;
        @include transition($inputTransition);

        &:not(.ui-state-disabled):hover {
            border-color: $inputHoverBorderColor;
        }
        
        &:not(.ui-state-disabled).ui-state-focus {
            @include focused-input();
        }

        .ui-multiselect-label {
            padding: $inputPadding;
            padding-right: 2em;
            color: $textColor;
        }

        .ui-multiselect-trigger {
            background-color: $inputBgColor;
            width: 2em;
            line-height: 2em;
            text-align: center;
            padding: 0;
            color: $inputDropdownIconColor;

            .ui-multiselect-trigger-icon {
                @include icon_override("\e902");
            }
        }
    }

    .ui-multiselect-panel {
        padding: 0;
        border: $inputOverlayBorder;
        background-color: $inputListBgColor;
        @include shadow($inputOverlayShadow);

        .ui-multiselect-header {
            padding: $inputListHeaderPaddingTop $inputListHeaderPaddingRight $inputListHeaderPaddingBottom $inputListHeaderPaddingLeft;
            border-bottom: $inputListHeaderBorder;
            color: $inputListHeaderTextColor;
            background-color: $inputListHeaderBgColor;
            margin: $inputListHeaderMargin;

            .ui-multiselect-filter-container {
                float: none;
                width: 70%;
                display: inline-block;
                vertical-align: middle;
                margin-left: 0;

                .ui-inputtext {
                    padding: $inputPadding;
                    padding-right: 2em;
                }

                .ui-multiselect-filter-icon {
                    color: $inputListHeaderSearchIconColor;
                    top: 50%;
                    margin-top: -.5em;
                    right: .5em;
                    left: auto;
                }
            }

            .ui-chkbox {
                margin-right: $inlineSpacing;
                float: none;
                vertical-align: middle;
            }

            .ui-multiselect-close {
                color: $inputListHeaderCloseIconColor;
                top: 50%;
                margin-top: -.5em;
                @include transition($inputListHeaderCloseIconTransition);

                &:hover {
                    color: $inputListHeaderCloseIconHoverColor;
                }
            }
        }

        .ui-multiselect-items {
            padding: $inputListPadding;

            .ui-multiselect-item {
                margin: $inputListItemMargin;
                padding: $inputListItemPadding;
                border: $inputListItemBorder;
                color: $inputListItemTextColor;
                background-color: $inputListItemBgColor;
                @include border-radius(0);

                &.ui-state-highlight {
                    color: $inputListItemHighlightTextColor;
                    background-color: $inputListItemHighlightBgColor;
                }

                &:not(.ui-state-highlight):not(.ui-state-disabled):hover {
                    color: $inputListItemHoverTextColor;
                    background-color: $inputListItemHoverBgColor;
                }

                &.ui-state-disabled {
                    .ui-chkbox-box {
                        cursor: auto;

                        &:hover {
                            border: $inputBorder;
                        }

                        &.ui-state-active:hover {
                            border-color: $checkboxActiveBorderColor;
                        }
                    }
                }

                .ui-chkbox {
                    position: static;
                    display: inline-block;
                    vertical-align: middle;
                    margin: 0 $inlineSpacing 0 0;
                }

                label {
                    display: inline-block;
                    vertical-align: middle;
                }
            }
        }
    }

    .ui-listbox {
        padding: 0;
        min-width: $inputListMinWidth;
        background: $inputListBgColor;
        border: $inputListBorder;

        .ui-chkbox {
            margin: 0 $inlineSpacing 0 0;
        }

        .ui-listbox-header {
            padding: $inputListHeaderPaddingTop $inputListHeaderPaddingRight $inputListHeaderPaddingBottom $inputListHeaderPaddingLeft;
            border-bottom: $inputListHeaderBorder;
            color: $inputListHeaderTextColor;
            background-color: $inputListHeaderBgColor;
            margin: $inputListHeaderMargin;

            .ui-listbox-filter-container {
                width: calc(100% - 3em);

                input {
                    padding: $inputPadding;
                    padding-right: 2em;
                }

                .ui-listbox-filter-icon {
                    top: 50%;
                    left: auto;
                    margin-top: -.5em;
                    right: .5em;
                    color: $inputListHeaderSearchIconColor;
                }
            }
        }

        .ui-listbox-list {
            background-color: $inputListBgColor;
            padding: $inputListPadding;

            .ui-listbox-item {
                margin: $inputListItemMargin;
                padding: $inputListItemPadding;
                border: $inputListItemBorder;
                color: $inputListItemTextColor;
                background-color: $inputListItemBgColor;
                @include border-radius(0);

                &.ui-state-highlight {
                    color: $inputListItemHighlightTextColor;
                    background-color: $inputListItemHighlightBgColor;
                }

                .ui-chkbox {
                    position: static;
                    display: inline-block;
                    vertical-align: middle;
                    margin: 0 $inlineSpacing 0 0;
                }

                label {
                    display: inline-block;
                    vertical-align: middle;
                }
            }
        }


        &:not(.ui-state-disabled) {
            .ui-listbox-item {
                &:not(.ui-state-highlight):not(.ui-state-disabled):hover {
                    color: $inputListItemHoverTextColor;
                    background-color: $inputListItemHoverBgColor;
                }
            }
        }

        &.ui-state-disabled {
            .ui-chkbox-box {
                &:not(.ui-state-disabled):not(.ui-state-active):hover {
                    border: $inputBorder;
                }
            }
        }

        .ui-listbox-footer {
            padding: $inputListHeaderPaddingTop $inputListHeaderPaddingRight $inputListHeaderPaddingBottom $inputListHeaderPaddingLeft;
            border-top: $inputListHeaderBorder;
            color: $inputListHeaderTextColor;
            background-color: $inputListHeaderBgColor;
        }
    }

    .ui-editor-container {
        .ui-editor-toolbar {
            border: $panelHeaderBorder;
            background-color: $panelHeaderBgColor;
        }

        .ui-editor-content {
            border: $panelContentBorder;

            .ql-editor {
                background-color: $inputBgColor;
                color: $textColor;
            }
        }

        .ql-picker.ql-expanded {
            .ql-picker-label {
                color: $panelHeaderTextColor;
            }
        }

        .ql-stroke {
            stroke: $panelHeaderTextColor;
        }

        .ql-picker-label {
            color: $panelHeaderTextColor;
        }

        .ql-snow.ql-toolbar button:hover,
        .ql-snow .ql-toolbar button:hover,
        .ql-snow.ql-toolbar button.ql-active,
        .ql-snow .ql-toolbar button.ql-active,
        .ql-snow.ql-toolbar .ql-picker-label:hover,
        .ql-snow .ql-toolbar .ql-picker-label:hover,
        .ql-snow.ql-toolbar .ql-picker-label.ql-active,
        .ql-snow .ql-toolbar .ql-picker-label.ql-active,
        .ql-snow.ql-toolbar .ql-picker-item:hover,
        .ql-snow .ql-toolbar .ql-picker-item:hover,
        .ql-snow.ql-toolbar .ql-picker-item.ql-selected,
        .ql-snow .ql-toolbar .ql-picker-item.ql-selected {
            color: $panelHeaderIconHoverColor;
        }

        .ql-snow.ql-toolbar button:hover .ql-stroke,
        .ql-snow .ql-toolbar button:hover .ql-stroke,
        .ql-snow.ql-toolbar button.ql-active .ql-stroke,
        .ql-snow .ql-toolbar button.ql-active .ql-stroke,
        .ql-snow.ql-toolbar .ql-picker-label:hover .ql-stroke,
        .ql-snow .ql-toolbar .ql-picker-label:hover .ql-stroke,
        .ql-snow.ql-toolbar .ql-picker-label.ql-active .ql-stroke,
        .ql-snow .ql-toolbar .ql-picker-label.ql-active .ql-stroke,
        .ql-snow.ql-toolbar .ql-picker-item:hover .ql-stroke,
        .ql-snow .ql-toolbar .ql-picker-item:hover .ql-stroke,
        .ql-snow.ql-toolbar .ql-picker-item.ql-selected .ql-stroke,
        .ql-snow .ql-toolbar .ql-picker-item.ql-selected .ql-stroke,
        .ql-snow.ql-toolbar button:hover .ql-stroke-miter,
        .ql-snow .ql-toolbar button:hover .ql-stroke-miter,
        .ql-snow.ql-toolbar button.ql-active .ql-stroke-miter,
        .ql-snow .ql-toolbar button.ql-active .ql-stroke-miter,
        .ql-snow.ql-toolbar .ql-picker-label:hover .ql-stroke-miter,
        .ql-snow .ql-toolbar .ql-picker-label:hover .ql-stroke-miter,
        .ql-snow.ql-toolbar .ql-picker-label.ql-active .ql-stroke-miter,
        .ql-snow .ql-toolbar .ql-picker-label.ql-active .ql-stroke-miter,
        .ql-snow.ql-toolbar .ql-picker-item:hover .ql-stroke-miter,
        .ql-snow .ql-toolbar .ql-picker-item:hover .ql-stroke-miter,
        .ql-snow.ql-toolbar .ql-picker-item.ql-selected .ql-stroke-miter,
        .ql-snow .ql-toolbar .ql-picker-item.ql-selected .ql-stroke-miter {
            stroke: $panelHeaderIconHoverColor;
        }
    }

    .ui-rating {
        a {
            text-align: center;
            display: inline-block;
            color: $ratingStarIconColor;
            @include transition($ratingTransition);

            &.ui-rating-cancel {
                color: $ratingCancelIconColor;
            }

            .ui-rating-icon {
                font-size: $ratingIconFontSize;
            }
        }

        &:not(.ui-state-disabled):not(.ui-rating-readonly) {
            a {
                &:hover {
                    color: $ratingStarIconHoverColor;
                }

                &.ui-rating-cancel {
                    &:hover {
                        color: $ratingCancelHoverIconColor;
                    }
                }
            }
        }
    }

    .ui-spinner {
        .ui-spinner-input {
            padding-right: $spinnerButtonWidth + $inputPadding;
        }

        .ui-spinner-button {
            width: $spinnerButtonWidth;

            &.ui-spinner-up {
                @include border-radius-top-right($borderRadius);
            }

            &.ui-spinner-down {
                @include border-radius-bottom-right($borderRadius);
            }

            .ui-spinner-button-icon {
                position: absolute;
                top: 50%;
                left: 50%;
                margin-top: -.5em;
                margin-left: -.5em;
                width: 1em;
            }
        }
    }

    .ui-fluid {
        .ui-spinner {
            .ui-spinner-input {
                padding-right: $spinnerButtonWidth + $inputPadding;
            }

            .ui-spinner-button {
                width: $spinnerButtonWidth;

                .ui-spinner-button-icon {
                    left: 50%;
                }
            }
        }
    }

    .ui-slider {
        background-color: $sliderBgColor;
        border: $sliderBorder;

        &.ui-slider-horizontal {
            height: $sliderHeight;

            .ui-slider-handle {
                top: 50%;
                margin-top: -1 * $sliderHandleHeight / 2;
            }
        }

        &.ui-slider-vertical {
            width: $sliderWidth;

            .ui-slider-handle {
                left: 50%;
                margin-left: -1 * $sliderHandleWidth / 2;
            }
        }

        .ui-slider-handle {
            height: $sliderHandleHeight;
            width: $sliderHandleWidth;
            background-color: $sliderHandleBgColor;
            border: $sliderHandleBorder;
            @include border-radius($sliderHandleBorderRadius);
            @include transition($sliderHandleTransition);
        }

        .ui-slider-range {
            background-color: $sliderRangeBgColor;
        }

        &:not(.ui-state-disabled) {
            .ui-slider-handle:hover {
                background-color: $sliderHandleHoverBgColor;
                border: $sliderHandleHoverBorder;
            }
        }
    }

    .ui-datepicker {
        padding: $calendarPadding;
        min-width: $calendarWidth;
        background-color: $inputContentPanelBgColor;
        color: $inputContentPanelTextColor;
        border: $inputListBorder;

        &:not(.ui-datepicker-inline) {
            border: $inputOverlayBorder;
            @include shadow($inputOverlayShadow);
        }

        &:not(.ui-state-disabled) {
            .ui-datepicker-header {
                .ui-datepicker-prev,
                .ui-datepicker-next {
                    &:hover {
                        color: $calendarNavIconHoverColor;
                    }

                    &:focus {
                        outline: 0 none;
                        color: $calendarNavIconHoverColor;
                    }
                }
            }

            table {
                td {
                    a:not(.ui-state-active):not(.ui-state-highlight):hover {
                        background-color: $calendarCellDateHoverBgColor;
                    }
                }
            }

            .ui-monthpicker {
                a.ui-monthpicker-month:not(.ui-state-active):hover {
                    background-color: $calendarCellDateHoverBgColor;
                }
            }
        }

        .ui-datepicker-header {
            padding: $inputListHeaderPaddingTop $inputListHeaderPaddingRight $inputListHeaderPaddingBottom $inputListHeaderPaddingLeft;
            background-color: $inputListHeaderBgColor;
            color: $inputListHeaderTextColor;
            font-weight: 600;
            @include border-radius(0);

            .ui-datepicker-prev,
            .ui-datepicker-next {
                cursor: pointer;
                top: 0;
                color: $calendarNavIconColor;
                @include transition($calendarNavIconTransition);
            }

            .ui-datepicker-next {
                span {
                    @include icon_override("\e901");
                }
            }

            .ui-datepicker-prev {
                span {
                    @include icon_override("\e900");
                }
            }

            .ui-datepicker-title {
                margin: 0;
                padding: 0;
                line-height: 1;

                select {
                    margin-top: -.35em;
                    margin-bottom: 0;
                }
            }
        }

        table {
            font-size: $fontSize;
            margin: $calendarTableMargin;

            th {
                padding: $calendarHeaderCellPadding;
            }

            td {
                padding: $calendarCellDatePadding;

                > a, > span {
                    display: block;
                    text-align: center;
                    color: $textColor;
                    padding: $calendarCellDatePadding;
                    @include border-radius($calendarCellDateBorderRadius);
                }

                > a {
                    cursor: pointer;

                    &.ui-state-active {
                        color: $calendarCellDateSelectedTextColor;
                        background-color: $calendarCellDateSelectedBgColor;
                    }
                }

                &.ui-datepicker-today {
                    a {
                        background-color: $calendarCellDateTodayBgColor;
                        color: $calendarCellDateTodayTextColor;
                        font-weight: 600;

                        &.ui-state-active {
                            color: $calendarCellDateSelectedTextColor;
                            background-color: $calendarCellDateSelectedBgColor;
                        }
                    }
                }
            }
        }

        .ui-datepicker-buttonbar {
            border-top: $calendarButtonBarDivider;
        }

        .ui-timepicker {
            border: 0 none;
            border-top: $calendarTimePickerDivider;
            padding: $calendarTimePickerPadding;

            a {
                color:$calendarTimePickerIconColor;
                font-size: $calendarTimePickerIconFontSize;

                &:hover {
                    color: $calendarTimePickerIconHoverColor;
                }
            }

            span {
                font-size: $calendarTimePickerTimeFontSize;
            }
        }

        .ui-monthpicker {
            .ui-monthpicker-month {
                color: $textColor;

                &.ui-state-active {
                    color: $calendarCellDateSelectedTextColor;
                    background-color: $calendarCellDateSelectedBgColor;
                }
            }
        }

        &.ui-datepicker-timeonly {
            padding: 0;

            .ui-timepicker {
                border-top: 0 none;
            }
        }

        &.ui-datepicker-multiple-month {
            .ui-datepicker-group {
                border-right: $calendarMultipleMonthDivider;
                padding-right: $calendarPadding;
                padding-left: $calendarPadding;
                padding-top: 0;
                padding-bottom: 0;

                &:first-child {
                    padding-left: 0;
                }

                &:last-child {
                    padding-right: 0;
                    border-right: 0 none;
                }
            }
        }
    }

    .ui-calendar.ui-calendar-w-btn {
        .ui-inputtext {
            @include border-radius-right(0);
            border-right: 0 none;

            &:enabled:hover:not(.ui-state-error),
            &:enabled:focus:not(.ui-state-error) {
                border-right: 0 none;
            }
        }

        .ui-datepicker-trigger.ui-button {
            width: $buttonIconOnlyWidth;
            @include border-radius-left(0);
        }
    }

    .ui-fluid {
        .ui-calendar.ui-calendar-w-btn {
            input.ui-inputtext {
                width: calc(100% - #{$buttonIconOnlyWidth});
            }
        }
    }

    .ui-fileupload {
        .ui-fileupload-buttonbar {
            background-color: $panelHeaderBgColor;
            padding: $panelHeaderPadding;
            border: $panelHeaderBorder;
            color: $panelHeaderTextColor;
            border-bottom: 0 none;

            .ui-button {
                margin-right: 8px;
            }
        }

        .ui-fileupload-content {
            background-color: $panelContentBgColor;
            padding: $panelContentPadding;
            border: $panelContentBorder;
            color: $panelContentTextColor;
            line-height: $panelContentLineHeight;
        }

        .ui-progressbar {
            top: 0;
        }
    }

    .ui-fileupload-choose {
        &:not(.ui-state-disabled):hover {
            background-color: $buttonHoverBgColor;
            color: $buttonHoverTextColor;
            border-color: $buttonHoverBorderColor;
        }

        &:not(.ui-state-disabled):active {
            background-color: $buttonActiveBgColor;
            color: $buttonActiveTextColor;
            border-color: $buttonActiveBorderColor;
        }

        &.ui-state-focus {
            outline: $buttonFocusOutline;
            outline-offset: $buttonFocusOutlineOffset;
        }
    }

    .ui-password-panel {
        padding: $inputContentPanelPadding;
        background-color: $inputContentPanelBgColor;
        color: $inputContentPanelTextColor;
        border: $inputOverlayBorder;
        @include shadow($inputOverlayShadow);
    }

    .ui-inputgroup {
        .ui-inputgroup-addon {
            border-color: $inputGroupBorderColor;
            background-color: $inputGroupBgColor;
            color: $inputGroupTextColor;
            padding: $inputPadding;
            min-width: 2.5em;

            &:first-child {
                @include border-radius-left($borderRadius);
            }

            &:last-child {
                @include border-radius-right($borderRadius);
            }

            &.ui-inputgroup-addon-checkbox {
                position: relative;

                .ui-chkbox {
                    position: absolute;
                    top: 50%;
                    left: 50%;
                    margin-left: -1 * $checkboxWidth / 2;
                    margin-top: -1 * $checkboxHeight / 2;
                }
            }

            &.ui-inputgroup-addon-radiobutton {
                position: relative;

                .ui-radiobutton {
                    position: absolute;
                    top: 50%;
                    left: 50%;
                    margin-left: -1 * $radiobuttonWidth / 2;
                    margin-top: -1 * $radiobuttonHeight / 2;
                }
            }
        }

        .ui-button {
            &:first-child {
              @include border-radius-left($borderRadius);
            }

            &:last-child {
              @include border-radius-right($borderRadius);
            }
        }
    }

    .ui-fluid {
        .ui-inputgroup {
            .ui-button {
                width: auto;

                &.ui-button-icon-only {
                    width: $buttonIconOnlyWidth;
                }
            }
        }
    }

    .ui-calendar .ui-datepicker {
        min-width: auto;
    }

    ::-webkit-input-placeholder {color:$inputPlaceholderTextColor}
    :-moz-placeholder           {color:$inputPlaceholderTextColor}
    ::-moz-placeholder          {color:$inputPlaceholderTextColor}
    :-ms-input-placeholder      {color:$inputPlaceholderTextColor}

    /* Validations */
    .ui-inputtext.ng-dirty.ng-invalid,
    p-dropdown.ng-dirty.ng-invalid > .ui-dropdown,
    p-autocomplete.ng-dirty.ng-invalid > .ui-autocomplete > .ui-inputtext,
    p-calendar.ng-dirty.ng-invalid > .ui-calendar > .ui-inputtext,
    p-chips.ng-dirty.ng-invalid > .ui-inputtext,
    p-inputmask.ng-dirty.ng-invalid > .ui-inputtext,
    p-checkbox.ng-dirty.ng-invalid .ui-chkbox-box,
    p-radiobutton.ng-dirty.ng-invalid .ui-radiobutton-box,
    p-inputswitch.ng-dirty.ng-invalid .ui-inputswitch,
    p-listbox.ng-dirty.ng-invalid .ui-inputtext,
    p-multiselect.ng-dirty.ng-invalid > .ui-multiselect,
    p-spinner.ng-dirty.ng-invalid > .ui-inputtext,
    p-selectbutton.ng-dirty.ng-invalid .ui-button,
    p-togglebutton.ng-dirty.ng-invalid .ui-button {
        border: $inputErrorBorder;
    }
}
