body {
    .ui-paginator {
        padding: $headerPadding;
        background-color: $paginatorBgColor;

        .ui-paginator-first,.ui-paginator-prev,.ui-paginator-next,.ui-paginator-last {
            color: $textSecondaryColor;
            border: 1px solid transparent;
            @include transition(color .3s);

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

            &:not(.ui-state-disabled):focus {
                outline: 0 none;
                border: 1px solid $primaryColor;
            }
        }

        .ui-paginator-pages {
            .ui-paginator-page {
                color: $textSecondaryColor;
                border: 1px solid transparent;
                @include transition(color .3s);

                &.ui-state-active {
                    color: #ffffff;
                }

                &:not(.ui-state-active):hover {
                    background-color: $paginatorHoverBgColor;
                }

                &:focus {
                    outline: 0 none;
                    border: 1px solid $primaryColor;
                }
            }
        }
    }

    .ui-table {
        .ui-table-caption,
        .ui-table-summary {
            padding: $headerPadding;
            text-align: center;
            font-weight: bold;
        }

        .ui-table-caption {
            border-bottom: 0 none;
        }

        .ui-table-summary {
            border-top: 0 none;
        }

        .ui-table-thead > tr > th,
        .ui-table-tbody > tr > td,
        .ui-table-tfoot > tr > td {
            padding: $contentPadding;
        }

        .ui-table-thead > tr > th,
        .ui-table-tfoot > tr > td {
          background-color: #ffffff;
          padding: $headerPadding;
          border: 1px solid $contentBorderColor;
          color: $textColor;
        }

        .ui-sortable-column {
            color: $textColor;

            .ui-sortable-column-icon {
                color: $textSecondaryColor;
            }

            &:not(.ui-state-highlight):hover {
                @include list-item-hover();

                .ui-sortable-column-icon {
                    @include list-item-hover();
                }
            }

            &.ui-state-highlight {
                background-color: $primaryColor;
                color: #ffffff;
                border-top-color: $primaryColor;

                .ui-sortable-column-icon {
                    color: #ffffff;
                }
            }
        }

        .ui-table-tbody {
            > tr {
                background: $contentBgColor;

                > td {
                  background: inherit;
                  border: 1px solid $contentBorderColor;
                }

                &.ui-state-highlight {
                  background-color: $primaryColor;
                  color: #ffffff;
                }

                &.ui-contextmenu-selected {
                  background-color: darken($primaryColor, 20%);
                  color: #ffffff;
                }
            }

            > tr:nth-child(even) {
                background-color: $datatableEvenRowBgColor;

                &.ui-state-highlight {
                    background-color: $primaryColor;
                    color: #ffffff;
                }

                &.ui-contextmenu-selected {
                    background-color: darken($primaryColor, 20%);
                    color: #ffffff;
                }
            }
        }

        &.ui-table-hoverable-rows {
            .ui-table-tbody > tr.ui-selectable-row:not(.ui-state-highlight):not(.ui-contextmenu-selected):hover {
              cursor: pointer;
              background-color: darken($contentBorderColor,5%);
              border-color: darken($contentBorderColor,10%);
            }
        }
    }

    .ui-datatable {
        .ui-datatable-header, .ui-datatable-footer {
            padding: $headerPadding;
        }

        .ui-datatable-header {
            border-color: $headerBorderColor;
        }

        .ui-paginator {
            padding: $headerPadding;
        }

        .ui-datatable-thead {
            > tr {
                > th {
                    background-color: #ffffff;
                    padding: $headerPadding;
                    border-color: $contentBorderColor;
                    color: $textColor;

                    &.ui-sortable-column:not(.ui-state-active):hover {
                        background-color: darken($contentBorderColor,10%);
                    }

                    &.ui-state-active {
                        background-color: $primaryColor;
                        color: #ffffff;
                    }

                    &:focus {
                        outline: 0 none;
                        background-color: #f0f3f5;

                        &.ui-state-active {
                            background-color: lighten($primaryColor,5%);
                        }
                    }

                    .ui-column-title {
                        font-weight: 700;
                    }
                }
            }
        }

        .ui-datatable-tfoot {
            > tr {
                > td {
                    background-color: #ffffff;
                    padding: $headerPadding;
                    border-color: $contentBorderColor;
                    color: $textColor;
                }
            }
        }

        .ui-datatable-data {
            tr {
                &.ui-datatable-even {
                    background-color: $datatableOddRowBgColor;

                    &.ui-state-highlight {
                        background-color: $primaryColor;
                        color: #ffffff;
                        border-color: darken($primaryColor,5%);
                    }
                }

                &.ui-datatable-odd {
                    background-color: $datatableEvenRowBgColor;

                    &.ui-state-highlight {
                        background-color: $primaryColor;
                        color: #ffffff;
                        border-color: darken($primaryColor,5%);
                    }
                }

                &.ui-state-highlight {
                    border-color: darken($primaryColor,5%);
                }

                td {
                    padding: $contentPadding;
                    border-color: $contentBorderColor;

                    &.ui-editable-column {
                        &.ui-cell-editing {
                            .ui-inputtext {
                                border-color: $primaryColor;
                            }

                            .ui-datepicker table td a,
                            .ui-datepicker table td span {
                                min-width: 1.8em;
                            }
                        }
                    }

                    .ui-row-toggler {
                        color: $textColor;
                        @include transition(color .3s);

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

                &.ui-widget-header {
                    background-color: lighten($headerBgColor, 5%);
                    border-color: $headerBgColor;

                    a {
                        color: $headerTextColor;
                        @include transition(color .3s);

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

            &.ui-datatable-hoverable-rows {
                > tr.ui-widget-content:not(.ui-state-highlight):hover {
                    cursor: pointer;
                    background-color: darken($contentBorderColor,5%);
                    border-color: darken($contentBorderColor,10%);
                }
            }
        }

        .ui-datatable-scrollable-header,
        .ui-datatable-scrollable-footer {
            background-color: #f0f3f5;

            .ui-datatable-scrollable-header-box {
                td {
                    color: $textColor;
                }
            }
        }
    }

    .ui-organizationchart {
        .ui-organizationchart-node-content {
            &.ui-organizationchart-selectable-node:not(.ui-state-highlight):hover {
                @include list-item-hover();
            }

            &.ui-state-highlight {
                .ui-node-toggler {
                    i {
                        color: darken($primaryColor, 25%);
                    }
                }
            }
        }
        .ui-organizationchart-line-down {
            background-color: darken($contentBorderColor, 10%);
        }

        .ui-organizationchart-line-left {
            border-right: 1px solid darken($contentBorderColor, 10%);
        }

        .ui-organizationchart-line-right {

        }

        .ui-organizationchart-line-top {
            border-top: 1px solid darken($contentBorderColor, 10%);
        }

        .ui-organizationchart-node-content {
            border-color: darken($contentBorderColor, 10%);
        }

        .ui-organizationchart-node-content .ui-node-toggler {
            color: darken($contentBorderColor, 10%);
            bottom: -.7em;
            margin-left: -.43em;
        }
    }

    .ui-dataview {
        .ui-paginator {
            padding: $headerPadding;
        }
    }

    .ui-datagrid {
        .ui-datagrid-header {
            padding: $headerPadding;
        }

        .ui-paginator {
            padding: $headerPadding;
        }

        .ui-panel-titlebar {
            border-bottom: 1px solid $contentBorderColor;
            color: $textColor;
        }
    }

    .ui-datalist {
        .ui-datalist-header {
            padding: $headerPadding;
        }

        .ui-paginator {
            padding: $headerPadding;
        }
    }

    .ui-datascroller {
        .ui-datascroller-header,
        .ui-datascroller-footer {
            padding: $headerPadding;
        }
    }

    .ui-picklist {
        .ui-picklist-buttons {
            button {
                font-size: $fontSize + 2;
            }
        }

        .ui-picklist-caption {
            padding: $headerPadding;
        }

        .ui-picklist-list {
            .ui-picklist-item {
                padding: $listItemPadding;
                margin: 0;
                @include border-radius(0);

                &:not(.ui-state-highlight):hover {
                    @include list-item-hover();
                }
            }
        }
    }

    .ui-orderlist {
        .ui-orderlist-controls {
            margin-right: 10px;

            button {
                font-size: $fontSize + 2;
            }
        }

        .ui-orderlist-caption {
            padding: $headerPadding;
            box-sizing: border-box;
            width: 200px;
        }

        .ui-orderlist-list {
            box-sizing: border-box;

            .ui-orderlist-item {
                padding: $listItemPadding;
                margin: 0;
                @include border-radius(0);

                &:not(.ui-state-highlight):hover {
                    @include list-item-hover();
                }
            }
        }

        &.ui-grid-responsive {
            .ui-grid-row {
                .ui-orderlist-controls {
                    margin-right: 0;
                    padding-right: 10px;
                }
            }
        }
    }

    .ui-carousel {
        padding: 0;

        .ui-carousel-header {
            padding: $headerPadding;
            margin: 0;
            border: 0 none;
            border-bottom: 1px solid $headerBorderColor;
            @include border-radius(0);

            .ui-carousel-header-title {
                padding: 0;
            }
        }

        .ui-carousel-footer {
            padding: $headerPadding;
            border: 0 none;
            border-top: 1px solid $headerBorderColor;
            margin: 0;
            @include border-radius(0);
        }

        .ui-carousel-button {
            margin-top: .4em;
            @include transition(color .3s);

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

        .ui-carousel-page-links {
            margin-top: .4em;

            .ui-carousel-page-link {
                color: $headerIconColor;
                @include transition(color $transitionDuration);

                &:hover {
                    color: darken($headerIconColor, 10%);
                }

                &.pi-circle-off {
                    color: $headerIconColor;
                }

                &.pi-circle-on {
                    color: $primaryColor;
                }
            }
        }
    }

    .ui-treetable {
        .ui-paginator {
            padding: $headerPadding;
        }
        .ui-treetable-caption,
        .ui-treetable-summary {
            padding: $headerPadding;
            text-align: center;
            font-weight: bold;
        }

        .ui-treetable-caption {
            border-bottom: 0 none;
        }

        .ui-treetable-summary {
            border-top: 0 none;
        }

        .ui-treetable-thead > tr > th,
        .ui-treetable-tbody > tr > td,
        .ui-treetable-tfoot > tr > td {
            padding: $listItemPadding;
        }

        .ui-treetable-thead > tr > th,
        .ui-treetable-tfoot > tr > td {
            color: $headerTextColor;
            border: 1px solid $contentBorderColor;
        }

        .ui-treetable-thead tr .ui-inputtext {
            width: 100%;
        }

        .ui-treetable-scrollable-header {
            border: none;
        }

        .ui-treetable-loading-content {
            .pi-spin {
                -webkit-animation: 2s linear infinite fa-spin;
                animation: 2s linear infinite fa-spin;
                color: #ffffff;
            }
        }

        .ui-sortable-column {
            color: $textColor;

            .ui-sortable-column-icon {
                color: $textSecondaryColor;
            }

            &:not(.ui-state-highlight):hover {
                @include list-item-hover();

                .ui-sortable-column-icon {
                    @include list-item-hover();
                }
            }

            &.ui-state-highlight {
                background-color: $primaryColor;
                color: #ffffff;
                border-top-color: $primaryColor;

                .ui-sortable-column-icon {
                    color: #ffffff;
                }
            }

            .ui-sortable-column-icon {
                vertical-align: middle;
            }
        }

        .ui-treetable-tbody {
            > tr {
                background: $contentBgColor;

                > td {
                    background: inherit;
                    border: 1px solid $contentBorderColor;

                    .ui-treetable-toggler {
                        color: $textSecondaryColor;
                        .pi {
                            &.pi-chevron-right {
                                &:before {
                                    content: "\e905";
                                }
                                vertical-align: middle;
                            }

                            &.pi-chevron-down {
                                &:before {
                                    content: "\e906";
                                }
                                vertical-align: middle;
                            }
                        }
                    }

                    .ui-treetable-chkbox {
                        vertical-align: middle;
                        margin-right: .4em;
                    }
                }

                &.ui-state-highlight {
                    background-color: $primaryColor;
                    color: #ffffff;

                    > td {
                        background: inherit;
                        border: $dividerColor;

                        .ui-treetable-toggler {
                            color: #ffffff;
                        }
                    }

                    &.ui-contextmenu-selected {
                        background-color: $primaryColor;
                        color: #ffffff;
                    }
                }
            }
        }

        &.ui-treetable-hoverable-rows {
            .ui-treetable-tbody > tr:not(.ui-state-highlight):not(.ui-contextmenu-selected):hover {
                cursor: pointer;
                @include list-item-hover();
            }
        }
    }

    .ui-tree {
        padding: .25em .5em;

        .ui-treenode {
            padding: .15em 0;

            .ui-treenode-content {
                padding: 0 0 .25em 0;

                .ui-tree-toggler {
                    font-size: $fontSize + 2;
                    vertical-align: middle;
                    display: inline-block;
                    float: none;
                    margin: 0;
                }

                .ui-treenode-icon {
                    vertical-align: middle;
                    display: inline-block;
                    margin: 0;
                    font-size: $fontSize + 2;
                }

                .ui-treenode-label {
                    margin: 0;
                    vertical-align: middle;
                    display: inline-block;
                    padding: 0 .25em;

                    &.ui-state-highlight {
                        @include list-item-highlight();
                    }
                }

                .ui-chkbox {
                    margin: 0 .25em;
                }

                &.ui-treenode-selectable {
                    .ui-treenode-label:not(.ui-state-highlight):hover {
                        @include list-item-hover();
                    }
                }

                > span {
                    line-height: inherit;
                }
            }
        }

        &.ui-tree-horizontal {
            padding: .85em 0;

            .ui-treenode {
                background: url("../layout/images/tth-connector.png") repeat-x scroll center center transparent;

                .ui-treenode-content {
                    padding: $contentPadding;
                    background-color: #ffffff;
                    border: 1px solid $contentBorderColor;

                    &.ui-state-highlight {
                        @include list-item-highlight();
                    }

                    .ui-chkbox {
                        .ui-icon {
                            color: $primaryColor;
                        }
                    }

                    .ui-treenode-label:not(.ui-state-highlight):hover {
                        background-color: inherit;
                        color: inherit;
                    }

                    &.ui-treenode-selectable:not(.ui-state-highlight):hover {
                        @include list-item-hover();
                    }
                }
            }

            .ui-treenode-connector-line {
                background: url("../layout/images/tth-connector.png") repeat-y scroll 0 0 transparent
            }
        }
    }

    .fc {
        .fc-toolbar {
            .ui-icon-circle-triangle-e {
                background: none !important;
                font-family: 'primeicons';
                speak: none;
                font-style: normal;
                font-weight: normal;
                font-variant: normal;
                text-transform: none;
                line-height: 1;
                display: inline-block;
                -webkit-font-smoothing: antialiased;
                -moz-osx-font-smoothing: grayscale;
                text-indent: 0px !important;
                text-align: center;

                &:before {
                    content: "\e901";
                }
                height: auto;
                width: auto;
                overflow: visible;
            }

            .ui-icon-circle-triangle-w {
                background: none !important;
                font-family: 'primeicons';
                speak: none;
                font-style: normal;
                font-weight: normal;
                font-variant: normal;
                text-transform: none;
                line-height: 1;
                display: inline-block;
                -webkit-font-smoothing: antialiased;
                -moz-osx-font-smoothing: grayscale;
                text-indent: 0px !important;
                text-align: center;

                &:before {
                    content: "\e900";
                }
                height: auto;
                width: auto;
                overflow: visible;
            }
        }
        .fc-event-container {
            .fc-event {
                border-color: $primaryColor;
                background-color: darken($primaryColor,5%);
            }
        }
    }

    .ui-virtualscroller {
        .ui-virtualscroller-list {
            li {
                border-bottom: 1px solid $dividerColor;
            }
        }
    }
}
