.fti-body {
    overflow-y: visible;
}

    .fti-body > .row {
        width: 100%;
        margin: 0;
    }

.wv-search-details {
    border: none;
    font-size: 0.875rem;
    color: var(--muted);
}

.wv-filter {
    color: var(--muted);
}

.workview-dv-body .dv-body {
    padding: 0;
    overflow-x: hidden;
}

.wv-tag {
    background: rgba(var(--primary-rgb), 0.25);
    border-radius: 0.75rem;
    font-size: 0.875rem;
    color: var(--navy);
    padding: 0.25rem .5rem;
    transition: all .2s ease;
    display: flex;
    line-height: 0.875rem;
}

    .wv-tag span {
        display: block;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: pre;
        text-align: left;
    }

        .wv-tag span:first-child {
            font-size: 0.75rem;
            color: var(--muted);
        }

        /* last-of-type because there could be another elem after the tags, like remove comp */
        .wv-tag span:last-of-type:not(:first-child) {
            margin-left: auto;
        }

    .wv-tag:not(:last-child) {
        margin-bottom: .25rem;
    }

    .wv-tag[ng-click]:hover {
        cursor: pointer;
        background: rgba(var(--primary-rgb), 0.35);
    }

    .wv-tag .watch-item {
        display: inline;
        padding: 0.07rem 0.3rem;
        padding-right: 1.20rem;
    }

        .wv-tag .watch-item span:last-child {
            width: inherit;
            color: inherit;
        }

        .wv-tag .watch-item .watch-btn {
            padding: 0;
            line-height: 1;
            display: flex;
            flex-direction: column;
            justify-content: center;
        }

        .wv-tag .watch-item .context-item-btn {
            position: initial;
            padding: 0 0.3rem;
        }

.wv-tag-btn {
    background: rgba(var(--primary-rgb), 0.25);
    cursor: pointer;
    color: var(--navy);
    text-align: center;
}

    .wv-tag-btn:hover,
    .wv-tag.wv-tag-btn:hover {
        background: rgba(var(--primary-rgb), 0.35);
    }

#filterDialogFilters div.wv-tag.wv-tag-btn.clearAllBtn-right {
	float: right;
	background: transparent;
	justify-content: right;
}

.workview-app-filter {
    padding: .1rem .5rem .1rem 1rem;
    background: rgba(var(--primary-rgb), 0.25);
    border-radius: 1rem;
    font-size: 0.875rem;
    display: inline-block;
}

    .workview-app-filter label {
        font-weight: bold;
        opacity: 0.75;
        margin: 0;
    }

    .workview-app-filter .btn.btn-fa {
        padding: 0;
    }

.prescribed-workview-app-filter {
    padding: .1rem .5rem .1rem 1rem;
    background: rgba(var(--primary-rgb), 0.25);
    color: var(--navy);
    border-radius: 1rem;
    font-size: 0.875rem;
    display: inline-block;
}

    .prescribed-workview-app-filter label {
        font-weight: bold;
        margin: 0;
    }

    .prescribed-workview-app-filter .btn.btn-fa {
        padding: 0;
    }

		.prescribed-workview-app-filter .btn.btn-fa.workview-filter-remove {
			background-color: transparent;
		}

			.prescribed-workview-app-filter .btn.btn-fa.workview-filter-remove  span.fa-times-circle.text-light {
				color: #627895!important;
			}

.wv-header.zugo-header {
    padding: 0.5rem 1rem;
}

.wv-header .zugo-title {
    display: none !important;
}

.wv-body {
    padding: 1rem;
    overflow: auto;
}

.wv-loader {
    z-index: 200;
    position: fixed;
    width: 100%;
    bottom: 0;
    height: 10rem;
}

.wv-app-icon {
    display: table-cell;
    width: 3rem;
    vertical-align: middle;
    text-align: center;
    cursor: pointer;
}

.wv-item-date {
    font-size: .75rem;
    color: var(--muted);
}

.wv-body iframe {
    width: 100%;
    height: calc(100% - 8rem);
    border: 0;
    overflow: hidden;
    position: absolute;
    left: 0;
    right: 0;
    padding-top: 1rem;
}

.workview-content {
    width: 100%;
}

.wv-body iframe.load-off-screen {
    position: absolute;
    margin-left: -10000px;
}


/* WorkView card styles  */

.wv-card {
    margin-bottom: 0.5rem;
    width: 100%;
    display: flex;
}


    .wv-card.wv-card-stack {
        border: 1px solid var(--border-strong);
        margin: 0 0 1rem;
        position: relative;
    }

        .wv-card.wv-card-stack:before, .wv-card.wv-card-stack:after {
            background: var(--border-strong);
            height: 3px;
            position: absolute;
            content: '';
            display: block;
            bottom: -4px;
            border-radius: 0 0 .25rem .25rem
        }

        .wv-card.wv-card-stack:before {
            bottom: -6px;
            left: .5rem;
            right: .5rem;
        }

        .wv-card.wv-card-stack:after {
            bottom: -10px;
            left: 1rem;
            right: 1rem;
        }


/* WorkView card columns */

.wv-col {
    display: flex;
    justify-content: center;
    align-items: center;
    padding-bottom: 1.5rem;
    position: relative;
    text-align: center;
    flex-grow: 1;
}

    .wv-col h3 {
        position: absolute;
        bottom: 0;
        left: 0;
        width: 100%;
        text-align: center;
        padding: 0;
        margin: 0;
        font-size: .875rem;
        border: 0;
        font-weight: normal;
    }

    .wv-col > div {
        padding: 1rem;
        width: 100%;
    }

    .wv-col + .wv-col:before {
        display: block;
        content: '';
        position: absolute;
        top: 1rem;
        left: 0;
        bottom: 1rem;
        border-left: 1px solid var(--border-light);
    }

    .wv-col.wv-col-desc:before {
        display: none;
    }

    .wv-col.wv-section-col {
        padding: 0;
        flex-grow: 1;
        flex-basis: 42%;
        width: 42%;
    }

        .wv-col.wv-section-col > div {
            display: flex;
            height: 100%;
            width: 100%;
            padding: 1rem;
        }


        .wv-col.wv-section-col .wv-col > div {
            font-size: 1.325rem;
            word-break: break-word;
            font-weight: bold;
            letter-spacing: -0.05rem;
        }

        .wv-col.wv-section-col .wv-col {
            background: var(--background);
            margin: 0 0.25rem;
            border-radius: 1rem;
        }

            .wv-col.wv-section-col .wv-col:before {
                display: none;
            }

wv-col-details-options {
    display: flex;
}

.wv-col-details-options .btn {
    margin-top: .25rem;
}

.wv-col-tags {
    width: 16rem;
}

.wv-col-desc {
    width: 32%;
    text-align: left;
    justify-content: left;
    display: flex;
    padding-bottom: 0;
}

.wv-col.wv-col-details .wv-col-details-options {
    width: 16rem;
}

.wv-col.wv-col-indicator {
    padding: 0;
    flex: 0 0 auto;
    display: flex;
}

    .wv-col.wv-col-indicator > div {
        padding: 0;
        height: 100%;
        display: flex;
        flex-wrap: nowrap;
    }

.wv-embedded-resource {
    width: 100%;
    height: 100%;
    vertical-align: baseline;
    display: block;
    border: 0;
    margin: 0;
    padding: 0;
    -webkit-box-flex: 1;
    -ms-flex-positive: 1;
    flex-grow: 1;
}


.card-indicator,
a.card-indicator {
    width: 2rem;
    background: var(--muted);
    color: var(--text-contrast);
    display: flex;
    flex-direction: column;
    text-align: center;
    justify-content: center;
    text-decoration: none;
    cursor: pointer;
}

    .card-indicator.bg-mild,
    a.card-indicator.bg-mild {
        background: var(--box-border);
        color: var(--muted);
    }

    .card-indicator:first-child {
        border-radius: .25rem 0 0 .25rem;
    }

    .card-indicator.noclick {
        cursor: default;
    }

/* filters styles */
.wv-filter-dialog .btn {
    margin-right: 0;
}

.wv-filter-dialog .filter-controls {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -ms-flex-direction: row;
    flex-direction: row;
    -ms-flex-wrap: nowrap;
    flex-wrap: nowrap;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
}

.wv-filter-dialog .tag-filter-controls {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    gap: .5rem;
}

    .wv-filter-dialog .tag-filter-controls sng-filterbox,
    .wv-filter-dialog .tag-filter-controls input {
        max-width: none;
        width: 100%;
        margin-right: 0;
    }

.wv-filter-dialog .wv-filter-picker {
    margin-right: .5rem;
}

.wv-filter-dialog sng-filterbox div.form-control {
    width: 100%;
    margin-right: 0;
}

.wv-filter-dialog .form-control {
    -webkit-box-flex: 1;
    -ms-flex: 1 1 auto;
    flex: 1 1 auto;
    margin-right: .75rem;
}

.wv-filter-dialog .select-wrapper > span {
    z-index: 1;
}

.wv-filter-dialog .btn-narrow {
    min-width: 3rem;
}

.wv-filter-dialog .filter-controls .fa {
    margin-right: 0;
}

.wv-filter-dialog h3 {
    text-transform: none;
    font-weight: normal;
}

.wv-filter-dialog label {
    display: inline-block;
}

.zugo-header.zugo-header--workview {
    min-height: 5.6rem;
}

.wv-prescribed-toolbar {
    gap: .25rem;
}

    .wv-prescribed-toolbar .selected-rows-text {
        padding: 0 .25rem .25rem 1em;
        height: 2rem;
        text-align: left;
        line-height: 2rem;
    }

    .wv-prescribed-toolbar .nav-link span.fa {
        margin-right: .25rem;
        vertical-align: text-bottom;
        transform: translateX(-0.25rem);
    }

@media (min-width: 480px) {
}

@media (min-width: 768px) {
}

@media (min-width: 992px) {

    .wv-col-details-options {
        flex-direction: column;
    }

        .wv-col-details-options .btn,
        .wv-col-details-options div {
            width: 100%;
        }
}

@media (min-width: 1200px) {
    .wv-col-desc {
        width: 30%;
    }

    .wv-col.wv-col-details {
        padding-bottom: 0;
    }
}


/* Bootstrap large breakpoint */
@media only screen and (max-width: 1199.98px) {

    .wv-card:after {
        display: block;
        clear: both;
        content: '';
    }

    .wv-col {
        padding: 1.25rem 0 0;
    }

        .wv-col h3 {
            bottom: auto;
            top: 0;
            text-align: left;
            padding: .25rem 1rem
        }

        .wv-col + .wv-col:not(.wv-col-details):before {
            display: none;
        }

    .wv-card {
        line-height: 1.2rem;
    }

    .wv-card, .wv-col {
        display: flex;
        flex-wrap: wrap;
    }

    .wv-col-desc {
        width: 100%;
        padding-top: .25rem;
    }

    .wv-col.wv-section-col {
        width: 100%;
        flex-basis: 100%;
    }

    .wv-section-col .wv-col {
        display: table-cell;
    }

    .wv-col.wv-section-col .wv-col > div {
        text-align: left;
    }

    .wv-col-tags, .wv-col-details {
        width: 50%;
        float: left;
    }

    .wv-col.wv-col-details .wv-col-details-options {
        width: 14rem;
    }

    .wv-col.wv-col-indicator {
        flex: 1 1 auto;
    }

        .wv-col.wv-col-indicator > div {
            padding: 0;
            height: auto;
            display: flex;
            flex-wrap: nowrap;
            width: 100%;
        }

        .wv-col.wv-col-indicator .card-indicator {
            flex: 1 1 auto;
            padding: .25rem;
            border-radius: 0;
        }

            .wv-col.wv-col-indicator .card-indicator:first-child {
                border-top-left-radius: .25rem;
            }

            .wv-col.wv-col-indicator .card-indicator:last-child {
                border-top-right-radius: .25rem;
            }

    .wv-tag {
        font-size: 1rem;
        padding: .25rem .5rem;
    }


    .wv-section-col .wv-col:first-child:before,
    .wv-tags:before {
        display: none;
    }

    .wv-body iframe {
        height: 28rem !important;
        margin: 1rem 0;
        position: relative;
        overflow: visible;
        border-radius: .25rem;
        overflow: hidden;
        top: 0 !important;
    }
}

/* Bootstrap MD breakpoint */
@media only screen and (max-width: 991.98px) {
    .wv-col.wv-col-indicator .card-indicator {
        padding: 1rem;
    }
}

/* Bootstrap SM breakpoint */
@media only screen and (max-width: 767.98px) {

    .wv-col:before {
        display: none !important;
    }

    .wv-col > div {
        padding: .125rem 1rem;
    }

    .wv-card .wv-col {
        padding: .5rem 0;
        border: 0;
        border-bottom: 1px solid var(--box-border);
    }

    .wv-col.wv-section-col, .wv-col.wv-col-indicator {
        border: 0;
        padding: 0;
    }

        .wv-col.wv-section-col .wv-col {
            display: block;
            width: 100% !important;
            text-align: left;
        }

        .wv-col.wv-section-col > div {
            flex-wrap: wrap;
        }

        .wv-col.wv-section-col .wv-col > div {
            font-size: 1rem;
        }


    .wv-col {
        padding: 0;
    }

        .wv-col:after {
            display: block;
            content: '';
            clear: both;
        }

        .wv-col h3 {
            width: 35%;
            float: left;
            position: static
        }

        .wv-col > div {
            float: right;
            width: 65%;
        }

    .wv-col-tags, .wv-col-details {
        float: none;
        width: 100%;
    }

    .wv-col-details {
        padding-bottom: .5rem;
        width: 14rem;
    }

    .wv-col.wv-col-details .wv-col-details-options {
        width: 100%;
    }

    c

    .wv-col-desc > div {
        width: 100%;
    }

    .wv-col-desc h1 {
        font-size: 1rem;
    }

    .wv-col-desc :not(h1) span {
        font-size: .875rem;
    }

    .wv-col.wv-col-indicator {
        padding: 0;
        flex: 1 0 auto;
        width: 100%;
        flex-basis: 100%;
        display: flex;
    }

        .wv-col.wv-col-indicator > div {
            display: flex;
            width: 100%;
            flex-basis: 100%;
            align-items: stretch;
            flex-wrap: nowrap;
        }

        .wv-col.wv-col-indicator .card-indicator {
            flex: 1 1 auto;
            text-align: center;
        }

    .wv-col + .wv-col:before {
        display: none;
    }
}



.wv-item-title {
    display: flex;
    align-items: center;
    margin-bottom: 0.5rem;
}

.wv-from-to {
    background: var(--table-row);
    border-radius: 1rem;
    max-width: fit-content !important;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: .25rem .5rem;
    font-size: .875rem;
    line-height: 1.25rem;
}

    .wv-from-to .form-label {
        display: none;
    }


@media only screen and (max-width: 1023px) {
    .wv-card h1 {
        display: inline-block;
        margin-right: 1rem;
    }

	.dropdown .dd-menu.wv-filter-dialog {
		max-width: 90vw !important;
		max-height: 70vh !important;
	}
}

@media only screen and (max-width: 799px) {
	.dropdown .dd-menu.wv-filter-dialog {
		left: 0 !important;
	}
}

div.workview-filter-dialog-container {
	position: absolute;
	z-index: 991;
	display: flex;
	max-width: 450px;
}

/*! angularjs-slider - v7.0.0 -  (c) Rafal Zajac <rzajac@gmail.com>, Valentin Hervieu <valentin@hervi.eu>, Jussi Saarivirta <jusasi@gmail.com>, Angelin Sirbu <angelin.sirbu@gmail.com> -  https://github.com/angular-slider/angularjs-slider -  2019-02-23 */
.rzslider{position:relative;display:inline-block;width:100%;height:4px;margin:35px 0 15px 0;vertical-align:middle;user-select:none}.rzslider.noanimate *{transition:none!important}.rzslider.with-legend{margin-bottom:40px}.rzslider[disabled]{cursor:not-allowed}.rzslider[disabled] .rz-pointer{cursor:not-allowed;background-color:#d8e0f3}.rzslider[disabled] .rz-draggable{cursor:not-allowed}.rzslider[disabled] .rz-selection{background:#8b91a2}.rzslider[disabled] .rz-tick{cursor:not-allowed}.rzslider[disabled] .rz-tick.rz-selected{background:#8b91a2}.rzslider span{position:absolute;display:inline-block;white-space:nowrap}.rzslider .rz-base{width:100%;height:100%;padding:0}.rzslider .rz-bar-wrapper{left:0;z-index:1;width:100%;height:32px;padding-top:16px;margin-top:-16px;box-sizing:border-box;transition:all linear .3s}.rzslider .rz-draggable{cursor:move}.rzslider .rz-bar{left:0;z-index:1;width:100%;height:4px;background:#d8e0f3;-webkit-border-radius:2px;-moz-border-radius:2px;border-radius:2px}.rzslider .rz-bar-wrapper.rz-transparent .rz-bar{background:transparent}.rzslider .rz-bar-wrapper.rz-left-out-selection .rz-bar{background:#df002d}.rzslider .rz-bar-wrapper.rz-right-out-selection .rz-bar{background:#03a688}.rzslider .rz-selection{z-index:2;background:#0db9f0;-webkit-border-radius:2px;-moz-border-radius:2px;border-radius:2px;transition:background-color linear .3s}.rzslider .rz-restricted{z-index:3;background:#f00;-webkit-border-radius:2px;-moz-border-radius:2px;border-radius:2px}.rzslider .rz-pointer{top:-14px;z-index:3;width:32px;height:32px;cursor:pointer;background-color:#0db9f0;-webkit-border-radius:16px;-moz-border-radius:16px;border-radius:16px;transition:all linear .3s}.rzslider .rz-pointer:after{position:absolute;top:12px;left:12px;width:8px;height:8px;background:#fff;-webkit-border-radius:4px;-moz-border-radius:4px;border-radius:4px;content:''}.rzslider .rz-pointer:hover:after{background-color:#fff}.rzslider .rz-pointer.rz-active{z-index:4}.rzslider .rz-pointer.rz-active:after{background-color:#451aff}.rzslider .rz-bubble{bottom:16px;padding:1px 3px;color:#55637d;cursor:default;transition:all linear .3s}.rzslider .rz-bubble.rz-limit{color:#55637d;transition:none}.rzslider .rz-ticks{position:absolute;top:-3px;left:0;z-index:1;width:100%;height:0;margin:0;list-style:none;box-sizing:border-box}.rzslider .rz-ticks-values-under .rz-tick-value{top:auto;bottom:-32px}.rzslider .rz-tick{position:absolute;top:0;left:0;width:10px;height:10px;margin-left:11px;text-align:center;cursor:pointer;background:#d8e0f3;border-radius:50%;transition:background-color linear .3s}.rzslider .rz-tick.rz-selected{background:#0db9f0}.rzslider .rz-tick-value{position:absolute;top:-30px;transform:translate(-50%,0)}.rzslider .rz-tick-legend{position:absolute;top:24px;max-width:50px;white-space:normal;transform:translate(-50%,0)}.rzslider.rz-vertical{position:relative;width:4px;height:100%;padding:0;margin:0 20px;vertical-align:baseline}.rzslider.rz-vertical .rz-base{width:100%;height:100%;padding:0}.rzslider.rz-vertical .rz-bar-wrapper{top:auto;left:0;width:32px;height:100%;padding:0 0 0 16px;margin:0 0 0 -16px}.rzslider.rz-vertical .rz-bar{bottom:0;left:auto;width:4px;height:100%}.rzslider.rz-vertical .rz-pointer{top:auto;bottom:0;left:-14px!important}.rzslider.rz-vertical .rz-bubble{bottom:0;left:16px!important;margin-left:3px}.rzslider.rz-vertical .rz-ticks{top:0;left:-3px;z-index:1;width:0;height:100%}.rzslider.rz-vertical .rz-tick{margin-top:11px;margin-left:auto;vertical-align:middle}.rzslider.rz-vertical .rz-tick-value{top:auto;left:24px;transform:translate(0,-28%)}.rzslider.rz-vertical .rz-tick-legend{top:auto;right:24px;max-width:none;white-space:nowrap;transform:translate(0,-28%)}.rzslider.rz-vertical .rz-ticks-values-under .rz-tick-value{right:24px;bottom:auto;left:auto}

/* START incentshared.css */
.incent-status-header {
    width: 7rem;
    color: white !important;
}

.incent-status-header-enabled {
    background-color: rgb(110, 186, 43) !important;
}

.incent-status-header:not(.incent-status-header-enabled) {
    background-color: rgb(231, 59, 78) !important;
}

.sort-column:hover {
    cursor: pointer;
}

/* START incentdistributiontable.css */
.incent-distribution-table {
    width: 100%;
    max-height: 75vh;
    overflow-y: auto;
}

    .incent-distribution-table .distribution-table-header {
        padding: 1rem;
        border-bottom: 2px solid white
    }

        .incent-distribution-table .distribution-table-header .distribution-table-section {
            width: 50%;
        }

    .incent-distribution-table .distribution-table-header-underlined {
        border: none;
        border-radius: 0;
        border-bottom: 2px solid #dc3545 !important;
        border-bottom: 2px solid var(--red) !important;
    }

    .incent-distribution-table .distribution-table-body {
        width: 100%;
    }

    .incent-distribution-table .distribution-table-row {
        display: flex;
        flex-direction: row;
        border-bottom: 2px solid white
    }

    .incent-distribution-table .distribution-table-row-selectable:hover {
        background-color: white;
        cursor: pointer;
    }

    .incent-distribution-table .distribution-table-row .distribution-table-row-content {
        padding: 0.5rem 1rem;
        flex-grow: 1;
    }

    .incent-distribution-table .distribution-table-row .distribution-table-row-content {
        padding: 0.5rem 1rem;
        flex-grow: 1;
    }

    .incent-distribution-table .distribution-table-row .distribution-table-row-icon {
        padding: 1rem;
        font-size: 1.25rem
    }

    .incent-distribution-table .distribution-table-row .distribution-table-row-icon-active {
        color: #28a745;
        color: var(--green);
    }

    .incent-distribution-table .distribution-table-row .distribution-table-tag-active {
        background-color: rgba(var(--success-rgb), 0.2);
        color: var(--success-dark);
        color: var(--success-dark);
    }

    .incent-distribution-table .distribution-table-row .distribution-table-row-title {
        padding-right: 1rem;
    }

    .incent-distribution-table .distribution-table-row .distribution-table-row-description {
        color: #6c757d;
        color: var(--secondary);
    }

    .incent-distribution-table .distribution-table-row .distribution-table-row-buttons {
        padding: 0.75rem;
    }

        .incent-distribution-table .distribution-table-row .distribution-table-row-buttons button {
            float: right;
            min-width: 3rem;
        }

    .incent-distribution-table .distribution-table-row .distribution-table-tag-icon {
        padding-right: 0.25rem;
    }

.incent-distribution-lightbox-message {
    padding-bottom: 0.75rem;
}

.incent-distribution-table .distribution-table-info-button {
    background-color: #17a2b8;
    background-color: var(--info);
}

/* START incentoffergroupmanagement.css */
.incent-offer-group-table .incent-offer-group-table-icon-row {
    width: 4rem;
    text-align: center;
}

    .incent-offer-group-table .incent-offer-group-table-icon-row button {
        width: 4rem;
        text-align: center;
    }

.incent-offer-group-table .rank-column-right {
    margin: -0.5rem 0;
}

.incent-offer-group-table .rank-button {
    cursor: pointer;
    min-width: 0;
    min-height: 0;
    display: block;
    color: #ce0037;
}

    .incent-offer-group-table .rank-button:disabled {
        color: var(--muted);
    }

.incent-offer-group-detail-section .incent-detail-top-row {
    margin-bottom: 0.75rem;
}

    .incent-offer-group-detail-section .incent-detail-top-row .section {
        height: 100%;
    }

.offer-group-delete-content {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    padding: 20px;
    height: 100%
}


/* START incentoffermanagement.css */
.offer-detail-section {
    padding: 1rem;
}

    .offer-detail-section .section {
        width: 100%;
        height: 98%;
    }

    .offer-detail-section .offer-detail-top-row .section {
        min-height: 32rem;
    }

    .offer-detail-section textarea {
        width: 24rem;
    }

    .offer-detail-section rowtitle {
        width: 100%;
    }

    .offer-detail-section .offer-code-dates {
        color: var(--muted);
    }

    .offer-detail-section .offer-detail-codes-list {
        max-height: 26rem;
        padding-right: 0.5rem;
        overflow-y: auto;
    }

    .offer-detail-section .receipt-detail-column {
        border-left: 1px solid rgba(0,0,0,.125);
        padding-left: 1rem;
        overflow-x: auto;
    }

@media (max-width: 1199.98px) { /* Bootstrap XL */
    .offer-detail-section .receipt-detail-column {
        padding-top: 0.5rem;
        padding-left: 0.5rem;
        border-left: 0px solid var(--box-border);
    }
}

.offer-detail-section .receipt-preview {
    display: inline-block;
    padding: 0.75rem;
    border: 1px solid black;
    max-height: 26rem;
    overflow-y: auto;
    white-space: pre-line;
}

    .offer-detail-section .receipt-preview .receipt-preview-line pre {
        margin-bottom: 0;
    }

        .offer-detail-section .receipt-preview .receipt-preview-line pre.receipt-preview-centered {
            text-align: center;
        }

        .offer-detail-section .receipt-preview .receipt-preview-line pre.receipt-preview-img-line {
            text-align: center;
        }

        .offer-detail-section .receipt-preview .receipt-preview-line pre.receipt-preview-bold {
            font-weight: 600;
        }

        .offer-detail-section .receipt-preview .receipt-preview-line pre:empty {
            height: 1.5em;
        }

    .offer-detail-section .receipt-preview span {
        padding: 0.5rem;
    }

.offer-detail-section .datetime-input-container {
    padding: 0.75rem 1rem;
    border: 1px solid var(--box-border);
    border-radius: 0.5rem;
    float: left;
}

.offer-detail-section .datetime-input-container-separator {
    float: left;
    color: var(--muted);
    padding: 1rem 1.25rem;
}

.offer-detail-section .redemption-fields fieldset {
    float: left;
}

    .offer-detail-section .redemption-fields fieldset:not(:first-child) {
        padding-left: 1.75rem
    }

.offer-detail-section .redemption-fields .redemption-field-append {
    float: left;
    color: var(--muted);
    margin-top: 0.25rem;
}

.offer-detail-section .incent-offer-controls-section {
    height: 100%;
}

.offer-table-section .incent-active-date-header {
    width: 18rem;
}

/* START incentslider.css */
.incent-slider {
    --sliderColorModel: #5d20bf;
    --sliderColorRandom: #10b2c7;
    --sliderColorControl: #5dc910;
    margin-bottom: 1rem;
}

    .incent-slider .distribution-fields {
        display: inline-block;
    }

        .incent-slider .distribution-fields fieldset {
            float: left;
        }

            .incent-slider .distribution-fields fieldset:not(:first-child) {
                margin-left: 1.75rem
            }

        .incent-slider .distribution-fields input {
            float: left;
            width: 4rem;
        }

        .incent-slider .distribution-fields .distribution-field-append {
            float: right;
            margin-top: 0.25rem;
        }

        .incent-slider .distribution-fields .distribution-field-model label,
        .incent-slider .distribution-fields .distribution-field-model .distribution-field-append {
            color: #5d20bf;
            color: var(--sliderColorModel);
        }

        .incent-slider .distribution-fields .distribution-field-model input:not(:focus) {
            border-color: #5d20bf;
            border-color: var(--sliderColorModel);
        }

        .incent-slider .distribution-fields .distribution-field-random label,
        .incent-slider .distribution-fields .distribution-field-random .distribution-field-append {
            color: #10b2c7;
            color: var(--sliderColorRandom);
        }

        .incent-slider .distribution-fields .distribution-field-random input:not(:focus) {
            border-color: #10b2c7;
            border-color: var(--sliderColorRandom);
        }

        .incent-slider .distribution-fields .distribution-field-control label,
        .incent-slider .distribution-fields .distribution-field-control .distribution-field-append {
            color: #5dc910;
            color: var(--sliderColorControl);
        }

        .incent-slider .distribution-fields .distribution-field-control input:not(:focus) {
            border-color: #5dc910;
            border-color: var(--sliderColorControl);
        }

    .incent-slider .control-error-message {
        z-index: 1;
    }



files-app, [files-app] {
	width: 100%;
	flex-grow: 1;
	display: flex;
	height: 100%;
}


	files-app .sidebar, [files-app] .sidebar {
		overflow-x: auto;
		width: 20rem;
		padding: 0 1rem;
	}


.files-embedded #files-browser,
.mode-lite #files-browser {
	left: 0;
	border-left: 0;
}

.mode-lite .ribbon > li .files-button-up {
	display: block;
}

#files-lightbox-save-bar {
	float: left;
	width: 70%;
	padding-right: 140px;
	position: relative;
}

.mode-save #files-lightbox-save-bar {
	display: table;
	float: left;
}

.mode-save .files-lite-save-bar {
	display: block;
}

#files-lightbox-save-bar .select-wrapper {
	display: table-cell;
	width: 15rem;
}

#files-userswitcher .autocomplete-content-wrapper {
	display: none;
}

#files-userswitcher .autocomplete-input {
	margin: 0;
}

#files-lite-container {
	z-index: 99;
}


.files-panel {
	height: calc(100% - 1rem) !important;
	background: var(--box);
	box-shadow: var(--shadow-medium);
	border-radius: 1rem;
	padding: .5rem;
}

	.files-panel .table, .files-panel thead th {
		border-width: 0;
		border-bottom-width: 1px;
	}

	.files-panel td {
		word-break: break-word;
	}

	.files-panel tbody tr:hover {
		cursor: pointer;
		background: var(--table-row-hover);
	}

	.files-panel tbody tr.folder .fa {
		font-size: 1.125rem;
		position: relative;
		top: .125rem;
		color: var(--navy);
	}

.lightbox .files-panel {
	box-shadow: none;
	display: flex;
	flex-direction: column;
}

.files-toggle-switch {
	margin-left: 1rem;
	padding: .25rem 0 0;
}

.navbar-nav .nav-item.files-filter {
	justify-content: flex-end;
	margin-left: auto;
}

.files-filter > input {
	height: 1.875rem;
	width: 15vw;
	min-width: 12rem;
}


.files-filter .cancel-search {
	position: absolute;
	top: 8px;
	right: 10px;
	color: var(--muted);
}

.files-row {
	background: var(--box-border);
}

.files-col {
	min-width: 3rem;
}

.files-col-checkbox, .files-col-icon {
	width: 2.75rem;
	min-width: 2.75rem;
}

.files-col-icon {
	color: var(--navy);
}

	.files-col-icon .fa {
		font-weight: bold;
	}

.files-col-description {
	width: 35%;
}

.files-col-displayname {
	width: 25%;
}

.files-col-updateddatetime {
	width: 11rem;
	min-width: 8rem;
}

files-ribbon {
	display: flex;
	width: auto;
	flex-grow: 1;
	gap: 0.25rem;
}

.files-selector-button {
	min-width: 13rem;
}

.files-head .table thead {
	background: 0;
}

.files-head {
}


/* Files App */

.files-nodes {
	overflow: hidden;
}

.files-selected-count {
	position: absolute;
	bottom: .75rem;
	left: 50%;
	background: var(--navy);
	color: var(--text-contrast);
	padding: .375rem 1rem;
	width: 18rem;
	text-align: left;
	margin-left: -9rem;
	border-radius: 1rem;
	box-shadow: 0 2px 10px rgba(10,10,20,0.3);
	z-index: 5;
}

	.files-selected-count .text-accent {
		color: var(--primary-base) !important;
	}

.fixed-table-container {
	position: relative;
	height: 100%;
}

.files-save-bar {
	width: calc(100% - 14rem);
	float: left;
	max-width: 60rem;
}


.lightbox files-app, lightbox [files-app] {
	display: flex;
	flex-direction: column;
	width: 100%;
}


.files-lb-buttons, .container-fluid.files-lb-buttons {
	flex: 0 0 auto;
	-ms-flex: 0 0 auto;
	-webkit-box-flex: 0 0 auto;
	display: flex;
	width: 100%;
	padding: 1rem;
	align-items: center;
}

	.files-lb-buttons .form-control-container {
		width: 100%;
	}

.files-panel .table {
	table-layout: fixed;
	border-collapse: collapse;
}

/* make sure the text node spans at least the width of its parent */

files-app .node > .node-text, [files-app] .node > .node-text {
	text-overflow: ellipsis;
	overflow: hidden;
}


/* ================== RESPONSIVE */

.nav-item.files-filter {
	position: fixed;
	top: 4rem;
	right: 1rem;
}

#impersonating-notification ~ .flex-body .nav-item.files-filter,
#impersonating-notification ~ .app-menu .nav-item.files-filter {
	top: 6.75rem;
}

#react-top-alert-root:has(.service-alert) ~ .flex-body .nav-item.files-filter,
#react-top-alert-root:has(.service-alert) ~ .app-menu .nav-item.files-filter {
	top: 6.75rem;
}

.lightbox .nav-item.files-filter {
	position: static;
	top: initial;
	right: initial;
}

/* Files directory path */

.files-directory-path {
	font-size: 1rem;
	padding-left: 1rem;
	padding-right: 1rem;
	padding-top: 0.25rem;
	height: 2rem;
	white-space: nowrap;
	overflow-x: scroll;
	-ms-overflow-style: none; /* for Internet Explorer, Edge */
	scrollbar-width: none; /* for Firefox */
}

	.files-directory-path::-webkit-scrollbar {
		display: none; /* for Chrome, Safari, and Opera */
	}

.files-directory-path-item:hover {
	text-decoration: underline;
	cursor: pointer;
}

.files-directory-path-chevron::after {
	font-family: 'Font Awesome 6 Pro';
	content: '\f105';
	color: #627895;
	margin: 0 0.5rem;
	font-size: .875rem;
	font-weight: 300;
}

.files-directory-path-lightbox-title {
	height: 4rem !important;
}

.files-directory-path-go-up {
	margin-right: 0.5rem !important;
	height: 2rem;
}

.files-directory-path-go-up-icon {
	padding: 0 0.5rem 0;
	line-height: 2rem;
	font-size: .875rem;
	width: 100%;
}

.files-compass-chevron {
	margin: 0 0.25rem;
	font-size: .5rem;
}

	.files-compass-chevron::before {
		margin-bottom: 0.25rem;
	}

.fixed-btn-size{
	width:137px !important;
}
/* *** Breakpoints *** */

/* Large devices (desktops, less than 1200px)*/
@media (max-width: 1199.98px) {
	.files-col-displayname {
		width: 22%;
	}

	.files-col-description {
		width: 30%;
	}

	.files-col-updateddatetime {
		width: 9rem;
	}
}

@media screen and (max-width: 991px) {
	.nav-item.files-filter {
		position: static;
	}
	.fixed-btn-size{
		width:inherit !important;
	}
}

@media (min-width:991px) and (max-width:1074px) {
	/* .nav-item.files-filter{
		margin-top: 1.5rem !important;
	} */
	.files-ribbon-lightbox .nav-item.files-filter {
		margin-top: 0rem !important;
	}
}

@media (min-width:1200px) and (max-width:1306px) {
	/* .nav-item.files-filter{
		margin-top: 1.5rem !important;
	} */
	.files-ribbon-lightbox .nav-item.files-filter {
		margin-top: 0rem !important;
	}
}

@media only screen and (max-width: 991px) {
	.files-directory-path {
		visibility: hidden;
		display: none;
	}

	.files-directory-path-go-up {
		margin-right: 0 !important;
	}

	files-ribbon {
		flex-direction: column;
	}
}


.fti-container {
	padding-top: 1rem;
}

	.fti-container .header {
		top: 0;
		left: 0;
		z-index: 2;
		background: var(--box);
		box-shadow: rgba(0, 0, 0, 0.15);
		white-space: nowrap;
		text-overflow: ellipsis;
		overflow-x: hidden;
	}

.fti-table {
	display: table;
	padding: 1rem;
	width: 100%;
}

.fti-row {
	display: table-row;
	width: 100%;
	border-bottom: 1px solid var(--border-light);
}

	.fti-row > div {
		display: table-cell;
		vertical-align: middle;
	}

	.fti-row + .fti-row {
		border-top: 0;
	}

.ia-tile-row h2 {
	margin: 0 0 .5rem;
}

/* inline help  within FTI tile */
.fti-row sng-local-help-item,
.ia-tile-row sng-local-help-item {
	-webkit-transform: translate(5px, -1px);
	transform: translate(5px, -1px);
}


.wv-sng-zugo .zugo-header {
	display: none;
}

.wv-sng-zugo .zugo-body table td.priority-col div {
	margin: auto;
}

/* This style is used for the first column to show red/amber/green icon */
.outlier-metric-sng-zugo .zugo-body table th:nth-child(1),
.outlier-metric-sng-zugo .zugo-body table td:nth-child(1) {
	width: 1rem;
	padding: 0;
	background-color: transparent;
}

	.outlier-metric-sng-zugo .zugo-body table th:nth-child(1) .sort-spinner {
		display: none;
	}

.outlier-metric-sng-zugo .zugo-body th:nth-child(1) .fa-sort,
.outlier-metric-sng-zugo .zugo-body th:nth-child(1) .fa-sort-asc,
.outlier-metric-sng-zugo .zugo-body th:nth-child(1) .fa-sort-desc {
	margin: auto;
	margin-top: .5rem !important;
	align-self: end;
}

.priority-col {
	width: 1rem;
	background: rgba(var(--success-rgb), 0.14) !important;
	padding: .25rem;
	position: relative;
	display: flex;
	width: 2rem;
	height: 3rem;
	align-items: center;
	border-radius: .75rem;
	justify-content: center;
}

	.priority-col div, .priority-col div:before, .priority-col div:after {
		width: .5rem;
		height: 0.3875rem;
		background: rgba(var(--success-rgb), 0.2);
		border-radius: .5rem;
	}

	.priority-col div {
		position: relative;
	}

		.priority-col div:before, .priority-col div:after {
			display: block;
			content: '';
			position: absolute;
			left: 0;
		}

		.priority-col div:before {
			top: -.75rem;
		}

		.priority-col div:after {
			bottom: -.75rem;
			top: auto;
		}

.red .priority-col {
	background: rgba(var(--danger-rgb), 0.1) !important;
}

	.red .priority-col div, .red .priority-col div:before, .red .priority-col div:after {
		background: var(--danger);
	}

.green .priority-col {
	background: rgba(var(--success-rgb), 0.14) !important;
}

	.green .priority-col div:after {
		background: var(--success);
	}

	.green .priority-col div, .green .priority-col div:before {
		background: rgba(var(--success-rgb), 0.2);
	}

.amber .priority-col {
	background: rgba(var(--warning-rgb), 0.14) !important;
}

	.amber .priority-col div, .amber .priority-col div:after {
		background: var(--warning-secure);
	}

		.amber .priority-col div:before {
			background: rgba(var(--warning-rgb), 0.2);
		}

.amber .fti-message {
	color: var(--warning-dark);
}

	.amber .fti-message .fa:before {
		content: '\f06a';
		font-weight: bold;
	}

.red .fti-message {
	color: var(--danger-dark);
}

	.red .fti-message .fa:before {
		content: '\f06a';
		font-weight: bold;
	}

.green .fti-message .fa {
	display: none;
}

/* not processed tile */
.fti-row.notprocessed .priority-col {
	background: var(--muted);
}

.fti-row.notprocessed .fti-message {
	color: var(--muted);
}

	.fti-row.notprocessed .fti-message .fa:before {
		content: '\f06a';
	}

.fti-row.notprocessed .btn-link {
	display: none;
}

.fti-row:after {
	display: block;
	clear: both;
	content: '';
}



.fti-container .header + .fti-body {
	height: calc(100% - 4.5rem);
	top: 4.5rem;
	padding-top: 1rem;
}

.synopsis-preview {
	min-height: 100%;
}

.target-search-validation {
	padding: 1rem;
	border-radius: 1rem;
	border: 1px solid var(--background);
}

	.target-search-validation .form-label {
		margin-bottom: .5rem;
	}

	.target-search-validation ul {
		list-style: none;
	}

	.target-search-validation .fa {
		color: var(--muted);
	}

	.target-search-validation .fa-check {
		color: var(--success);
	}

	.target-search-validation .fa-times {
		color: var(--danger);
	}

.supporting-search {
}

	.supporting-search .supporting-search-title, .supporting-search .supporting-search-subtitle {
		color: var(--muted);
		font-weight: 600;
		padding-bottom: 1rem;
	}

	.supporting-search .supporting-search-title {
		font-size: 1.125rem;
	}

	.supporting-search .supporting-search-subtitle {
		font-size: 1rem;
	}

	.supporting-search .supporting-search-sidebar {
		border-right: 1px solid var(--border-light);
	}

	.supporting-search .supporting-search-navlink {
		border-left: 3px solid transparent;
		margin-left: -1rem;
		padding-left: 1.1rem;
	}

		.supporting-search .supporting-search-navlink.active {
			box-shadow: 1px 1px 8px 1px rgba(0, 0, 0, 0.24);
			/*          border-left: 3px solid var(--navy);
            color: var(--navy);*/
		}

.param-mapping-group {
	position: relative;
	border: 1px dotted #d0dde8;
	border-left: 3px solid;
	border-radius: 0 .25rem .25rem 0;
	margin-bottom: .5rem;
	border-left-color: rgb(14,114,161);
}

.guidelines-list {
	list-style: none;
	padding: 0;
	margin: .5rem, 0 0;
	max-height: 24rem;
	max-width: 100%;
	overflow-x: hidden;
	overflow-y: auto;
}

	.guidelines-list li {
		position: relative;
		padding: .5rem;
		max-width: 40rem;
		background: var(--table-row);
		border: 1px solid var(--table-border);
		font-size: .875rem;
		padding-right: 1.5rem;
		word-break: break-word;
	}

	.guidelines-list .fa-remove {
		color: var(--muted);
		cursor: pointer;
		padding: .25rem;
		position: absolute;
		right: .25rem;
		top: .35rem;
	}

		.guidelines-list .fa-remove:hover {
			color: var(--navy);
		}

/* override for BS badge, requires .vw-badge */

.badge.wv-priority-badge {
	font-weight: normal;
	font-size: .875rem;
	color: var(--navy);
	background: transparent;
	border: 1px solid var(--box-border);
	vertical-align: text-bottom;
	padding: .25rem .5rem;
	border-radius: .75rem;
	display: flex;
	justify-content: center;
	align-items: center;
	width: fit-content;
	padding: 0 0.75rem;
	height: 2rem;
	margin: 0.125rem;
}

.wv-priority-badge.priority-1 {
	color: var(--success-dark);
	border-color: rgba(var(--success-rgb), 0.25);
}

.wv-priority-badge.priority-2 {
	color: var(--warning-dark);
	border-color: rgba(var(--warning-rgb), 0.25);
}

.wv-priority-badge.priority-3 {
	color: var(--danger-dark);
	border-color: rgba(var(--danger-rgb), 0.2);
}

/*override display for searches optional .wic - means work item composer*/
.wic-nav-item {
	display: contents;
	position: relative;
	margin: 0;
}

.fti-supporting-searches {
	border: 1px solid var(--box-border);
	border-radius: .75rem;
}

.fti-supporting-searches .subsection-title {
	display: flex;
	align-items: center;
	gap: .5rem;
}

.fti-supporting-search-list {
	display: flex;
	flex-wrap: nowrap;
	gap: .5rem;
}

.fti-supporting-search-list .btn {
	flex-shrink: 0;
	margin-right: 0;
}

#fti-supporting-search-more {
	display: flex;
	flex-shrink: 0;
}


#dsn-visual-container .form-group {
   margin-bottom: 1rem;
}

.btn-composer {
	min-width: 1.25rem;
	padding: 0;
	line-height: 1.25rem;
	height: auto;
	margin: 0 !important;
	min-height: 0;
}

.header.header-explorer {
	padding: 0 .5rem 0;
	height: auto;
	background: 0;
	min-height: 0;
}

.search-history-action {
	float: right;
	padding-top: .5rem;
}

.composer-column {
	display: inline-block;
	padding: .25rem .75rem;
	background: var(--box);
	border: 1px solid var(--box-border);
	color: var(--muted);
}

.composer-row.selected-row .composer-column {
	padding: .5rem .875rem;
	color: var(--text);
}

.composer-row.error {
	border-left: 4px solid red !important;
	margin-left: -4px !important;
}

.composer-column.selected {
	border: 1px solid var(--muted);
	background: var(--box-border);
	color: var(--muted);
	z-index: 1;
	position: relative;
	width: 20rem;
	text-align: center;
}

.composer-control {
	display: inline-block;
}


.composer-column,
.composer-control,
.accordion-option {
	cursor: pointer;
}

.accordion-option {
	margin-left: 1rem;
}

.composer-accordion-provider .accordion-option {
	margin-left: 0.5rem;
}

.accordion-option.selected {
	border: 1px solid var(--primary-base);
}

.composer-row .composer-column + .composer-column {
	margin-left: -1px;
}

.composer-row button.fa:disabled {
	color: var(--text-disabled);
	cursor: not-allowed;
}

/* Accordion */

.composer-accordion-wrapper {
	position: absolute;
	z-index: 105;
}

.composer-accordion {
	padding: 0;
	background: var(--modal);
	width: 20rem;
	border-radius: 1rem;
}

.accordion-hidden {
	display: none;
}

.composer-accordion > div:first-child {
	border-bottom: 1px solid var(--box-border);
	padding: .375rem;
}

.composer-accordion > div:nth-child(2) {
	max-height: 20rem;
	overflow-y: auto;
}


.composer-accordion > div:first-child input {
	max-width: 100%;
}

.accordion-body {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-orient: vertical;
	-webkit-box-direction: normal;
	-ms-flex-direction: column;
	flex-direction: column;
	height: 100%;
}

/* TODO: Remove these HTML elements once old design no longer accessible */
.add-expression-label {
	display: none !important;
}

.accordion-row,
.accordion-row-component {
	display: block;
	padding: .375rem .5rem;
	cursor: pointer;
	border-bottom: 1px solid var(--border-light);
	font-size: .875rem;
	transition: all .15s ease;
	min-height: 2rem;
}

.accordion-row, .accordion-row-component {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-orient: horizontal;
	-webkit-box-direction: normal;
	-ms-flex-direction: row;
	flex-direction: row;
}

/**
    accordion row
    - category name [optional]
    - display name [required]
    - favourite [optional]
*/
.accordion-row-component {
	padding: .375rem;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	-webkit-box-pack: start;
	-ms-flex-pack: start;
	justify-content: flex-start;
	height: 2rem;
}

.accordion-row-collapse.sng-animate .accordion-group .accordion-option.accordion-row.accordion-row-component {
	height: auto;
	align-items:self-start;
}

.accordion-row-component .accordion-row-category {
	margin-right: .375rem;
}

	.accordion-row-component .accordion-row-label {
		margin-right: auto;
	}

	.accordion-row-component .accordion-row-favourite {
		width: 1.75rem;
		height: 1.75rem;
		margin-right: -.375rem;
		padding: .25rem;
		text-align: center;
	}

.accordion-header, .accordion-row.accordion-header {
	color: var(--navy);
	background: var(--modal);
	text-align: center;
	border: 0;
	display: flex;
	align-items: center;
}

	.accordion-header .fa,
	.accordion-row:hover {
		color: var(--navy);
	}

	.accordion-header:hover {
		background: rgba(var(--primary-rgb), 0.25);
	}

	.accordion-header.accordion-disabled {
		background: var(--box);
		color: var(--text-disabled);
	}

		.accordion-header.accordion-disabled:hover {
			cursor: not-allowed;
		}

		.accordion-header.accordion-disabled:active {
			background: var(--box);
		}

		.accordion-header.accordion-disabled .fa {
			color: var(--text-disabled);
		}

.accordion-option:hover {
	background: rgba(var(--primary-rgb), 0.25);
}

.accordion-header:hover,
.accordion-option:hover {
	border-color: rgba(var(--primary-rgb), 0.25);
	z-index: 1;
	position: relative;
}

.accordion-group {
	border-left: .5rem solid transparent;
}

	.accordion-group .accordion-header {
		display: flex;
		align-items: center;
		background: var(--card-background);
		margin: 0.125rem;
		border-radius: .75rem;
	}

		.accordion-group .accordion-header .accordion-title {
			font-size: 0.875rem;
			font-weight: bold;
			color: var(--muted);
			order: 1;
		}


		.accordion-group .accordion-header .accordion-button {
			float: none !important;
			order: 0;
			margin-right: .5rem;
		}

		.accordion-group .accordion-header:hover {
			background: rgba(var(--primary-rgb), 0.25);
		}

	.accordion-group .accordion-row-collapse {
		padding-left: 1rem;
	}

.accordion-group-container {
	max-height: 12rem;
	overflow-y: auto;
}

/* Labels of the individual items and the headers */
.accordion-title {
	-webkit-box-flex: 1;
	-ms-flex-positive: 1;
	flex-grow: 1;
}

.accordion-header .accordion-title {
	text-align: left;
	font-size: 1.125rem;
}

.accordion-icon {
	margin-right: 0.5rem;
}

.accordion-option .fa-star, .accordion-option .fa-star-o {
	padding: .125rem 0;
}

	.accordion-option .fa-star.fa-star-o {
		color: var(--muted);
	}

	.accordion-option .fa-star:not(.fa-star-o) {
		color: #f3c631;
	}

.accordion-buttons {
	margin-left: auto;
	flex: 0 0 auto;
	-ms-flex: 0 0 auto;
	padding-left: .5rem;
}
/*
    Operator selector
*/

.operator-wrapper {
	position: absolute;
	left: -1.25rem;
	top: 50%;
	transform: translateY(-50%);
	background: var(--primary-base);
	color: var(--navy);
	padding: .125rem .25rem;
	line-height: 0.875rem;
	font-weight: bold;
	font-size: 0.75rem;
	border-radius: 0.75rem;
	text-transform: uppercase;
	min-width: 2.5rem;
	text-align: center;
	letter-spacing: -0.01em;
	border: 2px solid var(--box);
	display: flex;
	flex-direction: column;
	padding-bottom: 0.5rem;
}

	.operator-wrapper select {
		width: 2.5rem;
		height: 1.5rem;
		clip-path: polygon;
		opacity: 0;
		position: absolute;
		opacity: 0;
		left: 0;
		top: 0;
		font-size: 1rem;
	}

    .operator-wrapper .fas {
        position: absolute;
        bottom: 0;
        left: 50%;
        transform: translateX(-50%);
        pointer-events: none;
        opacity: 0.5;
    }

.operator-dropdown{
    position: absolute !important;
    cursor: pointer;
    z-index: 1;
}

/**
    Conditions Page
*/

.composer-title {
	font-size: 1.375rem;
	font-weight: bold;
	margin-bottom: .5rem;
	line-height: 1.325rem;
	padding: 0 0.5rem;
}

.compose-group {
	position: relative;
	margin-bottom: .5rem;
	padding-left: 1rem;
	min-height: 4rem;
}

	.compose-group:before {
		position: absolute;
		top: .5rem;
		bottom: .5rem;
		left: 0;
		content: '';
		display: block;
		border: 3px solid var(--border-strong);
		border-right: 0;
		width: 0.5rem;
		border-left-color: inherit;
	}

	.compose-group > .select-wrapper {
		display: inline-block;
	}

	.compose-group > .fa {
		font-size: 1.125rem;
		margin-left: .5rem;
	}

	.compose-group .compose-group {
		margin: .5rem .25rem;
	}

/* coour palette for composer groups - used e.g. in Designer */
.compose-group-border-left-0:before {
	border-color: #1976D2;
}

.compose-group-border-left-0 .operator-wrapper {
	background: #BBDEFB;
	color: #1976D2;
}

.compose-group-border-left-1:before {
	border-color: #512DA8;
}

.compose-group-border-left-1 .operator-wrapper {
	background: #D1C4E9;
	color: #512DA8;
}

.compose-group-border-left-2:before {
	border-color: #C2185B;
}

.compose-group-border-left-2 .operator-wrapper {
	background: #F8BBD0;
	color: #C2185B;
}

.compose-group-border-left-3:before {
	border-color: #c62828;
}

.compose-group-border-left-3 .operator-wrapper {
	background: #FFCDD2;
	color: #c62828;
}

.compose-group-border-left-4:before {
	border-color: #EF6C00;
}

.compose-group-border-left-4 .operator-wrapper {
	background: #FFE0B2;
	color: #E65100;
}

.compose-group-border-left-5:before {
	border-color: #558B2F;
}

.compose-group-border-left-5 .operator-wrapper {
	background: #DCEDC8;
	color: #33691E;
}

.compose-group-border-left-6:before {
	border-color: #00897B;
}

.compose-group-border-left-6 .operator-wrapper {
	background: #B2DFDB;
	color: #00695C;
}

.conditions-container {
	margin-left: .5rem;
	padding: .25rem 0;
	position: relative;
}

	.conditions-container:before {
		content: '';
		display: block;
		/*border-left: 2px dotted var(--modal-border);*/
		position: absolute;
		top: 0;
		left: -2px;
		bottom: 1.25rem;
	}

	.conditions-container:after, .compose-condition:after, .add-conditions:after {
		content: '';
		display: block;
		clear: both;
	}

.compose-condition {
	position: relative;
	padding: .25rem 0 .25rem 1rem;
}

	.compose-condition:before, .add-conditions:before, .compose-group .compose-group .select-wrapper:before {
		display: block;
		position: absolute;
		top: 1.25rem;
		/*border-bottom: 2px dotted var(--modal-border);*/
		content: '';
		width: 1rem;
	}

	.compose-condition:before, .add-conditions:before {
		left: 0;
	}

.compose-group .compose-group .select-wrapper:before {
	left: -.5rem;
}

.condition:before {
	top: 1.25rem;
}

.add-conditions:before {
	top: 1rem;
}

.add-conditions {
	padding: 0 0 .25rem 1rem;
	position: relative;
}

.compose-condition > div {
	display: block;
	float: left;
	background: var(--box);
	padding: .25rem .75rem;
	position: relative;
	z-index: 0;
	outline: 0;
	color: var(--muted);
	line-height: 1.25rem;
}

.compose-condition.mandatory > div {
	background: 0;
	padding-left: 0;
}

.compose-condition.active-condition > div:not(.accordion), .accordion .select-label {
	padding: .75rem 1rem;
	color: var(--text);
	z-index: 4;
	line-height: 1.5rem;
}

.compose-condition > div + div {
	margin-left: -1px;
}

.compose-condition > div:not(.condition-settings):hover, .compose-condition > div:focus {
	border-color: var(--primary-base);
	cursor: pointer;
	z-index: 2;
	color: var(--text);
}

.compose-condition.mandatory > div, .compose-condition.mandatory > div:hover {
	border-color: var(--modal-border);
	color: var(--text);
	cursor: default;
}

.compose-condition > div:focus {
	background: var(--background);
}

.add-conditions .btn {
	padding: .25rem .75rem;
	line-height: 1rem;
	margin-left: 0;
	display: block;
	float: left;
	font-size: .875rem;
	z-index: 1;
}

	.add-conditions .btn + .btn {
		border-radius: 0 .25rem .25rem .0;
		margin-left: -1px;
	}

.compose-condition .condition-button {
	-moz-appearance: none;
	-webkit-appearance: none;
	appearance: none;
	padding: 0;
	border: 0;
	background: 0;
	color: var(--muted);
}

	.compose-condition .condition-button + .condition-button {
		margin-left: .5rem;
	}

	.compose-condition .condition-button:hover {
		color: var(--navy);
		cursor: pointer;
	}

div[sng-composer] {
	min-height: 8rem;
}


.accordion-selector-submit-button {
	min-width: auto;
	display: inline-block;
	width: 16%;
}

.composer-accordion .has-submit-button {
	width: 82%;
	display: inline-block;
}
/*

.conditions:before,
.compose-group .compose-group:before,
.compose-group .compose-group:after,
.conditions:after {
    position: absolute;
    content: '';
    display: block;
}*/

.conditions {
	padding-left: .5rem;
	position: relative;
}

	.conditions:before {
		border-left: 1px dotted var(--border-strong);
		top: 0;
		bottom: .5rem;
	}

.condition {
	margin: 0 0 0 1rem;
}


.compose-group .compose-group {
	margin: .5rem 0 .5rem 1rem;
}


/* Explorer-specific */


#options {
	height: 100%;
}

.composer-sidebar-title {
	padding-left: 1rem;
	padding-top: 1.6rem;
	padding-bottom: 1.6rem;
	border-bottom: 1px solid var(--nav-border);
	font-size: 1rem;
	margin: 0 !important;
}

.composer-async-nosearches {
	padding-bottom: .5rem;
}

.composer-async-search {
	padding: .8rem;
	border-bottom: 1px solid var(--nav-border);
}

.composer-async-search-pointer {
	cursor: pointer;
}

.composer-async-search-gray {
	color: var(--muted);
}

.composer-visual-container {
	padding: .8rem;
	display: flex;
}

.composer-visual {
	width: 100%;
}

.composer-results-button {
	min-width: 5rem !important;
}

.composer-async-search-red {
	color: red;
}

.composer-async-search-yellow {
	color: orange;
}

.composer-async-search-green {
	color: green;
}

.composer-async-search-left {
	width: 70%;
	float: left;
	font-size: 1rem;
}

.composer-async-search-right {
	width: 30%;
	float: right;
	font-size: 1.2rem;
	color: var(--muted);
	text-align: right;
}

.composer-async-search-time {
	float: left;
	font-size: 0.85rem;
	color: var(--muted);
}

.composer-async-search-time-with-status {
	width: 70%;
}

.composer-async-search-view {
	width: 30%;
	float: right;
	text-align: right;
}

/* Accordion V2 */
.composer-accordion-provider {
	position: relative;
	display: inline-block;
}

.composer-accordion-popup {
	box-shadow: 2px 4px 12px rgba(10,0,40,0.25);
	padding: 0;
	background: var(--box);
	position: absolute;
	z-index: 105;
	top: 100%;
	border-radius: 1rem;
	padding: .5rem;
	overflow-y: auto;
}

	.composer-accordion-popup:has(.overflow-auto) {
		overflow-y: unset;
	}

	.composer-accordion-popup.pop-top {
		top: auto;
		bottom: 100%;
	}

.composer-accordion-loader {
	height: 8rem;
	position: relative;
}

.composer-accordion-content-no-overflow {
	max-height: 19rem;
	width: 25rem;
}

.composer-accordion-content-with-overflow {
	max-height: 19rem;
	overflow: auto;
	width: 20rem;
}

.component-or {
	padding-top: 0.8rem;
	padding-bottom: 0.8rem;
}

.composer-accordion-submit {
	text-align: right;
}

.accordion-list-add-section {
	text-align: center;
	padding-top: 0.8rem;
}

.composer-accordion-content {
	max-height: 19rem;
	overflow-y: auto;
	min-width: 20rem;
}

.composer-accordion-scroll {
	overflow-y: auto;
}

.accordion-content-spaced {
	padding: .375rem;
}

	.accordion-content-spaced.form-control-container {
		width: 100%;
		margin: 0.5rem;
		width: calc(100% - 1rem);
	}

.accordion-content-border-bottom {
	border-bottom: 1px solid var(--box-border);
}

.accordion-content-maxwidth {
	max-width: 100%;
}

.accordion-content-table-outer {
	display: table;
}

.accordion-content-table-inner {
	display: table-cell;
}

.accordion-content-table-small {
	min-width: 4rem;
	width: 4rem;
}

.accordion-content-table-full {
	width: 100%;
}

.accordion-inline-input {
	width: 15rem;
}

	.accordion-inline-input .btn {
		margin: 0 0 0 0.5rem;
		min-width: 2rem;
	}

.accordion-content-item {
	font-size: .875rem;
	display: block;
	padding: .25rem .5rem;
	cursor: pointer;
}

	.accordion-content-item.selected,
	.accordion-content-item:hover {
		background: rgba(var(--accent-rgb) / 0.1);
	}

.accordion-content-header {
	font-weight: bold;
	color: var(--muted);
	text-transform: uppercase;
	font-size: .75rem;
	background: var(--box-border);
	display: block;
	padding: .125rem .375rem;
	margin: .25rem 0;
}

.composer-accordion-info {
	color: var(--muted);
	padding: .25rem .5rem;
	text-align: center;
}

.composer-accordion-launcher {
	cursor: pointer;
	text-align: left;
	border-radius: .75rem;
	padding: .25rem .5rem;
	border: 1px solid rgba(var(--primary-rgb), 0.25);
}

	.composer-accordion-launcher:hover {
		background: rgba(var(--primary-rgb), 0.25);
		border-color: transparent;
		color: var(--navy);
	}

	.composer-accordion-launcher.active {
		background: rgba(var(--primary-rgb), 0.2);
		border-color: transparent;
		color: var(--navy);
	}

	.composer-accordion-launcher > span:only-child {
		display: flex;
		flex-direction: column;
	}

.accordion-label-area {
	min-width: none;
	width: auto;
	margin: 0;
	line-height: 0.75rem;
	text-align: left;
}

.composer-row .composer-accordion-launcher {
	border: 0;
}


/* Special coloring */

.composer-operator {
	color: #0275d8;
}

.composer-value {
	color: #fb9012;
}

.composer-selected-field {
	color: var(--navy);
}


/*composer condtion*/
.composer-row {
	padding: 0 .25rem;
	position: relative;
}

	.composer-row > div {
		border: 1px solid var(--border-light);
		border-width: 1px 0 1px 0;
		padding: .25rem;
		display: flex;
		align-items: flex-end;
	}

	.composer-row:not(.draggable) > div:not(.draggable) {
		display: flex;
		align-items: flex-end;
	}

	.composer-row > div.invalid {
		border-color: var(--warning-secure);
	}

	.composer-row .error-message {
		display: inline-flex;
		align-items: flex-end;
		flex: 1;
		height: auto;
		padding: .375rem .25rem;
	}

	.composer-row > div.valid .error-message {
		display: none;
	}

	.composer-row > .composer-row {
		padding: 0;
	}

		.composer-row > .composer-row > div {
			border: 0;
			padding: 0;
		}


	.composer-row > div:after {
		display: block;
		content: '';
		clear: both;
	}


	.composer-row + .composer-row > div {
		border-top: 0;
	}

	.composer-row:before {
		position: absolute;
		top: 1rem;
		left: -.25rem;
		content: '';
		width: .375rem;
		height: .375rem;
		border-radius: .25rem;
		background: var(--box-border);
		opacity: 0;
	}

.compose-mandatory-condition-item {
	display: inline-block;
	line-height: 1.25rem;
	padding: .25rem .5rem;
	text-align: center;
}

.compose-condition-item {
	display: inline-flex;
	padding: 0 .25rem;
	align-items: center;
}

.on-hover-edit {
	display: none;
}

.composer-row:hover .on-hover-edit {
	display: block;
}

.compose-condition-item .compose-condition-item .composer-accordion-provider .composer-accordion-launcher div.composer-value,
.compose-condition-item span.composer-value {
	word-break: break-word !important;
	overflow-wrap: break-word !important;
}

.composer-controls {
	border-left: 1px solid var(--border-light);
	color: var(--navy);
	padding: .125rem 0 .125rem .5rem;
	display: inline-block;
	flex-shrink: 0;
	-ms-flex-shrink: 0;
	margin-left: auto;
}

.composer-right {
	padding: .125rem 0 .125rem .5rem;
	margin-left: auto;
}

 .composer-right  + .composer-controls{
	margin-left: initial;
}

.composer-input-width-full > .form-control,
.composer-input-width-full > .sng-input-wrapper > .form-control,
.composer-input-width-full > .select-wrapper,
.composer-input-width-full > .sng-input-wrapper > .select-wrapper,
.composer-input-width-full > .currency-control,
.composer-input-width-full > .sng-input-wrapper > .currency-control {
	width: 100%;
}

.composer-input-width-small > .form-control,
.composer-input-width-small > .select-wrapper,
.composer-input-width-small > .currency-control {
	width: 8rem;
}

.composer-input-checkbox {
	display: flex;
	flex-wrap: wrap;
}

.composer-input-checkbox-label {
	width: 100%;
}

.composer-input-checkbox-item {
	flex-grow: 0;
	flex-basis: 50%;
}

.conditions-padded-vertical {
	padding-top: .5rem;
	padding-bottom: .5rem;
}

.conditions-padded-full {
	padding-top: 0.5rem;
	padding-left: 0.5rem;
	padding-right: 0.5rem;
}

	.conditions-padded-full:last-child {
		padding-bottom: 0.5rem;
	}

/* to overwrite the bootstrap madness we got to get deeeeep */
.conditions-overwrite-btn.btn.btn-sm {
	padding: 0 0.5rem;
}

.conditions-overwrite-btn.btn-primary:active,
.conditions-overwrite-btn.btn-primary:active:focus,
.conditions-overwrite-btn.btn-primary:focus {
	background-color: var(--danger);
}

/* this is the facto header of the dropdown selects */
/* prevent accidental select of the label/header on cramped list */
.accordion-content-spaced.label {
	user-select: none;
	color: var(--muted-dark);
}

/*
    The special extension to .checkbox, .label custom UI controls
    The reasoning behind is in TFS#14091
    If it works OK we could consider moving it into general solution
    The extensions moves the UI checkbox to the left and the text, wrapped
    to the right - using a media object pattern
*/
.accordion-content-spaced label.checkbox {
	position: relative;
	margin-left: 1.5rem;
	line-height: 1.1875rem;
	vertical-align: middle;
}

	.accordion-content-spaced label.checkbox input ~ span:before {
		position: absolute;
		top: 0;
		left: -1.5rem;
		line-height: 1;
	}

/* animation support within accordion opener */

.accordion-opener-container {
	position: relative;
	z-index: 0;
	overflow: hidden;
}

	.accordion-opener-container .accordion-header {
		position: relative;
		z-index: 1;
	}

	.accordion-opener-container .accordion-row:active {
		background: rgba(var(--primary-rgb), 0.25);
	}

	.accordion-opener-container .accordion-row.accordion-disabled:active {
		background: var(--box);
	}

	.accordion-opener-container .accordion-row-collapse {
		position: relative;
		z-index: 0;
		will-change: transform;
	}

		.accordion-opener-container .accordion-row-collapse.sng-animate {
			-webkit-transition: -webkit-transform .1s ease-in-out;
			transition: -webkit-transform .1s ease-in-out;
			transition: transform .1s ease-in-out;
			transition: transform .1s ease-in-out, -webkit-transform .1s ease-in-out;
		}

		.accordion-opener-container .accordion-row-collapse.ng-enter {
			-webkit-transform: translateY(-20%);
			transform: translateY(-20%);
		}

			.accordion-opener-container .accordion-row-collapse.ng-enter.ng-enter-active {
				-webkit-transform: translateY(0);
				transform: translateY(0);
			}

		.accordion-opener-container .accordion-row-collapse.ng-leave {
			-webkit-transform: translateY(0);
			transform: translateY(0);
		}

			.accordion-opener-container .accordion-row-collapse.ng-leave.ng-leave-active {
				-webkit-transform: translateY(-20%);
				transform: translateY(-20%);
			}


.functioncomposer .sidebar > h3 {
	margin-top: 0;
}

#searchDependenciesList a {
	color: var(--muted-dark);
	text-decoration: none;
}

	#searchDependenciesList a:hover {
		color: var(--navy);
		text-decoration: none;
	}

	#searchDependenciesList a .fa {
		color: var(--muted-light);
	}

@keyframes ai-new-highlight {
	0% {
		border-radius: 0.5rem;
	}
	10% {
		background-color: #fffacd;
		color: black;
		border-radius: 0.5rem;
	}
	90% {
		background-color: #fffacd;
		border-radius: 0.5rem;
		color: black;
	}
	100% {
		border-radius: initial;
	}
}
.isAiNew {
	display: inline-block;
	animation-name: ai-new-highlight;
	animation-duration: 10s
}

.fa-bars {
    cursor: move;
    cursor: grab;
    cursor: -moz-grab;
    cursor: -webkit-grab;
    margin-right: 2%;
}
.draggable:active {
    cursor: grabbing;
    cursor: -moz-grabbing;
    cursor: -webkit-grabbing;
}
.draggable {
    cursor: move; /* fallback if grab cursor is unsupported */
    cursor: grab;
    cursor: -moz-grab;
    cursor: -webkit-grab;
}

/*
    DynoView, Autocomplete, DatePicker
    Upload Manager
*/

/* Structure and layout */

[dynoview] {
    width: 100%;
    display: block;
}

.dyno-view {
    position: relative;
    display: block;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
}

.dyno-row .span_for_layer {
    position: fixed;
    z-index: 99;
}

.h-100 .dyno-view {
    height: 100%;
}

.dyno-view-body {
    width: 100%;
    padding: 1rem;
    margin: 0 auto;
    background: var(--background);
    -webkit-box-flex: 1;
    -ms-flex-positive: 1;
    flex-grow: 1;
}

    .dyno-view-body .grid-section .col {
        padding-bottom: 1rem;
    }

.dyno-control.section,
.dyno-control .section-content {
    margin: 0;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
}

.dynorow {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    max-width: 100%;
}

    .dynorow:only-child {
        min-width: 100%;
    }

    .dynorow > .grid-section {
        -webkit-box-flex: 1;
        -ms-flex: 1 1 auto;
        flex: 1 1 auto;
        max-width: calc(100% + 1rem); /* account for negative margins of row */
    }

.dyno-control .section-content {
    -webkit-box-flex: 1;
    -ms-flex: 1 0 auto;
    flex: 1 0 auto;
    max-width: 100%;
}

    .dyno-control .section-content .dynorow:only-child {
        -webkit-box-flex: 1;
        -ms-flex: 1 0 auto;
        flex: 1 0 auto;
    }

.dynorow:last-child > .grid-section {
    margin-bottom: 0;
}


.row-separator {
    display: block;
    clear: both;
}

dynoview .grid-section,
div[dynoview] .grid-section,
.react-dashboard .grid-section {
    margin-bottom: 1rem;
}

/* Headers and navigation */

.dyno-view > .header {
    z-index: 3;
    -webkit-backface-visibility: hidden;
    flex-shrink: 0;
}

.header ~ .dyno-view-body {
    overflow-y: auto;
}

.lightbox .dyno-view-body {
    background: var(--box);
}


.notification-body > .dyno-view > .header {
    position: static;
}


/* Attachments */

.dynoview-attachments {
    width: 100%;
    padding: 0.25rem 1rem;
    margin: 0 auto;
    z-index: 2;
    background-color: var(--background);
    border: 1px solid var(--box-border);
    border-radius: .25rem;
    display: none;
}

.dynoview-attachments-inner {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    width: 100%;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
}


.dyno-view #attachments .attachment {
    padding: 0 1rem;
}

.dyno-view #attachments .filename {
    font-size: .875rem;
}

.dyno-view #attachments .remove:hover {
    cursor: pointer;
    color: var(--navy);
}

/* Generic controls */

.dyno-control {
    padding: .75rem;
    min-height: 100%;
}

    .dyno-control.lightbox {
        min-height: 0;
    }

    .dyno-control.chart {
        min-height: 8rem;
    }

    .dyno-control.nav-item,
    .dyno-control.referenced-dynoview,
    .dyno-control.dyno-geo-map {
        padding: 0;
    }

    .dyno-control.nav-item,
    .dyno-control.referenced-dynoview {
        border: 0;
    }

    .dyno-control.referenced-dynoview {
        background: 0;
        -webkit-box-shadow: none;
        box-shadow: none;
    }

    .dyno-control label.inline {
        display: inline-block;
    }

        .dyno-control label.inline:not(:last-of-type) {
            margin-right: .5rem;
        }

    .dyno-control textarea {
        resize: both;
    }


.dyno-control-hidden {
    display: none;
}

.dyno-control-center {
    text-align: center;
}

.dyno-control-right {
    text-align: right;
}

.section-content .dyno-control:not(:last-child) {
    margin-bottom: .5rem;
}

.form-value {
    padding: .5rem;
    border: 1px solid var(--box-border);
    border-radius: .25rem;
    font-size: 1rem;
    display: block;
    min-height: 2.625rem;
}


.help-link, .help-link-custom {
    color: var(--text-disabled);
    padding-left: .25rem;
}

    .help-link:hover, .help-link-custom:hover {
        text-decoration: none;
        color: var(--navy);
    }

/* Deprecated dynoview styles */

.field-validation-valid {
    visibility: hidden;
}

.error-icon,
.field-validation-error {
    background: transparent;
    border: 0;
    appearance: none;
    -webkit-appearance: none;
    -moz-appearance: none;
    color: var(--warning-secure);
    margin-right: .25rem;
}

.field-validation-error {
    visibility: visible;
}

    .field-validation-error:before,
    .error-icon:before {
        content: '\f06a';
        font-family: 'FontAwesome';
        font-size: .875rem;
    }

.checkbox input[type=checkbox],
.checkbox-inline input[type=checkbox],
.radio input[type=radio],
.radio-inline input[type=radio] {
    margin-right: .25rem;
}

.radio-inline label,
.checkbox-inline label {
    display: inline-block;
}

    .radio-inline label:not(:last-child),
    .checkbox-inline label:not(:last-child) {
        margin-right: 2.4rem;
    }

.currency-box {
    border-collapse: collapse;
}

    .currency-box .input-group-addon {
        padding: 1px;
    }

    .currency-box .select-wrapper {
        width: 100%;
        border-right: 0;
        border-radius: .25rem 0 0 .25rem;
        height: 2.1875rem;
    }

    .currency-box .input-group-addon {
        padding: 0;
        background: transparent;
        border: 0;
    }

    .currency-box input {
        border-radius: 0 .25rem .25rem 0;
        min-width: 15ex;
    }

    .currency-box select {
        position: relative;
        width: auto;
        border: 0;
    }

    .currency-box.disabled .select-wrapper {
        background: 0;
        border: 0;
        height: 2.125rem;
    }

/* Datetime */

.datetime {
    display: inline-block;
}

.date-picker {
    max-width: 21rem;
    width: 100%;
    display: inline-block;
}

.time-picker {
    display: inline-flex !important;
    align-items: center;
}

    .time-picker.is-12-hour {
        min-width: 10.75rem;
    }

    .time-picker.is-24-hour {
        min-width: 6.75rem;
    }

    .date-picker .select-wrapper,
    .time-picker .select-wrapper {
        width: auto;
        display: inline-block;
    }

.date-picker-calendar-button {
    color: var(--muted);
}

    .date-picker-calendar-button:hover {
        color: var(--navy);
        cursor: pointer;
    }

/* date dropdown */

.date-dropdown,
.datetime-dropdown {
    position: relative;
}

.open.date-dropdown .dd-menu,
.open.datetime-dropdown .dd-menu {
    width: 22rem;
    max-height: none;
}

.date-dropdown .date-picker .select-wrapper,
.date-dropdown .time-picker .select-wrapper,
.datetime-dropdown .date-picker .select-wrapper,
.datetime-dropdown .time-picker .select-wrapper {
    float: left;
}

    .date-dropdown .date-picker .select-wrapper + .select-wrapper,
    .date-dropdown .time-picker .select-wrapper + .select-wrapper,
    .datetime-dropdown .date-picker .select-wrapper + .select-wrapper,
    .datetime-dropdown .time-picker .select-wrapper + .select-wrapper {
        margin-left: .125rem
    }

.datetime-dropdown .datetime-now {
    float: left;
    margin-bottom: .5em;
    margin-left: .25rem
}

.date-dropdown .date-picker,
.datetime-dropdown .date-picker {
    margin-right: .5rem
}

.date-dropdown.open .select-wrapper,
.datetime-dropdown.open .select-wrapper {
    text-transform: capitalize;
    width: auto;
    margin-right: .25rem;
}

.datetime-section {
    display: inline-block;
}

.date-dropdown .datetime-section,
.datetime-dropdown .datetime-section {
    float: left;
    text-align: left;
}

    .date-dropdown .datetime-section:not(:last-child),
    .datetime-dropdown .datetime-section:not(:last-child) {
        margin-right: 1rem;
    }

    .date-dropdown .datetime-section .timezone .datetime-dropdown .datetime-section .timezone {
        margin-left: .5rem;
    }

.date-dropdown .date-picker,
.date-dropdown .time-picker,
.datetime-dropdown .date-picker,
.datetime-dropdown .time-picker {
    margin-bottom: 0;
    min-width: auto;
    max-width: none;
    width: auto;
}

.date-dropdown .ui-datepicker,
.datetime-dropdown .ui-datepicker {
    margin: 0 auto;
}

    .date-dropdown .ui-datepicker.ui-datepicker-inline,
    .datetime-dropdown .ui-datepicker.ui-datepicker-inline {
        width: 100%;
    }

.date-dropdown .ui-datepicker-title,
.datetime-dropdown .ui-datepicker-title {
    text-align: center;
}


.datetime-dropdown .dropdown-menu {
    padding: .5rem 1rem;
    box-shadow: 0 3px 8px rgba(10,0,40,0.15);
}

.datetime-dropdown .ui-datepicker {
    border: 1px solid var(--background);
    padding: .5rem;
    box-shadow: none;
}

/* these are pure CSS specificity hacks to win *forms* general restyle rules
    that unfortunately are inlined after these more specific rules for dynoview controls
*/
.date-dropdown.date-dropdown td.ui-datepicker-other-month a.ui-state-default,
.datetime-dropdown.datetime-dropdown td.ui-datepicker-other-month a.ui-state-default {
    color: var(--text);
}

.datetime-dropdown .ui-datepicker-calendar tr,
.date-dropdown .ui-datepicker-calendar tr {
    background: transparent;
}

.date-dropdown .ui-datepicker .select-wrapper,
.date-dropdown .ui-datepicker .ui-datepicker-month,
.date-dropdown .ui-datepicker .ui-datepicker-year,
.datetime-dropdown .ui-datepicker .select-wrapper,
.datetime-dropdown .ui-datepicker .ui-datepicker-month,
.datetime-dropdown .ui-datepicker .ui-datepicker-year {
    min-width: 5rem;
    width: auto;
}

    /* add some module styles back */
    .date-dropdown .ui-datepicker .select-wrapper:first-of-type,
    .datetime-dropdown .ui-datepicker .select-wrapper:first-of-type {
        margin-left: auto;
    }

    .date-dropdown .ui-datepicker .select-wrapper:last-of-type,
    .datetime-dropdown .ui-datepicker .select-wrapper:last-of-type {
        margin-right: auto;
    }

    .date-dropdown .ui-datepicker .select-wrapper .date-dropdown .ui-datepicker .ui-datepicker-month,
    .datetime-dropdown .ui-datepicker .ui-datepicker-month {
        -ms-flex-preferred-size: 13ex;
        flex-basis: 13ex;
    }

.date-dropdown .ui-datepicker .ui-datepicker-month,
.datetime-dropdown .ui-datepicker .ui-datepicker-month {
    -ms-flex-preferred-size: 8ex;
    flex-basis: 8ex;
}

.ui-datepicker .ui-datepicker-month, .ui-datepicker .ui-datepicker-month option,
.ui-datepicker .ui-datepicker-year, .ui-datepicker .ui-datepicker-year option {
    background: var(--background);
    color: var(--text);
}

.ui-datepicker-current {
    color: var(--text);
}


.date-dropdown .ui-datepicker-title,
.datetime-dropdown .ui-datepicker-title {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    text-align: center;
}

/* sng-date control style fix with CSS for double arrows problem in specific case */
[sng-date] select.date-picker-part.ng-hide + span {
    display: none;
}

ul.options {
    padding: 0;
    margin-bottom: 0;
    display: flex;
    flex-wrap: wrap;
    margin: 0 -.5rem;
}

    ul.options.vertical {
        display: block;
    }

    ul.options li {
        padding: 0 .5rem .5rem;
    }

    ul.options.vertical li {
        padding: 0 .5rem;
    }

.options li {
    display: block;
}

.options label {
    display: inline-block;
}

/* Tabbed Section */

.dyno-control.tabbed-section {
    padding: 0;
}

.dyno-control.tabbed-window,
.dyno-control.section {
    padding: 0;
}

.dyno-control .nav.nav-tabs {
    border-radius: .125rem .125rem 0 0;
}

.tabbed-section .nav-tabs .nav-link {
    padding: .75rem 1.25rem;
}

    .tabbed-section .nav-tabs .nav-link.invalid {
        color: var(--warning-secure);
    }

    .tabbed-section .nav-tabs .nav-link.active.invalid {
        border-color: var(--warning-secure);
    }

    .tabbed-section .nav-tabs .nav-link.invalid:after {
        font-family: 'FontAwesome';
        content: '\f06a';
        display: inline-block;
        color: var(--warning-secure);
    }

.nav.nav-tabs .nav-link div {
    display: inline-block;
}

.dyno-control.tabbed-window {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    overflow: hidden;
}

.section-content .dyno-control.tabbed-window {
    border: 1px solid var(--box-border);
}


.tabbed-window-container, .tabbed-window-content, .tabbed-window-content > div {
    -webkit-box-flex: 1;
    -ms-flex: 1 0 auto;
    flex: 1 0 auto;
    max-width: 100%;
}

    .tabbed-window-content > div,
    .tabbed-window-container {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
    }

.tabbed-window-content {
    padding: .75rem;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    max-width: 100%;
}

    .tabbed-window-content.hide {
        display: none;
    }

.nav.nav-tabs.vertical {
    float: left;
    width: 20%;
    border-right: 1px solid var(--box-border);
    border-bottom: 0;
}

.tabbed-window-content-container.vertical {
    width: 80%;
    float: right;
}

.nav.nav-tabs.vertical .nav-item {
    width: 100%;
    float: none;
}

.nav.nav-tabs.vertical .nav-link {
    border-bottom: 0;
    border-radius: 0;
    border-left-width: 3px;
    border-left-style: solid;
}

.nav-tabs.vertical .nav-item + .nav-item {
    margin-left: 0;
}


.subsection-title {
    text-align: left;
    line-height: 2rem;
    margin: 0;
    margin-right: 1rem;
    position: relative;
    color: var(--muted);
    font-size: 1.125rem;
    font-weight: bold;
    display: flex;
}

.subsection-title > span{
    flex: 1;
    border-bottom: 1px dotted var(--border-strong);
}

.subsection-title,
.subsection-content {
    padding: .75rem 1rem;
}

    .subsection-title ~ .subsection-content {
        padding-top: 0;
    }

.section-content .sliding-window-body .section-content,
.sliding-window-body .section-content {
    -webkit-box-flex: 1;
    -ms-flex-positive: 1;
    flex-grow: 1;
    padding: 1rem;
}

.subsection-toggle {
    line-height: 1rem !important;
    padding: .25rem .5rem;
    border-radius: 1rem;
    height: 1.875rem;
    color: var(--border-strong);
    transition: background 0.2s ease, color 0.2s ease;
}

    .subsection-toggle:hover {
        background: rgba(var(--primary-rgb), 0.25);
        color: var(--navy);
    }

.section-content .paged-window {
    margin: 0 -.75rem;
}

.section-controls {
    font-size: .875rem;
    padding: 0 1rem;
    line-height: 2rem;
    background: var(--box);
    position: relative;
    -webkit-box-shadow: 0 0 0 transparent;
    box-shadow: 0 0 0 transparent;
    -webkit-transition: -webkit-box-shadow 0.3s ease;
    transition: -webkit-box-shadow 0.3s ease;
    transition: box-shadow 0.3s ease;
    transition: box-shadow 0.3s ease, -webkit-box-shadow 0.3s ease;
}

    .section-controls .title-wrapper {
        padding: 1rem;
        font-size: 1.125rem;
        line-height: 2rem;
        color: var(--text);
    }

    .section-controls .section-controls-buttons,
    .section-controls .paging {
        padding: 1rem;
    }

        .section-controls .paging > span {
            padding-left: 1rem;
            color: var(--muted);
        }

.section-controls-buttons {
    text-align: right;
    -webkit-box-flex: 1;
    -ms-flex-positive: 1;
    flex-grow: 1;
}

.section-controls:after {
    display: block;
    content: '';
    width: calc(100% - 2rem);
    position: absolute;
    bottom: 0;
    left: 1rem;
    border-bottom: 1px dotted var(--border-strong);
    -webkit-transition: all .4s ease;
    transition: all .4s ease;
}

.section-controls.sticky-bar-fixed {
    -webkit-box-shadow: 0 2px 4px rgba(0,0,0,0.15);
    box-shadow: 0 2px 4px rgba(0,0,0,0.15);
}

    .section-controls.sticky-bar-fixed:after {
        width: 100%;
        left: 0;
        border-bottom-style: solid;
    }

/* Toggle section */
.togglesection-disabled .section-content {
    display: none;
}

.togglesection-disabled .section-title {
    border-radius: .25rem;
}

.toggle-section.disabled .toggle-switch > div:before {
    left: 0.1875rem;
    opacity: .75;
}



/* ROW TITLES */

/* Horizontal rule*/

.dyno-control.dyno-hr {
    padding: 0;
}

.dyno-hr .rowtitle {
    margin: .5rem 0;
}


.rowtitle {
    text-align: left;
    border-bottom: 2px dotted var(--border-strong);
    line-height: 0.1em;
    margin: 1rem 0;
}

    .rowtitle span {
        background: var(--box);
        padding-right: 10px;
        color: var(--muted);
        font-size: 1rem;
        font-weight: bold;
    }

.rowtitle-help button {
    padding: 0;
    margin: 0;
    line-height: 0;
    display: inline;
}

.rowtitle-help {
    padding: 0 .5rem;
    margin-left: -.5rem;
}

.rowtitle.rowtitle-divider {
    margin: 2rem 0;
}
/* END ROW TITLES */

.required,
.field-validation-error {
    color: var(--warning-secure);
}

.required {
    font-size: .875rem;
    cursor: default;
    font-weight: bold;
    line-height: .875rem;
}

.dyno-control.dyno-critical {
    border-color: var(--danger);
}

.dyno-critical:after {
    content: 'Critical';
    display: block;
    position: absolute;
    top: .25rem;
    right: .25rem;
    background: var(--danger);
    color: #fff;
    font-size: .875rem;
    font-weight: bold;
    padding: 0 .25rem;
    border-radius: .125rem;
}

.dyno-control-right.dyno-critical:after {
    right: auto;
    left: .25rem;
}

.table-title {
    padding: .25rem .5rem;
    font-size: .875rem;
    background: var(--box-border);
    font-weight: bold;
}

.dyno-control.table {
    padding: 0;
}

    .dyno-control.table th {
        border-top: 0;
    }

.dyno-table .dyno-control {
    font-size: 1rem;
}

.dyno-table-scroller {
    max-width: 100%;
    overflow-x: auto;
}

    .dyno-table-scroller th {
        white-space: nowrap;
    }

    .dyno-table-scroller td {
        padding: 0;
    }

    .dyno-table-scroller .dyno-control {
        border: 0;
        -webkit-box-shadow: none;
        box-shadow: none;
        background: 0;
    }

.dyno-table-totals-row input,
.dyno-table-row-total {
    border: 0;
    background: 0;
    color: var(--text);
}

    .dyno-table-row-total td {
        font-size: 0.75rem;
        padding: .65rem;
        font-weight: bold;
        text-align: right;
        text-transform: uppercase;
    }

.section-content .dyno-control,
.tabbed-window-content .dyno-control,
.notification-dyno-view .dyno-control {
    padding: 0;
    background: 0;
    border-width: 0;
    -webkit-box-shadow: none;
    box-shadow: none;
}

.section-content .critical,
.tabbed-window-content .critical,
.section-content .section,
.tabbed-window-content .section {
    border-width: 1px;
}

.section-content .section,
.tabbed-window-content .section {
    border-color: var(--box-border);
    padding: 0;
}

.section-content .section-title ~ .section-content {
    border: 0;
}

.dyno-view-reference-div > .grid-section > .col:first-child {
    padding-left: 0;
}

.dyno-view-reference-div > .grid-section > .col:last-child {
    padding-right: 0;
}

.dyno-control#divider {
    padding: 0;
    border: 0;
}

.dyno-table .remove-row {
    margin: .5rem;
    margin-left: 0;
    border: 0;
}

/* DynoView Lightboxes */

.dyno-lightbox-content .dyno-control {
    -webkit-box-shadow: none;
    box-shadow: none;
}

.dyno-lightbox-content-row > .grid-section {
    margin: 0;
}

    .dyno-lightbox-content-row > .grid-section > .col {
        padding: 0;
    }

/* Charts */

.dyno-control.chart {
    margin-bottom: 0;
}

/********** Transaction Summary Control ***********/
.transaction-summary .dyno-control {
    border-color: transparent;
}

    .transaction-summary .dyno-control.chart label {
        text-align: center;
    }

.tx-summary-filter-container {
    margin-top: 0.875rem;
    margin-bottom: 0.857rem;
}

.tx-summary-filter {
    display: inline-block;
}

    .tx-summary-filter div {
        display: inline-block;
    }

.tx-summary-all-tx-btn {
}

/* Incident details */

.incident-details-top {
    margin: 0;
    display: block;
    width: 100%;
    position: relative;
    padding: 0.875rem;
    border-bottom: 1px solid var(--nav-border);
    overflow: hidden;
}

.incident-number {
    font-size: 1.2rem;
    padding-bottom: .5rem;
    color: var(--navy);
    overflow-wrap: break-word;
    word-wrap: break-word;
}

#incident-case-details span {
    font-weight: bold;
    word-break: break-word;
}

#incident-case-details {
}

.case-detail-value {
    position: relative;
    font-weight: bold;
    left: .2rem;
    word-break: break-word;
}

.case-detail-title {
    width: 7.5rem;
    font-weight: bold;
    display: inline-block;
    color: var(--muted);
}


/* SRA dashboard styles */

.dyno-control.hero-section,
.dyno-control.hero-section .section-content,
#decksection,
#decksection .section-content {
    padding: 0;
    border: 0;
    background: transparent;
}

.dyno-control.deck {
    max-width: 26rem;
    min-height: 12rem;
}

    .dyno-control.deck .dyno-control,
    .dyno-control.deck {
        padding: 0;
    }

.dyno-deck-header,
.dyno-deck-footer {
    padding: 1rem;
}

.dyno-deck-header {
    padding-bottom: .75rem;
}

    .dyno-deck-header:after {
        content: '';
        display: block;
        clear: both;
    }

.dyno-deck-footer {
    padding-top: .75rem;
}

.dyno-deck-title {
    text-transform: uppercase;
    font-size: 1rem;
    margin-bottom: 10px;
    float: left;
}

.dyno-deck-icon {
    float: right;
    font-size: 1.25rem;
    width: 1.25rem;
    text-align: center;
    cursor: pointer;
    position: absolute;
    top: .5rem;
    right: .5rem;
}

.severity-high,
.severity-medium,
.severity-low {
    color: var(--text-contrast);
}

.severity-high,
.section-content .severity-high {
    background: var(--danger);
}

.severity-medium,
.section-content .severity-medium {
    background: var(--warning-secure);
}

.severity-low,
.section-content .severity-low {
    background: var(--success);
}

.value-map-circle {
    left: -50px;
    position: absolute;
    font-size: 1rem;
    border-radius: 50%;
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    color: white;
    text-align: center;
    opacity: 0.9;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-transition: all .2s cubic-bezier(.4, 0, .2, 1);
    transition: all .2s cubic-bezier(.4, 0, .2, 1);
    border: 2px solid #e8e8e8;
}

    .value-map-circle > div {
        color: #e8e8e8;
    }

    .value-map-circle:hover {
        opacity: 0.95;
        cursor: pointer;
    }

    .value-map-circle.severity-neutral {
        background: #c00000;
    }

.value-map-previous-level {
    display: none;
    position: absolute;
    top: 15px;
    left: 15px;
    font-family: 'icoMoon';
    font-size: 19px;
    /* background: red; */
    padding: 9px;
    cursor: pointer;
    background-color: #ffffff;
    color: rgb(41, 108, 128);
    border-radius: 1px;
    -webkit-box-shadow: 1px 1px 5px -1px rgba(124, 124, 124, 0.75);
    box-shadow: 1px 1px 5px -1px rgba(124, 124, 124, 0.75);
    -webkit-transition: all 0.15s ease;
    transition: all 0.15s ease;
}

    .value-map-previous-level:hover {
        padding-top: 7px;
        padding-bottom: 11px;
        -webkit-transition: all 0.15s ease;
        transition: all 0.15s ease;
    }

.value-map-level-text {
    position: absolute;
    top: 15px;
    right: 15px;
    padding: 9px 10px;
    background: white;
    color: rgb(41, 108, 128);
    font-weight: bold;
    cursor: default;
}

.value-map-label {
    position: absolute;
    top: 0px;
    right: 0px;
    left: 0px;
    /*display: flex;*/
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    text-align: center;
}

.value-map-label-text {
    position: absolute;
    background: rgba(124, 124, 124, 0.75);
    color: white;
    font-weight: bold;
    font-size: 15px;
    padding: 10px;
    left: 30px;
    top: -10px;
    border: 2px solid #ffffff;
}

.value-map-label-pin {
    position: absolute;
    color: #505050;
    font-weight: bold;
    font-size: 35px;
    text-align: center;
    opacity: 1.0;
    text-shadow: -2px 0 #ffffff, 0 2px #ffffff, 2px 0 #ffffff, 0 -2px #ffffff;
}

    .value-map-label-pin.severity-high {
        background-color: transparent;
        color: #c00000;
    }

    .value-map-label-pin.severity-medium {
        background-color: transparent;
        color: #fca304;
    }

    .value-map-label-pin.severity-low {
        background-color: transparent;
        color: #548235;
    }

    .value-map-label-pin.severity-neutral {
        background-color: transparent;
        color: #505050;
    }

.value-map-label-description {
    white-space: nowrap;
    text-align: center;
}

.value-map-label-value {
    white-space: nowrap;
    text-align: center;
}


.dyno-view .dyno-control[data-dyno-type="valuemap"] {
    padding: 0;
    height: 500px !important;
    margin-right: 0px;
    margin-left: 0px;
}

    .dyno-view .dyno-control[data-dyno-type="valuemap"] label {
        display: none;
    }


/*Geo map*/
.gm-style .gm-style-iw {
    color: black;
}


.dyno-control.iframe,
.dyno-iframe-container.dyno-iframe-stretch,
.dyno-iframe-stretch .dyno-iframe-wrapper {
    display: flex;
}

.dyno-control.iframe {
    padding: 0;
    position: inherit;
}

.dyno-iframe-container.dyno-iframe-stretch {
    flex-direction: column;
}

.dyno-iframe-title {
    padding: 1rem;
    font-size: .875rem;
    font-weight: bold;
    color: var(--muted);
}

.dyno-iframe-container.dyno-iframe-stretch,
.dyno-iframe-container .dyno-iframe-wrapper,
.dyno-iframe-container.dyno-iframe-stretch iframe {
    flex-grow: 1;
    width: 100%;
}

.dyno-iframe-container iframe {
    margin: 0;
    padding: 0;
    display: block;
}
/*
.lightbox .dyno-iframe-wrapper {
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
}*/

.referenced-dynoview .dyno-control {
    margin: 0;
}

/* Charts */

.chart-wrapper-medium {
    height: 165px;
}

.heading2 {
    margin: 0;
    padding: 0;
    font-size: .875rem;
    text-transform: uppercase;
}

.gauge-label {
    width: 120px;
    font-size: 1.75rem;
    font-weight: normal;
    text-align: center;
}


/* New DynoView Visibility */

.dyno-hidden, .hidden {
    display: none !important;
}

.dyno-off {
}

/* DatePicker */

/* states and images */
.ui-icon {
    display: block;
    text-indent: -99999px;
    overflow: hidden;
    background-repeat: no-repeat;
}
/* Overlays */
.ui-widget-overlay {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}

.ui-datepicker {
    width: 240px;
    display: none;
    background-color: var(--modal);
    margin-left: -221px;
    margin-top: 25px;
    z-index: 995 !important;
    box-shadow: 0 4px 12px rgba(10,0,40,0.25);
    border-radius: .25rem;
    padding: .25rem;
}

    .ui-datepicker .ui-datepicker-header {
        position: relative;
        padding: 2px;
        height: 37px;
        *height: 22px;
    }

    .ui-datepicker .ui-datepicker-prev, .ui-datepicker .ui-datepicker-next {
        position: absolute;
        top: 12px;
        *top: 2px;
        height: 16px;
        width: 16px;
        border: solid 1px transparent;
    }

    .ui-datepicker .ui-datepicker-prev {
        left: 2px;
        background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAEAAAAAQCAYAAACm53kpAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAADsMAAA7DAcdvqGQAAAAadEVYdFNvZnR3YXJlAFBhaW50Lk5FVCB2My41LjEwMPRyoQAAAKRJREFUWEft1cENgCAMBVBG40AchWEMOzEathESQoBauOE3aTxIq30WNQYHBCAAgUYg3CFRRAq7i8M1cq20UstdzlJEis/5vDbnrD1/BmCEZYi68VJPA1A3nhvSAjDCGkQDoILoNa4B6DW+CaCHGAAUCD96k5TnZ7nSBFCjvjTbO0v55fqsBt9DrIMJePe+avRb1RO+Af/9C4h7BAsgAAEIHCLwAGUsNmwmpyCJAAAAAElFTkSuQmCC') /*../images/arrows.png*/;
        background-position: -14px 50%;
        background-repeat: no-repeat;
        padding: 2px;
    }

    .ui-datepicker .ui-datepicker-next {
        right: 2px;
        background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAEAAAAAQCAYAAACm53kpAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAADsMAAA7DAcdvqGQAAAAadEVYdFNvZnR3YXJlAFBhaW50Lk5FVCB2My41LjEwMPRyoQAAAKRJREFUWEft1cENgCAMBVBG40AchWEMOzEathESQoBauOE3aTxIq30WNQYHBCAAgUYg3CFRRAq7i8M1cq20UstdzlJEis/5vDbnrD1/BmCEZYi68VJPA1A3nhvSAjDCGkQDoILoNa4B6DW+CaCHGAAUCD96k5TnZ7nSBFCjvjTbO0v55fqsBt9DrIMJePe+avRb1RO+Af/9C4h7BAsgAAEIHCLwAGUsNmwmpyCJAAAAAElFTkSuQmCC') /*../images/arrows.png*/;
        background-position: 2px 50%;
        background-repeat: no-repeat;
        padding: 2px;
    }

    .ui-datepicker .ui-datepicker-prev:hover {
        left: 2px;
        background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAEAAAAAQCAYAAACm53kpAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAADsMAAA7DAcdvqGQAAAAadEVYdFNvZnR3YXJlAFBhaW50Lk5FVCB2My41LjEwMPRyoQAAAKRJREFUWEft1cENgCAMBVBG40AchWEMOzEathESQoBauOE3aTxIq30WNQYHBCAAgUYg3CFRRAq7i8M1cq20UstdzlJEis/5vDbnrD1/BmCEZYi68VJPA1A3nhvSAjDCGkQDoILoNa4B6DW+CaCHGAAUCD96k5TnZ7nSBFCjvjTbO0v55fqsBt9DrIMJePe+avRb1RO+Af/9C4h7BAsgAAEIHCLwAGUsNmwmpyCJAAAAAElFTkSuQmCC') /*../images/arrows.png*/;
        background-position: -30px 50%;
        background-repeat: no-repeat;
    }

    .ui-datepicker .ui-datepicker-next:hover {
        right: 2px;
        background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAEAAAAAQCAYAAACm53kpAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAADsMAAA7DAcdvqGQAAAAadEVYdFNvZnR3YXJlAFBhaW50Lk5FVCB2My41LjEwMPRyoQAAAKRJREFUWEft1cENgCAMBVBG40AchWEMOzEathESQoBauOE3aTxIq30WNQYHBCAAgUYg3CFRRAq7i8M1cq20UstdzlJEis/5vDbnrD1/BmCEZYi68VJPA1A3nhvSAjDCGkQDoILoNa4B6DW+CaCHGAAUCD96k5TnZ7nSBFCjvjTbO0v55fqsBt9DrIMJePe+avRb1RO+Af/9C4h7BAsgAAEIHCLwAGUsNmwmpyCJAAAAAElFTkSuQmCC') /*../images/arrows.png*/;
        background-position: -46px 50%;
        background-repeat: no-repeat;
    }

    .ui-datepicker .ui-datepicker-prev span, .ui-datepicker .ui-datepicker-next span {
        display: block;
        position: absolute;
        left: 50%;
        margin-left: -8px;
        top: 50%;
        margin-top: -8px;
    }

    .ui-datepicker .ui-datepicker-title {
        margin: 0 2.3em;
        line-height: 1.8em;
        text-align: center;
    }

        .ui-datepicker .ui-datepicker-title select {
            font-size: 12px;
            margin: 1px 0;
        }

    .ui-datepicker select.ui-datepicker-month-year {
        width: 100%;
    }

    .ui-datepicker table {
        width: 100%;
        font-size: 12px;
        border-collapse: collapse;
        margin: 11px 0 .4em;
    }

    .ui-datepicker th {
        padding: 4px 3px 4px 3px;
        text-align: center;
        font-weight: bold;
        background-color: var(--table-header); /*border-bottom:solid 1px #E8E8E8; border-top:solid 1px #E8E8E8;*/
        color: var(--text-contrast);
    }

    .ui-datepicker td {
        border: 1px solid var(--table-row);
    }

        .ui-datepicker td span, .ui-datepicker td a {
            display: block;
            text-decoration: none;
            padding: .25rem;
            width: 100%;
            overflow: hidden;
        }

        .ui-datepicker td.ui-datepicker-other-month a.ui-state-default {
            color: var(--table-row-border);
        }

        .ui-state-default.ui-state-highlight.ui-state-active,
        .ui-state-default:hover,
        .ui-state-highlight:hover,
        .ui-state-active:hover,
        .ui-datepicker td.ui-datepicker-other-month a.ui-state-default {
            display: block;
        }

            .ui-datepicker td.ui-datepicker-other-month a.ui-state-default:hover a {
                color: #484848;
            }

        .ui-datepicker td.ui-datepicker-other-month.ui-datepicker-unselectable.ui-state-disabled span {
            display: none;
        }

    .ui-datepicker .ui-datepicker-buttonpane {
        background-image: none;
        margin: 6px 0 0 0;
        padding: 6px;
        padding-top: 0;
        border: 0;
        text-align: center;
    }

        .ui-datepicker .ui-datepicker-buttonpane button.ui-datepicker-current {
            border: 0;
            background-color: transparent;
            font-size: 11px;
            height: 15px;
            width: 100%;
            display: block;
        }

            .ui-datepicker .ui-datepicker-buttonpane button.ui-datepicker-current:hover {
                cursor: pointer;
            }

    .ui-datepicker .ui-datepicker-next:hover, .ui-datepicker .ui-datepicker-prev:hover {
        cursor: pointer;
        background-color: transparent;
    }

    .ui-datepicker .ui-datepicker-close {
        display: none;
    }

.ui-datepicker-current-day {
    background: rgba(var(--primary-rgb), 0.2);
}

.ui-datepicker-title .select-wrapper {
    width: 47%;
    margin: 0 2px;
    display: inline-block;
}

.ui-datepicker-calendar tbody td {
    padding: 0;
    text-align: center;
}

/* Autocomplete */

.section-content .search-title {
    font-size: .875rem;
    margin-bottom: .5rem;
}

.ui-helper-hidden-accessible {
    display: none;
}

.ui-autocomplete {
    width: 250px;
    cursor: pointer;
    position: absolute;
    border: 1px solid var(--modal-border);
    background-color: var(--background);
    z-index: 200 !important;
    margin: 0;
    padding: 0;
    list-style-type: none;
    font-size: .875rem;
}

    .ui-autocomplete li {
        margin: 0;
        padding: .25rem;
    }

.ui-state-hover {
    background-color: var(--background-hover);
}

.ui-autocomplete li.ui-menu-item:hover {
    background-color: var(--background-hover);
}

.ui-autocomplete li.ui-menu-item.ui-state-focus {
    background-color: rgba(var(--primary-rgb), 0.25);
    color: var(--navy);
}

.autocomplete-grid .none-selected {
    display: none;
    background: 0;
}

.autocomplete-loader {
    width: 1rem;
    height: 1rem;
    background: var(--spinner);
}

.autocomplete-remove,
.autocomplete-table .action-button .fa {
    color: var(--text-disabled);
}

.action-button {
    width: 1rem;
}

.autocomplete-remove {
    padding: .375rem 0 0;
}

    .autocomplete-remove:hover,
    .autocomplete-table .action-button .fa:hover {
        text-decoration: none;
        color: var(--danger);
    }

.autocomplete-input {
    margin: 0 0 .5rem;
}

    .autocomplete-input input {
        max-width: none;
    }

.none-selected td {
    border: 0;
}

/* Dyno Geo Map */
.dyno-geo-map-label {
    position: absolute;
    top: .625rem;
    left: 7rem;
    z-index: 5;
    background: var(--box);
    text-align: center;
    font-size: 1rem;
    padding: .25rem .5rem;
    color: var(--navy);
    height: 2rem;
    border-radius: .125rem;
    -webkit-box-shadow: rgba(0, 0, 0, 0.298039) 0px 1px 4px -1px;
    box-shadow: rgba(0, 0, 0, 0.298039) 0px 1px 4px -1px;
}

.map-canvas {
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    width: 100%;
}
/* Upload manager */

div#upload-header {
    width: 100%;
    padding: 0;
}

#upload-page {
    padding: 1rem;
}



    #upload-page .buttons {
        margin-bottom: 1rem;
    }

#start-upload {
    float: right;
}

#add-file-attach {
    position: relative;
    overflow: hidden;
}

#upload-table-wrap {
    padding: .5rem;
    background: var(--box);
    font-size: .875rem;
    height: 16rem;
    overflow-x: hidden;
    overflow-y: auto;
    border-radius: 1rem;
    margin-bottom: 0.5rem;
}

    #upload-table-wrap table {
        width: 100%;
    }

#upload-complete-container {
    display: none;
}

#uploads-table .progress-bar {
    text-align: center;
    width: 150px;
    height: 16px;
    background: transparent no-repeat;
}

#uploads-table tr:not(:last-child) {
    border-bottom: 1px dotted var(--table-row-border);
}

#uploads-table td {
    padding: .5rem 0;
}

#uploads-table .progress-bar.active {
    background-image: url("../images/upload-uploader.gif");
}

#uploads-table .progress-bar.complete {
    background-image: url("../images/upload-tick.png");
}

#uploads-table td.remove {
    text-align: center;
    width: 2rem;
}

    #uploads-table td.remove .fa {
        color: var(--muted);
        cursor: pointer;
    }

#upload-complete-container #upload-complete-footer {
    height: 100%;
    padding: 1rem;
    font-size: 1rem;
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 16000;
    background-color: var(--background);
}

#upload-complete-footer .buttons {
    position: absolute;
    bottom: 0;
    right: 1rem;
}

#upload-complete-container span#footer-message {
    display: block;
    margin-bottom: 1rem;
}

#upload-page input#files {
    position: absolute;
    top: 0;
    right: 0;
    margin: 0;
    opacity: 0;
    filter: alpha(opacity=0);
    -webkit-transform: translate(-300px, 0) scale(4);
    transform: translate(-300px, 0) scale(4);
    font-size: 14px;
    direction: ltr;
    cursor: pointer;
    outline: none;
}

#upload-count {
    background: var(--box-border);
    border-radius: 1rem;
    font-size: .875rem;
    padding: .25rem .5rem;
    color: var(--muted);
}

#upload-error-list ul {
    list-style: none;
    margin: .5rem 0 0;
    padding: .5rem;
    font-size: .875rem;
}

#upload-error-list li:not(:last-child) {
    border-bottom: 1px solid rgba(255, 255, 255, 0.2);
}

#upload-error-list li {
    padding: .25rem;
}

/* Zugo Search in Dynoview */

.dyno-control #search-loader {
    position: absolute;
    left: 0;
}

.cpftext-print {
    font-size: 1rem;
}

/* email pdf lightbox */

#email-pdf-lightbox .lightbox {
    width: 60%;
    height: 70%;
    top: 14%;
}

.dyno-control .search-results {
    max-height: 22rem;
}

.dyno-control.no-scroll .search-results {
    max-height: none;
}

.dyno-control .search-results-count {
    float: right;
    margin-top: 0.25rem;
}

    .dyno-control .search-results-count span {
        margin-right: 0.5rem;
    }

.dyno-control .table-fixed-header-container {
    position: relative;
}

    .dyno-control .table-fixed-header-container > table:first-child {
        margin-bottom: 0;
    }

.dyno-control .fixed-header > table:first-child thead {
    position: absolute;
}

/* Data grid */

.dyno-control .data-grid-results {
    max-height: 28rem;
    overflow: auto;
    width: 100%;
}

    .dyno-control .data-grid-results table {
        margin-bottom: 0;
    }

    .dyno-control .data-grid-results td {
        word-break: break-word;
    }


.data-grid-header {
    padding: .5rem 0 1rem;
    display: flex;
    align-items: center;
}

.data-grid-title {
    font-size: 1.25rem;
    line-height: 2rem;
    margin: 0;
    flex: 1 1 auto;
}

.data-grid-filter {
    padding-right: 0;
}

.dyno-data-grid, .section-content .dyno-data-grid {
    padding: 0 0.5rem 0.5rem;
}


/* Embedded Dynoview */
.dyno-embedded {
    padding: 0;
    margin-bottom: 1rem;
    min-height: 11rem;
    position: relative;
}

    .dyno-embedded .header {
        padding: 0;
    }

    .dyno-embedded .dyno-view-body {
        padding: 0;
    }

    .dyno-embedded.hide-header .header {
        display: none;
    }

.dyno-control .load-indicator,
.dyno-control .load-indicator.full {
    background: var(--box);
}


/* Search results grid */

.dyno-control.dyno-srg .dyno-control-wrapper > div > .header {
    position: absolute;
    left: 0;
}

.dyno-control.dyno-srg .header {
    padding-top: .25rem;
    background: var(--box);
    margin: 0;
    padding: .5rem 0;
}


.narrative-control-missing {
    color: var(--danger);
}

.filter-box-selected-label {
    float: left;
    max-width: calc(100% - 1.25rem);
    text-overflow: ellipsis;
    white-space: nowrap;
    overflow: hidden;
}


.dyno-filteredselect[data-width=stretch] div[sng-filterbox] { /* slow rule, consider rewriting for specificity*/
    width: 100%;
}


.btn.btn-group-vertical {
    display: block;
}

    .btn.btn-group-vertical + .btn.btn-group-vertical {
        margin-top: 10px;
        margin-left: 0;
    }



.hidden {
    display: none;
}

/* Image upload control */

.upload-image.loaded:after {
    content: '\f040';
    position: absolute;
    padding: .25rem .375rem;
    background: rgba(0,0,0,0.2);
    color: var(--text-contrast);
    font-family: 'FontAwesome';
    border-radius: .5rem;
    line-height: .875rem;
    bottom: .25rem;
    right: .25rem;
}

.upload-image {
    position: relative;
    display: inline-block;
    border: 1px solid rgba(0,0,0,0.1);
    border-radius: .125rem;
}

    .upload-image:hover,
    .showing > .upload-image {
        border-color: var(--primary-base);
        cursor: pointer;
    }

        .upload-image:hover:after,
        .showing > .upload-image:after {
            background: var(--primary-base);
        }


.select-image-placeholder {
    padding: 100px 1rem 1rem;
    background: var(--background);
    width: 250px;
    height: 250px;
    padding-top: 100px;
    text-align: center;
    vertical-align: middle;
    max-height: 300px;
}

.upload-image.loaded .select-image-placeholder {
    display: none;
}

.upload-image .cpf-dropdown-menu {
    min-width: 252px;
    width: 252px;
    left: -1px;
    margin-top: 0;
}

    .upload-image .cpf-dropdown-menu .btn-group-vertical {
        display: block;
    }

/*CategoryList*/
.category-list-item {
    padding: 0.375rem;
    display: inline-block;
    border: 1px solid var(--box-border);
    margin: 0;
}

#reset-narrative {
    background: #999;
    color: #fff;
    margin-top: 1rem;
}

.col-lg-c3 {
    position: relative;
    min-height: 1px;
}

.col-lg-c5 {
    position: relative;
    min-height: 1px;
}

.col-lg-c7 {
    position: relative;
    min-height: 1px;
}

.col-lg-c8 {
    position: relative;
    min-height: 1px;
}

.col-lg-c9 {
    position: relative;
    min-height: 1px;
}

.col-lg-c10 {
    position: relative;
    min-height: 1px;
}

.col-lg-c11 {
    position: relative;
    min-height: 1px;
}

.repeater {
    padding: 0;
    background: var(--table-row);
    margin-bottom: 1rem;
}

.repeater-row {
    padding: .5rem 1rem;
    padding-right: 0;
    display: table;
    display: -webkit-box;
    display: flex;
    -ms-display: flex;
    -webkit-display: flex;
    -moz-display: flex;
}

.remove-row {
    background: var(--box-border);
    line-height: 2rem;
    border-left: 2px solid var(--table-row-border);
    padding: 1rem .5rem;
    color: var(--muted);
    cursor: pointer;
    text-decoration: none;
    position: relative;
    width: 2rem;
}

table .remove-row {
    padding: .25rem .5rem;
}

table .section-controls {
    display: table-row;
}


.remove-row .fa-remove {
    position: absolute;
    top: 40%;
    width: 1.75rem;
    left: 0;
    text-align: center;
}

.repeater-row.title-row + .repeater-row:nth-last-child(2) a.remove-row,
.remove-row.disabled,
.remove-row.disabled:hover,
.remove-row.disabled:active {
    background: var(--table-row);
    color: var(--text-disabled);
    cursor: default;
}


a.remove-row {
    text-decoration: none;
}

.remove-row span {
    color: inherit;
    text-decoration: inherit;
}

.remove-row:hover {
    background: var(--danger);
    color: var(--table-row-hover);
    text-decoration: none;
}

.repeater-row-content {
    width: 100%;
}

.repeater-remove ~ .repeater-row-content {
    width: calc(100% - 2rem);
}

.repeater-row:not(.title-row) + .repeater-row {
    border-top: 2px solid var(--table-border);
}

.repeater-row.title-row {
    border-radius: .25rem .25rem 0 0;
    font-weight: bold;
    border-bottom: 2px dotted var(--border-strong);
}

.responsiveRowInside > .dyno-control {
    background: var(--table-row);
    -webkit-box-shadow: none !important;
    box-shadow: none !important;
}

.responsiveRowInside .form-control {
    max-width: none !important;
}

.responsiveRowInside .currency-box {
    max-width: none !important;
}


.responsiveRowInside .dyno-cpftxt-styles-currency {
    max-width: none !important;
}

.repeater-row.add-row {
    background: var(--box-border);
    padding: .25rem;
    text-align: center;
    color: var(--muted);
    cursor: pointer;
    font-size: .875rem;
    display: block;
    border: 0;
    border-radius: 0 0 .25rem .25rem;
}

    .repeater-row.add-row:hover {
        background: var(--success);
        color: var(--text-contrast);
    }

.repeater-row.totals-row {
    background: var(--table-row-hover);
    padding: 0px;
}

.responsiveTotalInside > .dyno-total {
    -webkit-box-shadow: none !important;
    box-shadow: none !important;
}

.repeater-row.totals-row label {
    font-weight: bold;
}

.repeater-row .row {
    width: 100%;
}

.col-lg-c5 {
    position: relative;
    min-height: 1px;
    padding-right: 10px;
    padding-left: 10px;
}

/* Info Tile Dyno Control */

.info-tile {
    font-size: 1rem;
    background: 0;
    position: relative;
    min-width: 8rem;
    max-width: 15rem;
    padding: 0;
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    box-shadow: none;
}

    .info-tile:after {
        content: '';
        display: block;
        padding-top: 100%;
    }

.info-tile-light-yellow {
    background-color: #ffff80 !important;
}

.info-tile-small {
    font-size: 0.75rem;
    min-width: 7.5rem;
    max-width: 11.5rem;
}

.info-tile-large {
    font-size: 1.25rem;
    min-width: 12.5rem;
    max-width: 18.5rem;
}

.info-tile.width-stretch {
    width: 100%;
    min-width: 6rem;
    max-width: none;
    max-height: 11rem;
}

.info-tile-extra-small.width-stretch {
    height: 5.5rem;
    max-height: 5.5rem;
    margin-bottom: 15px;
}

.info-tile-small.width-stretch {
    height: 8rem;
    max-height: 8rem;
}

.info-tile-large.width-stretch {
    height: 15rem;
    max-height: 15rem;
}

.info-tile .tile {
    padding: .5rem;
    overflow: hidden;
    text-decoration: none;
    border-radius: 1rem;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    background: var(--background);
    -webkit-box-flex: 1;
    -ms-flex: 1 1 auto;
    flex: 1 1 auto;
    text-align: center;
    word-break: break-word;
    box-shadow: 0 1px 3px rgba(0,0,0,0.15);
}

.info-tile-url.tile {
    text-decoration: none;
    position: relative;
}

.info-tile, .dyno-control.info-tile{
    box-shadow: none;
}

.info-tile .tile:active,
.info-tile .tile:focus,
.info-tile.info-tile-subtleaccent .tile:active,
.info-tile.info-tile-subtleaccent .tile:focus {
    -webkit-box-shadow: 0 1px .25rem rgba(0,0,0,0.15), 0 0 0 .25rem rgba(var(--primary-rgb), 0.5);
    box-shadow: 0 1px .25rem rgba(0,0,0,0.15), 0 0 0 .25rem rgba(var(--primary-rgb), 0.5);
}

.info-tile-content {
	-ms-flex-preferred-size: 100%;
    flex-basis: 100%;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
	align-items: center;
}

.info-tile-lead-value {
    font-size: 1em;
    text-align: center;
}

    .info-tile-lead-value .label .fa {
        font-size: 0.75em;
        -webkit-transform: translateY(-10%);
        transform: translateY(-10%);
        margin-right: .5rem;
    }

    .info-tile-lead-value > .fa {
        font-size: 1.25em;
    }

.info-tile-extra-space {
    font-size: 0.65em !important;
    margin-right: 1rem !important;
}

.info-tile-extra-space-for-fo {
    font-size: 0.75em !important;
    margin-right: 8px !important;
}

.info-tile-sublabel,
.info-tile-footer {
    word-break: normal;
}

.info-tile-sublabel {
	margin-bottom: 0.5rem;
	font-size: 16px;
	display: flex;
	justify-content: center;
	align-items: center;
	text-align: center;
}

.info-tile-footer {
    font-size: .875rem;
    line-height: 1em;
    -webkit-box-flex: 0;
    -ms-flex: 0 0 auto;
    flex: 0 0 auto;
    margin-top: auto;
    font-weight: normal;
}

.info-tile-footer-small {
    font-size: .75rem;
    line-height: 1em;
    -webkit-box-flex: 0;
    -ms-flex: 0 0 auto;
    flex: 0 0 auto;
    margin-top: auto;
    text-transform: uppercase;
    font-weight: bold;
    letter-spacing: 0.02rem;
}

.light-gray {
    color: #afb0b1 !important;
}

.info-tile-link-hint {
    position: absolute;
    top: .5rem;
    right: .5rem;
    opacity: .25;
    -webkit-transition: opacity .2s ease;
    transition: opacity .2s ease;
    pointer-events: none;
    color: #000;
    z-index: 2;
}

.tile:hover + .info-tile-link-hint,
.tile:focus + .info-tile-link-hint {
    opacity: .5;
}


.info-tile-font-xsmall {
    font-size: .875rem;
    line-height: 1em;
}

.info-tile-font-small {
    font-size: 1rem;
    line-height: 1em;
}

.info-tile-font-medium {
    font-size: 1.25rem;
    line-height: 1em;
}

.info-tile-font-large {
    font-size: 1.75rem;
    line-height: 1em;
}

.info-tile-font-xlarge {
    font-size: 2.25rem;
    line-height: 1em;
}

.info-tile-font-xxlarge {
    font-size: 3.5rem !important;
    line-height: 2em !important;
}

.info-tile-image-xxlarge {
    font-size: 5.5rem !important;
    line-height: 2em !important;
	margin-top: -2rem;
  	margin-bottom: -2rem;
}

.info-tile a.tile {
    color: var(--navy);
}

.info-tile:not(.info-tile-subtleaccent) .clickable:after {
    background: rgba(255,255,255,0.15);
}

/* Info Tile BoldAccent */

.info-tile-boldaccent .tile,
.info-tile-boldaccent a.tile,
.info-tile-boldaccent .tile:focus,
.info-tile-boldaccent .tile:hover {
    background: var(--primary-base);
    background: linear-gradient(165deg, #51FFFF 0%, #65D2E3 50%, #35A5F7 100%);
    color: var(--text-contrast);
}

/* Info Tile SubtleAccent */

.info-tile-subtleaccent .tile {
    background: var(--background);
    color: var(--navy);
}


    .info-tile-subtleaccent .tile.clickable,
    .info-tile-subtleaccent a.tile.clickable {
        background: rgba(var(--primary-rgb), 0.25); 
        box-shadow: 0.25rem 0.25rem .45rem rgba(14, 123, 219, 0.1);
        color: var(--navy) !important;
    }

    .info-tile-subtleaccent .tile.remove-background-gradient,
    .info-tile-subtleaccent a.tile.remove-background-gradient {
        background: none;
    }

    .info-tile-subtleaccent .tile:not(.clickable) {
        box-shadow: inset 0 0 1px 1px rgba(0,0,0,0.1);
    }

.info-tile-subtleaccent .info-tile-link-hint,
.info-tile-subtleaccent .clickable .info-tile-lead-value {
    color: var(--navy);
}

.info-tile-subtleaccent .tile:not(.clickable) .info-tile-footer {
    color: var(--navy);
    opacity: 0.65;
}

/* Info Tile Colors */

.info-tile-default .tile,
.info-tile-muted .tile,
.info-tile-default a.tile,
.info-tile-muted a.tile,
.info-tile-default .tile:focus,
.info-tile-muted .tile:focus,
.info-tile-default .tile:hover,
.info-tile-muted .tile:hover {
    background: var(--muted);
    background: linear-gradient(165deg, #a2c0c1 0%, #8fb9bb 100%);
    color: #2F3A3C;
}

.info-tile-success .tile,
.info-tile-success a.tile,
.info-tile-success .tile:focus,
.info-tile-success .tile:hover {
    background: var(--success-light);
    background: linear-gradient(165deg, #adf069 0%, #9ddf5b 100%);
    box-shadow: 0.25rem 0.25rem .45rem rgba(49, 125, 7, 0.12);
    color: #134f14 !important;
}


.info-tile-warning .tile,
.info-tile-warning a.tile,
.info-tile-warning .tile:focus,
.info-tile-warning .tile:hover {
    background: var(--warning-light);
    background: linear-gradient(165deg, #fdba1a 0%, #ffaf48 100%);
    box-shadow: 0.25rem 0.25rem .45rem rgba(89, 22, 11, 0.14);
    color: #4f110b !important;
}


.info-tile-danger .tile,
.info-tile-danger a.tile,
.info-tile-danger .tile:focus,
.info-tile-danger .tile:hover {
    background: var(--danger);
    background: linear-gradient(165deg, #ff7b7b 0%, #ff5f7d 100%);
    box-shadow: 0.25rem 0.25rem .45rem rgba(87, 10, 32, 0.14);
    color: #570a20;
}

.info-tile .tile[disabled],
.info-tile a.tile[disabled],
.info-tile .tile[disabled]:focus,
.info-tile .tile[disabled]:hover {
    cursor: not-allowed;
    color: var(--muted);
    background: 0;
    -webkit-box-shadow: 0 0 0 1px rgba(0,0,0,0.1);
    box-shadow: 0 0 0 1px rgba(0,0,0,0.1);
}

    .info-tile .tile[disabled] .fa,
    .info-tile .tile[disabled] .info-tile-lead-value,
    .info-tile a.tile[disabled] .fa,
    .info-tile a.tile[disabled] .info-tile-lead-value {
        color: var(--muted);
    }

    .info-tile .tile[disabled]:after,
    .info-tile .tile[disabled] + .info-tile-link-hint {
        display: none;
    }

.info-card {
    padding: .5rem;
    display: flex;
    align-items: center;
    flex-wrap: wrap;
}

.info-card-shell {
    overflow: hidden;
}

.info-card-label {
    color: var(--navy);
    font-size: 1.25rem;
    line-height: 1em;
}

    .info-card-label i {
        font-size: 1.75rem;
    }

	.info-card-label .info-card-label-inner .text-ellipsis {
		overflow: hidden;
		text-overflow: ellipsis;
	}

.info-card-content {
	margin-left: auto;
	text-transform: uppercase;
	letter-spacing: 0.02rem;
}

.info-card-content-section {
    text-align: center;
    font-size: 0.9rem;
}

.info-card-figure {
    font-size: 1.35rem;
    font-weight: bold;
}

/* Dyno Control - Markdown */

.dyno-markdown ul {
    list-style-type: disc;
    padding-left: 1rem;
    display: block;
}


/* Dyno Control - Stacked List */

.stacked-list.dyno-control {
    padding: 0;
}

.stacked-list .stacked-list-container {
    display: block;
    margin: 0;
}

/* if shown within lightbox */
.stacked-list.stacked-list-lightbox {
    padding: 1rem;
}

.stacked-list .stacked-list-item {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    overflow: hidden;
    outline: none;
    font-size: 1rem;
    font-weight: 400;
    line-height: 1.5rem;
    min-height: 1.5rem;
    border-radius: .25rem;
    padding: .5rem 0;
    border-bottom: 1px solid var(--border-light);
}

    .stacked-list .stacked-list-item:first-child {
        border-top: 1px solid var(--border-light);
    }

    .stacked-list .stacked-list-item:last-child{
        border-top: 0 !important;
    }

a.stacked-list-item,
a.stacked-list-item:hover,
a.stacked-list-item:focus,
a.stacked-list-item:active {
    color: var(--navy);
    text-decoration: none;
    outline: none;
}

    a.stacked-list-item:active,
    a.stacked-list-item:hover {
        background: rgba(var(--primary-rgb), 0.15);
    }

.stacked-list-items {
    min-width: 20em;
    float: left;
}

    .stacked-list-items:not(:first-of-type) {
        padding-top: 0;
    }

    /* when disabled */
    .stacked-list-items.disabled a {
        pointer-events: none;
    }

    .stacked-list-items.disabled .indicator {
        color: var(--text-disabled);
    }

.stacked-list-lightbox .stacked-list-items {
    padding: 0;
}

.stacked-list .icon-container {
    width: 2.5rem;
    text-align: center;
}

.stacked-list .icon-container, .stacked-list-item .indicator {
    padding: 0 0.5rem;
}

.stacked-list-item .icon-container .fa {
    display: inline-block;
    font-size: 1.5rem;
    line-height: 2rem;
    font-weight: normal;
    width: 2.5rem;
    height: 2.5rem;
    vertical-align: middle;
}

.stacked-list-item dl {
    padding: 0;
    padding-left: 1rem;
    margin: 0;
    -webkit-box-flex: 1;
    -ms-flex-positive: 1;
    flex-grow: 1;
    word-break: break-word;
    max-width: calc(100% - 2.5rem);
}

.stacked-list-item dt {
    font-weight: 500;
}

.stacked-list dd {
    font-size: 0.875rem;
    color: var(--text);
    margin: 0;
}

.stacked-list-item .indicator {
    display: table-cell;
    vertical-align: top;
    font-size: 1rem;
    line-height: 1.5;
    font-weight: 400;
}

    .stacked-list-item .indicator .fa {
        opacity: .5;
        background: 0;
        -webkit-transition: opacity .1s ease;
        transition: opacity .1s ease;
    }

.stacked-list-item:link:hover .indicator .fa,
.stacked-list-item:link:focus .indicator .fa {
    opacity: 1;
}

/* stretch width */
.stacked-list.width-stretch .stacked-list-items {
    display: block;
    width: 100%;
    min-width: auto;
    float: none;
}

.stacked-list .stacked-list-load-more {
    margin-top: 16px;
}

.stacked-list .stacked-list-load-more {
    width: 100%;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-pack: justify;
    justify-content: space-between;
}

.stacked-list .help-icon ~ button.stacked-list-view-more {
    width: calc(100% - 2rem);
    flex: 0 1 auto;
    -ms-flex-order: 0;
    order: 0;
}

.stacked-list .help-icon {
    float: right;
    -webkit-box-flex: 0;
    -ms-flex-positive: 0;
    flex-grow: 0;
    -webkit-box-ordinal-group: 2;
    -ms-flex-order: 1;
    order: 1;
    padding: 0 .25rem;
    margin-right: .25rem;
}

.stacked-list-item .icon-container,
.stacked-list-item dl,
.stacked-list-item .indicator {
    color: var(--navy);
}

.stacked-list-item-subtleaccent .icon-container,
.stacked-list-item-subtleaccent dl,
.stacked-list-item-subtleaccent .indicator {
    color: var(--navy);
}

/* the boldaccent should be discussed - as it fallbacks to subtleaccent now */
.stacked-list-item-boldaccent .icon-container,
.stacked-list-item-boldaccent dl,
.stacked-list-item-boldaccent .indicator {
    color: var(--navy);
}

.stacked-list-item-green .icon-container,
.stacked-list-item-green dl,
.stacked-list-item-green .indicator,
.stacked-list-item-success .icon-container,
.stacked-list-item-success dl,
.stacked-list-item-success .indicator {
    color: var(--success);
}

.stacked-list-item-amber .icon-container,
.stacked-list-item-amber dl,
.stacked-list-item-amber .indicator,
.stacked-list-item-warning .icon-container,
.stacked-list-item-warning dl,
.stacked-list-item-warning .indicator {
    color: var(--warning-secure);
}

.stacked-list-item-red .icon-container,
.stacked-list-item-red dl,
.stacked-list-item-red .indicator,
.stacked-list-item-danger .icon-container,
.stacked-list-item-danger dl,
.stacked-list-item-danger .indicator {
    color: var(--danger);
}

/* Dyno Control - Container */

.dyno-control.dyno-container {
    overflow: auto;
    margin-left: -.25rem;
    margin-right: -.25rem;
    margin-top: -.5rem;
}

.dyno-container .container-element {
    margin: .5rem .25rem 0;
    padding: 0;
}

.dyno-container .container-element-left {
    float: left;
}

.dyno-container .container-element-right {
    float: right;
}

.dyno-container .container-element-centre {
    float: left;
}

/* Dyno Control - Data Grid/Search */

div[sng-zugo] .search-filter input,
.dyno-control-plus .search-filter input {
    padding-right: 2rem;
}

div[sng-zugo] .search-filter .clear-filter,
.dyno-control-plus .search-filter .clear-filter {
    position: absolute;
    right: 2.5rem;
    text-align: center;
    background: transparent;
    border: none;
    z-index: 10;
    cursor: pointer;
    pointer-events: auto;
}

/* FTI Dynoviews */
.fti-dyno-view-container .dyno-view-body {
    background: var(--box);
}

.fti-dyno-view-container .dyno-control {
    -webkit-box-shadow: none;
    box-shadow: none;
}

    .fti-dyno-view-container .dyno-control:last-child {
        margin-bottom: 0;
    }



/* Read mode & Print Mode Specific Styles */

.dv-read {
}

    .dv-read .dyno-control {
        border: 0;
    }

.report-read .form-value {
    font-size: 1.125rem;
}

.report-read-body {
    box-shadow: 0 2px 6px rgba(0,0,0,0.15);
    max-width: 980px;
    min-height: calc(100vh - 10rem);
    margin: 1rem auto;
    width: 100%;
    background: var(--modal);
    padding: 1rem 2rem;
    box-shadow: 0 2px 8px rgba(0,0,0,0.15);
    flex-shrink: 0;
}

    .report-read-body.report-font {
        font-family: 'Georgia', 'serif';
    }

    .report-read-body.landscape {
        max-width: 1440px;
    }

    .report-read-body .dyno-control {
        box-shadow: none;
    }

    .report-read-body .form-value {
        border: 0;
    }

.report-read-meta {
    text-align: right;
    font-size: 1rem;
}

.report-read-header {
    background: 0;
    border: 0;
}

.report-read-body h1, .report-read-body h2 {
    display: block;
    text-align: center;
    line-height: normal;
    padding: 0;
    border: 0;
    margin: 0 0 .5rem;
}

.report-read-body h1 {
    color: var(--navy);
    font-size: 2rem;
}

.report-read-body h2 {
    color: var(--navy);
    font-style: italic;
    font-size: 1.25rem;
}

.quicklink {
    padding: .5rem .75rem;
    align-items: center;
}

.section .quicklinks {
    border-radius: 0 !important;
}

.data-policy-title {
    color: var(--navy);
    font-weight: 500;
}

/* Dynoview plus overrides */

.dv-container .dv-body {
    padding: .5rem 1rem;
}


.quicklink {
    cursor: pointer;
    align-items: center;
}

    .quicklink a {
        font-weight: normal;
    }

a.quicklink:focus {
    box-shadow: none;
}

.dashboard-designer > .header-flat,
.dv-body > .header-flat {
	border: none;
	padding: initial;
}

/* *** Breakpoints *** */
@media (min-width: 1400px) {
	.col-xxl-3 {
		flex: 0 0 auto;
		width: 25%;
	}

	.col-xxl-4 {
		flex: 0 0 auto;
		width: 33.33333333%;
	}
}

@media (min-width: 1200px) {
	.col-lg-c3 {
		width: 33%;
		float: left;
	}

	.col-lg-c5 {
		width: 20%;
		float: left;
	}

	.col-lg-c7 {
		width: 14%;
		float: left;
	}

	.col-lg-c8 {
		width: 12.5%;
		float: left;
	}

	.col-lg-c9 {
		width: 11.1%;
		float: left;
	}

	.col-lg-c10 {
		width: 10%;
		float: left;
	}

	.col-lg-c11 {
		width: 9%;
		float: left;
	}
}

/* Bootstrap large breakpoint */
/* @media (max-width: 1199.98px) { */
@media only screen and (max-width: 1199.98px) {
	.info-card-label-inner {
		justify-content: center !important;
	}
}

@media only screen and (max-width: 767px) {
	.info-tile-font-xlarge {
		font-size: 2rem;
		line-height: 1em;
	}

	.info-tile-font-xxlarge {
		font-size: 3rem;
		line-height: 1.5em;
	}

	.info-tile-width-stretch {
		min-width: 5rem;
		height: 8rem;
		max-height: 8rem;
	}
}

@media (min-width: 576px) {
	.stacked-list.stacked-list-lightbox {
		max-width: 80vw;
	}
}

@media (min-width: 576px) {
	.stacked-list .stacked-list-items {
		display: inline-block;
		width: calc(50%);
	}
}

@media (min-width: 460px) {

	.date-dropdown .ui-datepicker .ui-datepicker-month,
	.datetime-dropdown .ui-datepicker .ui-datepicker-month {
		/* min-width taken from datetime control */
		min-width: 13ex;
	}

	.date-dropdown .ui-datepicker .ui-datepicker-year,
	.datetime-dropdown .ui-datepicker .ui-datepicker-year {
		/* min width taken from datetime control */
		min-width: 8ex;
	}
}

.ebag-item {
    width: 24.6%;
    float: left;
    margin: 0 .5% .5rem 0;
    padding-bottom: 1.75rem;
    position: relative;
}

    .ebag-item.selected {
        border-color: var(--primary-base);
    }

.ebag-item-bottom {
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    padding: .5rem;
    font-size: .875rem;
}

    .ebag-item-bottom .fa {
        width: 1.375rem;
        text-align: center;
    }

    .ebag-item-bottom label {
        display: inline;
    }

.ebag-item > div:first-child {
    height: 6rem;
    background: var(--box-border) no-repeat center center;
    background-size: cover;
    border-bottom: 1px solid var(--box-border);
    cursor: pointer;
}

    .ebag-item > div:first-child div {
        width: 100%;
        height: 100%;
        background: var(--muted);
        text-align: center;
        padding-top: 2rem;
        color: var(--muted);
        text-transform: uppercase;
        font-size: .875rem;
        line-height: .875rem;
        transition: all .2s ease;
    }

        .ebag-item > div:first-child div,
        .ebag-item > div:first-child div span {
            -webkit-transition: all .2s ease;
            -moz-transition: all .2s ease;
            -ms-transition: all .2s ease;
            -o-transition: all .2s ease;
            transition: all .2s ease;
            opacity: 0;
        }

    .ebag-item > div:first-child:hover div,
    .ebag-item > div:first-child:hover div span {
        opacity: .6;
    }

    .ebag-item > div:first-child div span {
        display: inline-block;
        padding: .25rem .5rem;
        background: var(--text);
        color: var(--text-contrast);
    }


    .ebag-item > div:first-child:hover {
        background-size: contain;
    }

.ebag-item > div:last-child {
    padding: .5rem;
}

.ebag-title,
.ebag-description-hidden {
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}

.ebag-title {
    font-size: 1rem;
    color: var(--text);
    width: calc(100% - 7rem);
}

.ebag-title,
.ebag-description.ebag-description-hidden {
    min-height: 1.5rem;

    padding: .125rem .25rem;
}

.ebag-description {
    font-size: .875rem;
    padding: .125rem .25rem;
    width: 100%;
    margin-bottom: .25rem;
}

.ebag-time-ago {
    font-size: .75rem;
    color: var(--muted);
    float: right;
    padding: 0 0 .5rem .5rem;
    width: 7rem;
    text-align: right;
}

.ebag-item .fa.fa-trash-o {
    padding: .25rem;
    display: inline-block;
}

body.ebag-select .dyno-control:not(.ebag-disabled) {
    border: 1px solid var(--muted);
    z-index: 4;
    position: relative;
}

body.ebag-select .dyno-control.hover {
    border-color: var(--primary-base);
    z-index: 5;
}

    body.ebag-select .dyno-control.hover:before {
        display: block;
        content: '';
        width: 100%;
        height: 100%;
        position: absolute;
        left: 0;
        top: 0;
        background: rgba(var(--primary-rgb), 0.25);
        opacity: .1;
        cursor: pointer;
        z-index: 4;
    }



body.ebag-select .ebag-overlay {
    display: block;
}

.ebag-item-bottom input {
    height: .875rem;
    position: relative;
    top: .125rem;
}

.ebag-image-view {
    padding: 1rem;
    text-align: center;
    overflow: auto;
    height: calc(100% - 6rem);
}

    .ebag-image-view img {
        display: inline-block;
    }

.ebag-image-description {
    width: 100%;
    border-top: 1px solid var(--modal-inner);
    color: var(--muted);
    text-align: center;
    padding: 1rem;
}

.ebag-capture,
.ebag-capture header {
    max-width: 1024px;
}

.ebag-capture {
    overflow: visible;
    height: auto;
    min-height: 940px;
}

    .ebag-capture .alert,
    .ebag-capture .alert-vis,
    .ebag-capture #alert,
    .ebag-capture .alert-body {
        display: none !important;
    }

    .ebag-capture .mCSB_scrollTools {
        opacity: 0 !important;
    }

    .ebag-capture > .mCSB_container {
        overflow: visible;
    }

@media all and (min-width: 80em) {
    .ebag-item {
        width: 19.6%;
    }

        .ebag-item:nth-child(5n) {
            margin-right: 0;
        }

        .ebag-item:nth-child(5n+1) {
            clear: both;
        }
}

@media all and (max-width: 79.99em) and (min-width: 64em) {
    .ebag-item:nth-child(4n) {
        margin-right: 0;
    }

    .ebag-item:nth-child(4n+1) {
        clear: both;
    }
}

@media all and (max-width: 63.99em) and (min-width: 56em) {
    .ebag-item {
        width: 33%;
    }

        .ebag-item:nth-child(3n) {
            margin-right: 0;
        }

        .ebag-item:nth-child(3n+1) {
            clear: both;
        }
}

@media all and (max-width: 55.99em) and (min-width: 34em) {
    .ebag-item {
        width: 49.75%;
    }

        .ebag-item:nth-child(2n) {
            margin-right: 0;
        }

        .ebag-item:nth-child(2n+1) {
            clear: both;
        }
}


@media all and (max-width: 33.99em) {
    .ebag-item {
        margin-right: 0;
        width: 100%;
        clear: both;
        float: none;
    }
}



.fact-board-controls {
	position: fixed;
	z-index: 920;
	background: var(--box);
	padding: 0 .25rem;
	top: 0;
	border-bottom-left-radius: .2rem;
	border-bottom-right-radius: .2rem;
	width: 45rem;
	max-width: -webkit-fill-available;
	box-shadow: 0 3px 6px rgba(10, 0, 40, 0.25);
	padding: .5rem 1rem;
}

    .fact-board-controls .load-indicator-mini {
        background: var(--box);
        height: 3rem;
        z-index: 2;
    }

.fact-select-section {
    /*width: 50%;*/
    float: left;
    padding: .5rem 0 .5rem .5rem;
}

.fact-options-section {
    /*width: 50%;*/
    float: right;
    text-align: right;
    padding: .5rem .5rem 0 .5rem;
}

.fact-select {
    width: 12rem;
}

.fact-add-to {
    color: var(--box);
    margin-right: .5rem;
}

.dyno-view-body .grid-section .col {
    transition: padding-bottom 0.2s ease;
}

.factboard-select .dyno-view-body .grid-section .col,
.factboard-select .dv-body .grid-section .col {
    padding-bottom: 1.5rem;
}

/* add some breathing space in factboard mode see: #13459 */
.factboard-select div[dynosection] {
    padding-bottom: 1rem;
}

.factboard-addable {
    transition: margin 0.25s ease;
}

body.factboard-select .factboard-addable {
    z-index: 1;
    position: relative;
    margin-bottom: 1.5rem;
}

    body.factboard-select .factboard-item-selected:before,
    body.factboard-select .dyno-control.factboard-item-selected:before,
    body.factboard-select .factboard-addable.factboard-item-selected:before,
    body.factboard-select .factboard-item-added:before {
        display: block;
        content: '';
        position: absolute;
        top: .25rem;
        right: .25rem;
        width: .5rem;
        height: .5rem;
        border-radius: .25rem;
        background: rgba(var(--success-rgb), 0.5);
    }


.investigation-title {
    color: var(--navy);
}

.investigation-description {
	flex-grow: 1;
	white-space: pre-line;
	margin: 0;
	overflow-wrap: break-word;
	border-bottom: 0;
}
#edit-investigation-title, #edit-investigation-description {
	overflow-wrap: anywhere;
}
.investigation-name {
	align-items: baseline;
	display: flex;
	flex-direction: row-reverse;
	width: 100%;
	gap: 1rem;
	flex-wrap: wrap;
	margin-bottom:0;
}

	.investigation-name #investigationTypeControls {
		text-align: left;
		max-width: fit-content;
	}

.investigation-name h1 {
	overflow: visible;
	white-space: normal;
}

	.investigation-name h1 {
		white-space: normal;
		margin: 0;
		overflow-wrap: break-word;
	}

	.area-label {
    color: var(--navy);
    font-weight: bolder;
    font-size: larger;
    margin: .5rem 0 .5rem .5rem;
}

.investigation-header {
	flex-direction: row;
}

.investigation-section-nameanddesc {
	flex-grow: 4;
	flex-shrink: 1;
	flex-basis: auto;
	margin-right: 10px;
}

.investigation-section-details {
	flex-grow: 1;
	flex-shrink: 1;
	flex-basis: auto;
}

@media only screen and (max-width: 800px) {
	.investigation-header {
		flex-direction: column;
	}

	.investigation-section-nameanddesc {
		flex-grow: 1;
		flex-shrink: 1;
		flex-basis: auto;
		margin-right: 0;
	}

	.investigation-section-details {
		flex-grow: 1;
		flex-shrink: 1;
		flex-basis: auto;
	}
}

.fact-target-wrapper {
    float: left;
    margin: 0 .5rem .5rem;
    position: relative;
}

.fact-wrapper {
    float: left;
    margin: 0 .5rem .5rem;
    position: relative;
    width: 20rem;
}

/* the bottom most set of controls */
.fact-controls {
    padding: .5rem;
    font-size: 1rem;
    line-height: 1;
    border-bottom: 1px solid var(--box-border);
}

    .fact-controls .btn:not(:first-child), .fact-controls .btn.dd-toggle {
        margin-left: 0.25rem;
    }

.header-wrapper {
    clear: both;
    width: 100%;
}

.evidence-attachment {
    margin-left: 1.5rem;
    top: -.7rem;
}

.fact-transaction {
    text-align: center;
    height: 10rem;
}

.fact-transaction-label {
    font-size: x-large;
    margin-top: 2rem;
    margin-bottom: 1rem;
}

.fact-transaction-primary-label {
    font-size: medium;
    color: rgb(98, 120, 149);
    margin-top: .5rem;
    margin-bottom: 1.5rem;
}


/* fact file and image share similar LF */

.fact-image,
.fact-file {
    height: 9rem;
    width: calc(100% - 1rem);
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
    cursor: pointer;
    margin: .5rem;
}

.fact-file {
    position: relative;
}

    .fact-file > div {
        position: absolute;
        top: 0;
        opacity: 0;
    }

.investigations-read-toggle {
    display: flex;
    align-items: center;
}
/**
    Support different rendering of preview image
*/
/* the default scaling is a contain */
.fact-image[fact-preview-size="contain"] {
    background-size: contain;
    background-position: center;
}
/* the cover - it as many as possible without distortion */
.fact-image[fact-preview-size="cover"] {
    background-size: cover;
    background-position: center;
}
/* above the fold - scale width to fit and align to top */
.fact-image[fact-preview-size="abovethefold"] {
    background-size: 100% auto;
    background-position: 0 0;
}
/* left scale down - scale height to fit and align to left */
.fact-image[fact-preview-size="leftscaledown"] {
    background-size: auto 100%;
    background-position: 0 0;
}

.btn-change-preview-size {
    position: absolute;
    top: 3rem;
    right: .75rem;
    z-index: 1;
    opacity: .3;
    outline: none;
    line-height: 1;
    color: var(--text);
}

    .btn-change-preview-size:focus {
        outline: none;
    }

    .btn-change-preview-size svg {
        fill: currentColor;
    }

.btn-change-preview-size {
    opacity: .75;
    color: white;
}

.fact-image > div,
.fact-file > div {
    opacity: 0;
    padding-top: 4rem;
    text-align: center;
    height: 100%;
    width: 100%;
    border-radius: 0.75rem;
    background: rgba(var(--primary-rgb), 0.25);
}

    .fact-image > div:hover,
    .fact-image > div:hover + div,
    .fact-file > div:hover,
    .fact-file > div:hover + div {
        opacity: .75;
    }

    .fact-image > div > span,
    .fact-file > div > span {
        text-align: center;
        height: 100%;
    }

/*Edit Investigation - evidences: file-type on hover, to display text at the top */
.fact-file-hover.d-flex.justify-content-center.align-items-center span {
	position: absolute;
	top: 0;
}

/* extends fact "image" for workview */
.fact-image--workview {
    background-position: -1px -2px;
    background-size: auto 102%;
}

.fact-url {
    cursor: pointer;
    color: var(--navy) !important;
}

.fact-hyperlink{
    word-break: break-all;
}

.fact-time-ago {
    font-size: .75rem;
    color: var(--muted);
    float: right;
    padding: .5rem;
    width: 7rem;
    text-align: right;
}


.fact-title {
    height: 1.125rem;
    width: 15rem;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    display: inline-block;
    color: var(--muted);
    font-size: 0.875rem;
}


.fact-title {
    flex-grow: 1;
    text-align: center;
}

.fact-title-bar {
    display: flex;
    padding: .5rem .75rem;
}

.fact-url {
    height: 150px;
    width: 300px;
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
    cursor: pointer;
}

    .fact-url > div {
        padding-top: 4rem;
        text-align: center;
        height: 100%;
        width: 100%;
    }

        .fact-url > div:hover {
            opacity: .6;
        }

        .fact-url > div > span {
            color: var(--text);
            text-align: center;
            height: 100%;
        }

.fact-header {
    width: 100%;
    cursor: pointer;
    position: relative;
    border-radius: 1rem;
    border: 1px solid var(--box-border);
}

    .fact-header > div {
        display: flex;
        align-items: center;
        padding: .5rem;
    }


		.fact-header > div > span {
			text-align: left;
			font-weight: 500;
			color: var(--muted);
			display: inline-block;
			padding: 0 .5rem;
			font-size: 1.125rem;
			flex: 1;
			max-height: 9rem;
			overflow-y: auto;
			overflow-wrap: break-word;
		}

.fact-card {
    cursor: pointer;
}

.fact-item-top {
    top: 0;
    bottom: 0;
    left: 0;
    width: 100%;
    font-size: 1rem;
}

.fact-heading {
    padding: .5rem;
}

.wv-col.fact-col {
    padding: 0rem;
}

.fact-cancel-update {
    float: left;
    width: 48%;
}

.fact-save-update {
    float: right;
    width: 48%;
}

.wv-col.fact-col-desc,
.wv-col.fact-col-count {
    width: 20%;
    text-align: left;
}

.wv-col.fact-col-buttons > div {
    width: 10rem;
    float: right;
}

.wv-col.fact-col-buttons.fact-editing-buttons > div {
    width: 20rem;
}

input[type="text"].fact-label {
    font-size: 1.25rem;
    color: var(--navy);
}

input[type="text"].fact-desc {
    font-size: 1rem;
    color: var(--muted);
}

/* Context buttons on factboard add */
body:not(.factboard-select) .factboard-addable .context-item-btn {
    display: none;
}

.factboard-addable > .context-item-btn span:before {
    content: '\f068';
}

.factboard-addable:not(.factboard-item-selected) > .context-item-btn span:before {
    content: '\f067';
}


body.factboard-select .factboard-addable.dropdown {
    z-index: 2;
}



.factboard-select .event-panel.factboard-addable {
    margin-bottom: 1.5rem;
}

/* Removed facts */

.removed-fact {
    width: 20rem;
    height: 15.25rem;
    border-radius: .25rem;
    background: rgba(0,0,0,0.05);
    padding: 2rem;
    color: var(--muted);
    text-align: center;
}

.btn-icon.btn-link {
    text-align: left;
}

    .btn-icon.btn-link .fa {
        border-right: 1px solid rgba(200,0,75,0.15)
    }

.tooltiptext {
    visibility: hidden;
    width: 120px;
    background-color: #352965;
    color: #fff;
    text-align: center;
    border-radius: 6px;
    padding: 5px 0;
    position: absolute;
    z-index: 1;
    top: 150%;
    left: 3rem;
    margin-left: -60px;
}

    .tooltiptext::after {
        content: "";
        position: absolute;
        bottom: 100%;
        left: 50%;
        margin-left: -5px;
        border-width: 5px;
        border-style: solid;
        border-color: transparent transparent #352965 transparent;
    }

.toggle:hover .tooltiptext {
    visibility: visible;
}


.investigations-lightbox-menu {
    margin-top: -0.625rem;
}

/* *** Breakpoints *** */
@media only screen and (max-width: 1024px) {

	.wv-col.fact-col-desc {
		width: 50%;
		float: left;
	}

	.wv-col.fact-col-count {
		width: 50%;
		float: right;
	}

	.wv-col.fact-col-buttons {
		width: 100%;
		float: right;
	}

	.fact-board-controls {
		width: 34rem;
	}

	.fact-select-section,
	.fact-options-section {
		/*width: 100%;
        float: none;
        text-align: center*/
	}

	.fact-select-section {
		/*padding-bottom: 0;*/
	}

	.fact-new {
		padding-top: 0.5rem;
	}
}

@media only screen and (max-width: 767px) {

	.wv-col.fact-col-desc {
		width: 50%;
		float: left;
	}

		.wv-col.fact-col-desc > div {
			float: left;
			width: 100%;
			margin: .25rem;
		}

			.wv-col.fact-col-desc > div > h1,
			.wv-col.fact-col-desc > div,
			input[type="text"].fact-label input[type="text"].fact-desc {
				font-size: .875rem;
			}


	.wv-col.fact-col-buttons,
	.wv-col.fact-col-count {
		width: 50%;
		float: right;
	}

		.wv-col.fact-col-buttons > div,
		.wv-col.fact-col-count > div {
			width: 100%;
			float: left;
			margin: .25rem;
		}

		.wv-col.fact-col-buttons > div {
			position: relative;
		}

		.wv-col.fact-col-buttons.fact-editing-buttons,
		.wv-col.fact-col-buttons.fact-editing-buttons > div {
			width: 100%;
		}
}

@media only screen and (max-width: 576px) {
	.fact-board-controls {
		width: 100%;
	}

	.fact-select {
		width: 100%;
	}

		.fact-select select {
			color: var(--text-contrast);
		}


	.fact-select-section,
	.fact-options-section {
		/*width: 100%;
        float: none;
        text-align: center*/
	}

	.form-group.fact-add-to {
		margin-bottom: .4rem;
	}

	.form-group.fact-select,
	.form-group.fact-new,
	.form-group.fact-options {
		margin: 0;
	}
}

#InputEmailSelect .form-control.fs-toggle {
	display: inline-flex;
	width: 100%;
	align-content: space-between;
}

#InputEmailSelect .sngfilter-menu.avoid-menu {
	max-width: fit-content;
}

.radio-focused {
	outline: 2px solid rgba(var(--primary-rgb), 0.25);
}

.form-group {
	position: relative;
	margin-bottom: 1rem;
}

	.form-group:last-child:not(.mb), .form-group.error-message-container.invalid:last-child {
		margin-bottom: 0;
	}

button, input, optgroup, select, textarea {
	font-family: 'Lato', 'Helvetica', 'Arial', sans-serif;
}

.form-label, .form-group > label, .form-control-container > label,
.prop-panel-control > label {
	font-size: 0.875rem;
	color: var(--muted);
	margin: 0;
	display: block;
}

.dyno-control .form-label, .dyno-control .form-group > label {
	display: inline-block;
	margin-bottom: 0.125rem;
}

.focuslabel {
	color: var(--navy) !important;
}

.optional, .form-label.text-right.optional {
	font-size: .75rem;
	font-weight: bold;
	text-transform: uppercase;
	color: var(--border-strong);
	margin: 0 .5rem;
}

	.optional:first-child {
		margin-left: 0;
	}

	.optional:last-child {
		margin-right: 0;
	}

.form-control,
.form-control-icon,
.fs-toggle,
.select-wrapper select,
.select-wrapper select + span {
	-webkit-transition: background 0.2s ease, border 0.2s ease, color 0.2s ease;
	-ms-transition: background 0.2s ease, border 0.2s ease, color 0.2s ease;
	transition: background 0.2s ease, border 0.2s ease, color 0.2s ease;
}

.form-control,
.form-control-blocked,
.fs-toggle,
.select-wrapper select {
	border: 0;
	height: 2rem;
	padding: 0.25rem 0;
	position: relative;
	background: 0;
	font-family: 'Lato', Arial, sans-serif;
	font-size: 1rem;
	height: 2rem;
	color: var(--text);
}

.form-control-container .form-control:not(:disabled):focus {
	outline: 0;
	box-shadow: none;
	background: 0;
}

.form-control-container {
	border: 0;
	border-radius: 0.75rem;
	background: var(--form-control-container);
	padding: .25rem .5rem;
	box-shadow: 0 0 0 transparent;
	transition: box-shadow 0.3s ease;
	width: fit-content;
	max-width: 100%;
	line-height: 1.125rem;
}

#composer_input_list :not(fieldset) .form-control {
	border: 0;
	border-radius: 0.75rem;
	background: rgba(5,15,40,0.07);
	padding: .25rem .5rem;
	box-shadow: 0 0 0 transparent;
	transition: box-shadow 0.3s ease;
	max-width: 100%;
	line-height: 1.125rem;
	width: fit-content;
}

div.lightbox-inner div.lightbox-content div#composer_input_list input[type=text]#composer_input_integer_list_input.form-control {
	padding: 6px 14px;
	min-height: 35px;
}

.form-control-container .form-control-container {
	background: transparent;
	padding: 0;
}

	.form-label, .form-control-container label {
		font-weight: 500;
		font-size: 0.875rem;
		line-height: 1rem;
		padding: .125rem 0;
	}

.form-control-container_focused {
	box-shadow: 0 0 0 2px rgba(var(--primary-rgb), 0.6);
}

.form-control-blocked,
span.form-control {
	text-overflow: ellipsis;
	overflow: hidden;
	white-space: nowrap;
	transition: unset;
}

.form-control,
.select-wrapper,
.width-normal {
	width: 18rem;
	max-width: 100%;
}

	.form-control:hover,
	.select-wrapper select:hover {
		border-color: rgba(var(--primary-rgb), 0.5);
	}

	.form-control:focus {
		color: var(--text);
	}

		.form-control:focus .form-control-icon,
		.form-control:hover .form-control-icon,
		.select-wrapper select:focus .form-control-icon,
		.select-wrapper select:hover .form-control-icon {
			color: var(--navy);
		}

	.form-control:disabled,
	.form-control:disabled:hover,
	.form-control-blocked,
	.form-control[readonly],
	.select-wrapper select:disabled,
	.select-wrapper select:disabled:hover,
	.sngfilter.disabled .form-control {
		border-color: transparent;
		opacity: 0.6;
		background: var(--form-control-container);
	}

	.select-wrapper.form-control-container_focused select,
	.form-control-container_focused .select-wrapper select {
		outline: none;
	}

input.form-control:-moz-read-only {
	background: rgba(4, 0, 10, 0.05);
	border-color: transparent;
}

.form-control.disabled,
.form-control:disabled,
.select-wrapper select:disabled,
.sngfilter.disabled .form-control {
	color: var(--muted);
	cursor: not-allowed;
}

.form-control.invalid,
.select-wrapper select.invalid {
	border-color: var(--warning-secure);
	background: rgba(252, 163, 17, 0.1);
}

.form-control::-webkit-input-placeholder {
	color: var(--border-strong);
}

.form-control:-ms-input-placeholder {
	color: var(--border-strong);
}

.form-control::-ms-input-placeholder {
	color: var(--border-strong);
}

.form-control::placeholder {
	color: var(--border-strong);
}


.form-control ::-ms-clear,
.form-contro::-webkit-search-decoration,
.form-contro::-webkit-search-cancel-button,
.form-contro::-webkit-search-results-button,
.form-contro::-webkit-search-results-decoration {
	display: none;
}

.form-control-icon {
	color: var(--muted);
	float: right;
	-webkit-transition: all 0.2s ease;
	transition: all 0.2s ease;
	padding: 0.125rem;
	position: absolute;
	top: 0.25rem;
	right: 0.25rem;
}

.width-small, .width-normal, width-wide, width-auto {
	max-width: 100%;
}

	.width-small .form-control,
	.width-small .select-wrapper,
	.width-normal .form-control,
	.width-normal .select-wrapper,
	.width-wide .form-control,
	.width-wide .select-wrapper,
	.width-auto .form-control,
	.width-auto .select-wrapper,
	.width-stretch .form-control,
	.width-stretch .select-wrapper {
		width: 100%;
	}

.width-small,
.form-control.width-small,
.select-wrapper.width-small {
	width: 9rem;
}

.width-wide,
.form-control.width-wide,
.select-wrapper.width-wide {
	width: 40rem;
	max-width: 100%;
}

.width-stretch,
.form-control.width-stretch,
.form-control-blocked.width-stretch,
.select-wrapper.width-stretch {
	width: 100%;
}

	/* 40rem as max width for any standard (input-styled) form control */
	.width-stretch .form-control,
	.width-stretch .select-wrapper,
	.form-control.width-stretch,
	.form-control-blocked.width-stretch,
	.select-wrapper.width-stretch {
		max-width: 40rem;
	}

	/* except textareas */
	textarea.form-control.width-stretch,
	textarea.form-control-blocked.width-stretch,
	.width-stretch textarea.form-control {
		max-width: none;
	}

.fs-toggle, .select-wrapper select {
	padding-right: 1.25rem;
}

.select-wrapper {
	position: relative;
	line-height: 1rem;
}

	.select-wrapper > span {
		color: var(--muted);
		display: block;
		font-family: 'Font Awesome 6 Pro';
		font-size: 0.75rem;
		font-weight: 600;
		position: absolute;
		right: 0.5rem;
		top: 50%;
		z-index: 0;
		margin-top: -0.375rem;
		line-height: 0.75rem;
	}

		.select-wrapper > span:before {
			content: '\f0dc';
		}

.select-wrapper-loading > span:before {
	content: '\f1ce';
}

.select-wrapper select {
	background: 0;
	position: relative;
	width: 100%;
	z-index: 1;
	-moz-appearance: none;
	-webkit-appearance: none;
}

.select-wrapper select option,
#user-details-language option {
	background: var(--modal);
	color: var(--text);
}

	.select-wrapper select::-ms-expand {
		display: none;
	}

	.select-wrapper select:disabled {
		color: var(--muted);
	}

		.select-wrapper select:disabled + span {
			opacity: 0.25;
		}

	.select-wrapper select:focus:not(:disabled) + span, .select-wrapper select:hover:not(:disabled) + span {
		color: var(--navy);
	}

textarea.form-control {
	height: auto;
	min-height: 5rem;
	border-width: 0;
}

[sng-input-save-textbox] ng-transclude {
	flex-grow: 1;
	flex-shrink: 1;
	overflow: hidden;
}



/* ========== buttons */
.pull-right {
	float: right;
}

.pull-left {
	float: left;
}

.btn, .btn.btn-primary, .btn-icon, .btn-fa, .nav-link, .navbar-nav .nav-link,
.dyno-lightbox-close,
.lightbox-close, .cpf-lightbox-close, .new-btn {
	background: var(--primary-rgb-faded);
	border-radius: 1rem;
	cursor: pointer;
	font-size: 0.875rem;
	font-weight: 600;
	min-width: 3rem;
	padding: 0.5rem 0.75rem;
	text-align: center;
	transition: background 0.12s ease, box-shadow 0.12s ease;
	margin-right: .5rem;
	min-height: 2rem;
	height: auto;
	word-break: break-word;
	border: 0;
	white-space: normal;
	line-height: 1em;
	min-width: 4rem;
	color: var(--button-text);
}

@media only screen and (max-width: 991px) {
	.navbar-nav button#fileDropDown.nav-link {
		margin-right: .0rem;
	}
}

	.btn, .btn:active, .btn:focus, .btn:hover, .nav-link:hover, .navbar-nav .nav-link:hover, .nav-link:focus, .navbar-nav .nav-link:focus {
		outline: 0;
		color: var(--button-text);
		text-decoration: none;
	}

		.btn:hover, .btn.btn-primary:hover, .nav-link:hover, .navbar-nav .nav-link:hover {
			background: rgba(var(--primary-rgb), 0.3);
			box-shadow: 0 3px 8px rgba(var(--primary-rgb), 0.15);
		}

		.btn:focus, .nav-link:focus, .navbar-nav .nav-link:focus {
			outline: 2px solid rgba(var(--primary-rgb), 0.15);
			color: var(--button-text);
		}


		.btn:focus, .btn.btn-primary:focus, .collapsible-btn:focus {
			-webkit-box-shadow: 0 0 0 0.125rem rgba(var(--primary-rgb), 0.5);
			box-shadow: 0 0 0 0.125rem rgba(var(--primary-rgb), 0.5);
		}

		.btn:active, .btn.btn-primary:active {
			background: rgba(var(--primary-rgb), 0.3);
			-webkit-box-shadow: none;
			box-shadow: none;
		}

		.btn.btn-narrow {
			min-width: 1.25rem;
		}

		.btn.btn-secondary {
			background: rgba(var(--navy-rgb), 0.15);
			color: var(--navy);
		}



			.btn.btn-secondary:hover {
				background: rgba(var(--navy-rgb), 0.3);
				box-shadow: 0 3px 8px rgba(var(--navy-rgb), 0.15);
			}

			.btn.btn-secondary:focus {
				-webkit-box-shadow: 0 0 0 0.125rem rgba(var(--navy-rgb), 0.5);
				box-shadow: 0 0 0 0.125rem rgba(var(--navy-rgb), 0.5);
			}

			.btn.btn-secondary:active {
				background: rgba(var(--navy-rgb), 0.25);
				-webkit-box-shadow: none;
				box-shadow: none;
			}

		.btn.btn-success {
			background: var(--success-rgb-faded);
			color: var(--success-dark) !important;
		}

			.btn.btn-success:hover {
				background: rgba(var(--success-rgb), 0.3);
				box-shadow: 0 3px 8px rgba(var(--success-rgb), 0.15);
			}

			.btn.btn-success:focus {
				outline: 0.125rem rgba(var(--success-rgb), 0.3);
			}

			.btn.btn-success:active {
				background: rgba(var(--success-rgb), 0.3) !important;
				box-shadow: none;
			}

		.btn.btn-warning {
			background: var(--warning-rgb-faded);
			color: var(--warning-dark) !important;
		}

			.btn.btn-warning:hover {
				background: rgba(var(--warning-rgb), 0.3);
				box-shadow: 0 3px 8px rgba(var(--warning-rgb), 0.15);
			}

			.btn.btn-warning:focus {
				outline: 0.125rem rgba(var(--warning-rgb), 0.3);
			}

			.btn.btn-warning:active {
				background: rgba(var(--warning-rgb), 0.25);
				box-shadow: none;
			}

		.btn.btn-danger {
			background: var(--danger-rgb-faded);
			color: var(--danger-dark) !important;
		}

			.btn.btn-danger:hover {
				background: rgba(var(--danger-rgb), 0.3);
				box-shadow: 0 3px 8px rgba(var(--danger-rgb), 0.1);
			}

			.btn.btn-danger:focus {
				outline: 0.125rem rgba(var(--danger-rgb), 0.3);
			}

			.btn.btn-danger:active {
				background: rgba(var(--danger-rgb), 0.2);
				box-shadow: none;
			}

		.btn.btn-muted {
			background: rgba(var(--muted-rgb), 0.1);
			color: var(--muted-dark) !important;
		}

			.btn.btn-muted:hover {
				background: rgba(var(--muted-rgb), 0.2);
			}

			.btn.btn-muted:focus {
				outline: 0.125rem rgba(var(--muted-rgb), 0.5);
			}

			.btn.btn-muted:active {
				background: rgba(var(--muted-rgb), 0.3);
				box-shadow: none;
			}

		.btn.btn-block, .btn-block {
			margin: 0;
		}

			.btn-block + .btn-block {
				margin-top: .5rem;
			}

.btn-alert {
	font-weight: bold;
	background: 0;
	-webkit-box-shadow: none;
	box-shadow: none;
	border: 1px solid var(--text-contrast);
}

.btn.btn-alert:hover {
	background: var(--text-contrast);
	color: var(--navy);
}

.btn-link, .btn.btn-link, .btn.btn-link:hover, .btn.btn-link:active, .btn.btn-link:focus,
.btn-fa, .btn.btn-fa, .btn.btn-fa:hover, .btn.btn-fa:active, .btn.btn-fa:focus {
	color: var(--navy);
}

.btn-link,
.btn-fa,
.btn-faded {
	font-weight: bold;
}

.btn-fa, .btn.btn-fa, .lightbox-close, .cpf-lightbox-close, .dyno-lightbox-close {
	min-width: 2rem;
	height: auto;
	padding: .25rem .5rem;
	border-radius: 0.75rem !important;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	margin: 0;
}

	.btn-fa.btn-sm {
		min-width: 0;
	}

	.btn-fa.btn-fa-lg {
		min-width: 0;
		font-size: 1.125rem;
		height: 2rem;
		width: 2.25rem;
		text-align: center;
		display: block;
		flex-shrink: 0;
		display: flex;
		align-items: center;
	}

.btn:disabled, .btn:disabled:hover, .btn:disabled:active, .btn:disabled:focus,
a.btn[disabled], a.btn[disabled], a.btn[disabled], a.btn[disabled],
.nav-link:disabled, .nav-link.disabled, .nav-link[disabled] {
	background: 0 !important;
	-webkit-box-shadow: inset 0 0 0 1px var(--border-strong) !important;
	box-shadow: inset 0 0 0 1px var(--border-strong) !important;
	cursor: not-allowed;
	color: var(--muted) !important;
	text-decoration: none;
}

.btn-fa:disabled, .btn-fa:disabled:hover, .btn-fa:disabled:active, .btn-fa:disabled:focus {
	-webkit-box-shadow: none !important;
	box-shadow: none !important;
}

.btn.btn-link-success,
.btn.btn-link-success:hover {
	color: var(--success);
}

	.btn.btn-link-success:hover {
		background: rgba(var(--success-rgb), 0.3);
	}

.btn.btn-link-warning,
.btn.btn-link-warning:hover {
	color: var(--warning-secure);
}

	.btn.btn-link-warning:hover {
		background: rgba(var(--warning-rgb), 0.3);
	}


.btn.btn-link-danger,
.btn.btn-link-danger:hover {
	color: var(--danger);
}

	.btn.btn-link-danger:hover {
		background: rgba(var(--danger-rgb), 0.3);
	}

.btn.btn-link-secondary,
.btn.btn-link-secondary:hover {
	color: var(--navy);
}

	.btn.btn-link-secondary:hover {
		background: rgba(var(--navy-rgb), 0.3);
	}

.btn.btn-link-muted,
.btn.btn-link-muted:hover {
	color: var(--muted);
}

	.btn.btn-link-muted:hover {
		background: rgba(var(--muted-rgb), 0.3);
	}

.btn-faded-secondary {
	background: rgba(var(--navy-rgb),0.1);
	color: var(--navy);
}

	.btn-faded-secondary:hover, .btn-faded-secondary:active {
		text-decoration: none;
		background: rgba(var(--navy-rgb),0.2);
		color: var(--navy);
	}


.btn-faded-success {
	background: rgba(var(--success-rgb),0.1);
	color: var(--success-dark);
}

	.btn-faded-success:hover, .btn-faded-success:active {
		text-decoration: none;
		background: rgba(var(--success-rgb),0.2);
		color: var(--success-dark);
	}

div.app-menu-right .btn-faded-warning,
div.app-menu-right div.d-flex span {
	white-space: nowrap;
}

.btn-faded-warning {
	background: var(--warning-rgb-faded);
	color: var(--warning-dark);
}

	.btn-faded-warning:hover, .btn-faded-warning:active {
		text-decoration: none;
		background: rgba(var(--warning-rgb),0.4);
		color: var(--warning-dark);
	}


.btn-faded-danger {
	background: rgba(var(--danger-rgb),0.1);
	color: var(--danger);
}

	.btn-faded-danger:hover, .btn-faded-danger:active {
		text-decoration: none;
		background: rgba(var(--danger-rgb),0.2);
		color: var(--danger);
	}


.btn-faded-muted {
	background: rgba(var(--muted-rgb),0.1);
	color: var(--muted);
}

	.btn-faded-muted:hover, .btn-faded-muted:active {
		text-decoration: none;
		background: rgba(var(--muted-rgb),0.2);
		color: var(--muted);
	}


.btn-faded-info {
	/* change this */
	background: rgba(var(--info-rgb),0.1);
	color: var(--info);
}

	.btn-faded-info:hover, .btn-faded-info:active {
		text-decoration: none;
		background: rgba(var(--info-rgb),0.2);
		color: var(--info);
	}


.btn.btn-outline {
	border: 1px solid var(--navy);
	color: var(--navy);
	background: 0;
}

	.btn.btn-outline:hover {
		background: rgba(var(--primary-rgb),0.15);
	}

	.btn.btn-outline:active {
		background: rgba(var(--primary-rgb),0.25);
	}

	.btn.btn-outline.btn-outline-inverse {
		border-color: var(--text-contrast);
		background: rgba(255,255,255,0.1); /* no rgba support on TextContrast variable */
		color: var(--text-contrast);
	}

.btn.btn-outline-inverse:hover {
	background: rgba(255,255,255,0.2); /* no rgba support on TextContrast variable */
}

.btn.btn-outline-inverse:active {
	background: var(--text-contrast);
	color: var(--navy);
}


.btn.btn-outline:disabled, .btn.btn-outline-inverse:disabled,
.btn.btn-outline:disabled:hover, .btn.btn-outline-inverse:disabled:hover {
	border: 1px solid rgba(255,255,255,0.3);
	color: #fff !important;
	background: 0;
	box-shadow: none !important;
}

.btn-icon {
	text-align: left;
	display: inline-flex;
	white-space: nowrap;
	max-width: 100%;
	overflow: hidden;
	text-overflow: ellipsis;
	align-items: center;
}

	.btn-icon > .fa:first-child,
	.btn-icon > .fas:first-child {
		margin-right: 0.5rem;
	}

	.btn-icon-right > .fa:last-child,
	.btn-icon-right > .fas:first-child {
		margin-left: 0.5rem;
		margin-right: 0;
	}

	.btn-icon.btn-lg .fa {
		font-size: 1.125rem;
		margin: .125rem .5rem 0 0;
	}

	.btn-icon.btn-sm .fa,
	.btn-icon.btn-link .fa {
		padding-left: .25rem;
	}

	.btn-icon.btn-link .fa {
		border: 0;
		margin: 0;
	}

	.btn-icon.btn-link {
		text-align: center;
	}

.btn.btn-dropdown:after, .btn.dd-toggle:after {
	content: '\f0d7';
	font-weight: 800;
	font-family: 'Font Awesome 6 Pro';
	margin: 0 0.125rem 0 0.5rem;
}

.btn.dd-toggle .caret {
	display: none;
}

.btn.btn-lg {
	font-size: 1rem;
	height: 2.75rem;
}

.btn.btn-launch {
	width: 100%;
	display: flex;
	font-size: 1rem;
	padding: 0.75rem 1rem;
	font-weight: bold;
	align-items: center;
}

	.btn.btn-launch .fa {
		flex: 0;
	}

	.btn.btn-launch .btn-text {
		flex: 1;
	}

.btn.btn-sm,
.btn.btn-xs {
	min-height: 0;
	min-width: 0;
	line-height: 1em;
}

.btn.btn-sm {
	height: 1.5rem;
	padding: .25rem 0.5rem;
}

.btn.btn-xs {
	padding: .125rem .25rem;
	height: 1.25rem;
}

.btn-xs .fa, .btn-xs .fo, .btn-sm .fa, .btn-sm .fo { /* Small button icons */
	margin-right: .25rem;
}

.external-link:after {
	content: '\f08e';
	font-family: 'Font Awesome 6 Pro';
	font-weight: 400;
	opacity: 0.5;
	margin-left: 0.5rem;
	display: inline-block;
}

/* #14354 - fixing above .btn:not... rule */
.btn-group > .btn {
	margin-right: 0;
}

/* Input groups and addons */

.input-group-addon {
	height: 2rem;
	background: transparent;
	border: 0;
	border-bottom: 2px transparent;
}

.search-filter .input-group-append > .btn {
	margin-right: -0.25rem;
}
/* Item selector display - resource editor & file input */


/*file input element*/
.item-selector {
	display: flex;
}

	.item-selector.item-selector-inline {
		display: inline-flex;
	}

	.item-selector.width-stretch {
		width: 100%;
	}


.item-selector-info {
	float: left;
	color: var(--navy);
	position: absolute;
	cursor: pointer;
	left: 0;
	top: 0;
	line-height: 2rem;
	bottom: 0;
	width: 2rem;
}

.item-selector-display {
	border-radius: 1rem;
	background: var(--background);
	vertical-align: middle;
	color: var(--muted);
	text-align: center;
	min-width: 5rem;
	flex: 1 1 auto;
}

	.item-selector-display.item-selector-selected {
		border-left: 3px solid var(--primary-base);
		color: var(--navy);
	}

.item-selector-item {
	font-size: .875rem;
	min-width: 18rem;
	padding: .5rem 2rem 0.5rem 1.25rem;
	min-height: 2.25rem;
	position: relative;
}

.item-selector-compact .item-selector-item {
	min-width: 4rem;
}

.item-selector-item.has-info-button {
	padding-left: 2rem;
}

.item-selector-text {
	word-break: break-word;
	word-wrap: break-word;
	-ms-word-break: break-word;
	-ms-word-wrap: break-word;
}

.item-selector-remove {
	float: right;
	color: var(--navy);
	position: absolute;
	cursor: pointer;
	right: 0;
	top: 0;
	line-height: 2rem;
	bottom: 0;
	width: 2rem;
}

.form-control-container .item-selector {
	margin-bottom: 0;
	padding-top: .25rem;
}

.item-selector-button {
	/* min-width: 13rem;*/
}

	.item-selector-button:last-child {
		margin: 0 0 0 .5rem;
	}

.item-selector.item-selector-stacked .item-selector-display {
	display: block;
}

.item-selector.item-selector-stacked .item-selector-button {
	width: 100%;
	margin-bottom: 1rem;
}

.item-selector.item-selector-inline .item-selector-display {
	display: inline-block;
	margin-left: 0.75rem;
}

/*  disabled state */
.item-selector-item .item-selector-info[disabled],
.item-selector-item .item-selector-remove[disabled] {
	color: var(--muted);
	cursor: not-allowed;
}

/* Checkboxes and radio controls */

.alt-radio.focused {
	border-color: var(--primary-base);
	box-shadow: 0 0 0 3px rgba(var(--primary-rgb), 0.5);
}

.alt-checkbox input,
.alt-radio input,
.checkbox input,
.radio input {
	position: absolute;
	opacity: 0;
	z-index: -1;
	-webkit-box-shadow: none !important;
	box-shadow: none !important;
	clip: rect(0, 0, 0, 0);
	-webkit-clip-path: polygon(0px 0px,0px 0px,0px 0px,0px 0px);
	clip-path: polygon(0px 0px,0px 0px,0px 0px,0px 0px);
	height: 0;
	width: 0;
	overflow: hidden;
	float: left;
	-moz-appearance: none;
	appearance: none;
	-webkit-appearance: none;
}

	.alt-checkbox input:focus + span:before,
	.alt-radio input:focus + span:before,
	.checkbox input:focus + span:before,
	.radio input:focus + span:before,
	.checkbox-static:focus:before,
	.radio-static:focus:before {
		border-color: var(--primary-base);
		box-shadow: 0 0 0 3px rgba(var(--primary-rgb), 0.5);
	}

.alt-radio.vertical,
.alt-checkbox.vertical,
.alt-checkbox.vertical span,
.alt-radio.vertical span {
	width: 100%;
	display: block;
}

	.alt-radio.vertical label,
	.alt-checkbox.vertical label {
		display: block;
		margin: 0 0 .25rem;
	}

	.alt-checkbox.vertical input,
	.alt-radio.vertical input {
		display: block;
	}

	.alt-checkbox.vertical label:last-child,
	.alt-radio.vertical label:last-child {
		margin: 0;
	}

.checkbox,
.radio {
	line-height: 1rem;
	display: inline-block;
	margin-right: 1rem;
	font-size: 1rem;
}

.form-group label.checkbox,
.prop-panel-control label.checkbox,
.form-group label.radio,
.prop-panel-control label.radio {
	font-size: 1rem;
	color: var(--text);
}

.checkbox:last-child,
.radio:last-child {
	margin-right: 0;
}

.checkbox.vertical,
.radio.vertical {
	display: block;
	padding-top: 0.5rem;
}

.alt-radio:has(input:focus) {
	border-color: var(--primary-base);
	box-shadow: 0 0 0 3px rgba(var(--primary-rgb), 0.5);
}

/* Angular buttons that perform as checkboxes */
.checkbox-static,
.radio-static {
	appearance: none;
	background: 0;
	border: 0;
	padding: 0;
	margin: 0;
}

	.checkbox-static:focus,
	.radio-static:focus {
		outline: 0;
	}

	/* Main code for checkboxes*/
	.checkbox input ~ span:before,
	.radio input ~ span:before,
	.checkbox-static:before,
	.radio-static:before {
		background: transparent;
		border: 2px solid var(--border-strong);
		cursor: pointer;
		display: inline-block;
		height: 1.25rem;
		margin-right: 0.5rem;
		overflow: hidden;
		position: relative;
		top: 0.125rem;
		-webkit-transition: all 0.15s ease;
		transition: all 0.15s ease;
		width: 1.25rem;
	}

.checkbox.checkbox--no-right-margin input ~ span:before {
	margin-right: 0px;
}

.checkbox input ~ span:before,
.checkbox-static:before {
	border-radius: 0.125rem;
	color: transparent;
	content: '\f00c';
	font-family: 'Font Awesome 6 Pro';
	font-size: 1rem;
	line-height: 1rem;
	text-align: center;
	font-weight: 300;
}

.radio input ~ span:before,
.radio-static:before {
	border-radius: 0.5rem;
	content: '';
}

.radio input:checked + span:before,
.checkbox input:checked + span:before,
.radio-static.checked:before,
.checkbox-static.checked:before {
	border-color: var(--primary-base);
	color: var(--text-contrast);
}

.radio input:checked + span:before,
.radio-static.checked:before {
	border-width: .375rem;
}

.radio input:checked:focus + span:before,
.radio-static.checked:focus:before {
	box-shadow: 0 0 0 3px rgba(var(--primary-rgb), 0.5);
}

.checkbox input:checked + span:before,
.checkbox-static.checked:before {
	background: var(--primary-base);
}

.checkbox input:disabled ~ span,
.radio input:disabled ~ span,
.checkbox-static:disabled,
.radio-static:disabled {
	color: var(--muted);
}

	.checkbox input:disabled + span:before,
	.radio input:disabled + span:before,
	.checkbox-static:disabled:before,
	.radio-static:disabled:before {
		border-color: var(--border-strong);
		cursor: not-allowed;
	}

.checkbox input:disabled:checked + span:before,
.checkbox-static.checked:disabled:before {
	background: 0;
	color: var(--border-strong);
}

.form-label + .checkbox:before,
.form-label + .radio:before {
	display: block;
	content: '';
}

.alt-checkbox,
.alt-radio {
	border-radius: 1rem;
	padding: 0.25rem;
	border: 1px solid var(--box-border);
	display: inline-block;
}

	.alt-checkbox label,
	.alt-radio label {
		padding: .25rem;
		margin: 0;
	}

		.alt-checkbox label span,
		.alt-radio label span {
			padding: .25rem 0.75rem;
			border-radius: .75rem;
			display: block;
			cursor: pointer;
			-webkit-transition: all 0.2s ease;
			transition: all 0.2s ease;
			line-height: 1rem;
			min-width: 4rem;
			text-align: center;
			color: var(--navy);
		}

		.alt-checkbox label:hover span,
		.alt-radio label:hover span {
			background: rgba(var(--primary-rgb), 0.1);
		}

		.alt-checkbox label input:checked + span,
		.alt-radio label input:checked + span {
			background: rgba(var(--primary-rgb), 0.35);
			color: var(--navy);
		}

	.alt-checkbox span:before {
		font-family: 'Font Awesome 6 Pro';
		margin-right: .5rem;
		content: '\f096';
		-webkit-box-shadow: none !important;
		box-shadow: none !important;
		color: var(--muted);
		width: 1rem;
		display: inline-block;
		text-align: center;
	}

	.alt-checkbox input:checked + span:before {
		content: '\f14a';
		color: var(--navy);
	}

	.alt-checkbox input:disabled + span,
	.alt-radio input:disabled + span {
		background: 0;
		color: var(--text-disabled);
		cursor: not-allowed;
	}

	.alt-checkbox label input:checked:disabled + span,
	.alt-radio label input:checked:disabled + span {
		color: var(--muted);
		background: var(--border-light);
	}

.form-control-container .alt-radio,
.form-control-container .alt-checkbox {
	padding: 0;
	border: 0;
}
.alt-radio.alt-radio-mini label span {
	min-width: 4rem;
	font-size: 0.875rem;
	padding: 0.325rem;
}
/* Columns in tables or stacks containing checkboxes */
.checkbox-column, .table .checkbox-column, .t-row .checkbox-column {
	width: 2.5rem;
	padding: 0;
}

	.checkbox-column .checkbox-static {
		padding: .75rem;
	}

		.checkbox-column .checkbox,
		.checkbox-column input ~ span::before,
		.checkbox-column .checkbox-static::before,
		.checkbox-column .radio-static::before {
			margin: 0;
		}

/* Currency controls */

.currency-control {
	padding: 0;
	display: flex;
	flex-wrap: wrap;
}

	.currency-control .select-wrapper {
		flex: 0 0 auto;
		flex-basis: 4.625rem;
	}

	.currency-control select {
		padding-left: 0.5rem;
		text-align: right;
	}

	.currency-control input {
		background: 0;
		padding-left: 1rem;
		width: calc(100% - 4.625rem);
		flex: 1 1 auto;
		flex-basis: calc(100% - 4.625rem);
	}

.date-control {
	max-width: 21rem;
	padding-right: 1.5rem;
}

	.date-control.dd-toggle:after {
		display: none;
	}

.date-control,
.fs-toggle {
	height: auto;
	min-height: 2rem;
}

.open .date-control,
.form-control-toggle:hover {
	cursor: pointer;
	background: rgba(var(--primary-rgb), 0.1);
}

	.open .date-control .form-control-icon,
	.form-control-toggle:hover .form-control-icon {
		color: var(--navy);
	}

.disabled .form-control-icon, input:disabled ~ .form-control-icon {
	color: var(--border-strong) !important;
}

/* Toggles */

.toggle {
	display: inline-block;
	margin: 0;
}

	.toggle input {
		width: 0;
		height: 0;
		padding: 0;
		clip: rect(0, 0, 0, 0);
		-webkit-clip-path: polygon(0px 0px,0px 0px,0px 0px,0px 0px);
		clip-path: polygon(0px 0px,0px 0px,0px 0px,0px 0px);
		-webkit-box-shadow: none;
		box-shadow: none;
		-moz-appearance: none;
		appearance: none;
		-webkit-appearance: none;
		opacity: 0;
	}

.tog-switch {
	display: inline-block;
	width: 3.5rem;
	height: 2rem;
	background: var(--box-border);
	border-radius: 1rem;
	float: left;
	margin-right: 0.5rem;
	position: relative;
	cursor: pointer;
	box-shadow: inset 0 0 12px rgba(10, 10, 30, 0.12);
	line-height: 1rem;
	font-size: 1rem;
}

	.tog-switch, .tog-switch:before {
		-webkit-transition: all 0.2s ease;
		transition: all 0.2s ease;
	}

		.tog-switch:before {
			display: block;
			content: '';
			width: 1.5rem;
			height: 1.5rem;
			border-radius: 0.75rem;
			background: #fff;
			position: absolute;
			top: 0.25rem;
			left: 0.25rem;
			box-shadow: 0 2px 4px rgba(10, 10, 30, 0.15);
		}

input:focus + .tog-switch {
	-webkit-box-shadow: 0 0 0 2px rgba(var(--primary-rgb), 0.5), inset 0 -15px 20px rgba(255, 255, 255, 0.16);
	box-shadow: 0 0 0 2px rgba(var(--primary-rgb), 0.5), inset 0 -15px 20px rgba(255, 255, 255, 0.16);
}

input:checked:focus + .tog-switch {
	-webkit-box-shadow: 0 0 0 2px rgba(var(--success-rgb), 0.5), inset 0 -15px 20px rgba(255, 255, 255, 0.16);
	box-shadow: 0 0 0 2px rgba(var(--success-rgb), 0.5), inset 0 -15px 20px rgba(255, 255, 255, 0.16);
}

input:checked + .tog-switch {
	background: var(--success);
}

	input:checked + .tog-switch:before {
		left: 1.75rem;
	}

.toggle input + span:nth-of-type(2),
.toggle input:checked ~ span:nth-of-type(3),
.toggle span:nth-of-type(2) {
	display: none;
}

	.toggle input:checked ~ span:nth-of-type(2),
	.toggle span:nth-of-type(2):last-child {
		display: inline;
	}

.tog-switch:nth-last-child(2):after {
	display: block;
	content: '\f00d';
	position: absolute;
	top: 0.5rem;
	right: 0.75rem;
	color: rgba(25, 25, 25, 0.4);
	font-family: 'Font Awesome 6 Pro';
	font-weight: normal;
}

input:checked + .tog-switch:nth-last-child(2):after {
	right: 2rem;
	content: '\f00c';
}

.toggle-sm .tog-switch {
	height: 1.5rem;
	width: 3rem;
	line-height: 1.5rem;
}

	.toggle-sm .tog-switch:before {
		height: 1rem;
		width: 1.25rem;
	}

.tog-switch ~ span {
	line-height: 2rem;
}

.toggle-sm .tog-switch ~ span {
	line-height: 1.5rem;
	font-size: .875rem;
}

.toggle-sm input:checked + .tog-switch:before {
	left: 1.375rem;
}

.toggle-sm input:checked + .tog-switch:nth-last-child(2):after {
	right: 1.75rem;
	top: 0;
}

.toggle-sm .tog-switch:nth-last-child(2):after {
	top: 0;
	right: 0.5rem;
}

.toggle input:disabled + .tog-switch {
	background: 0;
	-webkit-box-shadow: 0 0 0 2px var(--border-strong);
	box-shadow: 0 0 0 2px var(--border-strong);
	cursor: not-allowed;
}

	.toggle input:disabled + .tog-switch:before {
		border: 2px solid var(--border-strong);
		box-shadow: none !important;
		background: 0;
	}

.toggle input:disabled:checked + .tog-switch:before {
	background: var(--box-border);
}

input:disabled + .tog-switch:after {
	color: var(--border-strong);
}

.toggle input:disabled ~ span:not(.tog-switch) {
	color: var(--muted);
}

.toggle-sm span {
	font-size: .875rem;
}

.required {
	color: var(--danger);
}

.error-message {
    font-size: 0.875rem;
    color: var(--warning-secure);
    max-width: 100%;
    display: flex;
    padding: .25rem 0;
}

.error-icon {
	-webkit-box-flex: 0;
	-ms-flex: 0 0 auto;
	flex: 0 0 auto;
}

.error-message:empty {
	display: none;
}

.error-icon,
.help-icon,
.dv-help-icon,
.sng-ui-help {
	font-size: 0.875rem;
	line-height: inherit;
	font-family: 'Font Awesome 6 Pro';
	font-weight: bold;
}

.help-icon,
.dv-help-icon,
.sng-ui-help {
	margin-left: .5rem;
	cursor: pointer;
}

	.help-icon:before,
	.dv-help-icon:before,
	.sng-ui-help:before {
		content: '\f059';
		color: var(--help-icon);
	}

.error-icon:before {
	content: '\f06a';
	color: var(--warning-secure);
}

.fs-toggle {
}

	.fs-toggle span,
	.fs-toggle:after {
		padding: .25rem 0 0;
	}

	.fs-toggle:after {
		display: block;
		clear: both;
	}

	.fs-toggle:hover {
		cursor: pointer;
		color: var(--navy);
	}

	.fs-toggle .fs-selected {
		color: var(--text);
		padding: 0 0 0 .25rem;
		width: 100%;
	}

		.fs-toggle .fs-selected button {
			float: right;
			font-size: .75rem;
			padding: .25rem;
			margin: .125rem 0 0;
			color: var(--border-strong);
			-moz-appearance: none;
			-webkit-appearance: none;
		}

			.fs-toggle .fs-selected button:hover {
				color: var(--navy);
				cursor: pointer;
			}

.fs-selected .title {
	width: calc(100% - 1.375rem);
	float: left;
	font-size: 1rem;
	padding: 0;
	line-height: 1.25rem;
	word-wrap: break-word;
	overflow-wrap: break-word;
	word-break: break-word;
	-ms-hyphens: auto;
	-webkit-hyphens: auto;
	hyphens: auto;
}

.visible .fs-toggle {
	background: rgba(var(--primary-rgb),0.1);
}

.fs-selected-label {
	float: left;
	max-width: calc(100% - 1.25rem);
	text-overflow: ellipsis;
	white-space: nowrap;
	overflow: hidden;
}


.dragover {
	background: rgba(var(--primary-rgb), 0.1);
	border-color: var(--primary-base);
	color: var(--navy);
}

.movefield {
	transition: .3s;
}

.drag-icon {
	height: 6px;
	width: 12px;
	border: 2px solid var(--border-strong);
	border-width: 2px 0 2px 0;
}

.draggable {
	cursor: move !important;
	cursor: grab !important;
	cursor: -moz-grab !important;
	cursor: -webkit-grab !important;
	transition: .3s !important;
}

.drag-icon-right-light {
	height: 14px;
	border-right: 2px solid #fff;
}

.drag-icon-left-right {
	height: 14px;
	border-left: 2px solid #fff;
}

.drag-drop-zone {
	width: 100%;
	height: 42px;
	background: rgba(var(--primary-rgb), 0.25);
}

/* TABLE STYLING */

.highlightHeader {
	background: rgba(var(--primary-rgb), 0.15);
	color: var(--navy) !important;
	box-shadow: var(--shadow-small);
	border-radius: 1rem;
}


.table {
	color: var(--text);
}
.new-table thead,
.table thead,
.t-head,
tfoot {
	background: var(--table-row);
	color: var(--muted);
	position: sticky;
	inset-block-start: 0;
	z-index: 10;
}

.t-head, .row.t-head {
	margin: 0;
}

	.table thead th,
	.t-head > div {
		padding: 0.5rem 1.25rem 0.75rem;
		border: 0;
		border: 1px solid var(--border-light);
		border-width: 0 1px 1px 0;
		font-weight: 500;
		position: relative;
		vertical-align: middle;
	}

		.table thead th:last-child,
		.t-head > div:last-child {
			border-right: 0;
		}

		.table thead th.draggable,
		.t-head > div.draggable {
			transition: padding 0.2s ease;
		}

			.table thead th.draggable:after,
			.t-head > div.draggable:after {
				content: '\f7a5';
				font-family: 'Font Awesome 6 Pro';
				color: var(--muted);
				opacity: 0.5;
				position: absolute;
				font-size: 0.75rem;
				left: 0.625rem;
				opacity: 0;
				transition: opacity 0.3s ease;
				top: 50%;
				transform: translateY(-50%);
				margin-top: -0.125rem;
			}

			.table thead th.draggable:hover:after,
			.t-head > div.draggable:hover:after {
				opacity: 0.75;
			}

		.table thead th:hover::before,
		.t-head > div:hover::before {
			display: block;
			content: '';
			position: absolute;
			top: 0;
			left: 0.25rem;
			width: calc(100% - 0.5rem);
			height: calc(100% - 0.25rem);
			background: rgba(var(--primary-rgb), 0.15);
			pointer-events: none;
			border-radius: 0.75rem;
		}

		.table-disable-hover thead th:hover::before {
			display: none;
			background: inherit;
		}

		.table thead th .sort-icon,
		.t-head > div .sort-icon {
			position: absolute;
			top: 50%;
			right: 0.325rem;
			transform: translateY(-50%);
			line-height: 0.875rem !important;
			margin-top: -0.125rem;
			width: 1.25rem;
			text-align: center;
		}


	.table-small thead th,
	.t-head > div {
		padding: 0.4rem 0.5rem;
	}

	.t-head:first-child {
		border-radius: .25rem .25rem 0 0;
	}


.t-body {
	border-width: 0 .125rem;
	border-radius: .25rem;
}

.t-body, .t-row .t-body {
	padding: 0;
}

	.t-body + .t-body {
		margin-top: 1rem;
	}

ul.t-body {
	list-style: none;
}

.table tbody tr,
.t-row {
	border: 1px solid var(--border-light);
	border-width: 0 0 1px;
	background: var(--table-row);
}

	.table tbody tr:last-child,
	.t-row:last-child {
		border-bottom: 0;
	}

	.table tbody tr.dynoview-total-row {
		background: var(--background-column-total);
		font-weight: bold;
	}

		.table tbody tr.dynoview-total-row td {
			padding: 0.5rem 0.75rem;
		}

	.t-row:first-child {
		border-top-width: 1px;
	}

	.table tbody tr.clickable:hover,
	.t-row.clickable:hover {
		background: rgba(var(--primary-rgb), 0.15);
		color: var(--navy);
		cursor: pointer;
	}

	.table tbody td,
	.t-row > div {
		padding: 0.75rem;
		border: 0;
	}

		.table tbody td:not(:last-child),
		.t-row > div:not(:last-child),
		.table thead th:not(:last-child),
		.t-head > div:not(:last-child) {
			border-right: 1px solid var(--border-light);
		}



	.table-small tbody td,
	.t-row > div {
		padding: 0.4rem;
	}

	.t-row > div {
		-webkit-box-align: center;
		-ms-flex-align: center;
		align-items: center;
	}

    td.td-with-anchor {
        padding: 0 !important;
    }

    td.td-with-anchor a {
        display: block;
        padding: 0.75rem;
        height: 100%;
        width: 100%;
        color: inherit;
        font-weight: 400;
    }

    td.td-with-anchor a:hover, a:focus {
        text-decoration: none !important;
        box-shadow: none !important;
    }

	td.td-with-anchor a {
		display: block;
		padding: 0.75rem;
		height: 100%;
		width: 100%;
		color: inherit;
	}

		td.td-with-anchor a:hover, a:focus {
			text-decoration: none;
		}

.t-row.disabled, .t-row:disabled {
	background: var(--background);
	color: var(--muted);
}

.t-row.t-row-add {
	appearance: none;
	text-align: center;
	padding: .125rem;
	color: var(--muted);
	background: rgba(var(--primary-rgb), 0.25);
	width: 100%;
}

	.t-row.t-row-add:hover {
		cursor: pointer;
		background: rgba(var(--primary-rgb), 0.35);
		color: var(--text-contrast);
	}

.t-body > .t-row {
	margin: 0;
}

/* new class for new data-grid */
thead.data-grid-sortable {
	cursor: pointer;
}

thead.sortable th,
.t-head.sortable > div,
.sng-results-container th {
	position: relative;
	cursor: pointer;
}

	.sng-results-container th.loading-results,
	.t-head.sortable > div {
		position: relative;
		cursor: default;
	}

	thead.sortable th:after,
	.thead.sortable > div:after {
		margin-left: 0.5rem;
		display: inline;
		font-family: 'Font Awesome 6 Pro';
		font-size: 0.75rem;
		padding: 0.25rem;
		position: relative;
		color: var(--text-contrast);
		opacity: .5;
		content: '\f0dc';
	}

	thead.sortable th.sort:before, thead.sortable th.sort-asc:before, thead.sortable th.sort-desc:before, thead.sortable th:hover:before {
		opacity: 1;
	}

	thead.sortable th.sort:after, thead.sortable th.sort-asc:after, thead.sortable th.sort-desc:after, thead.sortable th:hover:after {
		opacity: .5;
	}

th.sort-column .fa-sort,
th.sort-column .fa-sort-asc,
th.sort-column .fa-sort-desc {
	color: var(--muted);
	opacity: 0.5;
}

th.sort,
th.sort-asc,
th.sort-desc {
	position: relative;
}

	th.sort:after,
	th.sort-asc:after,
	th.sort-desc:after {
		display: block;
	}

	th.sort-asc:after {
		content: '\f0de' !important;
		top: -.125rem;
	}

	th.sort-desc:after {
		content: '\f0dd' !important;
		top: 0.125rem;
	}

.fa-sort-asc::before {
	content: '\f884' !important; /* Required to prevent erroneous icons in pre-style */
}

.fa-sort-desc::before {
	content: '\f161' !important; /* Required to prevent erroneous icons in pre-style */
}

thead.sortable th.no-sort:after {
	content: '';
	content: none;
	display: none;
}


th .sort-spinner {
	display: inline-block;
	margin-left: .25rem;
}


.table tr.disabled,
.t-row .disabled {
	color: var(--text-disabled);
	cursor: default;
}

.table tbody td,
.t-row > div {
	overflow-wrap: break-word;
	-ms-word-break: normal;
	word-break: normal;
	word-wrap: break-word;
	max-width: 100vw; /* IE11 cannot force word wrap without specified maximum width*/
}

	.table tbody td:only-child,
	.t-row > div:only-child {
		max-width: none;
	}

.table tbody tr.selected,
.t-row.selected {
	color: var(--navy);
	background: rgba(var(--primary-rgb), 0.2);
}

	.table tbody tr.selected td:first-child,
	.t-row.selected > div:first-child {
		-webkit-box-shadow: inset .1875rem 0 0 var(--primary-base);
		box-shadow: inset .1875rem 0 0 var(--primary-base);
	}

.t-row.row {
	margin: 0;
}

.table tbody + tbody {
	border-top: 3px solid var(--border-strong);
}

.table + .table {
	margin-bottom: 0;
}

.table-hover tbody tr:not(.disabled):not(.table-subtotal):hover td {
	cursor: pointer;
}

.table-hover tbody tr:hover {
	background: rgba(var(--primary-rgb), 0.15);
	color: var(--navy);
}


.table-subtotal {
	background-color: rgba(0,0,0,.075) !important;
}

.table-groupheader {
	text-align: center;
}


.table .mobile-display-name {
	display: none;
}

.table-count {
	font-size: 0.875rem;
	color: var(--muted);
}


.sng-checkbox-column, .t-row .sng-checkbox-column, .table td.sng-checkbox-column {
	width: 3rem;
	padding: 0;
}

.col.sng-checkbox-column, .t-row .sng-checkbox-column {
	display: flex;
}

.sng-checkbox-column label {
	padding: .75rem;
	text-align: center;
	flex-grow: 1;
	display: flex;
	align-items: center;
}


/* Tooltip and popover override styling */

.tooltip-inner {
	box-shadow: 0 0 0 1px var(--text-contrast);
	background: var(--navy);
	color: var(--text-contrast);
	border-radius: .75rem;
	padding: .25rem .75rem;
}

	.tooltip-inner::before {
		border: 0;
		background: var(--navy);
		color: var(--text-contrast);
		width: 8px;
		height: 8px;
		-webkit-transform: rotate(45deg);
		transform: rotate(45deg);
		border: 0px solid var(--text-contrast);
		z-index: 1;
	}

.arrow:before {
	display: none !important;
}


.list {
	margin-left: 1.5rem;
}

/* Business calendar */

.calendar-picker, .period-picker {
	display: block;
	max-width: 100%;
}

/* Validation styles */


.form-control-container.error-message-container.invalid:not(.form-control-container_focused) {
	border-color: var(--warning-secure);
	background-color: rgba(var(--warning-rgb), 0.16);
}

.error-message-container.invalid > .sngfilter .fs-toggle .form-control-icon {
	color: var(--warning-secure);
}

.error-message-container.error-animate-in {
	-webkit-transition: background-color 300ms ease-in;
	transition: background-color 300ms ease-in;
}

.error-message-container.error-animate-out {
	-webkit-transition: background-color 300ms ease-out;
	transition: background-color 300ms ease-out;
}

.error-message-container .error-message {
	display: none;
	z-index: 0;
}

.error-message-container.invalid .error-message {
	display: flex;
}

.error-message-container.error-animate-in .error-message {
	-webkit-animation: 150ms fadeInDown ease;
	animation: 150ms fadeInDown ease;
}

.error-message-container.error-animate-out .error-message {
	-webkit-animation: 200ms fadeOutUp ease;
	animation: 200ms fadeOutUp ease;
}

.data-grid-error-icon {
	text-align: center;
}

/* Variables bar */

.variable-bar {
    padding: .25rem 0;
	line-height: 1.5rem;
}

	.variable-bar .variable {
		padding: .25rem .5rem;
		color: var(--navy);
		font-size: .875rem;
		font-weight: 500;
		margin: 0 0.125rem;
		border-radius: 1rem;
		background: rgba(var(--accent-rgb) / 0.15);
		transition: background 0.2s ease;
	}

		.variable-bar .variable:hover {
			background: rgba(var(--accent-rgb) / 0.25);
			cursor: pointer;
		}


.custom-slider.rzslider .rz-bar {
	background: #ffe4d1;
	height: 2px;
}

.custom-slider.rzslider .rz-selection {
	background: orange;
}

.custom-slider.rzslider .rz-pointer {
	width: 8px;
	height: 16px;
	top: auto; /* to remove the default positioning */
	bottom: 0;
	background-color: #333;
	border-top-left-radius: 3px;
	border-top-right-radius: 3px;
}

	.custom-slider.rzslider .rz-pointer:after {
		display: none;
	}

.custom-slider.rzslider .rz-bubble {
	bottom: 14px;
}

.custom-slider.rzslider .rz-limit {
	font-weight: bold;
	color: orange;
}

.custom-slider.rzslider .rz-tick {
	width: 1px;
	height: 10px;
	margin-left: 4px;
	border-radius: 0;
	background: #ffe4d1;
	top: -1px;
}

	.custom-slider.rzslider .rz-tick.rz-selected {
		background: orange;
	}

.rzslider .rz-bar {
	height: 1rem;
}

.rzslider .rz-bar-wrapper {
	padding-top: 12px;
}

.rzslider .rz-pointer {
	border-radius: 6px;
	width: 24px;
	background: #eff1f2;
	border: 1px solid #bac6d6;
	box-shadow: 0 1px 3px rgba(5,0,20,0.2), inset 3px 3px 8px #fff;
}

	.rzslider .rz-pointer::after {
		display: none;
	}

	.rzslider .rz-pointer:hover {
		box-shadow: 0 0 2px 1px rgba(200,0,75,0.3), inset 3px 3px 8px #fff;
	}

	.rzslider .rz-pointer.rz-active {
		box-shadow: 0 0 0 2px rgba(200,0,75,0.4), inset 3px 3px 8px #fff;
		outline: none;
	}

.rzslider .rz-bar-wrapper.rz-left-out-selection .rz-bar {
	background: #5d20bf;
}

.rzslider .rz-bar-wrapper.rz-right-out-selection .rz-bar {
	background: #5dc910;
}
/* KAP styles */
.sidebar.sidebar-wide {
	width: 26rem;
	overflow: visible;
}

.profile-charts {
	padding: 0.5rem;
}

	.profile-charts h3 {
		padding: 0.5rem;
		margin-bottom: 0.5rem;
	}

.search-description-box {
	background-color: var(--background);
	border-radius: 0.25rem;
}

	.search-description-box .fa {
		color: var(--navy);
		background-color: transparent;
		margin: 0 0.5rem 0 0.5rem;
	}

	.search-description-box.search-description-box--disabled {
		background-color: rgba(4, 0, 10, 0.05);
	}

		.search-description-box.search-description-box--disabled .fa {
			color: var(--muted);
			cursor: default;
		}

.search-description-text {
	display: inline-block;
	padding-right: 1rem;
	min-width: 10rem;
	max-width: 13rem;
	display: inline-block;
	color: var(--muted);
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
	vertical-align: middle;
	font-size: 0.8em;
	text-align: center;
}

/* searchInfoBtn directive
    [Definition > step 3 > searches] */
button.item-selector-info.fa-info-circle {
	line-height: inherit;
	vertical-align: middle;
}

/* Style when selected item
    [Definition > step 3 > searches] */
li.node.selected div.row.node-text {
	border-radius: 0.25rem;
	background: var(--background);
	color: var(--navy);
}

	li.node.selected div.row.node-text:hover {
		background: #e1e9f5;
	}

/* text-overflow: ellipsis
    [Definition > step 3 > searches] */
.col-ellipsis {
	white-space: nowrap;
	width: 400px;
	overflow: hidden;
	text-overflow: ellipsis;
}

/* to remove internal 'x' btn from filter tables input */
input[type="search"]::-webkit-search-decoration,
input[type="search"]::-webkit-search-cancel-button,
input[type="search"]::-webkit-search-results-button,
input[type="search"]::-webkit-search-results-decoration {
	-webkit-appearance: none;
}

.text-ellipsis-limited-width {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
	max-width: 50ch !important;
}


/* *** Breakpoints *** */
@media only screen and (min-width: 768px) {

	.dg-ellipsis {
		position: relative;
	}

		.dg-ellipsis:after {
			content: '&nbsp;';
			visibility: hidden;
		}

	.dg-ellipsis-content {
		overflow: hidden;
		white-space: nowrap;
		text-overflow: ellipsis;
		position: absolute;
		left: .75rem;
		right: .75rem;
	}
}

@media only screen and (max-width: 760px), (min-device-width: 768px) and (max-device-width: 1024px) {
	.dg-ellipsis-content {
		display: grid;
	}
}

@media only screen and (max-width: 799px) {


	/* tables */
	.table .mobile-display-name {
		display: block;
		font-weight: bold;
		color: var(--navy);
		float: left;
		width: 9rem;
		padding: 0.75rem;
		text-align: start;
	}

		.table .mobile-display-name ~ span {
			text-align: start;
		}

	.table tbody tr td > span {
		display: block;
    	padding: 0.75rem;
	}

	.table, .table tbody, .table tbody tr, .table tbody tr td {
		display: block;
	}

		.table thead, .table.fixed-table-head {
			display: none;
		}

		.table tbody tr {
			border: 0;
		}

			.table tbody tr:not(:last-child) {
				border-bottom: 1px solid var(--modal-border);
			}

		.table tbody td:after {
			display: block;
			clear: both;
			content: '';
		}

		.table tbody td {
			border: 0 !important;
			width: 100% !important;
		}

		.table thead th, .table tbody td {
			padding: .25rem .5rem;
		}

	td.item-selection-column {
		text-align: left;
		padding: 1rem 1rem 0;
	}

	.table {
		border: 0;
		border: 1px solid var(--modal-border);
		border-left: 0;
		border-right: 0;
	}
}


/* --- keyframes --- */
@-webkit-keyframes fadeOutUp {
	from {
		opacity: 1;
	}

	90% {
		opacity: 0;
	}

	to {
		opacity: 0;
		-webkit-transform: translate3d(0, -100%, 0);
		transform: translate3d(0, -100%, 0);
	}
}

@keyframes fadeOutUp {
	from {
		opacity: 1;
	}

	90% {
		opacity: 0;
	}

	to {
		opacity: 0;
		-webkit-transform: translate3d(0, -100%, 0);
		transform: translate3d(0, -100%, 0);
	}
}

@-webkit-keyframes fadeInDown {
	from {
		opacity: 0;
		-webkit-transform: translate3d(0, -100%, 0);
		transform: translate3d(0, -100%, 0);
	}

	to {
		opacity: 1;
		-webkit-transform: none;
		transform: none;
	}
}

@keyframes fadeInDown {
	from {
		opacity: 0;
		-webkit-transform: translate3d(0, -100%, 0);
		transform: translate3d(0, -100%, 0);
	}

	to {
		opacity: 1;
		-webkit-transform: none;
		transform: none;
	}
}


/* Location groups */

.level-number {
    font-size: 1.25rem;
    color: var(--navy);
    padding-bottom: .5rem;
}

.hierarchy-loc-member,
.heirarchy-group-member {
    padding: .375rem .5rem;
    text-align: center;
    min-width: 10rem;
    border: 1px solid rgba(var(--primary-rgb),0.15);
    color: var(--navy);
    border-radius: .25rem;
    display: inline-block;
    font-size: .875rem;
    min-height: 2rem;
    word-break: break-word;
    max-width: 100%;
}

    .hierarchy-loc-member:hover,
    .heirarchy-group-member:hover {
        background: rgba(var(--primary-rgb),0.15);
        cursor: pointer;
    }

    .hierarchy-loc-member + div:not(.hierarchy-loc-member) {
        padding: .5rem .5rem .5rem 2rem;
        position: relative;
    }

    .hierarchy-loc-member.selected {
        border-left: 3px solid var(--navy);
    }

    .hierarchy-loc-member + div:not(.hierarchy-loc-member):before {
        display: block;
        content: '';
        width: 1.25rem;
        height: 1.5rem;
        border: 1px dotted var(--border-strong);
        border-width: 0 0 1px 1px;
        position: absolute;
        left: .75rem;
        top: 0;
    }

.heirarchy-group-member {
    margin-bottom: .5rem;
    width: calc(100% - 1.5rem);
}

    .heirarchy-group-member.locked {
        width: 100%;
    }

        .hierarchy-loc-member.locked:before,
        .heirarchy-group-member.locked:before {
            float: left;
            opacity: .25;
            margin-right: .25rem;
            content: '\f023';
            font-family: 'Font Awesome 6 Pro';
        }

.heirarchy-member-delete {
    width: 1rem;
    text-align: center;
    padding: .125rem 0;
    display: inline-block;
    color: var(--navy);
}

.hierarchy-search:first-child{
    border-top: 1px solid var(--box-border);
}

.saving-indicator {
    width: 1.5rem;
    height: 2rem;
    float: left;
    position: relative;
    padding: .5rem .125rem;
}

    .saving-indicator .fa {
        position: absolute;
        transition: opacity .75s ease;
        opacity: 1;
    }

        .saving-indicator .fa.ng-hide {
            opacity: 0;
        }

    .saving-indicator .ng-show-animate {
        opacity: 1;
    }

.show-ar-users {
	margin-left: auto !important;
}

	.show-ar-users button {
		color: #627895;
	}


/*
    Lightboxes, floating panels and modal content
*/


.lightbox-overlay {
    position: fixed;
    width: 100%;
    height: 100%;
    background: rgba(60, 72, 117, 0.66);
    top: 0;
    left: 0;
}

/* Old styles below */

.lightbox-sidebar-toggle {
    display: none;
}

.ng-lightbox-container,
.lightbox-container {
    position: fixed;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    z-index: 100;
    overflow-y: hidden;
    overflow-x: auto;
    text-align: center;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
}

.lightbox-container {
    display: none;
}

.dyno-lightbox.lightbox,
.lightbox,
.new-box.lightbox,
.modal-content {
    font-size: .875rem;
    border-radius: 1.5rem;
    transition: opacity .2s ease;
    flex-grow: 0;
    min-width: 20rem;
    max-width: 92vw;
    max-height: 90vh;
}

    .lightbox,
    .modal-content .dyno-lightbox.inline {
        background: var(--modal);
        display: inline-block;
        text-align: left;
        position: relative;
        box-shadow: 4px 12px 4rem rgba(10,0,40,0.25);
    }

    .dyno-lightbox.lightbox,
    .dyno-lightbox.lightbox.factboard-addable {
        background: var(--modal);
        display: none;
        z-index: 100;
        height: 90%;
        width: 92%;
    }

.dyno-lightbox.lightbox-xsmall {
    width: 30rem;
    height: 25rem;
}

.dyno-lightbox.lightbox-small {
    width: 45rem;
    height: 30rem;
}

.dyno-lightbox.lightbox-medium {
    width: 60rem;
    height: 45rem;
}

.dyno-lightbox.lightbox-large {
    width: 70rem;
    height: 55rem;
}

.lightbox-responsive {
    height: 86%;
    width: 92%;
    margin: 0 auto;
    min-width: 20rem;
    max-width: 96%;
}

.dyno-lightbox-title,
.lightbox-title {
    padding: 1.5rem 4rem 1rem 1.5rem;
    border-bottom: 0;
    font-size: 1rem;
    cursor: default;
    width: 100%;
    color: var(--navy);
    font-weight: bold;
    font-size: 1.125rem;
    line-height: 1.125rem;
    border-radius: 1.5rem 1.5rem 0 0;
    word-break: break-word;
    -ms-flex: 0 0 auto;
    flex: 0 0 auto;
}

    .dyno-lightbox-title .icon,
    .lightbox-title .icon {
        float: left;
        display: block;
        margin-right: .5rem;
        font-size: 1.125rem;
        line-height: 1.25rem;
    }


.lightbox-nav-tabs {
    position: absolute;
    right: 3rem;
    top: 0;
    border-bottom: 0;
    background: 0;
}

    .lightbox-nav-tabs.nav-tabs .nav-item .nav-link {
        padding: .75rem 1.5rem;
        height: calc(3rem - 1px);
        line-height: 1.75rem;
        opacity: .6;
        color: var(--text-contrast);
        border-color: var(--text-contrast);
    }

        .lightbox-nav-tabs.nav-tabs .nav-item .nav-link:hover {
            background: rgba(255,255,255,0.1);
        }

        .lightbox-nav-tabs.nav-tabs .nav-item .nav-link:hover,
        .lightbox-nav-tabs.nav-tabs .nav-item .nav-link.active {
            opacity: 1;
        }

.dyno-lightbox-close,
.lightbox-close, .cpf-lightbox-close {
    position: absolute;
    top: .875rem;
    right: .875rem;
    font-size: 1.25rem;
    cursor: pointer;
    z-index: 101;
    color: var(--navy);
    padding: 0 0.5rem;
    border-radius: 0.75rem;
    background: rgba(var(--primary-rgb), 0.25);
}

    .lightbox-close:hover, .cpf-lightbox-close:hover {
        background: rgba(var(--primary-rgb), 0.45);
    }

    .lightbox-close:focus, .cpf-lightbox-close:focus {
        background: rgba(var(--primary-rgb), 0.45);
        -webkit-box-shadow: 0 0 0 3px rgba(var(--primary-rgb), .5);
        box-shadow: 0 0 0 3px rgba(var(--primary-rgb), .5);
    }

.lightbox .toolbar {
    min-width: initial;
    padding-left: 0;
}

.lightbox-section-header {
    padding: .75rem 1rem;
    border-bottom: 1px solid var(--modal-inner);
    text-transform: uppercase;
    color: var(--muted);
    clear: both;
}

    .lightbox-section:not(:first-child) .lightbox-section-header,
    .lightbox-section-header:not(:first-child) {
        border-top: 1px solid var(--modal-inner);
    }

.lightbox-content .lightbox-content-heading {
    min-width: 20rem;
    padding: 1rem;
    border-bottom: 1px solid var(--modal-inner);
    height: 6.5rem;
}

.lightbox-inner > .lightbox-content:last-child {
    border-radius: 0 0 2rem 2rem;
}

.dyno-lightbox-content,
.lightbox-content {
    min-width: 20rem;
    overflow-y: auto;
    position: relative;
}

    .dyno-lightbox-content .content,
    .lightbox-content .content {
        min-width: 20rem;
    }

        .dyno-lightbox-content .content.multiline,
        .lightbox-content .content.multiline {
            white-space: pre-line;
        }

    .lightbox-content h3 + .content {
        padding-top: 0;
    }

    .lightbox-content .content.container-fluid {
        padding-left: 0;
        padding-right: 0;
    }

    .dyno-lightbox-content .content.inner-content .content,
    .lightbox-content .content.inner-content .content {
        padding: 0;
    }

    .lightbox-content > .section-content {
        width: 100%;
    }

.lightbox-title + .lightbox-content > .content {
    padding-top: .25rem;
}

.cpf-message-box .content > span > ul {
    list-style-type: none;
}

.cpf-message-box {
    min-width: 22rem;
    max-width: 80%;
}

.dyno-lightbox-buttons,
.lightbox-buttons {
    padding: 1rem 1.5rem 1.5rem;
    text-align: right;
    width: 100%;
    -ms-flex: 0 0 auto;
    flex: 0 0 auto;
}

    .lightbox-buttons:after {
        display: block;
        clear: both;
        content: '';
    }

    .lightbox-buttons .btn {
        margin-left: .5rem;
    }

.dyno-lightbox-title {
    height: 4rem;
}

.dyno-lightbox-buttons .dyno-control {
    background-color: transparent;
    border: none;
    display: inline-block;
    padding: 0;
    -webkit-box-shadow: none;
    box-shadow: none;
}

.lightbox-responsive .lightbox-content,
.lightbox-responsive .lightbox-tabs,
.dyno-lightbox-content {
    overflow-y: auto;
    background: var(--modal);
    position: relative;
}

.lightbox-content {
    flex-grow: 1;
}

.lightbox-buttons, .lightbox-title {
    flex-grow: 0;
}

.lightbox-content.no-buttons {
    border-radius: 0 0 .25rem .25rem;
}

.dyno-lightbox-buttons .btn {
    margin: 0 0 0 .5rem;
}
/* Lightbox content sizing */

.lightbox, .lightbox-inner {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
}

.lightbox-inner {
    -webkit-box-flex: 1;
    -ms-flex-positive: 1;
    flex-grow: 1;
    max-height: 100%;
    height: 100%;
}

.lightbox .lightbox-inner .lightbox-content .form-group .form-control,
.lightbox .lightbox-inner .lightbox-content .form-control {
	padding: 4px 0px 4px 8px;
}

/* end */



.dyno-lightbox-content.dyno-lightbox-no-footer {
    bottom: 0;
}

.lightbox-tabs .lightbox-content {
    height: 100%;
    width: 100%;
    background: var(--modal);
}

.lightbox-responsive-toolbar .lightbox-title {
    border-bottom: 0;
}

.lightbox .content {
    width: 100%;
    flex-basis: 100%;
}

.content > h3:first-child {
    padding-top: 0;
}

.lightbox-responsive .lightbox-has-sidebar {
    bottom: 0;
}

.lightbox-content.active {
    z-index: 1;
}


.lightbox .sidebar {
    height: 100%;
    position: static;
}

/* New lightbox styles */

.lightbox-panel {
    display: flex;
    flex-wrap: nowrap;
    flex: 1 1 auto;
}

    .lightbox-panel > .sidebar {
        flex: 0 0 auto;
        height: auto;
    }

    .lightbox-panel .scroll-panel,
    .lightbox-panel .panel {
        height: auto;
    }



.lightbox .panel-has-sidebar {
    overflow: auto;
    height: auto;
}


.panel-container,
.lightbox-inner div[ng-include] {
    height: 100%;
}

.panel-buttons {
    padding: 1rem;
    text-align: right;
    width: 100%;
}

.lightbox-controls {
    width: auto;
    float: right;
}

    .lightbox-controls > .fa, .lightbox-controls .cpf-dropdown > .fa {
        color: var(--navy);
        background: rgba(var(--primary-rgb), 0.25);
        padding: .3875rem .5rem;
        border-radius: .25rem;
        margin-top: -.3125rem;
    }


/* # Floating Panels */

.floating-panel {
    display: flex;
    flex-direction: column;
    position: fixed;
    border: 4px solid var(--box);
    border-radius: 1rem;
    z-index: 100;
    box-shadow: 0px 2px 12px 2px rgba(10,20,40,0.25);
    overflow: hidden;
    background: #fff;
}

    .floating-panel .content {
        width: 100%;
    }

.floating-panel-title {
    height: 2rem;
    background: var(--box-border);
    padding: .325rem .75rem;
    color: var(--navy);
    display: flex;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}

.floating-panel-body {
    -ms-flex: 1 1 auto;
    flex: 1 1 auto;
    display: flex;
}

    .floating-panel-body div[sng-i-frame] {
        -ms-flex: 1;
        flex: 1;
        height: auto;
    }

.floating-panel-close {
    color: var(--navy);
    font-size: 1.25rem;
}

.floating-panel-expand {
    color: var(--navy);
}

.drag-indicator {
    background: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAMAAAADAQMAAABs5if8AAAABlBMVEUAAAD///+l2Z/dAAAAAXRSTlMAQObYZgAAAAxJREFUCNdjaGAAAgAChgCB/5LsuQAAAABJRU5ErkJggg==') repeat;
    cursor: move;
    cursor: grab;
    cursor: -moz-grab;
    cursor: -webkit-grab;
}

    .drag-indicator:active {
        cursor: grabbing;
        cursor: -moz-grabbing;
        cursor: -webkit-grabbing;
    }

.floating-panel .drag-indicator {
    margin: .125rem 1rem;
    flex-grow: 1;
}

/*TODO ?? - overwritten bootstrap modal*/
@media screen and (max-width: 799px){
    .lightbox.lightbox-responsive {
        position: fixed;
        top: 0;
        left: 0;
        right: 0;
        bottom: 0;
        width: 100% !important;
        height: 100% !important;
        margin: 0;
        padding: 0;
        max-width: none;
        max-height: none;
        border-radius: 0;
    }
}

/*this is for  the loader icon in the dashboard print feature*/
.report-loader-spinner {
	border: 4px solid rgba(0, 0, 0, 0.1);
	border-left-color: #007bff; /* Blue color */
	border-radius: 50%;
	width: 50px;
	height: 50px;
	animation: spin 1s infinite linear;
}

.report-loading-icon-center{
	text-align: -webkit-center;
}

.loading-report{
	padding-bottom: 2rem;
}

@keyframes spin {
	0% { transform: rotate(0deg); }
	100% { transform: rotate(360deg); }
}

.completed {
	font-size: 50px;
	color: green;
}

/*
    Log in page
*/

.logon-panel, .sign-in-container-center {
    background: var(--box);
    z-index: 1;
    position: relative;
    box-shadow: -2px 0 1rem rgba(30,20,50,0.35);
}

    .logon-panel .form-control {
        width: 100%;
        max-width: 100%;
    }

    .logon-panel > div {
        max-width: 28rem;
        margin: 0 auto;
    }

.logon-container {
    width: 100%;
    height: 100%;
    display: flex;
    flex-direction: row;
}

.logon-news-container {
    background-size: cover;
    padding: 0;
}

    .logon-container .highlight-info {
        white-space: pre-line
    }

.logon-logo {
    padding: 6rem 0 3rem;
    display: flex;
    justify-content: center;
}


.logon-footer {
    color: var(--text-contrast);
    background: rgba(var(--secure-purple-rgb), 0.85);
    padding: 1rem 1rem 0.5rem;
}

    .logon-footer li {
        display: inline-block;
        padding-right: 1rem;
    }

        .logon-footer li + li {
            border-left: 1px solid var(--box-border);
            padding-left: 1rem;
        }

        .logon-footer a{
            color: #fff;
        }

        .logon-policies{
            opacity: 0.85;
            font-size: 0.875rem;
            padding-top: 1rem;
        }

.logon-footer h2 {
    color: #fff;
}

#logon-news-spacer {
    flex: 1 1 auto;
    background: rgba(30,20,50,0.15);
}

.logon-news-logo {
    padding: 1rem;
}

#news p {
    margin-bottom: 1rem;
    font-size: 0.875rem;
}

#news .col-md-6 + .col-md-6:before {
    content: '';
    display: block;
    height: 85%;
    width: 1px;
    position: absolute;
    background: #fff;
    left: -0.5rem;
    top: 12.5%;
    opacity: 0.2;
}

/*
    General classes & global styles
    Notice we use variable parser to add cache busting for urls of deployed assets
*/
/* Webfont: LatoLatin-Italic */
@font-face {
	font-family: 'Lato';
	src: url('../Images/fonts/LatoLatin-Italic.eot?v=2511.708.22.0'); /* IE9 Compat Modes */
	src: url('../Images/fonts/LatoLatin-Italic.woff?v=2511.708.22.0') format('woff'), /* Modern Browsers */
	url('../Images/fonts/LatoLatin-Italic.ttf?v=2511.708.22.0') format('truetype');
	font-style: italic;
	font-weight: normal;
	text-rendering: optimizeLegibility;
}

/* Webfont: LatoLatin-Light */ @font-face {
	font-family: 'Lato';
	src: url('Images/fonts/LatoLatin-Light.eot?v=2511.708.22.0'); /* IE9 Compat Modes */
	src: url('../Images/fonts/LatoLatin-Light.woff?v=2511.708.22.0') format('woff'), /* Modern Browsers */
	url('../Images/fonts/LatoLatin-Light.ttf?v=2511.708.22.0') format('truetype');
	font-style: normal;
	font-weight: 300;
	text-rendering: optimizeLegibility;
}

/* Webfont: LatoLatin-LightItalic */ @font-face {
	font-family: 'Lato';
	src: url('../Images/fonts/LatoLatin-LightItalic.eot?v=2511.708.22.0'); /* IE9 Compat Modes */
	src: url('../Images/fonts/LatoLatin-LightItalic.woff?v=2511.708.22.0') format('woff'), /* Modern Browsers */
	url('../Images/fonts/LatoLatin-LightItalic.ttf?v=2511.708.22.0') format('truetype');
	font-style: italic;
	font-weight: 300;
	text-rendering: optimizeLegibility;
}

/* Webfont: LatoLatin-Medium */ @font-face {
	font-family: 'Lato';
	src: url('../Images/fonts/LatoLatin-Semibold.eot?v=2511.708.22.0'); /* IE9 Compat Modes */
	src: url('../Images/fonts/LatoLatin-Semibold.woff?v=2511.708.22.0') format('woff'), /* Modern Browsers */
	url('../Images/fonts/LatoLatin-Semibold.ttf?v=2511.708.22.0') format('truetype');
	font-style: normal;
	font-weight: 500;
	text-rendering: optimizeLegibility;
}

/* Webfont: LatoLatin-Regular */ @font-face {
	font-family: 'Lato';
	src: url('../Images/fonts/LatoLatin-Regular.eot?v=2511.708.22.0'); /* IE9 Compat Modes */
	src: url('../Images/fonts/LatoLatin-Regular.woff?v=2511.708.22.0') format('woff'), /* Modern Browsers */
	url('../Images/fonts/LatoLatin-Regular.ttf?v=2511.708.22.0') format('truetype');
	font-style: normal;
	font-weight: normal;
	text-rendering: optimizeLegibility;
}

/* Webfont: LatoLatin-Bold */
@font-face {
	font-family: 'Lato';
	src: url('../Images/fonts/LatoLatin-Bold.eot?v=2511.708.22.0'); /* IE9 Compat Modes */
	src: url('../Images/fonts/LatoLatin-Bold.woff?v=2511.708.22.0') format('woff'), /* Modern Browsers */
	url('../Images/fonts/LatoLatin-Bold.ttf?v=2511.708.22.0') format('truetype');
	font-style: normal;
	font-weight: 600;
	text-rendering: optimizeLegibility;
}


html, body {
	height: 100%;
	overflow: auto;
}

html {
	font-size: 16px;
}

body {
	background: var(--background);
	font-family: 'Lato', 'Helvetica', 'Arial', sans-serif;
	letter-spacing: -0.025em;
	color: var(--text);
}

/* Scrollbar colours. Two parts here as scrollbar-color is not supported across all browsers */
*::-webkit-scrollbar-thumb {
  background-color: var(--scrollbar-thumb);
  border-radius: 4px;
}
*::-webkit-scrollbar-track {
  background: var(--scrollbar-track);
}

* {
	scrollbar-color: var(--scrollbar-thumb) var(--scrollbar-track);
}

	body.factboard-select {
		letter-spacing: normal;
	}


h1 {
	font-size: 1.5rem;
	margin: 0 0 .75rem;
	padding: .5rem 0;
	text-overflow: ellipsis;
	white-space: nowrap;
	overflow: hidden;
	font-weight: bold;
	color: var(--text);
}

h2, .page-lead, .dropdown .dd-menu h2 {
	color: var(--navy);
	font-size: 1.25rem;
}

h2 {
	margin: .75rem 0;
	color: var(--navy);
}

h3 {
	color: var(--muted);
	font-size: 1.125rem;
	margin: 1rem 0;
	padding: .5rem 0;
	border-bottom: 1px dotted var(--border-strong);
	font-weight: 600;
}

h4 {
	font-size: 1rem;
	font-weight: 500;
	color: var(--navy);
	margin: .5rem 0;
	padding: .25rem 0;
}

h3, .dd-menu h3 {
	color: var(--muted);
}

	h2:first-child,
	h3:first-child,
	h4:first-child {
		margin-top: 0;
	}


.page-subtitle {
	font-size: 1rem;
	color: var(--muted);
}

button {
	-moz-appearance: none;
	-webkit-appearance: none;
	border: 0;
	background: 0;
	margin: 0;
	padding: 0;
}

a {
	color: var(--navy);
	font-weight: 500;
}

	a:focus, a:hover {
		color: var(--navy);
		text-decoration: underline;
	}

	a:active {
		color: var(--navy);
	}


	a:focus {
		outline: 0;
		box-shadow: 0 0 0 0.125rem rgba(var(--primary-rgb), 0.5);
	}

	a.disabled {
		color: var(--text-disabled);
	}

a, button {
	cursor: pointer;
}

ul, ol {
	margin: 0;
	padding: 0;
}

p {
	margin: 0;
}

button:focus:not(.exception) {
	outline: 2px solid rgba(var(--primary-rgb),0.3);
}

/* Main classes */

app-root {
	min-height: 100%;
}

.hidden-new-design {
	display: none !important;
}

.fa {
	font-family: 'Font Awesome 6 Pro';
	font-weight: 400;
}

.header:not(.dashboard-header),
.header-flat,
.header-floating {
	background: transparent;
	margin-bottom: 1rem;
	padding: 0 1.5rem 1rem;
	width: 100%;
	-ms-flex: 0 0 auto;
	flex: 0 0 auto;
	position: relative;
	z-index: 2;
	min-height: 3rem;
}

	.header.header-fixed,
	.header .header-fixed {
		left: 0;
		position: absolute;
		top: 0;
		width: 100%;
		margin: 0;
	}

	.header h1 {
		font-size: 1.25rem;
		margin: 0;
		margin-right: .5rem;
	}

	.header h2 {
		font-size: 1.125rem;
		color: var(--muted);
	}

	.header:after {
		display: block;
		content: '';
		clear: both;
	}

	.header h1, .zugo-header h1 {
		padding: .5rem 0;
		border: 0;
	}

	.header h1, .header h2 {
		display: inline;
		width: auto;
		line-height: 2rem;
	}

.box .header {
	background: 0;
}
/* flat header */

.header-flex {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-orient: horizontal;
	-webkit-box-direction: normal;
	-ms-flex-direction: row;
	flex-direction: row;
	-ms-flex-wrap: wrap;
	flex-wrap: wrap;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
}


.header-flat {
	position: relative;
	-webkit-backface-visibility: hidden;
	margin: 0;
	margin-bottom: 1rem;
	width: 100%;
	background: var(--table-row);
	border: 2px solid var(--box-border);
	border-radius: .25rem;
	width: 100%;
	z-index: 1;
}

.header-floating {
	margin-bottom: 0;
	box-shadow: 0 1px 3px #000;
	box-shadow: 0 2px 4px rgba(0,0,0,0.2);
}

#allappsToolbarButton {
	background: var(--accent, #ce0037);
	border-radius: 0;
	height: 3.25rem;
	width: 3.5rem;
	color: #fff;
	position: relative;
	text-align: center;
	display: flex !important;
	justify-content: center;
	font-size: 1.5rem;
	padding: .75rem 1.375rem;
	min-width: 0;
	border-bottom-right-radius: 1rem;
	box-shadow: inset 11px -8px 16px rgba(19, 12, 98, 0.1);
	transition: opacity 0.2s ease, box-shadow 0.2s ease;
}

/* Temp solution. TODO: remove below and find a way to resource colour values in js files. */
#allappsToolbarButtonNew, #allAppsToggleCurveNew {
	background: var(--accent, #ce0037);
}


.all-apps-toggle-curve {
	display: block;
	width: 1rem;
	height: 1rem;
	position: absolute;
	top: 0;
	right: -1rem;
	background: var(--accent, #ce0037);
	overflow: hidden;
}

	.all-apps-toggle-curve:before {
		width: 1rem;
		height: 1rem;
		position: absolute;
		border-top-left-radius: 0.75rem;
		background: var(--nav);
		top: 0;
		left: 0;
		content: '';
		display: block;
	}


#allappsToolbarButton:hover {
	opacity: 0.9;
	box-shadow: inset 9px -8px 16px rgba(19, 12, 98, 0.15);
}

.box, .new-box,
.section,
.stepwise-container,
.dyno-control,
.dd-menu,
.zugo-body-container {
	background: var(--box);
	border-radius: 1rem;
	box-shadow: 0 0.25rem 0.5rem rgba(10, 15, 40, 0.12);
}

	.dark,
	.box.dark {
		background: rgba(var(--muted-rgb), 0.15);
		box-shadow: none;
	}

	.box.box-light {
		background: var(--table-row);
	}

	.box .box, .section .box, .dyno-control .box, .dd-menu .box, .new-box .box,
	.new-box .new-box, .section .new-box,
	.section .section, .new-box .section, .box .section,
	.box .zugo-body-container, .section .zugo-body-container, .new-box .zugo-body-container,
	.box .search-container.has-search-header, .new-box .search-container.has-search-header, .section .search-container.has-search-header,
	.lightbox-content .box, .lightbox-content .new-box, .lightbox-content .section, .lightbox-content .dyno-control, .lightbox-content .zugo-body-container {
		box-shadow: none;
		border: 1px solid var(--box-border);
	}

	.section .dyno-control:not(.dyno-data-grid), .box .dyno-control:not(.dyno-data-grid) {
		border: 0;
	}

.no-inner-box-decoration .box,
.no-inner-box-decoration .section,
.no-inner-box-decoration .new-box,
.no-inner-box-decoration .dyno-control,
.no-inner-box-decoration .dd-menu,
.no-inner-box-decoration .zugo-body-container,
.no-inner-box-decoration .search-container.has-search-header,
.no-inner-box-decoration .lightbox-content .box,
.no-inner-box-decoration .lightbox-content .new-box,
.no-inner-box-decoration .lightbox-content .section,
.no-inner-box-decoration .lightbox-content .dyno-control,
.no-inner-box-decoration .lightbox-content .zugo-body-container {
	box-shadow: none !important;
	border: none !important;
}


.content, .new-content {
	padding: 1rem 1.5rem;
}

.section {
	margin-bottom: 1rem;
}

.col > .section {
	height: 100%;
}

html.dark-theme .dd-menu {
	background: var(--modal);
}

/*[class*="col-"] {
	padding: 0 .25rem .75rem .25rem;
}*/

.section-full {
	margin: 0;
	min-height: 100%;
}

.section-tools {
	background: #BAC6D6;
	padding: 0.5rem 1rem;
	overflow: hidden;
	zoom: 1;
}

	.section-tools button,
	.section-tools div {
		display: inline-block;
	}

		.section-tools button:not(:last-child),
		.section-tools div:not(:last-child) {
			margin-right: 0.25rem;
		}

	.section-tools > .fa {
		color: var(--navy);
		width: 2rem;
		text-align: center;
		border-radius: 0.5rem;
		cursor: pointer;
		padding: 0.25rem 0;
		background: rgba(var(--primary-rgb), 0.25);
	}

		.section-tools > .fa:hover {
			background: rgba(var(--primary-rgb), 0.45);
		}

		.section-tools > .fa:disabled {
			color: rgba(0, 0, 0, 0.2);
			background: 0 !important;
		}


.fade.in {
	opacity: 1;
}

.dropdown {
	position: relative;
}


/* =============================================*/
/* Menus, popouts and generic hovering elements */

/* Max widths of popovers - put all new popovers in this rule for consistency */

.dd-menu, .sngfilter-menu, .composer-accordion-popup {
	max-width: 36rem;
	min-width: 10rem;
}

.composer-accordion-popup-wide {
	max-width: 36rem;
	min-width: 36rem;
}



/* Bootstrap popovers */

.popover, .help-bubble {
	background: var(--modal);
	padding: 0;
	min-width: 5rem;
	box-shadow: var(--shadow-medium);
	padding: .5rem;
	border-radius: 1rem;
	border: 0;
	max-width: 50vw;
}

	.popover.delete-popover {
		max-width: none;
	}

	.popover .arrow::before {
		display: none !important;
	}

.popover-header,
.popover-body {
	padding: .5rem;
}

.popover-header {
	font-size: 1rem;
	color: var(--navy);
	background: 0;
	height: 2.25rem;
	line-height: 1rem;
	margin: 0;
	padding-right: 2rem;
	border: 0;
}

.popover-body {
	background: var(--modal);
	color: var(--navy);
	border-radius: 0 0 .25rem .25rem;
	white-space: pre-wrap;
}

.popover-header + .popover-body {
	padding-top: 0;
}

.cpf-popover-close {
	position: absolute;
	top: .75rem;
	right: .75rem;
	margin: 0;
	padding: .125rem .375rem !important;
}


/* End max widths */

.dd-menu {
	color: var(--text);
	position: absolute;
	left: 0;
	margin-top: .75rem;
	max-height: 0;
	opacity: 0;
	overflow: hidden;
	text-align: left;
	top: 100%;
	display: none;
	min-width: 100%;
	box-shadow: 0 0.5rem 1.5rem rgba(10, 15, 40, 0.17);
}

	.dd-menu li {
		display: block;
		min-width: 14rem;
	}

.dropdown.open > .nav-link {
	background: rgba(var(--primary-rgb), 0.25);
}

.dropdown.open .dd-menu {
	max-height: 24rem;
	max-width: 100vw;
	overflow-y: auto;
	opacity: 1;
	z-index: 991;
	display: block;
}

.dropdown.open .workview-filter-dialog-container .dd-menu {
	position: relative;
}

.dropdown.sm-target .dd-menu {
	margin-left: -.5rem;
	margin-right: -.5rem;
}

.dd-menu.pop-top {
	top: auto;
	bottom: 100%;
	margin-top: 0;
	margin-bottom: .25rem;
}

.dd-menu.avoid-menu-fixed {
	right: auto !important;
	min-width: 0;
	width: auto;
	max-width: calc(20rem + 20vw);
}

.dropdown.closed .dd-menu {
	display: block;
	visibility: hidden;
	transition: opacity 0.2s ease;
	z-index: 1;
}

.operator-wrapper.operator-dropdown.dropdown.open {
	z-index: 2;
}

.dd-menu-content{
	width:fit-content;
	height: fit-content;
}

.dropdown.open-left .dd-menu {
	left: auto;
	right: 0;
}

.dd-menu.dd-menu-xs {
	width: 10rem;
}

.dd-menu.dd-menu-sm {
	width: 14rem;
}

.dd-menu.dd-menu-md {
	width: 18rem;
	max-height: 26rem !important;
}

.dd-menu.dd-menu-lg {
	width: 24rem;
	max-height: 30rem !important;
}

.dd-menu.dd-menu-xl {
	width: 36rem;
	max-height: 32rem !important;
}

	.dd-menu.dd-menu-xl .sngfilter-menu.avoid-menu.visible {
		width: calc(36rem - 200px);
	}

.dd-menu .dropdown-item {
	color: var(--navy);
	border-radius: 0;
}

.dd-arrow {
	display: none !important; /* Remove DD arrow classes when styling transitioned */
}

.avoid-menu.avoid-menu-fixed {
	position: fixed;
	z-index: 200;
}

.scroll-content {
	width: 100%;
}

.scroll-content, .sidebar {
	height: 100%;
	overflow-y: auto;
	position: relative;
}

.lead {
	font-size: 1.125rem;
	font-weight: normal;
}


.noscroll, .noscroll .scroll-content, .noscroll .sidebar {
	overflow: hidden;
}

	.noscroll .lightbox .sidebar {
		overflow-y: auto;
	}

.mobile-no-optim {
	min-width: 46rem;
}
/* support both fontsy and fontawesome font family, add more if we add more fonts */
.universal-icon {
	font-family: 'Fontsy', FontAwesome !important;
	speak: none;
	font-style: normal;
	font-weight: normal;
	font-variant: normal;
	text-transform: none;
	line-height: 1;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
}

.fontsy {
	font-size: 0.875rem;
	font-family: 'icoMoon';
}

code {
	background: var(--background);
	color: var(--navy);
}

.hiddenOnLoad {
	visibility: hidden;
}

[ng\:cloak], [ng-cloak], [data-ng-cloak], [x-ng-cloak], .ng-cloak, .x-ng-cloak {
	display: none !important;
}

.pointer {
	cursor: pointer !important;
}

.container-fluid {
	padding: 0 0.5rem;
}

.container-max {
	width: 100%;
	height: 100%;
	display: block;
	position: relative;
}

.container-flex {
	width: 100%;
	display: flex;
	flex-wrap: wrap;
}

.search-toolbox ~ .titles {
	width: 60%;
	float: left;
}

.header ~ .page-content {
	height: calc(100% - 4rem);
	flex: 1 1 auto;
	overflow-y: auto;
}


.panel-has-sidebar > .table {
	border: 0;
}

	.panel-has-sidebar > .table th {
		border-top: 0;
	}

.table thead label {
	margin: 0;
	padding: 0;
	line-height: .875rem;
}

/* Layout */

#page {
	width: 100%;
	position: relative;
	height: 100%;
	overflow: visible;
	display: flex;
	flex-direction: column;
}

	#page.contains-dynoview {
		height: auto;
	}

.page-content {
	padding: .25rem 1rem .75rem;
	height: 100%;
	width: 100%;
}

#react-app-root {
	height: 100%;
}

#react-overshorts-dashboard-portal {
    height: 100%;
}

.panel,
.scroll-panel,
div[ng-view] {
	width: 100%;
	height: 100%;
	position: relative;
	min-height: 0;
}

.scroll-panel,
.results-panel:not(#allAppTilesPanel):not(#allAppsPanel) {
	overflow-y: auto;
	flex-grow: 1;
	flex: 1 1 auto;
}

.results-panel {
	padding: 0;
}

.scroll-panel.has-buttons {
	height: calc(100% - 4.5rem);
}

.scroll-panel.has-open-buttons {
	height: calc(100% - 4.5rem);
}

label.file-name-prompt {
	text-align: left;
}

.cpf-box {
	background: var(--box);
	border: 1px solid var(--box-border);
	border-radius: .125rem;
	padding: 1rem;
}

.flex-container {
	display: flex;
	flex-direction: column;
	height: 100%;
	flex: 1;
}

@media (max-width: 991px) {
	.flex-container {
		margin-left: 10px;
	}
}

.flex-body, div[sng-i-frame] {
	display: flex;
	height: 100%;
	min-height: 0;
	flex: 1 1 auto;
}


	div [sng-i-frame] iframe {
		width: 100%;
		flex-basis: 100%;
		flex-grow: 1;
		height: 100%;
		min-height: 0;
		border-color: var(--background);
	}




/* Layer styles */

.layer-wrapper {
	display: none;
	position: absolute;
}

.help-layer {
	background: var(--background);
	border: 1px solid var(--primary-base);
	padding: 1rem;
	color: var(--navy);
}

/* Track Lite */

#track-lite {
	display: none;
	position: fixed;
	z-index: 10;
	background: var(--modal);
	border: 1px solid var(--modal-border);
	min-width: 18rem;
}

	#track-lite h2 {
		padding: 1rem;
		margin-bottom: 1rem;
	}

#track-lite-details {
	max-height: 400px;
	overflow-x: hidden;
}

#track-lite .table td:first-child,
#track-lite .table th:first-child {
	width: 3rem;
}

/* Black overlay */
.black-overlay,
.ng-lightbox-overlay {
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	background: var(--overlay);
	background: rgba(60, 72, 117, 0.66);
}

.black-overlay {
	position: fixed;
	display: none;
	z-index: 99 !important;
}

.ng-lightbox-overlay {
	position: fixed;
}

	.ng-lightbox-overlay.ng-lightbox-overlay-hidden {
		background: none;
	}

/* Alert */
#alert, .alert,
#refresh-results-box {
	z-index: 1400;
}

#forgot-password-alert,
.refresh-results-box {
	z-index: 12;
}

#alert-buttons {
	display: inline;
}

#alert,
#forgot-password-alert,
#refresh-results-box,
.refresh-results-box {
	position: fixed;
	-webkit-backface-visibility: hidden;
	bottom: -4rem;
	right: 1rem;
	width: 100%;
	text-align: center;
	border: 0;
	background: transparent;
	margin: 0;
	padding: .75rem;
	opacity: 0;
	font-size: 1rem;
	transition: opacity 0.3s 0.2s ease, bottom 0.2s ease;
	width: max-content;
	max-width: 60rem;
	font-size: .875rem;
}

	#alert.alert-vis,
	#refresh-results-box.alert-vis,
	.refresh-results-box.alert-vis {
		bottom: 1rem;
		opacity: 1;
	}

.alert a {
	color: var(--text-contrast);
	text-decoration: underline;
}

.alert-body {
	background: var(--navy);
	color: white;
	position: relative;
	line-height: 1rem;
	box-shadow: 2px 4px 12px 1px rgba(10, 10, 40, 0.25);
	border-radius: 1.5rem;
	display: flex;
	align-items: center;
	flex-wrap: nowrap;
	justify-content: flex-end;
	min-width: 0;
	width: fit-content;
	padding: 0.25rem 0.5rem;
	max-width: 70vw;
	font-weight: 500;
}

	.alert-body .alert-body-icon {
		text-align: center;
		width: 2rem;
		display: block;
		padding: 0 0.5rem;
		flex: 0;
	}

	.alert-body .message {
		display: block;
		margin-right: .5rem;
		padding: .375rem;
		padding: 0.5rem;
		line-height: 1.25rem;
		text-align: left;
		flex: 1 1 auto;
		min-width: 10rem;
	}

	/*
    .alert-body .fa {
        font-size: 1.25rem;
        padding: .375rem 0;
    }*/

	.alert-body .alert-buttons {
		order: 9;
		display: flex;
		flex-direction: row;
		flex: 0 0 auto;
		justify-content: flex-end;
		align-items: center;
		min-width: 0;
		width: fit-content;
	}

	.alert-body .btn {
		background: rgba(var(--plain-rgb),0.75);
		color: var(--navy);
		font-size: 0.875rem;
		line-height: 1.25rem;
		padding: 0.25rem 0.75rem;
		min-height: 0;
		border: 0;
	}

		.alert-body .btn:hover {
			background: rgba(var(--plain-rgb),0.95);
			color: var(--navy);
		}



	.alert-body.bg-success {
		color: var(--modal) !important;
		background: var(--success-dark);
		box-shadow: 2px 4px 12px 1px rgba(var(--success-rgb), 0.25);
	}

	.alert-body.bg-warning {
		color: var(--modal) !important;
		background: var(--warning-dark);
		box-shadow: 2px 4px 12px 1px rgba(var(--warning-rgb), 0.25);
	}

	.alert-body.bg-danger {
		background: var(--modal) !important;
		color: var(--warning-secure);
	}

	.alert-body.bg-info {
		color: var(--modal) !important;
		background: var(--navy);
	}

	.alert-body .alert-body-icon:before {
		display: inline-block;
		margin-right: 1rem;
		font-family: 'Font Awesome 6 Pro';
	}

	.alert-body .alert-body-icon:before {
		content: '\f05a';
	}

	.alert-body.bg-danger .alert-body-icon:before,
	.alert-body.bg-warning .alert-body-icon:before {
		content: '\f06a';
	}

	.alert-body.bg-success .alert-body-icon:before {
		content: '\f00c';
	}

	.alert-body.bg-info .alert-body-icon:before {
		content: '\f05a';
	}

	.alert-body.alert-progress .message:before {
		content: '\f1ce';
		-webkit-animation: fa-spin 1.5s infinite linear;
		animation: fa-spin 1.5s infinite linear;
		font-family: 'Font Awesome 6 Pro';
		margin-right: .5rem;
		display: inline-block;
	}

	.alert-body.helpful {
		background: #fff;
		color: #4b81bf;
		padding: 1rem;
		font-size: 1rem;
		margin: 1rem;
	}

		.alert-body.helpful .alert-buttons {
			float: right;
		}

			.alert-body.helpful .alert-buttons .btn {
				color: #4b81bf;
				border: 1px solid #4b81bf;
			}

				.alert-body.helpful .alert-buttons .btn:hover {
					background: #4b81bf;
					color: #fff;
				}

		.alert-body.helpful .message {
			font-size: 1rem;
			text-align: left;
			display: block;
			width: calc(100% - 8rem);
		}

.alert-close {
	line-height: .75rem;
	font-size: .75rem;
	font-weight: 400;
	background: white;
	color: black;
	width: 1rem;
	height: 1rem;
	opacity: 0.6;
	border-radius: 0.75rem;
}

.alert-keepopen.btn.btn-alert {
	background: 0;
	color: white;
	font-size: 0.875rem;
	min-width: 0;
}

.alert-body.bg-danger .btn,
.alert-body.bg-danger .alert-keepopen.btn.btn-alert,
.alert-body.bg-danger .alert-close {
	background: rgba(var(--warning-rgb), 0.2);
	color: var(--warning-secure);
}

	.alert-body.bg-danger .btn:hover,
	.alert-body.bg-danger .alert-keepopen.btn.btn-alert:hover,
	.alert-body.bg-danger .alert-close:hover {
		background: rgba(var(--warning-rgb), 0.3);
	}

#show-errorlogs-button {
	display: none;
}

	#show-errorlogs-button .down {
		display: none;
	}

#alert:not(.alert-vis) #error-logs-wrapper {
	display: none !important;
}

#error-logs-wrapper {
	position: relative;
	margin-top: 1rem;
	padding: 1rem;
	display: none;
	z-index: 99;
	clear: both;
}

.closebutton-wrapper {
	cursor: pointer;
	float: right;
	margin-left: .375rem;
}

/* Other Errors */

.error-content {
	margin: 1rem;
	border: 1px solid var(--box-border);
	background: var(--box);
	padding: 1rem;
}

	.error-content:after {
		content: '';
		display: block;
		clear: both;
	}

	.error-content .error-icon {
		font-size: 1.125rem;
		margin-right: .25rem;
	}

	.error-content .error-log-show {
		float: right;
	}

	.error-content .error-detail {
		font-size: .875rem;
	}

/* Hide Nav */

body.nav-hidden #prog-line-container {
	display: none;
}

body.nav-hidden #top-bar {
	display: none;
}

body.nav-hidden .navbar {
	height: 2.5rem;
}

body.nav-hidden #secondary-nav {
	top: 2.5rem;
}

/* Hide Chrome */

body.chrome-hidden .navbar {
	display: none;
}

/* Password policy */

#password-policy-message {
	font-size: .875rem;
	color: var(--muted);
	padding: 1rem 0 0;
	width: 50%;
}

/* User Apps list page */

tr.row-total {
	border-top: 2px solid;
}

	tr.row-total td {
		font-size: 1rem;
		font-weight: bold;
	}

/* ========== */


.caret {
	font-size: .75rem;
	color: inherit;
	margin: 0 .125rem;
}

	.caret:before {
		content: '\f0d7';
		font-family: 'Font Awesome 6 Pro';
		font-weight: 600;
	}

.nav-link .caret {
	margin-left: .5rem;
}

/* cpf dropdown */

.cpf-dropdown {
	display: inline-block;
	position: relative;
}

.cpf-dropdown-toggle:after,
.tasks-button::after {
	display: inline-block;
	width: 0;
	height: 0;
	margin-left: .75rem;
	margin-right: 0;
	vertical-align: middle;
	content: "";
	border-top: .3em solid var(--text-contrast);
	border-right: .3em solid transparent;
	border-left: .3em solid transparent;
}

.cpf-dropdown-toggle:hover:after,
.tasks-button:hover:after,
.cpf-dropdown-toggle:active:after,
.tasks-button:active:after {
	border-top-color: var(--text-contrast);
}

.cpf-dropdown.showing .cpf-dropdown-toggle:after,
.cpf-dropdown-toggle:hover:after,
.tasks-button.mobile-open:after {
	border-top-color: var(--text-contrast);
}

.cpf-dropdown-toggle.disabled:after,
.tasks-button.disabled:after {
	border-top-color: var(--text-disabled);
}

.cpf-dropdown-menu {
	padding: 0;
	position: absolute;
	top: 100%;
	margin-top: -1px;
	border-radius: .25rem;
	background: var(--modal);
	display: none;
	left: 0;
	max-height: 30rem;
	min-width: 18rem;
	overflow-y: auto;
	z-index: 4;
	color: var(--text);
}

	.cpf-dropdown-menu.left {
		right: 0;
		left: auto;
	}

.cpf-dropdown.showing .cpf-dropdown-menu {
	display: block;
}

.cpf-dropdown.showing .cpf-dropdown-toggle,
.tasks-button.mobile-open {
	border-bottom-right-radius: 0;
	border-bottom-left-radius: 0;
	background: rgba(var(--primary-rgb), 0.25);
	color: var(--navy);
}

	.cpf-dropdown-toggle.btn-link:after,
	.cpf-dropdown.showing .cpf-dropdown-toggle.btn-link:after {
		border-top-color: var(--navy)
	}

.cpf-dropdown.showing .btn-link {
	background: rgba(var(--primary-rgb),0.25);
	color: var(--navy);
	text-decoration: none;
}

.dropdown-item .checkbox,
.dropdown-item .radio {
	margin-bottom: 0;
}


.dsn-chart {
	padding: 2rem;
	color: var(--text-disabled);
	text-align: center;
}

	.dsn-chart .fa {
		font-size: 5rem;
	}

.chartwizard-title {
	padding-top: 1rem;
}

/* Overrides for highcharts classes to control light/dark mode colours */
#chart-preview-wrapper .highcharts-legend-box {
    fill: var(--modal);
}

#chart-wrapper .highcharts-legend-box,
.chart-wrapper .highcharts-legend-box {
    fill: var(--box);
}

.highcharts-axis text,
.highcharts-axis-labels text,
.highcharts-title,
.highcharts-subtitle,
.highcharts-legend-item text {
    fill: var(--text) !important;
	color: var(--text) !important;
}

.highcharts-grid-line {
    stroke: rgba(var(--text-rgb), 0.4);
}

/* Filter box */

.dyno-control div[sng-filterbox],
.dyno-control sng-filterbox {
	display: inline-block;
	width: 13rem;
	max-width: 100%;
}

.dyno-control[data-width="stretch"] div[sng-filterbox],
.dyno-control[data-width="stretch"] sng-filterbox {
	width: 100%;
}

.sngfilter {
	position: relative;
}

	/**
    a text placeholder (should have the same colour as :placeholder)
    Replaces: qa-pleasechoose (?)
*/
	.sngfilter .placeholder {
		color: var(--muted-light);
	}

	.sngfilter .toggle {
		min-width: 14rem;
		width: 100%;
		padding: 0;
		border: 1px solid var(--nav-border);
		border-radius: 0.125rem;
		cursor: pointer;
		-moz-transition: all 0.2s ease;
		-o-transition: all 0.2s ease;
		-webkit-transition: all 0.2s ease;
		transition: all 0.2s ease;
		height: 2.25rem;
	}

.toggle .selected .title {
	max-width: calc(100% - 1.5rem);
	overflow-x: hidden;
	display: block;
	text-overflow: ellipsis;
	white-space: nowrap;
	float: left;
}

.toggle:hover,
.sngfilter.visible .toggle {
	border-color: var(--primary-base);
}

.sngfilter.visible .toggle {
	background: var(--text-contrast);
}

.sngfilter.visible .toggle-label {
	color: var(--text-contrast);
}

.sngfilter .toggle-label,
.sngfilter .selected,
.sngfilter .selected_category {
	padding: 0.5rem;
	color: var(--navy);
	font-size: 0.875rem;
}

.sngfilter .selected, .sngfilter .selected_category {
	border-color: var(--box-border);
	background: var(--table-row);
	height: 2.125rem;
	border-left: 2px solid var(--primary-base);
}

	.sngfilter .selected .fa-remove, .sngfilter .selected_category .fa-remove {
		float: right;
		padding: .125rem;
	}

.invalid .sngfilter .toggle {
	background-color: var(--invalid);
	border-color: var(--warning-secure);
}

	.invalid .sngfilter .toggle .toggle-label {
		color: var(--warning-secure);
	}

.sngfilter .toggle-label.loading {
	color: var(--muted);
}

.sngfilter .form-control {
	float: none;
}

.sngfilter.disabled .toggle-label {
	color: var(--text-disabled);
}

.sngfilter.disabled-cursor .toggle-label {
	cursor: not-allowed;
}

.disabled-cursor {
	cursor: not-allowed;
	color: var(--text-disabled);
}

.sngfilter-menu {
	width: 100%;
	min-width: 15rem;
	position: absolute;
	top: 100%;
	margin: -1px 0 0;
	left: 0;
	box-shadow: 2px 4px 12px rgba(10,0,40,0.2);
	border-radius: 1rem;
	padding: .75rem;
	background: var(--modal);
	visibility: hidden;
	z-index: 99;
}

	.sngfilter-menu.pop-top {
		top: auto;
		bottom: calc(100% - 1px);
	}

	.sngfilter-menu .sngfilter-results {
		width: 100%;
		max-height: 18rem;
		font-size: .875rem;
		overflow: hidden;
		overflow-y: auto;
		border-radius: .75rem;
	}

		.sngfilter-menu .sngfilter-results ul {
			position: relative;
			list-style: none;
			margin: 0;
			padding: 0;
		}

		.sngfilter-menu .sngfilter-results li {
			width: 100%;
			padding: .5rem .75rem;
			border-radius: .75rem;
			position: relative;
		}

			.sngfilter-menu .sngfilter-results li:after {
				display: block;
				content: '';
				position: absolute;
				top: 0;
				left: 0;
				width: .25rem;
				height: 100%;
				background: 0;
			}

			.sngfilter-menu .sngfilter-results li:not(:last-child) {
				border-bottom: 1px solid var(--border-light);
			}


			.sngfilter-menu .sngfilter-results li.exists span.result-row {
				color: var(--muted);
				display: flex;
				justify-content: flex-start;
				padding-right: 2rem;
				align-items: center;
				flex-direction: row;
				text-align: left;
				overflow-wrap: break-word;
			}
			@keyframes growAndPulse {
				0% {
					transform: scale(1);
				}

				50% {
					transform: scale(1.5);
				}

				100% {
					transform: scale(1.3);
				}
			}
			.sngfilter-menu .sngfilter-results li .fa-check {
				opacity: 0;
				position: absolute;
				padding-right: 0.5rem;
			}

			.sngfilter-menu .sngfilter-results li.exists.animate-icon .fa-check {
				animation: growAndPulse 0.2s ease forwards;
			}

			.sngfilter-menu .sngfilter-results li.exists .fa-check {
				position: revert;
				opacity: 1;
				transform: scale(1.3);
				padding-top: 0.05rem;
			}
			.sngfilter-menu .sngfilter-results li.exist:after {
				background: rgba(var(--primary-rgb), 0.45);
			}

			.sngfilter-menu .sngfilter-results li.sel {
				background: rgba(var(--primary-rgb), 0.25);
				cursor: pointer;
				opacity: 1;
			}

			.sngfilter-menu .sngfilter-results li.clickable-item:hover,
			.sngfilter-menu .sngfilter-results li.clickable-item.keyboard-highlight {
				background: rgba(var(--primary-rgb), 0.25);
				cursor: pointer;
				opacity: 1;
			}

	.sngfilter-menu span.hlt {
		color: var(--navy);
		font-weight: bold;
		text-decoration: underline;
	}

	.sngfilter-menu.visible {
		visibility: visible;
	}

.sngfilter-input {
	padding-right: 2.5rem;
	position: relative;
	margin-bottom: .5rem;
}

	.sngfilter-input input {
		width: 100%;
		max-width: none;
		transition-duration: 0s;
	}

	.sngfilter-input .form-control-container {
		margin-bottom: .5rem;
		width: 100%;
		max-width: none;
		background: rgba(5,15,40,0.07);
		padding: .25rem .5rem;
	}

.visible .sngfilter-input input {
	transition-duration: 0.2s; /* fix for bug in chrome rendering */
}

.sngfilter-input .fa-remove {
	position: absolute;
	top: .675rem;
	right: .65rem;
	cursor: pointer;
	color: var(--muted);
}

	.sngfilter-input .fa-remove:hover {
		color: var(--navy);
	}

.sngfilter-existing {
	list-style: none;
	padding: 0;
	margin: .5rem 0 0;
	max-height: 24rem;
	max-width: 100%;
	overflow-x: hidden;
	overflow-y: auto;
}

	.sngfilter-existing li {
		position: relative;
		max-width: 40rem;
		padding: .5rem;
		font-size: .875rem;
		padding-right: 1.5rem;
		word-break: break-word;
		border-top: 1px solid var(--border-light);
	}

	.sngfilter-existing .none-selected {
		background: 0;
	}

	.sngfilter-existing li:not(:first-child) {
		border-top: 0;
	}

	.sngfilter-existing .fa-remove {
		color: var(--muted);
		cursor: pointer;
		padding: .25rem;
		position: absolute;
		right: .25rem;
		top: .35rem;
	}

		.sngfilter-existing .fa-remove:hover {
			color: var(--navy);
		}


	.sngfilter-existing .stack {
		border: 1px solid var(--table-row-border);
		font-size: .875rem;
		height: auto;
	}

		.sngfilter-existing .stack .fa-remove {
			position: static;
			padding: 0;
			top: 0;
		}

	.sngfilter-existing .stack-item:hover {
		background: var(--table-row);
		cursor: default;
	}

	.sngfilter-existing .stack-item:first-child {
		border-top: 0;
	}

	.sngfilter-existing .stack-item:last-child {
		border-bottom: 0;
	}

.sngfilter-full .sngfilter-existing {
	overflow: visible;
}

.stack-item.to-remove .autocomplete-remove {
	color: var(--text-disabled);
}

	.stack-item.to-remove .autocomplete-remove:before {
		content: '\f01e';
	}

.sngfilter.disabled .toggle {
	border-color: var(--box-border);
	cursor: default;
}

.sngfilter.disabled .toggle-label, .sngfilter.disabled .selected {
	color: var(--text-disabled);
}

.sngfilter-icon {
	margin-right: .5rem;
	margin-left: .25rem;
}

.sngfilter-has-zugo .sngfilter-existing li {
	border-left: 3px solid var(--success);
	padding-left: .3875rem;
}

/* Location Hierarchy */

.location-hierarchy-flex {
	display: flex !important;
}

.location-hierarchy-layout-stacked {
	display: block !important;
}

.location-hierarchy-level-m {
	margin-left: 1rem;
	margin-top: 0px;
}

.location-hierarchy-layout-stacked .location-hierarchy-level-m {
	margin-left: 0;
	margin-top: 1rem;
	min-width: 34rem;
}

/* Expression Buider */

.expression-wrapper,
.composer-accordion-wrapper.expression-wrapper {
	position: fixed;
}

.expression-piece {
	padding: .125rem .5rem;
	border: 1px solid var(--box-border);
	display: block;
	float: left;
	min-height: 2.375rem;
	line-height: 2rem;
	position: relative;
}

	.expression-piece .expression-piece {
		float: none;
		display: inline-block;
	}

	.expression-piece .expression-piece, .expression-piece + .expression-piece {
		margin-left: .5rem;
	}

	.expression-piece:hover {
		position: relative;
		z-index: 1;
	}

.expression-options {
	position: absolute;
	top: -1px;
	left: 100%;
	height: calc(100% + 2px);
	background: rgba(var(--primary-rgb), 0.25);
	color: var(--navy);
	line-height: 1.5rem;
	padding: 0 .25rem;
	border-radius: 0 .25rem .25rem 0;
	display: none;
}


.expression-piece.selected {
	border-color: var(--primary-base);
	width: 20rem;
	margin-right: 1rem;
}

	.expression-piece.selected .expression-options {
		display: block;
	}

.add-expression {
	min-width: 0;
}



ul.filterbox-print-values {
	margin-bottom: 0;
	padding-left: 1.25rem;
	font-size: .875rem;
}
/* Job System */

#json-plan-validator {
	visibility: hidden;
	width: 0;
	float: right;
	padding: 0;
}

	#json-plan-validator.invalid + div {
		border: 1px solid var(--danger);
	}
/* IE version warning alerts */

#ie-alert {
	position: fixed;
	top: 6rem;
	left: .5rem;
	right: .5rem;
	padding: .5rem 1rem;
	background: var(--danger);
	z-index: 500;
	color: var(--text);
}

.error-log-show {
	float: right;
}

/* WorkView Dashboard sizes*/

.wv-dboard-panel {
	min-height: 7rem;
}

	.wv-dboard-panel:after {
		display: block;
		clear: both;
		content: '';
	}

.wv-dboard-label {
	color: var(--muted);
	font-size: .875rem;
}

.wv-dboard-title {
	font-size: 2rem;
	line-height: 2.5rem;
}

.wv-dboard-diff {
	font-size: 1.25rem;
}


/* IE 10+ textbox styling overrides */

::-ms-clear {
	display: none;
	width: 0;
	height: 0;
}

::-ms-reveal {
	width: 0;
	height: 0;
}

/* end */


.progress[value]::-webkit-progress-bar {
	background: var(--box-border);
}

.progress[value]::-moz-progress-bar {
	background: var(--box-border);
}

.progress {
	height: .5rem;
	border: 0;
	background: var(--box-border);
	border-radius: .25rem;
}

.sng-progress-indicator.ng-hide-add,
.sng-progress-indicator progress.ng-hide-add {
	transition: 0.5s linear opacity;
	opacity: 1;
}

.sng-progress-indicator.ng-hide-add-active,
.sng-progress-indicator progress.ng-hide-add-active {
	opacity: 0;
}

.progress-indicator progress {
	width: 100%;
}

.progress-indicator div {
	text-align: center;
	font-size: .875rem;
	color: var(--muted);
}


.progress[value] {
	color: var(--primary-base);
}

	.progress[value]::-webkit-progress-value {
		background: var(--primary-base);
		transition: width .15s ease;
	}

	.progress[value]::-moz-progress-value {
		background: var(--primary-base);
		transition: width .15s ease;
	}

	.progress[value]::-ms-fill {
		background: var(--primary-base);
		transition: width .15s ease;
	}

.progress-indicator .progress[value]::-webkit-progress-value {
	transition: width 1s ease;
}

.progress-indicator .progress[value]::-moz-progress-value {
	transition: width 1s ease;
}

.progress-indicator .progress[value]::-ms-fill {
	transition: width 1s ease;
}

.load-error .progress[value] {
	color: var(--danger);
}

	.load-error .progress[value]::-webkit-progress-value {
		background: var(--danger);
	}

	.load-error .progress[value]::-moz-progress-value {
		background: var(--danger);
	}

	.load-error .progress[value]::-ms-fill {
		background: var(--danger);
	}

.checked-list-item {
	border: 1px solid var(--input-border);
	display: inline-block;
	margin-right: 0.375rem;
	padding: 0.375rem 0.5rem;
	font-size: 0.875rem;
	border-radius: 0.125rem;
	line-height: 1.125rem;
	height: 2.25rem;
}

	.checked-list-item:hover {
		cursor: default;
	}

	.checked-list-item .list-remove {
		top: .875rem;
		right: 1rem;
		font-size: 1rem;
		cursor: pointer;
		z-index: 101;
		padding-left: 0.5rem;
	}

		.checked-list-item .list-remove:hover {
			color: var(--navy);
		}

/* Vault */

.cache-row {
	color: var(--muted);
}

.cache-name {
	color: var(--text);
}

/* Narrative Builder styles */

.narrative-buttons {
	color: var(--muted);
}

.narrative-row {
	border-bottom: 1px solid var(--box-border);
	border-top: 1px solid var(--box-border);
}

	.narrative-row + .narrative-row {
		border-top: 0;
	}

/****** Expression Picker ******/

.expression-picker-invalid .sng-expression-picker {
	width: calc(100% - 2rem);
	float: left;
}

.expression-invalid-warning {
	line-height: 2.75rem;
	padding: 0 .5rem;
	float: left;
	color: var(--warning-secure);
	display: none;
}


.expression-picker-invalid .expression-invalid-warning {
	display: block;
}

.sng-expression-picker {
	width: 100%;
	max-width: none;
	display: flex;
}

	.sng-expression-picker .select-wrapper,
	.sng-expression-picker .single-option {
		width: 25% !important;
		display: inline-block;
		flex-basis: 0.25;
	}

	.sng-expression-picker > div:last-child {
		flex-grow: 1;
		padding-left: 1rem;
	}

	.sng-expression-picker .single-option {
		background: var(--input);
		border: 1px solid var(--input-border);
		border-radius: .125rem;
		color: var(--input-text);
		font-size: .875rem;
		padding: .425rem;
		height: 2.25rem;
	}

	.sng-expression-picker .single-option {
		color: var(--muted);
	}

		.sng-expression-picker .select-wrapper.medium,
		.sng-expression-picker .select-wrapper.medium select,
		.sng-expression-picker textarea.medium,
		.sng-expression-picker .single-option.medium {
			height: 6rem;
		}

		.sng-expression-picker .single-option.medium {
			padding: 2.25rem 0.725rem;
		}

	.sng-expression-picker .select-wrapper:last-child,
	.sng-expression-picker .select-wrapper:last-child select {
		-webkit-border-top-left-radius: 0;
		-webkit-border-bottom-left-radius: 0;
		-moz-border-radius-topleft: 0;
		-moz-border-radius-bottomleft: 0;
		border-top-left-radius: 0;
		border-bottom-left-radius: 0;
	}

	.sng-expression-picker.with-options input,
	.sng-expression-picker.with-options textarea.medium,
	.sng-expression-picker .select-wrapper:last-child {
	}

	.sng-expression-picker .select-wrapper:last-child {
		width: 100% !important;
		border-left: 1px solid var(--box-border);
	}

	.sng-expression-picker input.compact {
		width: 100%;
	}

	/*.sng-expression-picker.with-options textarea,*/

	.sng-expression-picker button {
		padding: .375rem 0.84rem;
		min-width: initial;
	}

	.sng-expression-picker.expression-picker-expanded {
		margin-top: 18px;
	}

.expression-builder-term {
	padding: 0.25rem .5rem;
	display: inline-block;
	border: 1px solid var(--box-border);
	margin: 0;
}

	.expression-builder-term + .expression-builder-term {
		border-left: 0;
	}

.expression-builder-wrapper {
	border: 1px solid var(--modal-border);
	border-radius: .25rem;
	min-height: 2.25rem;
	padding: .25rem;
	font-size: 1rem;
	overflow: auto;
}

.warning {
	color: var(--warning-secure);
}

/* Alert classes */

.alert-warning,
.alert-danger,
.alert-success {
	color: inherit;
	background: 0;
	padding: .5rem .5rem .5rem 3.5rem;
	position: relative;
}

.alert-warning {
	border: 1px solid var(--warning-secure);
}

.alert-success {
	border: 1px solid var(--success);
}

.alert-danger {
	border: 1px solid var(--danger);
}

	.alert-warning:before,
	.alert-danger:before,
	.alert-success:before {
		font-family: 'Font Awesome 6 Pro';
		position: absolute;
		left: 1rem;
		top: .5rem;
		font-size: 1.5rem;
	}

.alert-warning:before {
	content: '\f06a';
	color: var(--warning-secure);
}

.alert-success:before {
	content: '\f00c';
	color: var(--success);
}

.alert-danger:before {
	content: '\f071';
	color: var(--danger);
}

.no-trim {
	white-space: pre;
}



.inline-block {
	display: inline-block !important;
}

.image-popper-wrapper {
	position: fixed;
	z-index: 1004;
	background: var(--background);
	border: 1px solid var(--box-border);
	box-shadow: 0 1px 10px rgba(0, 0, 0, 0.4);
}

	.image-popper-wrapper:hover {
		cursor: move;
	}

	.image-popper-wrapper.popper-popin {
		animation: 200ms zoomIn ease;
	}

	.image-popper-wrapper.popper-popout {
		animation: 200ms zoomOut ease;
	}

.image-popper-close {
	float: right;
	padding: 0.25rem;
}

	.image-popper-close:hover {
		cursor: pointer;
	}

.image-popper-content {
	border-top: 1px solid var(--box-border);
}



/* Extended Properties */

.category-title {
	white-space: nowrap;
	margin-bottom: .5rem;
	padding-bottom: 0;
}

.category-rows {
}

.category-content {
	padding: 0 0 .75rem;
}

	.category-content + .category-content {
		border-top: 1px solid var(--border-light);
		padding-top: .75rem;
	}

.margin-sides-10pct {
	margin-left: 10%;
	margin-right: 10%;
}

.margin-sides-5pct {
	margin-left: 5%;
	margin-right: 5%;
}

/* Tags
*/
.tag {
	background: rgba(var(--muted-rgb), 0.1);
	display: inline-block;
	padding: 0.125rem 0.25rem;
	font-weight: bold;
	border-radius: 0.25rem;
	font-size: 0.75rem;
	line-height: 0.875rem;
	color: var(--muted);
	border-radius: 1rem;
}

	.tag + .tag {
		margin-left: .25rem;
	}

	.tag.clickable {
		cursor: pointer;
	}

	.tag.clickable,
	.tag.tag-accent {
		background: rgba(var(--primary-rgb), 0.1);
		color: var(--navy);
	}

	.tag.tag-warning {
		background: rgba(var(--warning-rgb), 0.1);
		color: var(--warning-dark);
	}

	.tag.tag-success {
		background: rgba(var(--success-rgb), 0.1);
		color: var(--success-dark);
	}

	.tag.tag-danger {
		background: rgba(var(--danger-rgb), 0.1);
		color: var(--danger-dark);
	}


/* Section and box code */

.dyno-control.nav-item {
	background: none;
}

.section:not(:last-child) {
	margin-bottom: 1rem;
}

.clickable {
	cursor: pointer;
	position: relative;
}

.box.clickable {
	color: var(--navy);
}

	.box.clickable:after,
	.info-tile .clickable:after {
		-ms-transition: opacity 0.2s ease;
		-moz-transition: opacity 0.2s ease;
		-webkit-transition: opacity 0.2s ease;
		transition: opacity 0.2s ease;
		display: block;
		content: '';
		position: absolute;
		left: 0;
		top: 0;
		width: 100%;
		height: 100%;
		background: rgba(var(--primary-rgb), 0.15);
		opacity: 0;
		z-index: 0;
		border-radius: 1rem;
		pointer-events: none;
	}

	.box.clickable:hover,
	.box.clickable:focus,
	.box.clickable:active {
		text-decoration: none;
	}

		.box.clickable:hover:after,
		.info-tile .clickable:hover:after {
			opacity: 1;
		}

	.box.clickable:active,
	.info-tile .clickable:active {
		box-shadow: 0 0 0 2px rgba(var(--primary-rgb), 0.5);
	}

	.box.clickable:focus,
	.info-tile .clickable:focus {
		outline: 0;
		box-shadow: 0 0 0 2px rgba(var(--primary-rgb), .5);
		z-index: 1;
	}

	.box.clickable.selected {
		cursor: default;
	}

.section .section {
	box-shadow: none;
}

.stepwise-container {
	padding: 1rem;
}
/* Section */
.section-scroll {
	overflow-y: auto;
}

.section-title {
	border-radius: 1rem 1rem 0 0;
	padding: 1rem;
	font-size: 1.25rem;
	font-weight: bold;
}

.toggle-section-title {
	text-transform: initial;
	font-weight: bold;
}

.toggle-section.disabled .toggle-section-title {
	color: var(--text-disabled);
}

.toggle-section-title .title-text {
	max-width: calc(100% - 10rem);
	display: inline-block;
}


.section-order-number {
	position: relative;
	float: left;
	padding-right: .5rem;
	margin-right: .75rem;
	color: var(--muted);
	font-size: 1rem;
	font-weight: bold;
	text-align: center;
	width: 2rem;
}

.title-wrapper .toggle {
	position: relative;
}

	.section-order-number:after,
	.title-wrapper .toggle:after {
		display: block;
		content: '';
		height: calc(100% - .5rem);
		position: absolute;
		right: 0;
		top: .25rem;
		border-right: 1px dotted var(--box-border);
		opacity: .5;
	}

.title-wrapper .toggle {
	float: left;
	margin: 0 1rem 0 0;
	position: relative;
	padding-right: 1rem;
}

.section-help {
	padding: .5rem;
	font-size: .875rem;
	text-transform: none;
	font-weight: normal;
	box-shadow: none;
	border: 1px solid var(--box-border);
	padding: .5rem;
	border-radius: .5rem;
}

.section-content {
	padding: 1rem;
}

.section-title + .section-content,
.subsection-title + .section-content {
	padding-top: 0;
}

.fact-board-background {
	background: var(--box) !important;
}

/* Wizard */

.wizard {
	padding: 1rem;
	margin-bottom: 1rem;
}

.wizard-header {
	display: flex;
	width: 100%;
}

	.wizard-header > div:nth-child(2) {
		white-space: nowrap;
		text-align: center;
		flex-grow: 1;
		padding: .25rem 0;
	}

		.wizard-header > div:nth-child(2) > div {
			display: inline-block;
		}

.wizard .progress {
	width: 100%;
	height: .25rem;
	margin: .5rem 0 1rem;
}


.wizard-progress {
	display: none;
}


.wizard-steps {
	margin-bottom: 1.5rem;
	display: table;
	width: 100%;
	border-bottom: 3px dotted var(--box-border);
	height: .6125rem;
}

	.wizard-steps > div {
		position: relative;
		cursor: pointer;
	}

		.wizard-steps > div:before,
		.wizard-steps > div:after {
			display: block;
			content: '';
		}

		.wizard-steps > div:before {
			width: 100%;
			height: .25rem;
			margin-top: .375rem;
		}

		.wizard-steps > div:after {
			position: absolute;
			top: 0;
			left: 50%;
			width: 1rem;
			height: 1rem;
			background: var(--background);
			border: 0;
			outline: none;
			border-radius: .5rem;
			z-index: 1;
		}

		.wizard-steps > div.completed:after {
			background: var(--primary-base);
		}

		.wizard-steps > div.errors:after {
			background: var(--warning-secure) !important;
			color: var(--text-contrast);
			box-shadow: 0 2px 8px rgba(var(--warning-rgb), 0.25);
			font-family: 'Font Awesome 6 Pro';
			content: '\21';
			line-height: 1rem;
			text-indent: -1px;
			font-size: .625rem;
			text-align: center;
		}

	.wizard-steps > .uncomplete ~ .uncomplete {
		cursor: default;
	}

	.wizard-steps .uncomplete ~ div:after {
		background: var(--background);
	}

	.wizard-steps > div.selected:after {
		box-shadow: 0 0 0 .25rem rgba(var(--primary-rgb),0.5);
	}

	.wizard-steps > div.completed.selected:after {
		background: var(--primary-base);
	}

.wizard-steps {
	display: flex;
	width: 100%;
}

	.wizard-steps > div {
		flex-grow: 1;
	}

		.wizard-steps > div:first-child,
		.wizard-steps > div:last-child {
			flex-grow: 0.5;
		}

			.wizard-steps > div:first-child:after {
				left: 0;
				margin: 0;
			}

			.wizard-steps > div:last-child:after {
				left: auto;
				right: 0;
				margin: 0;
			}

		.wizard-steps > div:only-child {
			flex-grow: 1;
		}

			.wizard-steps > div:only-child:after {
				left: calc(50% - 0.5rem);
				right: auto;
			}




/* Collapsible panels */

.dashboards-list {
	display: flex;
	flex-wrap: wrap;
	padding: .5rem;
}

.dashboards-category {
	padding: .5rem;
}

.dashboards-panel {
	width: 100%;
	padding: 1rem;
	border-radius: 0 0 .25rem .25rem;
	flex-wrap: wrap;
}

.dashboards-title {
	color: var(--text);
	padding: .5rem;
	margin-bottom: 0;
	border-bottom: 2px dotted var(--border-strong);
	font-weight: bold;
	border-radius: .25rem .25rem 0 0;
}


/* Dashboard homepage buttons */

.dashboard-button {
	padding: 2rem;
	display: inline-block;
	text-align: center;
	width: 14rem;
	border-radius: 1.75rem
}

	.dashboard-button .title {
		white-space: nowrap;
		overflow: hidden;
		text-overflow: ellipsis;
		color: var(--muted);
	}

/* Context overlay */

.context-item,
body.factboard-select .factboard-addable {
	position: relative;
	box-shadow: 0 0 0 2px var(--primary-base);
	border-radius: .25rem;
	border-bottom-right-radius: 0;
}

	.context-item.context-item-success,
	body.factboard-select .factboard-item-selected,
	body.factboard-select .factboard-item-added {
		box-shadow: 0 0 0 2px var(--success);
	}

	.context-item.context-item-warning {
		box-shadow: 0 0 0 2px var(--warning-secure);
	}

	.context-item.context-item-danger {
		box-shadow: 0 0 0 2px var(--danger);
	}

	.context-item.context-item-secondary {
		box-shadow: 0 0 0 2px var(--navy);
	}

	.context-item.context-item-muted {
		box-shadow: 0 0 0 2px var(--muted);
	}

.context-item-btn {
	position: absolute;
	right: -2px;
	top: 100%;
	margin-top: 1px;
	background: rgba(var(--primary-rgb), 0.25);
	width: 1.25rem;
	height: 1.25rem;
	z-index: 1;
	border-radius: 0 0 .25rem .25rem;
	color: var(--navy) !important;
}

	.context-item-btn .fa,
	.factboard-addable .context-item-btn .fa {
		padding: 0;
		margin: 0;
		color: var(--navy) !important;
	}


.factboard-item-selected > .context-item-btn,
.context-item-success .context-item-btn {
	background: var(--success);
}

.context-item-warning .context-item-btn {
	background: var(--warning-secure);
}

.context-item-danger .context-item-btn {
	background: var(--danger);
}

.context-item-secondary .context-item-btn {
	background: var(--navy);
	color: var(--text-contrast-secondary);
}

.context-item-muted .context-item-btn {
	background: var(--muted);
}

/* Fact board specific */

/* Fix for issue with html2canvas which prints both characters of a ligature over each other */
.factboard-rendering {
	font-feature-settings: "liga" 0;
	-ms-font-feature-settings: "liga" 0;
	letter-spacing: 0;
}

html.factboard-rendering {
	overflow: visible;
	min-height: 100vh;
	height: auto;
}

	html.factboard-rendering body {
		height: 100%;
		min-height: 100vh;
		position: relative;
		overflow: visible;
	}

body:not(.factboard-select) .factboard-addable .context-item-btn {
	display: none;
}

/**
    when capturing page do not crop the height
*/
.factboard-rendering body,
body.factboard-creator-active {
	height: 100%;
	min-height: 100vh;
	position: relative;
	overflow: visible;
}

	/**
    when captureing page make sure that visible alerts are not captured
*/
	.factboard-rendering body .alert-vis,
	.factboard-rendering body #alert,
	body.factboard-creator-active .alert-vis,
	body.factboard-creator-active #alert {
		display: none !important;
	}
/**
    when capturing page do not crop the height
*/
.factboard-creator-active .scroll-content {
	min-height: 100%;
	overflow: visible;
}

/*
   These below two rules are set by the object that actually
   captures the item from the page within factboard service
   a.k.a. content creator
   If we are capturing nested -addable- items, allow creator
   to not capture internal addable-artefacts
*/
.factboard-creator-active .factboard-addable {
	box-shadow: none !important;
}

/**
    hides scrollable headers during factboard screenshot creation
*/
.factboard-creator-active .zugo-container table.fixed-table-header {
	display: none !important;
}
/**
    Hides load more item in zugo grid during factboard screenshot creation
*/
.factboard-creator-active .zugo-container .load-indicator-mini {
	display: none !important;
}

.factboard-creator-active .factboard-addable .context-item-btn {
	display: none !important;
}

.factboard-addable > .context-item-btn span:before {
	content: '\f067';
}

.factboard-item-selected > .context-item-btn span:before {
	content: '\f068';
}

/* Fti watch */

.watch-item {
	box-shadow: 0 0 0 .125rem rgba(var(--warning-rgb), 0.5);
	margin: 0 .125rem .375rem;
	border-radius: .25rem;
	padding: 0 1.5rem 0 .125rem;
	position: relative;
}

	.watch-item:last-child {
		margin-bottom: 0;
	}

span.watch-item {
	display: inline-block;
}

.watch-btn {
	display: block;
	position: absolute;
	top: .125rem;
	right: .125rem;
	padding: 0 .125rem;
	border-radius: .25rem;
	color: var(--warning-secure);
	z-index: 0;
	line-height: 1rem;
}

	.watch-btn:hover {
		background: rgba(var(--warning-rgb), 0.2);
	}

/* Reports app */

.report-age {
	padding: .375rem 1rem 0;
	font-size: .875rem;
}

.static-header {
	background: var(--box-border);
	border: 2px solid var(--table-row);
	padding: .5rem;
	border-radius: .25rem;
}

	.static-header h1, .static-header h2 {
		margin: 0;
	}



.confirm-menu {
	white-space: pre;
	padding: .5rem;
	font-size: 1rem;
}

	.confirm-menu .btn {
		margin-left: 1rem;
	}


/*  Sticky navigation bar */

.sticky-bar {
	position: relative;
}

	.sticky-bar.sticky-bar-fixed {
		position: fixed;
		z-index: 3;
	}

.pdf-export-button {
	min-width: 150px;
}

/* Video */
.embed-responsive-item.video-js:not(-webkit-full-screen) {
	z-index: 1;
}

.cctv-no-video {
	flex: 1;
	background: var(--muted);
	color: white;
	display: flex;
	flex-direction: column;
	justify-content: center;
	width: 100%;
	align-items: center;
	gap: 1rem;
}

/* impersonating-notification */
#impersonating-notification {
	text-align: left;
	padding: 1px;
	display: flex;
	justify-content: center;
	align-items: center;
	height: 2.5rem;
	background: rgba(var(--primary-rgb), 0.2);
	box-shadow: inset -4px 0 10px 1px rgba(10,50,70,0.13);
}

	#impersonating-notification .fs-selected button.fa.fa-remove {
		display: none;
	}

.completed-container {
	display: -ms-flexbox;
	display: flex;
	height: 0.5rem;
	overflow: hidden;
	font-size: .75rem;
	background-color: #e9ecef;
	border-radius: 0.25rem;
	max-width: 18rem;
	margin: 0.5rem;
}

.completed-progress-bar {
	display: -ms-flexbox;
	display: flex;
	-ms-flex-direction: column;
	flex-direction: column;
	-ms-flex-pack: center;
	justify-content: center;
	color: #fff;
	text-align: center;
	white-space: nowrap;
	background-color: rgb(44, 160, 0);
	transition: width .6s ease;
}

/* Error viewer */
#error-viewer {
	margin: 20px;
}

	#error-viewer .row {
		margin-bottom: 15pt;
	}

#ie-not-supported-login {
	display: none;
	background-color: #ededbc;
	border: 1px solid #d9d348;
	padding: 10px;
	-webkit-box-shadow: 7px 7px 14px 3px rgba(199,199,199,0.93);
	box-shadow: 7px 7px 14px 3px rgba(199,199,199,0.93);
}

	#ie-not-supported-login p {
		padding: 10px;
	}

#ie-not-supported {
	display: none;
	background-color: #ededbc;
	border: 1px solid #d9d348;
	padding: 10px;
	width: 90%;
	position: fixed;
	bottom: 10px;
	font-size: 0.8rem;
	-webkit-box-shadow: 7px 7px 14px 3px rgba(199,199,199,0.93);
	box-shadow: 7px 7px 14px 3px rgba(199,199,199,0.93);
}

#ie-dismiss {
	float: right;
}

#ie-not-supported p {
	padding: 5px;
}

app-hierarchy {
	display: block;
}

/* Cpf Tour */
.tour-overlay {
	z-index: 990;
}

.tour-preview-container {
	z-index: 99999;
	padding: 1rem;
	margin: -1rem;
	background: white;
	border-radius: 2rem;
	outline: 4px solid rgba(255, 255, 255, 0.2);
}

.tour-desc-box {
	position: fixed;
	z-index: 999999;
	top: 2rem;
	width: 30rem;
	padding: 1rem;
}

#tour-close {
	min-width: auto;
}

.tour-desc-buttons {
	padding-top: 1rem;
	display: flex;
	align-items: center;
}

	.tour-desc-buttons > * {
		flex: 1;
		text-align: center;
	}




.fade-in {
	animation: fade-in .75s;
}

.factboard-rendering .fade-in {
	animation: none;
}

.fade-out {
	animation: fade-out .75s;
}



.skeleton {
	position: relative;
	overflow: hidden;
	border-radius: .4rem;
	background: var(--box-border);
}

	.skeleton::before {
		content: '';
		display: block;
		position: absolute;
		left: -150px;
		top: 0;
		height: 100%;
		width: 150px;
		background: linear-gradient(90deg,  var(--box-border) 0%, var(--box) 50%,  var(--box-border) 100%);
		animation: load 1s cubic-bezier(0.4, 0.0, 0.2, 1) infinite;
	}


/* --- keyframes --- */
@keyframes load {
	from {
		left: -150px;
	}

	to {
		left: 100%;
	}
}

@keyframes fade-in {
	0% {
		opacity: 0;
	}

	100% {
		opacity: 1;
	}
}

@keyframes fade-out {
	0% {
		opacity: 0;
	}

	100% {
		opacity: 1;
	}
}

@keyframes zoomIn {
	from {
		opacity: 0;
		transform: scale3d(.3, .3, .3);
	}

	50% {
		opacity: 1;
	}
}

@keyframes zoomOut {
	from {
		opacity: 1;
	}

	50% {
		opacity: 0;
		transform: scale3d(.3, .3, .3);
	}

	to {
		opacity: 0;
	}
}


/* *** Breakpoints *** */
@media (min-width: 1400px) {
	.col-xxl-3 {
		flex: 0 0 auto;
		width: 25%;
	}
	.col-xxl-4 {
		flex: 0 0 auto;
		width: 33.33333333%;
	}
}

@media screen and (max-width: 1023px) {
	#alert,
	#forgot-password-alert,
	#refresh-results-box,
	.refresh-results-box {
		right: 0;
	}

		#alert.alert-vis,
		#refresh-results-box.alert-vis,
		.refresh-results-box.alert-vis {
			bottom: 3rem;
		}


	.alert-body {
		flex-wrap: wrap;
		max-width: 95vw;
	}


	.asymetric-65 {
		flex-basis: 65%;
	}

	.asymetric-30 {
		flex-basis: 30%;
	}


	body .col:only-child,
	body [class^='col-']:only-child,
	body [class*=' col-']:only-child,
	body.landscape .col,
	body.landscape [class^='col-'],
	body.landscape [class*=' col-'] {
		-ms-flex-preferred-size: initial;
		flex-basis: auto;
		max-width: none;
	}
}

.avoid-menu-activating {
	position:fixed !important;
	opacity: 0 !important;
	overflow: hidden !important;
}

@media only screen and (max-width: 991px) {

	/*Added for composer new search conditions specific to override the calc above*/
	div.compose-condition-item div.composer-accordion-popup.active.composer-accordion-popup-wide.avoid-menu-absolute {
		max-width: 32rem;
		min-width: 32rem;
	}

	.dd-menu, .sngfilter-menu, .composer-accordion-popup {
		max-width: 32rem;
	}
}

@media only screen and (min-width: 800px) and (max-width: 991px) {
	div.icon-nav-btn-container .dropdown.open .dd-menu {
		left: auto !important
	}
}

@media screen and (max-width: 799px) {

	html, body {
		font-size: 14px;
	}

	.app-container > .flex-body {
		padding-bottom: 3.25rem;
	}


	body .col:only-child,
	body [class^='col-']:only-child,
	body [class*=' col-']:only-child,
	body.landscape .col,
	body.landscape [class^='col-'],
	body.landscape [class*=' col-'] {
		-ms-flex-preferred-size: initial;
		flex-basis: auto;
		max-width: none;
	}
}

@media only screen and (max-width: 767px) {

	.composer-accordion-popup {
		min-width: calc(100vw - 8rem);
		max-width: calc(100vw - 8rem);
	}

	.form-stretch {
		width: 100%
	}
    .form-stretch .form-control {
		width: 100%;
    }
	.dd-menu, .sngfilter-menu, .composer-accordion-popup {
		max-width: 26rem;
	}

	.avoid-menu {
		max-width: 90vw;
	}
	/*Added for composer new search conditions specific*/
	div.compose-condition-item div.composer-accordion-popup.active.composer-accordion-popup-wide.avoid-menu-absolute .sngfilter-menu.avoid-menu.avoid-menu-fixed.pop-top.visible {
		max-width: 24rem;
	}
}

@media screen and (max-width: 442px) {
	.location-hierarchy-flex {
		display: block !important;
	}

	.location-hierarchy-level-m {
		margin-left: 0px;
		margin-top: 1rem;
	}
}

@media print {
	.no-print, .no-print * {
		display: none !important;
	}
}


/*
    Header, secondary navigation and sidebars
*/
/* RESERVED Z-INDEX VALUES */
.app-container {
	display: flex;
	flex-direction: column;
	height: 100vh;
	width: 100%;
	position: relative;
	overflow: hidden;
}


.app-menu {
	min-height: 6rem;
	flex-shrink: 0;
	position: relative;
}

.app-menu-bottom,
.app-menu-top {
	width: 100%;
}


.app-menu-top {
	min-height: 3.25rem;
	display: flex;
	background: var(--nav);
	align-items: start;
	box-shadow: 0 2px 12px rgba(10,15,40,0.15);
	z-index: 60;
	position: relative;
}

.app-menu-bottom {
	min-height: 2.5rem;
	display: flex;
	padding: .5rem .5rem !important;
}

.teleport-bar {
	display: none !important;
	opacity: 0;
	height: 0;
	overflow: hidden;
}

.page-title-container {
	display: flex;
	flex-direction: column;
}


.page-title,
.mobile-btn-large {
	float: left;
	position: relative;
}

.mobile-btn-large {
	font-size: 1.5rem;
	color: var(--navy);
	padding: 0 1rem;
	display: none;
	position: relative;
	width: 1.28571429em;
	box-sizing: content-box;
	text-align: center;
	line-height: 3.25rem;
	margin-right: 0;
}

a.mobile-btn-large {
	text-decoration: none;
}

	.mobile-btn-large:disabled, .mobile-btn-large[disabled] {
		color: var(--text-disabled);
	}.page-title {
	float: left;
	padding: 0 1rem;
	font-size: 1.5rem;
	font-weight: bold;
	line-height: 1.675rem;
	max-width: 28rem;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
	flex-shrink: 0;
	margin-top: -0.125rem;
}

	.page-title:empty {
		display: none;
	}

		.page-title:empty + .navbar-nav {
			padding-left: .5rem;
		}

	.page-title.sm {
		font-size: 1.125rem;
		padding: .25rem 1.5rem;
	}

.beta-icon {
	background-color: #ccc;
	border-radius: 4px;
	color: #000;
	font-size: 10px;
	margin-left: 1px;
	padding: 2px 5px;
}

.app-logo {
	max-width: 12rem;
	height: 3.25rem;
	display: flex;
	align-items: center;
	overflow: hidden;
	margin: 0;
	float: left;
	padding: 0 .5rem;
	flex-shrink: 0;
}

html.dark-theme a.app-logo {
	filter: invert(1) hue-rotate(180deg) brightness(160%) grayscale(80%);
	mix-blend-mode: screen;
	transform: translateZ(0);
	will-change: filter;
}

/* Responsive Logo Styles */

.logo-lores {
	display: block;
}

.logo-hires {
	display: none;
}




.nav {
	-ms-flex-negative: 0;
	flex-shrink: 0;
}

.dropdown-item,
.dropdown-section {
	border: 0;
	background: 0;
	padding: 0 1rem 0.25rem;
	line-height: 2rem;
	font-size: .875rem;
	position: relative;
	-moz-appearance: none;
	-webkit-appearance: none;
	transition: background 0.2s ease, color 0.2s ease;
	border-radius: 0.25rem;
}

.dropdown-section {
	display: block;
	border-radius: 0;
	border-top: 1px solid var(--box-border);
	padding: .25rem 1rem;
}

.dropdown-item {
	color: var(--navy);
	cursor: pointer;
}

	.dropdown-item + .nav-link,
	.nav-link + .nav-link {
		margin-left: 0.25rem;
	}

	.dropdown-item .fa,
	.nav-link .fa,
	.dropdown-item .fo,
	.nav-link .fo {
		margin-right: 0.25rem;
		width: 1.28571429em;
		text-align: center;
	}

	.nav-link:hover {
		background: rgba(var(--primary-rgb), 0.45);
	}.nav-link:active,
.navbar-nav .nav-link:active {
	background: rgba(var(--primary-rgb), 0.3);
}

.dropdown-item:hover, .dropdown-item:active {
	background: 0;
}

.nav-link {
	text-align: left;
}

.nav-item > .nav-link {
	width: 100%;
}

.nav-link .fo {
	position: relative;
	top: 1px;
}


.dropdown-item {
	padding: 0;
}

	.dropdown-item > div,
	.dropdown-item > a,
	.dropdown-item > span,
	.dropdown-item > button {
		color: var(--muted);
		display: block;
		padding: .25rem .75rem;
		text-decoration: none;
		height: auto;
		width: 100%;
		text-align: left;
		transition: background 0.2s ease;
	}

	.dropdown-item > button,
	.dropdown-item > a {
		-moz-appearance: none;
		appearance: none;
		-webkit-appearance: none;
		background: transparent;
		border: 0;
		color: var(--navy);
		font-weight: normal;
	}

		.dropdown-item > button:hover,
		.dropdown-item > a:hover,
		#more-toolbar-button:hover,
		#edit-portal-button:hover {
			background: rgba(var(--primary-rgb), 0.25);
		}

	.dropdown-item .fa {
		color: var(--navy);
		margin-right: .75rem;
		margin-left: .125rem;
		text-align: center;
	}

	.dropdown-item > .nav-link {
		min-width: 100%;
		background: 0;
		border-radius: 0;
		text-align: left;
		padding: .25rem .75rem;
		line-height: 2rem;
		font-weight: normal;
		margin: 0;
	}

		.dropdown-item > .nav-link:disabled {
			box-shadow: none;
		}



.dropdown-header {
	position: relative;
	padding: .5rem .75rem;
	border-radius: .25rem .25rem 0 0;
	font-size: 1rem;
	color: var(--navy);
	font-weight: bold;
}

	.dropdown-header + .dropdown-divider {
		margin-top: 0;
	}

.dropdown-content {
	padding: 1rem;
}

.dropdown-header + .dropdown-content {
	padding-top: 0;
}

.dropdown-divider {
	border-top: 2px dotted var(--box-border);
	margin: .375rem 1rem;
}

.dropdown-content {
	padding: 1rem;
}

.dropdown-header + .dropdown-content {
	padding-top: .5rem;
}


.nav-item {
	display: flex;
	position: relative;
}



.toolbar .nav-item {
	float: left;
	flex-shrink: 0;
	margin: 0;
}

.app-menu-right {
	margin-left: auto;
	max-width: 50%;
	padding-right: .5rem;
	flex-shrink: 0;
	min-width: max-content;
}

	/* the buttons within app menu nav should not wrap into multilines */
	.app-menu-right .nav-link {
		white-space: nowrap;
	}

/* Nav tabs */
.portal-tabs-container {
	border-bottom: 1px solid var(--box-border);
}

.portal-tab-more-container {
	padding-left: 0;
}

.portal-tab-edit-container {
	padding-left: 0;
	margin-left: auto;
}

.nav-tabs {
	border: 0;
}

.nav-tabs, .nav.nav-tabs {
	padding: 0;
}

	.nav-tabs.alt {
		background: var(--table-row);
	}

	.nav-tabs .nav-link, .nav-tabs .nav-item .nav-link, #more-toolbar-button, #edit-portal-button {
		height: 2.5rem;
		text-align: center;
		font-size: 1rem;
		background: transparent;
		color: var(--navy);
		padding: 0 1rem;
		cursor: pointer;
		line-height: 2.5rem;
		overflow: hidden;
		white-space: nowrap;
		text-overflow: ellipsis;
		border: 0 solid transparent;
		border-width: 0 0 0.175rem 0;
		box-shadow: none !important;
		font-weight: 500;
		border-radius: 1rem;
	}

		.nav-tabs .nav-item .nav-link:hover {
			border-radius: 1rem;
		}

		.nav-tabs .nav-item .nav-link:focus {
			border-radius: 1rem;
		}

		.nav-tabs .nav-item .nav-link:hover,
		.nav-tabs .nav-item .nav-link:focus {
			color: var(--navy);
			background: transparent;
			outline: 0;
		}

		.nav-tabs .nav-item .nav-link:hover {
			background: rgba(var(--primary-rgb), .25);
		}

		.nav-tabs .nav-item .nav-link:focus {
			box-shadow: 0 0 0 2px rgba(var(--primary-rgb), .25);
		}

			.nav-tabs .nav-link.active:disabled {
				border-color: transparent;
			}

	.nav-tabs .nav-item, .nav-tabs .nav-item + .nav-item {
		margin: 0!important;
	}

	.nav-tabs li.nav-item:has(> a.nav-link.active), .nav-tabs li.nav-item:has(> button.nav-link.active) {
		border-bottom: solid 3px var(--primary-base);
	}

.right.nav .nav-tabs {
	background: 0;
	border: 0;
	border-bottom: 1px solid rgba(10,15,40,0.06);
}

	.right.nav .nav-tabs .nav-item {
		margin-right: 0;
	}


	.right.nav .nav-tabs .nav-link, #periodTypeSelectorComp.nav-tabs .nav-link {
		border-radius: 1rem;
		margin: 0;
	}

.tab-ribbon {
	background: 0;
}

.files-tab-ribbon {
	display: flex;
	padding: .5rem .75rem;
	gap: 0.25rem;
}


/* Compass */

.compass {
	float: left;
	padding: 0 1rem;
	margin: 0;
	height: auto;
	flex: 1;
	align-items: center;
	display: flex;
	flex-wrap: wrap;
	font-size: 0.875rem;
}

	.compass li {
		display: inline-flex;
		flex-grow: 0;
		max-width: 16rem;
		overflow-x: hidden;
		text-overflow: ellipsis;
		white-space: nowrap;
		align-items: center;
	}

		.compass li:first-child {
			color: var(--muted);
		}

		.compass li:first-child:before {
			content: none;
		}

		.compass li:before {
			font-family: 'Font Awesome 6 Pro';
			content: '\f105';
			color: var(--muted);
			margin: 0 0.5rem;
			font-size: .875rem;
			font-weight: 300;
			display: block;
		}

		.compass li:only-child {
			text-overflow: ellipsis;
		}

.compass-root:before {
	display: none !important;
}

.compass .compass-close,
.compass-close:before {
	display: none;
}

.compass li[ng-click] {
	color: var(--navy);
	cursor: pointer;
}

.compass li.breadcrumb-last-item {
	color: var(--text);
	cursor: default;
}

.compass a {
	color: var(--muted);
	font-weight: normal;
}

.compass-close {
	margin-left: auto;
	padding: .125rem .5rem;
	color: var(--muted);
}

.sort-spinner {
	color: var(--muted);
	-webkit-animation: fa-spin 2s infinite linear;
	animation: fa-spin 2s infinite linear;
	font-family: 'Font Awesome 6 Pro';
	font-weight: 300;
}

.app-menu-spinner {
	position: absolute;
	top: 100%;
	margin-top: -1px;
	left: 0;
	width: 100vw;
}



.cpf-spinner {
	width: 100%;
	height: 3px;
	background: var(--primary-base);
	overflow: hidden;
	opacity: 0;
	transition: opacity 0.3s ease;
	pointer-events: none;
}

	.cpf-spinner:before {
		height: 100%;
		width: 0;
		position: absolute;
		left: 50%;
		top: 0;
		content: '';
		display: block;
		background: #fff;
		width: 14rem;
		animation: spinner-bar 1s ease-in-out infinite;
	}

	.cpf-spinner.cpf-spinner-shown {
		opacity: 0.6;
	}

.sort-spinner:before {
	content: "\f1ce" !important;
}



.toolbar, .toolbar-section {
	padding-left: .5rem;
	display: flex;
	flex-wrap: wrap;
}

sng-toolbar {
	display: flex;
	flex-wrap: wrap;
	flex: 1 1 auto;
}

.toolbar-toggle {
	margin: 0 .5rem .5rem;
}

.sub-toolbar-toggle {
	display: none;
}

.navbar-nav .toolbar-noitems-message {
	padding: .5rem;
	color: var(--muted-light);
	display: none;
}

.icon-nav {
	padding: 0;
	height: 3rem;
	display: flex;
	margin-left: auto;
	align-items: center;
	padding-right: .5rem;
}

.icon-nav-btn-container {
	display: flex;
	position: relative;
	margin: 0;
	padding: 0 0.25rem;
	align-items: center;
}

	.icon-nav-btn-container:after, .icon-nav-btn-container:before {
		display: block;
		content: '';
		position: absolute;
		top: .5rem;
		bottom: .5rem;
		border-left: 1px solid var(--border-light);
	}

	.icon-nav-btn-container:before {
		left: 0;
	}

	.icon-nav-btn-container:after {
		right: 0;
	}

	.icon-nav-btn-container + .icon-nav-btn-container:before {
		display: none;
	}

	.icon-nav-btn-container .icon-nav-btn {
		margin: 0;
	}

	.icon-nav-btn-container:last-child:after {
		display: none;
	}

.icon-nav-btn {
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 0.5rem 0.75rem 0.475rem;
	border-radius: 1.5rem;
	cursor: pointer;
	transition: background 0.2s ease;
	position: relative;
	color: var(--navy);
	height: 2.75rem;
	margin: 0;
}

	.icon-nav-btn .charm-title {
		position: absolute;
		top: 100%;
		font-weight: 400;
		font-size: 0.875rem;
		padding: .125rem .5rem;
		border-radius: .5rem;
		background: var(--navy);
		border: 1px solid white;
		color: var(--text-contrast);
		white-space: pre;
		margin-top: 1rem;
		pointer-events: none;
		opacity: 0;
		transition: opacity 0.2s ease;
	}

		.icon-nav-btn .charm-title.right {
			right: 0;
		}

.dropdown.open .charm-title {
	opacity: 0 !important;
}

.icon-nav-btn:hover {
	background: rgba(var(--primary-rgb), 0.25);
}

	.icon-nav-btn:hover .charm-title {
		opacity: 1;
	}

.icon-nav-btn, .icon-nav-btn:hover, .icon-nav-btn:focus {
	text-decoration: none;
}

.icon-nav-icon {
	font-size: 1.75rem;
	color: var(--navy);
	float: left;
}

	.icon-nav-icon + .fa-stack-1x {
		top: -2px;
	}

.icon-nav-btn .mobile-app-name {
	color: var(--navy);
	display: inline-block;
	font-size: 1rem;
	padding: 0 0 0 .5rem;
}

.icon-nav-btn > .caret {
	padding: .375rem 0 0 .25rem;
	margin-left: -0.45rem;
	position: absolute;
	bottom: -0.325rem;
	left: 50%;
	opacity: 0.3;
	font-size: 0.6rem;
	font-weight: 600;
}

.icon-nav .dropdown {
	min-width: 0;
	float: left;
}

	.icon-nav .dropdown.open .dd-toggle {
		background: rgba(var(--primary-rgb), 0.25);
	}

	.icon-nav .dropdown.open .caret {
		color: var(--navy);
		font-weight: normal
	}

	.icon-nav .dropdown button:after {
		color: var(--navy);
		padding-left: .125rem;
	}

.icon-item-count {
	background: var(--muted);
	color: var(--text-contrast);
	border-radius: .5rem;
	padding: 0 .25rem;
	font-size: .75rem;
	line-height: .875rem;
	font-weight: bold;
	display: inline-block;
	margin-left: .25rem;
	position: relative;
	min-width: 1.25rem;
	text-align: center;
	position: absolute;
	left: 1.5rem;
	top: .25rem;
}

.btn .icon-item-count {
	background: var(--muted);
	color: var(--text-contrast);
	float: right;
	position: static;
}

.notifications-count.hiddenOnLoad {
	display: none;
}

.charm-title {
	padding-left: .5rem;
}

.charm-shortcuts {
	display: grid;
	grid-auto-flow: column;
	grid-template-rows: 1fr 1fr;
	gap: .125rem;
}

.charm-shortcut {
	font-size: 1.125rem;
	color: var(--navy);
	padding: 0.125rem 0.25rem !important;
	height: 1.25rem;
}

	.charm-shortcut .icon-nav-icon {
		color: var(--navy);
		font-size: 1rem;
		opacity: 70%;
	}

#preference-box {
	padding: .5rem 1rem 1rem;
}

.user-image {
	background: var(--primary-rgb);
	border-radius: 50%;
	float: left;
	padding: .25rem;
	line-height: 1rem;
	color: var(--navy);
	margin-right: 1rem;
}

	.user-image + h2 {
		padding: 0 1rem 0;
		margin: 0;
	}

.user-domain {
	text-overflow: ellipsis;
	white-space: pre;
	overflow: hidden;
	font-size: .875rem;
}

#user-domain-select select {
	font-size: .875rem;
	border: 0;
	-webkit-appearance: none;
	-moz-appearance: none;
	padding: 2px;
	color: var(--text);
	background: var(--modal);
}

.dropvisible > .menu-dropout {
	display: block;
	cursor: default;
}

.navbar-nav {
	border: 0;
	position: relative;
	display: flex;
	flex-wrap: wrap;
	flex-grow: 1;
	flex-direction: row;
	margin: auto 0;
	width: 100%;
	padding: 0.25rem 0.5rem;
}

	.navbar-nav.right {
		display: flex;
		flex-direction: row;
		margin-left: auto;
		flex-grow: 0;
		background: 0;
	}

	.navbar-nav > div {
		display: flex;
		flex-wrap: wrap;
		flex-shrink: 1;
		align-items: center;
		gap: 0.25rem;
	}

		.navbar-nav > div .nav-link {
			margin-right: initial;
		}


	.navbar-nav .nav-link:hover,
	.navbar-nav .nav-item.open > .nav-link {
		background: rgba(var(--primary-rgb), 0.3);
	}



	/* danger nav link button */
	.navbar-nav .nav-link.nav-danger .fa {
		color: var(--danger);
	}

	.navbar-nav .nav-link.nav-danger:not(.disabled):not(:disabled):hover {
		background: var(--danger);
	}

	.navbar-nav .dropdown-menu {
		background: var(--modal);
		border: 0;
		border-top-left-radius: 0;
		border-top-right-radius: 0;
		margin-top: 0;
		padding: 0;
		box-shadow: 0 2px 5px #444;
		box-shadow: 0 2px 5px rgba(0, 0, 0, 0.2);
		border-top: 1px solid var(--modal-hover);
	}

.nav-link.disabled:hover ~ .dropdown-menu,
.nav-link:disabled:hover ~ .dropdown-menu {
	display: none;
}

.open .dropdown-menu {
	display: block;
}

.ribbon-group {
	display: flex;
}

	/* ribbon groups */
	.ribbon-group > ul {
		padding: 0 .25rem;
		margin: 0 .75rem;
		display: flex;
		flex-direction: row;
		list-style: none;
		position: relative;
		gap: 0.25rem;
	}

		.ribbon-group > ul:before,
		.ribbon-group > ul:after {
			height: .75rem;
			width: .125rem;
			content: '';
			display: block;
			position: absolute;
			top: 50%;
			z-index: 1;
			background: rgba(10,10,50, 0.07);
			border-radius: .25rem;
			transform: translateY(-50%);
		}

		.ribbon-group > ul:before {
			left: -0.325rem;
		}

		.ribbon-group > ul:after {
			right: -0.325rem;
		}

	.ribbon-group:first-child ul:before,
	.ribbon-group:last-child ul:after {
		display: none;
	}


	.ribbon-group + .ribbon-group > ul {
		padding-left: 0;
		margin-left: 0;
	}

		.ribbon-group + .ribbon-group > ul:before {
			display: none;
			padding-left: 0;
		}

.dropdown-menu .nav-item {
	display: block;
	float: none;
	background: var(--modal);
	text-align: left;
	width: auto;
	margin: 0;
}

	.dropdown-menu .nav-item .nav-link {
		padding-right: 1.5rem;
		white-space: nowrap;
		width: auto;
		max-width: none;
	}

.navbar-nav .dropdown-menu .nav-item .nav-link .fa,
.navbar-nav .dropdown-menu .nav-item .nav-link .fo {
	color: var(--navy);
}

.navbar-nav .dropdown-menu .nav-item .nav-link:hover .fa,
.navbar-nav .dropdown-menu .nav-item .nav-link:hover .fo {
	color: var(--text-contrast);
}


.dropdown-toggle::after {
	border-width: .25rem;
}

.disabled .fa,
.disabled .fo,
.nav-link.disabled,
.navbar-nav .disabled .fa,
.dropdown-item :disabled,
.dropdown-item a.disabled,
.dropdown-item a.disabled:hover,
.dropdown-item :disabled .fa,
.nav-link:disabled,
.nav-link:disabled .fa {
	color: var(--text-disabled) !important;
	background: 0 !important;
	cursor: not-allowed !important;
	box-shadow: none !important;
}

/* sub toolbar */

/* TODO:ML: Investigate .header-control */
.header-control {
	background: rgba(var(--primary-rgb),0.25);
}

	.header-control:hover {
		background: rgba(var(--primary-rgb),0.35);
	}

	.header-control:active {
		background: rgba(var(--primary-rgb),0.25);
	}

	.header-control:disabled {
		color: var(--muted);
		background: rgba(255,255,255,0.1);
		opacity: .5;
		cursor: not-allowed;
	}


.header-control-btn {
	padding: 0 1rem;
}


/* */

.dropdown-item .label {
	padding-top: .125rem;
	position: relative;
	top: .125rem;
}


/* ------------*/

.panel-has-sidebar {
	width: calc(100% - 21rem);
	float: right;
	position: relative;
	z-index: 1;
}

.lightbox .panel-has-sidebar {
	height: 100%;
}

.sidebar {
	height: 100%;
	position: relative;
	width: 20rem;
	font-size: .875rem;
	padding: 0 0.75rem;
	overflow-y: auto;
	flex-shrink: 0;
}

	.sidebar > h3 {
		margin-left: 1rem;
		margin-right: 1rem;
		margin-top: 0.5rem;
	}

.lightbox .sidebar {
	border-right-color: var(--modal-inner);
}

#secondary-nav ul:not(#mobile-compass), #secondary-nav ul:not(#mobile-compass) li,
.sidebar ul {
	list-style: none;
	margin: 0;
	padding: 0;
}

	#secondary-nav ul:not(#mobile-compass) ul,
	.sidebar ul ul {
		padding-left: 1rem;
	}

	#secondary-nav ul:not(#mobile-compass) li a,
	.sidebar li a {
		padding: .5rem .5rem .5rem 1rem;
	}

	#secondary-nav ul:not(#mobile-compass) li a,
	.sidebar li a,
	.sidebar-item,
	.node > .node-text {
		color: var(--navy);
		display: block;
		width: 100%;
		cursor: pointer;
		border-radius: 1.5rem;
	}

		#secondary-nav ul:not(#mobile-compass) li a:hover,
		.sidebar li a:hover,
		.sidebar-item:hover,
		.node > .node-text:hover {
			background: rgba(var(--primary-rgb), 0.25);
		}

		#secondary-nav ul:not(#mobile-compass) li a.selected,
		#secondary-nav ul:not(#mobile-compass) li a.nested-selected,
		.sidebar li a.selected,
		.sidebar-item.selected,
		.node-text.selected-node,
		.node.selected > .node-text,
		.sidebar li a.active,
		.sidebar-item.active {
			color: var(--navy);
			background: rgba(var(--primary-rgb), 0.5);
		}

			#secondary-nav ul:not(#mobile-compass) li a.selected:hover,
			.sidebar li a.selected:hover,
			.sidebar-item.selected:hover,
			.sidebar li a.active:hover,
			.sidebar-item.active:hover,
			.node:hover {
				cursor: default;
			}

		.sidebar li a.disabled,
		.sidebar-item.disabled,
		.sidebar-item:disabled {
			color: var(--text-disabled) !important;
			background: 0 !important;
			cursor: not-allowed;
		}

.close-nav {
	float: right;
	margin: .25rem;
}

.mobile-nav-header .close-nav {
	display: none;
}

.mobile-nav-header h2 {
	padding: .75rem;
	border-bottom: 1px solid var(--border-light);
}

.node-text:hover {
	cursor: pointer;
}

.node-container, .sidebar ul {
	font-size: .875rem;
	list-style: none;
	margin: 0;
	padding: 0;
}

	.node-container .node-container {
		padding-left: 1rem;
	}

.node {
	position: relative;
}

.node-text {
	height: 2rem;
	line-height: 2rem;
}

.node-text, .sidebar-item {
	color: var(--muted);
	display: block;
	line-height: 1.125rem;
	padding: .5rem .75rem;
	overflow: hidden;
	white-space: nowrap;
	-moz-text-overflow: ellipsis;
	text-overflow: ellipsis;
	text-align: left;
}

.sidebar-item {
	padding-left: 2.25rem;
}

	.node-text:hover, .node-text:focus, .sidebar-item:hover, .sidebar-item:focus {
		background: rgba(var(--primary-rgb), 0.25);
		color: var(--navy);
	}

.node-text.selected {
	border-left: 2px solid var(--primary-base);
	margin-left: -2px;
	color: var(--navy);
	background-color: var(--table-row-hover);
}

.node-icon {
	color: var(--navy);
	margin-right: .5rem;
	font-weight: bold;
}

.selected > .node-text .node-icon {
	color: var(--navy);
}

.node-collapse {
	padding-right: 1rem;
	width: 1.25rem;
}

	.node-collapse.hide-toggle:before {
		content: '' !important;
	}

.node-label-wrapper {
	padding-left: 2.25rem;
}

span.add-link .fa {
	margin-right: .5rem;
}

span.add-link-no-color {
	padding: 0.5rem 0;
	display: block;
}

span.add-link {
	padding: 0.5rem 0;
	display: block;
	color: var(--navy);
}

.search-expandable, #navigation-bar {
	display: none;
}

.navbar-nav a:hover, #secondary-nav li a:hover, #secondary-nav li a:focus {
	text-decoration: none;
}

/* Properties Panels */


.prop-panel-section {
	padding: .75rem;
}


	.prop-panel-section .form-control,
	.prop-panel-section .select-wrapper {
		width: 100%;
		max-width: none;
	}

.prop-panel-control label {
	display: inline-block;
}

.prop-panel-section .input-group [ng-include] .fa-question-circle,
.prop-panel-section .input-group [ng-include] .help-link {
	display: none;
}


/* Breadcrumbs */

.breadcrumb {
	background: 0;
	margin: 0;
	display: block;
}

#compass {
	padding: .75rem 0 0;
	float: left;
}

#mobile-compass {
	padding: 0 .75rem .75rem;
	font-size: 1rem;
}

.breadcrumb li {
	color: var(--muted);
}

.breadcrumb-item + .breadcrumb-item:before {
	content: '\f105';
	font-family: 'Font Awesome 6 Pro', 'icoMoon';
	color: var(--text-disabled);
	line-height: 1rem;
	font-weight: 300;
}

.breadcrumb a {
	color: var(--navy);
}

.breadcrumb-last-item-text {
	display: none;
}

/* Mobile */
.tasks-button {
	position: relative;
	top: .5rem;
}

	.tasks-button.mobile-open {
		background: rgba(var(--primary-rgb), 0.25);
		color: var(--navy);
	}

.tasks-popout .nav-link,
.tasks-popout .dropdown-item a {
	font-size: .9375rem;
}

.tasks-popout .nav-link {
	padding: .5rem .5rem .5rem 2rem;
	white-space: nowrap;
	position: relative;
	width: 100%;
}

.tasks-popout .nav-item:not(:last-child) .nav-link {
	border-bottom: 1px solid var(--border-light);
}

.tasks-popout .fa {
	position: absolute;
	left: .25rem;
	top: .75rem;
}

.tasks-popout {
	padding: 0 .5rem;
}

	.tasks-popout .dropdown-item {
		position: relative;
	}

		.tasks-popout .dropdown-item a {
			padding: .5rem 1rem .5rem 2rem;
		}

	.tasks-popout .dropdown-menu {
		position: absolute;
		top: 0;
		left: 105%;
		padding: 0 .5rem;
		overflow-y: auto;
		overflow-x: hidden;
		white-space: nowrap;
		max-height: 16rem;
		-webkit-overflow-scrolling: touch;
	}

	.tasks-popout .nav-item {
		position: relative;
	}

/* Hidden chrome */

.chrome-hidden .app-menu {
	display: none;
}

.header {
	width: 100%;
}



/* Searches menu in Nav */

.search-item {
	padding: .5rem;
}

	.search-item + .search-item {
		border-top: 1px solid var(--border-light);
	}

.search-item-details {
	flex: 1 1 auto;
}

	.search-item-details div {
		display: inline-block;
	}

.search-item-details, .search-item-buttons, .search-item-icons {
	padding: 0 .25rem;
}

.search-item-buttons,
.search-item-icons {
	flex: 0 0 auto;
	align-items: center;
	display: flex;
	align-self: flex-start;
}

.search-item-icons {
	padding-top: 0.25rem;
}



/** Impersonation */


#imp-switch-usermenu {
	background: 0;
	padding: 0;
	margin: 0;
}

	#imp-switch-usermenu .title {
		font-weight: 500;
		color: var(--navy);
		font-size: 1.125rem;
	}

	#imp-switch-usermenu .form-control-icon {
		display: none;
	}

	#imp-switch-usermenu .fs-selected {
		padding: 0;
	}

#user-domain-select {
	padding-left: 3.5rem;
}

/* Responsive Styles */

/* --- keyframes --- */
@keyframes sidebar-wiggle {
	0% {
		transform: translateX(-19rem);
	}

	25% {
		transform: translateX(-18.25rem);
	}

	50% {
		transform: translateX(-19rem);
	}

	75% {
		transform: translateX(-18.25rem);
	}

	100% {
		transform: translateX(-19rem);
	}
}

@keyframes spinner-bar {
	0% {
		left: -14rem;
		opacity: 0;
	}

	10% {
		opacity: 1;
	}

	90% {
		left: calc(100% + 14rem);
		opacity: 1;
	}

	100% {
		opacity: 0;
	}
}

/* *** Breakpoints *** */
/*@media screen and (max-width: 1023px) {*/
@media screen and (max-width: 991px) {

	#main-nav {
		position: absolute;
		top: 3.75rem;
		left: calc(40%);
		left: -webkit-calc(40%);
		left: -moz-calc(40%);
		transform: translateX(-50%);
		background: white;
		border-radius: 1rem;
		max-width: 90vw;
		min-width: 14rem;
		width: auto;
		box-shadow: 2px 4px 12px rgba(10,10,30,0.2);
		visibility: hidden;
		opacity: 0;
		transition: opacity 0.2s ease;
		max-height: 90vh;
		flex-direction: column;
	}

		#main-nav.toolbar-visible {
			visibility: visible;
			flex-direction: column;
			opacity: 1;
		}

		#main-nav > div {
			flex-direction: column;
			width: 100%;
		}

	.navbar-nav .nav-item {
		flex: 1;
		width: 100%;
		margin: 0.25rem 0;
	}

	.toolbar-toggle {
		margin: 5px;
		align-self: center;
	}

	.toolbar-noitems .toolbar-noitems-message {
		display: block;
	}

	.app-menu-bottom {
		padding: .25rem .5rem !important;
	}

	.app-menu-right {
		max-width: max-content;
	}

	.page-title {
		font-size: 1.25rem;
		line-height: 1.25rem;
		padding-bottom: .25rem;
	}

	.charm-shortcuts {
		display: none !important;
	}


	.sidebar {
		position: fixed;
		top: 3.25rem;
		left: 0;
		bottom: 0;
		background: var(--table-row);
		z-index: 50;
		height: auto;
		padding: 1rem !important;
		box-shadow: 0 2px 12px rgba(10,10,30,0.24);
		left: 0;
		transform: translateX(-19rem);
		width: 20rem;
		transition: transform 0.3s ease-in-out, background 0.2s ease, box-shadow 0.2s ease;
		box-shadow: 0 2px 12px rgba(10,10,30,0.24);
		animation: sidebar-wiggle 0.75s 0.3s ease;
		overflow: hidden;
	}

		.sidebar.sidebar-open {
			transform: translateX(0);
			background: white;
			box-shadow: 0 2px 18px rgba(10,10,30,0.28);
			animation: none;
			overflow-y: auto;
		}

	.panel-has-sidebar {
		width: calc(100% - 2rem);
		left: 1.5rem;
	}

	.sidebar {
		max-width: 20rem;
	}

		.sidebar:after {
			display: block;
			position: absolute;
			content: '\f0da';
			top: 50%;
			transform: translateY(-50%);
			right: .25rem;
			font-size: 0.875rem;
			color: var(--muted);
			font-family: 'Font Awesome 6 Pro';
			font-weight: bold;
			opacity: 1;
			transition: opacity 0.2s ease;
		}

		.sidebar.sidebar-open:after {
			opacity: 0;
		}
}

@media screen and (max-width: 991px) {
	.mobile-nav-header .close-nav {
		display: block;
	}

	.app-logo {
		padding: 0 .5rem;
	}
}

@media screen and (max-width: 799px) {

	#main-nav {
		left: 80%;
		min-width: 12rem;
	}

	.icon-nav-icon + .fa-stack-1x {
		top: 0px;
	}

	.toolbar-toggle {
		margin: 0.625rem 1rem 0.5rem auto;
	}

	#allappsToolbarButton, .icon-nav {
		position: fixed;
		bottom: 0;
		left: 0;
	}

	#allappsToolbarButton {
		z-index: 1;
		border-radius: 0 1rem 0 0;
	}

	.all-apps-toggle-curve {
		bottom: 0;
		top: auto;
		transform: rotate(270deg);
	}

	#main-toolbar {
		flex-direction: column;
	}

	.app-menu-right {
		max-width: max-content;
	}

	.table-count {
		display: none;
	}

	.compass {
		font-size: .75rem;
	}

		.compass li:before {
			font-size: 0.675rem;
			padding: 0;
			margin: 0 0.25rem;
		}

	.icon-nav {
		width: 100%;
		padding: .5rem 1rem;
		padding-left: 1rem;
		display: flex;
		align-items: center;
		justify-content: center;
		padding-left: 4.5rem;
		background: white;
		height: 3.25rem;
		box-shadow: -2px 0 12px rgba(10,10,20,0.2);
		justify-content: space-around;
	}

	.icon-nav-icon {
		font-size: 2rem;
	}

	.icon-nav-btn > .caret {
		bottom: auto;
		top: -0.75rem;
	}

		.icon-nav-btn > .caret:before {
			content: '\f0d8';
		}

	.icon-nav .dropdown .dd-menu {
		position: fixed;
		left: 0 !important;
		right: 0 !important;
		bottom: 3.25rem;
	}

	.sidebar {
		bottom: 3.25rem;
	}
}

@media (max-width: 576px) {

	#main-nav {
		left: 70%;
	}
}


@media screen and (max-width: 480px) {

	.app-menu-right {
		min-width: unset;
		max-width: unset;
	}

		.app-menu-right div div.d-flex {
			flex-flow: row;
			flex-wrap: wrap;
		}

			.app-menu-right div div.d-flex div.d-flex.align-items-center {
				flex: 1 1 auto;
			}

			.app-menu-right div div.d-flex:first-child {
				margin-bottom: 5px;
			}

			.app-menu-right div div.d-flex:nth-child(2) {
				flex-flow: row-reverse;
				justify-content: left;
			}
}

@media (-webkit-min-device-pixel-ratio: 1.25), (min-resolution: 120dpi) {

	.logo-lores {
		display: none;
	}

	.logo-hires {
		display: block;
	}
}


/* Notifications Styles */
#notifications-wrapper {
    position: relative;
    height: 100%;
    display: flex;
}

.preview-wrapper
#detail-view-wrapper {
    height: 100%;
}

#nodes {
    width: 100%;
}

.preview-wrapper {
    width: 32rem;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
}

#preview-list {
    height: 100%;
    overflow: auto;
    padding: 0 0.5rem;
}

#detail-view-wrapper {
    flex: 1;
    height: 100%;
    overflow-y: auto;
}

.preview-item {
    padding: .5rem;
}

    .preview-item p {
        padding-bottom: 10px;
    }

    .preview-item.t-row {
        border-top: 0;
    }

.preview-item-checkbox {
    float: left;
    height: 1.25rem;
}

.preview-item:hover {
    cursor: pointer;
    background: #d0dde8;
}

.preview-item .preview-unread-indicator {
    display: none;
    font-size: 0.5625rem;
    position: relative;
    bottom: 0.125rem;
    margin-right: 0.25rem;
}

.preview-item-info {
    padding: .5rem;
    padding-left: 1rem;
    position: relative;
}


.preview-options {
    position: absolute;
    top: 0;
    left: 0;
    padding: .6125rem .5rem 0;
}

.preview-item.preview-item-selected .preview-options {
    border-color: rgba(var(--primary-rgb), 0.25);
}

.preview-date-created {
    float: right;
    color: var(--muted);
}

.preview-item.has-read-false {
    font-weight: bold;
}

.preview-top .fa {
    margin-right: .5rem;
    color: sandybrown;
}

#notification-icon {
    margin-right: .5rem;
    color: sandybrown;
}

.selected-preview-item {
    background: rgba(var(--primary-rgb), 0.2);
}

.preview-item-info:before {
    width: 3px;
    height: auto;
    content: '';
    display: block;
    background: rgb(91, 200, 217);
    position: absolute;
    top: 0.5rem;
    left: -0.25rem;
    bottom: 0.5rem;
    border-radius: 1rem;
    opacity: 0;
    transition: opacity 0.2s ease;
}


.selected-preview-item .preview-item-info:before {
    opacity: 1;
}

.preview-wrapper .sort-seperator {
    padding: 0.75rem 0.5rem;
    text-transform: uppercase;
    font-size: 0.75rem;
    text-align: center;
    font-weight: bold;
    color: var(--muted);
}

#sort-filter {
    padding: 0 0.5rem 0.5rem;
}

#notification-preview #filter-by-search {
    border: 1px solid var(--box-border);
}

#hide-details-view {
    position: absolute;
    top: 0.5rem;
    left: 0.5rem;
}

.subjects-wrapper {
    clear: both;
    background: var(--box);
    border: 1px solid var(--box-border);
    padding: .5rem 0;
    border-radius: .125rem;
}

.subject-value {
    hyphens: auto;
    overflow-wrap: break-word;
    word-break: break-word;
    word-wrap: break-word;
}


.attachments-wrapper a {
    border: 1px solid var(--box-border);
    padding: .25rem .5rem;
    display: inline-block;
}

    .attachments-wrapper a:hover {
        text-decoration: none;
        border-color: rgba(var(--primary-rgb), 0.25);
    }

    .attachments-wrapper a > div {
        display: inline-block;
    }

#load-more-preview-items, #loading-more-preview-items {
    text-align: center;
    font-size: .875rem;
    padding: 1rem;
}

#notification-banner {
    padding: 0.385rem 0.875rem;
    color: var(--text-contrast);
    margin-top: 1rem;
}

    #notification-banner.escalated {
        background: var(--danger);
    }

    #notification-banner.delegated {
        background: var(--warning-secure);
    }

#detail-view .header {
    background: 0;
    padding: 0;
    box-shadow: none;
    position: static;
}

#detail-view {
    padding: 2rem;
}

.sub-heading span {
    font-size: inherit;
    padding-right: .5rem;
}

.attachments-wrapper {
    margin-bottom: .5rem;
    padding: .5rem;
}

.notification-attachment {
    margin: .2rem;
    border-radius: .5rem;
    padding: 0.5rem;
    border: 1px solid #d0dde8;
    display: inline-block;
    width: 15rem;
    float: left;
}

.attachment-type {
    text-transform: uppercase;
    font-weight: bold;
    font-size: 85%;
}

.notification-attachment span.fa, .notification-attachment span.attachment-type {
    color: var(--muted);
}

.notification-attachment span.attachment-name {
    color: var(--navy);
}

.notification-body {
    background-color: white;
    padding: 1rem;
}

.notification-dyno-view .dyno-view-body {
    overflow: visible;
    background: 0;
    padding: 1rem 0 0;
}

@media screen and (max-width: 1339px) {
    .preview-wrapper {
        width: 26rem;
    }

    #detail-view-wrapper {
        width: calc(100% - 26rem);
    }
}

.notification-title {
    border: 0;
    color: var(--navy);
    font-size: 1.75rem;
}


/* platform help related style */
/*
    ===================================
    components
    ===================================
*/
/* inline help directive */

sng-local-help-item,
[sng-local-help-item] {
    display: inline-block;
    white-space: nowrap;
}

sng-local-help-item a,
sng-local-help-item button,
[sng-local-help-item] a,
[sng-local-help-item] button {
    display: inline-block;
    position: relative;
    z-index: 1;
    top: auto;
    float: none;
    vertical-align: middle;
    text-align: center;
    border-radius: 50%;
    line-height: 1;
    border: none;
}

sng-local-help-item a:focus,
sng-local-help-item button:focus,
[sng-local-help-item] a:focus,
[sng-local-help-item] button:focus {
    border: none;
    box-shadow: none;
}

sng-local-help-item .help-icon,
sng-local-help-item .help-icon,
[sng-local-help-item] .help-icon,
[sng-local-help-item] .help-icon {
    z-index: 1;
    top: auto;
    float: none;
    margin-left: auto;
    font-size: 1.25rem;
}

sng-local-help-item .help-icon:before,
sng-local-help-item .help-icon:before,
[sng-local-help-item] .help-icon:before,
[sng-local-help-item] .help-icon:before {
    content: '\f29c';
    color: var(--accent);
}




/* custom rules for sngFullscreen controls */
.lightbox-title .sng-fullscreen-btn:hover {
	color: var(--navy);
	background: rgba(var(--primary-rgb), 0.35);
}

.lightbox-title .sng-fullscreen-btn {
	position: absolute;
	top: .875rem;
	right: calc(1.25rem + 2 * .875rem);
	font-size: 1.25rem;
	cursor: pointer;
	z-index: 101;
	color: var(--text-contrast);
	border-radius: 1rem;
}

.lightbox-title .sng-fullscreen-btn:focus {
    outline: 0;
    -webkit-box-shadow: 0 0 0 3px rgba(var(--primary-rgb), .5);
    box-shadow: 0 0 0 3px rgba(var(--primary-rgb), .5);
    color: var(--accent);
}

.lightbox-title .sng-fullscreen-btn.lightbox-close {
	color: var(--navy);
}



/* Load indicator classes */

.load-indicator {
    padding: 5%;
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
    min-height: 5rem;
}

    .load-indicator.full {
        position: absolute;
        top: 0;
        left: 0;
        right: 0;
        bottom: 0;
        background: var(--box);
        height: auto;
        z-index: 10;
    }

    .load-indicator.data-grid {
        position: absolute;
        top: 0;
        left: 0;
        right: 0;
        bottom: 0;
        background: var(--box);
        height: auto;
        z-index: 5;
        padding: 0%;
        width: 100%;
    }

.load-indicator:not(.load-error) > div,
.load-indicator:not(.load-error) > div:before,
.load-indicator:not(.load-error) > div:after {
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
    -webkit-animation: load-ind 1.5s infinite ease-in-out;
    animation: load-ind 1.5s infinite ease-in-out;
    background: var(--text);
    height: 2rem;
    width: 0.5rem;
    border-radius: 0.25rem;
}

.load-indicator > div {
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
    position: absolute;
    left: 50%;
    top: 40%;
    margin-top: -1rem;
    opacity: 0.25;
}

.load-indicator-light:not(.load-error) > div,
.load-indicator-light:not(.load-error) > div:before,
.load-indicator-light:not(.load-error) > div:after {
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
    -webkit-animation: load-ind-light 1.5s infinite ease-in-out;
    animation: load-ind-light 1.5s infinite ease-in-out;
    background: var(--text-contrast);
}

.load-indicator-mini {
    min-height: 1.5rem;
    padding: 0.5rem;
    position: relative;
    text-align: center;
}

.load-indicator-mini > div {
    margin-top: -0.125rem;
    display: inline-block;
    position: relative;
}

.load-indicator-mini > div,
.load-indicator-mini > div:before,
.load-indicator-mini > div:after {
    -webkit-animation: load-ind-m 1s infinite ease-in-out;
    animation: load-ind-m 1s infinite ease-in-out;
    background: var(--text-disabled);
    height: 0.5rem;
    width: 0.5rem;
    border-radius: 0.5rem;
}

.load-indicator:not(.load-error) > div,
.load-indicator-mini > div {
    -webkit-animation-delay: -0.2s;
    animation-delay: -0.2s;
    margin-left: -0.25rem;
}

.load-indicator.load-error > div {
    width: 5rem;
    text-align: center;
    font-size: 3rem;
    margin-left: -2.5rem;
    margin-top: -3rem;
    color: var(--text-disabled);
}

.load-indicator.load-error > div:before {
    content: "\f071";
    font-family: "FontAwesome";
    display: inline-block;
}

.load-indicator:not(.load-error) > div:before,
.load-indicator:not(.load-error) > div:after,
.load-indicator-mini > div:after,
.load-indicator-mini > div:before {
    content: "";
    position: absolute;
    top: 0;
}

.load-indicator:not(.load-error) > div:before,
.load-indicator-mini > div:before {
    animation-delay: -0.4s;
    left: -1.25rem;
    -webkit-animation-delay: -0.4s;
}

.load-indicator-mini > div:after,
.load-indicator > div:after {
    left: 1.25rem;
}

#page > .load-indicator > div {
    top: 15rem;
}

.load-indicator .load-text {
    display: block;
    font-size: 1.5rem;
    color: var(--text-disabled);
    text-align: center;
    margin-top: 2rem;
}

.progress-indicator {
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    background: var(--table-row);
    padding: 2rem;
    z-index: 6;
    -webkit-transition: opacity 0.4s 0.2s ease;
    transition: opacity 0.4s 0.2s ease;
    opacity: 1;
}

.progress-indicator.ng-hide-remove {
    opacity: 1;
    display: block !important;
}

.progress-indicator.ng-hide {
    opacity: 0;
}

@-webkit-keyframes load-ind {
    0%,
    90%,
    100% {
        -webkit-box-shadow: 0 0 var(--text);
        box-shadow: 0 0 var(--text);
        height: 1.5rem;
    }

    45% {
        -webkit-box-shadow: 0 -0.75rem var(--text);
        box-shadow: 0 -0.75rem var(--text);
        height: 2rem;
    }
}

@keyframes load-ind {
    0%,
    90%,
    100% {
        -webkit-box-shadow: 0 0 var(--text);
        box-shadow: 0 0 var(--text);
        height: 1.5rem;
    }

    45% {
        -webkit-box-shadow: 0 -0.75rem var(--text);
        box-shadow: 0 -0.75rem var(--text);
        height: 2rem;
    }
}

@-webkit-keyframes load-ind-light {
    0%,
    90%,
    100% {
        -webkit-box-shadow: 0 0 var(--text-contrast);
        box-shadow: 0 0 var(--text-contrast);
        height: 1.5rem;
    }

    45% {
        -webkit-box-shadow: 0 -0.75rem var(--text-contrast);
        box-shadow: 0 -0.75rem var(--text-contrast);
        height: 2rem;
    }
}

@keyframes load-ind-light {
    0%,
    90%,
    100% {
        -webkit-box-shadow: 0 0 var(--text-contrast);
        box-shadow: 0 0 var(--text-contrast);
        height: 1.5rem;
    }

    45% {
        -webkit-box-shadow: 0 -0.75rem var(--text-contrast);
        box-shadow: 0 -0.75rem var(--text-contrast);
        height: 2rem;
    }
}

@-webkit-keyframes load-ind-m {
    0%,
    100%,
    90% {
        background: rgba(var(--navy-rgb), 0.08);
    }

    45% {
        background: rgba(var(--navy-rgb), 0.25);
    }
}

@keyframes load-ind-m {
    0%,
    100%,
    90% {
        background: rgba(var(--navy-rgb), 0.08);
    }

    45% {
        background: rgba(var(--navy-rgb), 0.25);
    }
}

/* Search progress indicator */

@-webkit-keyframes search {
    0% {
        top: 0rem;
        left: 0.125rem;
    }

    20% {
        top: 0rem;
        left: 2.5rem;
    }

    33% {
        top: 0rem;
        left: 2.5rem;
    }

    53% {
        top: 1.75rem;
        left: 1.25rem;
    }

    66% {
        top: 1.75rem;
        left: 1.25rem;
    }

    87%,
    100% {
        top: 0;
        left: 0.125rem;
    }
}

@keyframes search {
    0% {
        top: 0rem;
        left: 0.125rem;
    }

    20% {
        top: 0rem;
        left: 2.5rem;
    }

    33% {
        top: 0rem;
        left: 2.5rem;
    }

    53% {
        top: 1.75rem;
        left: 1.25rem;
    }

    66% {
        top: 1.75rem;
        left: 1.25rem;
    }

    87%,
    100% {
        top: 0;
        left: 0.125rem;
    }
}

.search-anim {
    position: relative;
    display: block;
    width: 5rem;
    margin: 0 auto;
}

.search-anim:before,
.search-anim:after {
    font-family: "FontAwesome";
    color: var(--border-strong);
    display: block;
    content: "";
}

.search-anim:before {
    font-size: 4rem;
    line-height: 5.75rem;
    opacity: 0.3;
    content: "\f1c0";
}

.search-anim:after {
    position: absolute;
    top: 0.5rem;
    left: 1rem;
    -webkit-animation: search 4s infinite;
    animation: search 4s infinite;
    content: "\f002";
    font-size: 3rem;
}

/* Alert boxes */

.alert-box {
    padding: 1rem;
    background: rgba(var(--primary-rgb), 0.15);
    color: var(--navy);
    border-radius: 1rem;
    margin-bottom: 1rem;
    display: flex;
    flex-direction: row;
    align-items: center
}

.alert-box:last-child {
    margin-bottom: 0;
}

.alert-box .alert-icon {
    font-size: 1.5rem;
    margin-right: 1rem;
    -webkit-box-flex: 0;
    -ms-flex-positive: 0;
    flex-grow: 0;
    -ms-flex-negative: 0;
    flex-shrink: 0;
    line-height: 1.5rem;
}

.alert-box .alert-icon:before {
    content: "\f05a";
    font-family: "FontAwesome";
}

    .alert-box.accent {
        background: rgba(var(--primary-rgb), 0.15);
        color: var(--navy);
    }

.alert-box.info .alert-icon:before {
    content: "\f05a";
}

.alert-box.warning {
    background: var(--warning-rgb-faded);
    color: var(--warning-dark);
}

.alert-box.warning .alert-icon:before {
    content: "\f06a";
}

.alert-box.success {
    background: var(--success-rgb-faded);
    color: var(--success-dark);
}

.alert-box.success .alert-icon:before {
    content: "\f058";
}

.alert-box.danger {
    background: var(--danger-rgb-faded);
    border-color: rgba(var(--danger-rgb), 0.2);
    color: var(--danger-dark);
}

.alert-box.danger .alert-icon:before {
    content: "\f071";
}

    .alert-box.info {
        background: var(--primary-rgb-faded);
        color: var(--navy);
    }

.alert-box.info .alert-icon:before {
    content: "\f05a";
}

.alert-box-sm {
    padding: 0.5rem;
}

.alert-box-sm .alert-icon {
    font-size: 1rem;
    line-height: 1rem;
}

.alert-box code {
    background: rgba(0, 0, 0, 0.05);
}

/* Flexbox stuff */
.flex-grow {
    -webkit-box-flex: 1;
    -ms-flex-positive: 1;
    flex-grow: 1;
}

.flex-nogrow {
    -webkit-box-flex: 0;
    -ms-flex-positive: 0;
    flex-grow: 0;
}

.flex-shrink {
    -ms-flex-negative: 1;
    flex-shrink: 1;
}

.flex-noshrink {
    -ms-flex-negative: 0;
    flex-shrink: 0;
}
/* separators */

.separator-left:before,
.separator-right:after {
    display: block;
    position: absolute;
    top: 0.5rem;
    bottom: 0.5rem;
    content: "";
}

.separator-left:before {
    left: 0;
    border-left: 1px dotted var(--border-strong);
}

.separator-right:after {
    right: 0;
    border-right: 1px dotted var(--border-strong);
}

/* vertical and horizontal rules. vr is best used within a flexbox model
*/

.vr {
    padding: 0.5rem 0.25rem;
}

.vr:after {
    display: block;
    content: "";
    height: 100%;
    border-left: 1px dotted var(--border-strong);
}

fieldset.hr-text {
    border-top: 2px dotted var(--border-strong);
    padding-left: 0;
}

fieldset.hr-text legend {
    font-size: 0.875rem;
    margin: 0;
    width: auto;
    text-align: left;
    color: var(--muted);
    padding: 0 0.5rem;
    font-weight: 700;
}

/* Transitions */

.height-transition-start {
    -webkit-transition: max-height 1s ease;
    transition: max-height 1s ease;
    overflow: hidden;
}

/* Alignment */

.align {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
}

.align.align-left {
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    justify-content: flex-start;
}

.align.align-center {
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
}

.align.align-right {
    -webkit-box-pack: end;
    -ms-flex-pack: end;
    justify-content: flex-end;
}

.align > div {
    max-width: 100%;
    -webkit-box-flex: 0;
    -ms-flex: 0 1 auto;
    flex: 0 1 auto;
}

/* font awesome */
.fa-xl {
    font-size: 1.5em;
}


/*
    Padding and Margin Classes
    Format ({p/m}-{a/x/y/t/r/b/l}-{05/1/2/3})
    Where p or m is padding or margin
    a - all, x/y - x or y axis only, t/r/b/l - top right bottom left only
*/
.pt-05, .p-05, .py-05 {
    padding-top: .5rem !important;
}

.pb-05, .p-05, .py-05 {
    padding-bottom: .5rem !important;
}

.pl-05, .p-05, .px-05 {
    padding-left: .5rem !important;
}

.pr-05, .p-05, .px-05 {
    padding-right: .5rem !important;
}

.mt-05, .ma-05, .m-y-05 {
    margin-top: .5rem !important;
}

.mb-05, .ma-05, .m-y-05 {
    margin-bottom: .5rem !important;
}

.ml-05, .ma-05, .m-x-05 {
    margin-left: .5rem !important;
}

.mr-05, .ma-05, .m-x-05 {
    margin-right: .5rem !important;
}

/* Font size utility classes */
.f-s-0 {
    font-size: .875rem !important;
}

.f-s-1 {
    font-size: 1rem !important;
}

.f-s-2 {
    font-size: 1.5rem !important;
}

.f-s-3 {
    font-size: 2rem !important;
}

.b-r {
    -webkit-border-radius: .25rem;
    -moz-border-radius: .25rem;
    border-radius: .25rem;
}

.full-height {
    height: 100%;
}

.h-100 {
    height: 100%;
}

.w-100 {
    width: 100%;
}

.inline {
    display: inline;
}

.inline-block {
    display: inline-block;
}

.label-light {
    background: var(--box-border);
    color: var(--muted);
}

    .label-light.label-hover:hover {
        background: rgba(var(--primary-rgb), 0.25);
        cursor: pointer;
        color: var(--navy);
    }

.text-primary {
    color: var(--text); !important;
}

.text-accent {
    color: var(--navy) !important;
}

.text-muted {
    color: var(--muted) !important;
}

.text-danger {
    color: var(--danger) !important;
}

.text-success {
    color: var(--success) !important;
}

.text-warning {
    color: var(--warning-secure) !important;
}

.text-contrast {
    color: var(--text-contrast) !important;
}

.text-secondary {
    color: var(--navy) !important;
}
/* Backgrounds */

.bg-success {
    background-color: var(--success-secure) !important;
}

.bg-warning {
    background-color: var(--warning-secure) !important;
}

.bg-danger {
    background-color: var(--danger) !important;
}

.bg-accent {
    background-color: var(--primary-base) !important;
}

.bg-secondary {
    background-color: var(--navy) !important;
}

.bg-muted {
    background-color: var(--muted) !important;
}

.bg-transparent {
    background-color: transparent !important;
}

.bg-faded, /* deprecated */
.bg-light {
    background-color: rgba(10,12,20,0.06) !important;
}

.bg-success-tr {
    background-color: rgba(var(--success-rgb), 0.15) !important;
}

.bg-warning-tr {
    background-color: rgba(var(--warning-rgb), 0.15) !important;
}

.bg-danger-tr {
    background-color: rgba(var(--danger-rgb), 0.15) !important;
}

.bg-accent-tr {
    background-color: rgba(var(--accent-rgb) / 0.15) !important;
}

.bg-secondary-tr {
    background-color: rgba(var(--navy-rgb), 0.15) !important;
}

.bg-muted-tr {
    background-color: rgba(var(--muted-rgb), 0.15) !important;
}

/* Text coloring */

.text-success {
    color: var(--success) !important;
}

.text-warning {
    color: var(--warning-secure) !important;
}

.text-danger {
    color: var(--danger) !important;
}

.info,
.text-info,
.text-accent {
    color: var(--navy) !important;
}

.text-secondary {
    color: var(--navy) !important;
}

.text-muted {
    color: var(--muted) !important;
}

.text-disabled {
    color: var(--border-strong) !important;
}

/* Font size classes */

.fs-1 {
    font-size: 0.875rem !important;
}

.fs-2 {
    font-size: 1rem !important;
}

.fs-3 {
    font-size: 1.125rem !important;
}

.fs-4 {
    font-size: 1.25rem !important;
}

.fs-5 {
    font-size: 1.375rem !important;
}

.lh-0 {
    line-height: 0.75rem !important;
}

.lh-1 {
    line-height: 0.875rem !important;
}

/* Other font utilities */

.word-wrap {
    word-wrap: break-word;
    white-space: normal;
    height: auto;
}


.label-accent {
    background: var(--primary-base);
}

.label-muted {
    background: var(--muted);
}

.label-secondary {
    background: var(--navy);
}

.label-muted {
    background: var(--muted);
}

.label-danger {
    background: var(--danger);
}

.label-warning {
    background: var(--warning-secure);
}

.label-success {
    background: var(--success);
}


.ng-link:hover {
    cursor: pointer;
    text-decoration: underline;
}

.d-inline {
    display: inline !important;
}

.d-inline-block {
    display: inline-block !important;
}

.d-block {
    display: block !important;
}

.d-table {
    display: table !important;
}

/* Utilities / Miscellaneous */

.label-hover {
    background: rgba(var(--primary-rgb), 0.25);
    color: var(--navy);
}

    .label-hover:hover {
        background: rgba(var(--primary-rgb), 0.35);
        cursor: pointer;
    }

.overflow-visible {
    overflow: visible !important;
}

/* VideoJS Default Styles */
.vjs-default-skin{color:#ccc}@font-face{font-family:'VideoJS';src:url(../images/vjs.eot?v=2511.708.22.0);src:url(../images/vjs.eot?v=2511.708.22.0#iefix) format("embedded-opentype"),url(../images/vjs.woff?v=2511.708.22.0) format("woff"),url(../images/vjs.ttf?v=2511.708.22.0) format("truetype"),url(../images/vjs.svg?v=2511.708.22.0#icomoon) format("svg");font-weight:400;font-style:normal}.vjs-default-skin .vjs-slider{outline:0;position:relative;cursor:pointer;padding:0;background-color:#333;background-color:rgba(51,51,51,0.9)}.vjs-default-skin .vjs-slider:focus{-webkit-box-shadow:0 0 2em #fff;-moz-box-shadow:0 0 2em #fff;box-shadow:0 0 2em #fff}.vjs-default-skin .vjs-slider-handle{position:absolute;left:0;top:0}.vjs-default-skin .vjs-slider-handle:before{content:"\e009";text-align:center;text-shadow:0 0 1em #fff;position:absolute;top:0;left:0;-webkit-transform:rotate(-45deg);-moz-transform:rotate(-45deg);-ms-transform:rotate(-45deg);-o-transform:rotate(-45deg);transform:rotate(-45deg);font:1em/1 VideoJS}.vjs-default-skin .vjs-control-bar{display:none;position:absolute;bottom:0;left:0;right:0;height:3em;background-color:#07141e;background-color:rgba(7,20,30,0.7)}.vjs-default-skin.vjs-has-started .vjs-control-bar{display:block;visibility:visible;opacity:1;-webkit-transition:visibility 0.1s,opacity .1s;-moz-transition:visibility 0.1s,opacity .1s;-o-transition:visibility 0.1s,opacity .1s;transition:visibility 0.1s,opacity .1s}.vjs-default-skin.vjs-has-started.vjs-user-inactive.vjs-playing .vjs-control-bar{display:block;visibility:hidden;opacity:0;-webkit-transition:visibility 1s,opacity 1s;-moz-transition:visibility 1s,opacity 1s;-o-transition:visibility 1s,opacity 1s;transition:visibility 1s,opacity 1s}.vjs-default-skin.vjs-controls-disabled .vjs-control-bar{display:none}.vjs-default-skin.vjs-using-native-controls .vjs-control-bar{display:none}.vjs-default-skin.vjs-error .vjs-control-bar{display:none}.vjs-audio.vjs-default-skin.vjs-has-started.vjs-user-inactive.vjs-playing .vjs-control-bar{opacity:1;visibility:visible}@media \0screen{.vjs-default-skin.vjs-user-inactive.vjs-playing .vjs-control-bar :before{content:""}}.vjs-default-skin .vjs-control{outline:none;position:relative;float:left;text-align:center;margin:0;padding:0;height:3em;width:4em}.vjs-default-skin .vjs-control:before{position:absolute;top:0;left:0;width:100%;height:100%;text-align:center;text-shadow:1px 1px 1px rgba(0,0,0,0.5);font:1.5em/2 VideoJS}.vjs-default-skin .vjs-control:focus:before,.vjs-default-skin .vjs-control:hover:before{text-shadow:0 0 1em #fff}.vjs-default-skin .vjs-control-text{border:0;clip:rect(0 0 0 0);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;width:1px}.vjs-default-skin .vjs-play-control{width:5em;cursor:pointer}.vjs-default-skin .vjs-play-control:before{content:"\e001"}.vjs-default-skin.vjs-playing .vjs-play-control:before{content:"\e002"}.vjs-default-skin .vjs-playback-rate .vjs-playback-rate-value{font-size:1.5em;line-height:2;position:absolute;top:0;left:0;width:100%;height:100%;text-align:center;text-shadow:1px 1px 1px rgba(0,0,0,0.5)}.vjs-default-skin .vjs-playback-rate.vjs-menu-button .vjs-menu .vjs-menu-content{width:4em;left:-2em;list-style:none}.vjs-default-skin .vjs-mute-control,.vjs-default-skin .vjs-volume-menu-button{cursor:pointer;float:right}.vjs-default-skin .vjs-mute-control:before,.vjs-default-skin .vjs-volume-menu-button:before{content:"\e006"}.vjs-default-skin .vjs-mute-control.vjs-vol-0:before,.vjs-default-skin .vjs-volume-menu-button.vjs-vol-0:before{content:"\e003"}.vjs-default-skin .vjs-mute-control.vjs-vol-1:before,.vjs-default-skin .vjs-volume-menu-button.vjs-vol-1:before{content:"\e004"}.vjs-default-skin .vjs-mute-control.vjs-vol-2:before,.vjs-default-skin .vjs-volume-menu-button.vjs-vol-2:before{content:"\e005"}.vjs-default-skin .vjs-volume-control{width:5em;float:right}.vjs-default-skin .vjs-volume-bar{width:5em;height:.6em;margin:1.1em auto 0}.vjs-default-skin .vjs-volume-level{position:absolute;top:0;left:0;height:.5em;width:100%;background:#66a8cc url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAYAAAAGCAYAAADgzO9IAAAAP0lEQVQIHWWMAQoAIAgDR/QJ/Ub//04+w7ZICBwcOg5FZi5iBB82AGzixEglJrd4TVK5XUJpskSTEvpdFzX9AB2pGziSQcvAAAAAAElFTkSuQmCC) -50% 0 repeat}.vjs-default-skin .vjs-volume-bar .vjs-volume-handle{width:.5em;height:.5em;left:4.5em}.vjs-default-skin .vjs-volume-handle:before{font-size:.9em;top:-.2em;left:-.2em;width:1em;height:1em}.vjs-default-skin .vjs-volume-menu-button .vjs-menu{display:block;width:0;height:0;border-top-color:transparent}.vjs-default-skin .vjs-volume-menu-button .vjs-menu .vjs-menu-content{height:0;width:0}.vjs-default-skin .vjs-volume-menu-button:hover .vjs-menu,.vjs-default-skin .vjs-volume-menu-button .vjs-menu.vjs-lock-showing{border-top-color:rgba(7,40,50,0.5)}.vjs-default-skin .vjs-volume-menu-button:hover .vjs-menu .vjs-menu-content,.vjs-default-skin .vjs-volume-menu-button .vjs-menu.vjs-lock-showing .vjs-menu-content{height:2.9em;width:10em}.vjs-default-skin .vjs-progress-control{position:absolute;left:0;right:0;width:auto;font-size:.3em;height:1em;top:-1em;-webkit-transition:all .4s;-moz-transition:all .4s;-o-transition:all .4s;transition:all .4s}.vjs-default-skin:hover .vjs-progress-control{font-size:.9em;-webkit-transition:all .2s;-moz-transition:all .2s;-o-transition:all .2s;transition:all .2s}.vjs-default-skin .vjs-progress-holder{height:100%}.vjs-default-skin .vjs-progress-holder .vjs-play-progress,.vjs-default-skin .vjs-progress-holder .vjs-load-progress,.vjs-default-skin .vjs-progress-holder .vjs-load-progress div{position:absolute;display:block;height:100%;margin:0;padding:0;width:0;left:0;top:0}.vjs-default-skin .vjs-play-progress{background:#66a8cc url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAYAAAAGCAYAAADgzO9IAAAAP0lEQVQIHWWMAQoAIAgDR/QJ/Ub//04+w7ZICBwcOg5FZi5iBB82AGzixEglJrd4TVK5XUJpskSTEvpdFzX9AB2pGziSQcvAAAAAAElFTkSuQmCC) -50% 0 repeat}.vjs-default-skin .vjs-load-progress{background:#646464;background:rgba(255,255,255,0.2)}.vjs-default-skin .vjs-load-progress div{background:#787878;background:rgba(255,255,255,0.1)}.vjs-default-skin .vjs-seek-handle{width:1.5em;height:100%}.vjs-default-skin .vjs-seek-handle:before{padding-top:.1em}.vjs-default-skin.vjs-live .vjs-time-controls,.vjs-default-skin.vjs-live .vjs-time-divider,.vjs-default-skin.vjs-live .vjs-progress-control{display:none}.vjs-default-skin.vjs-live .vjs-live-display{display:block}.vjs-default-skin .vjs-live-display{display:none;font-size:1em;line-height:3em}.vjs-default-skin .vjs-time-controls{font-size:1em;line-height:3em}.vjs-default-skin .vjs-current-time{float:left}.vjs-default-skin .vjs-duration{float:left}.vjs-default-skin .vjs-remaining-time{display:none;float:left}.vjs-time-divider{float:left;line-height:3em}.vjs-default-skin .vjs-fullscreen-control{width:3.8em;cursor:pointer;float:right}.vjs-default-skin .vjs-fullscreen-control:before{content:"\e000"}.vjs-default-skin.vjs-fullscreen .vjs-fullscreen-control:before{content:"\e00b"}.vjs-default-skin .vjs-big-play-button{left:.5em;top:.5em;font-size:3em;display:block;z-index:2;position:absolute;width:4em;height:2.6em;text-align:center;vertical-align:middle;cursor:pointer;opacity:1;background-color:#07141e;background-color:rgba(7,20,30,0.7);border:.1em solid #3b4249;-webkit-border-radius:.8em;-moz-border-radius:.8em;border-radius:.8em;-webkit-box-shadow:0 0 1em rgba(255,255,255,0.25);-moz-box-shadow:0 0 1em rgba(255,255,255,0.25);box-shadow:0 0 1em rgba(255,255,255,0.25);-webkit-transition:all .4s;-moz-transition:all .4s;-o-transition:all .4s;transition:all .4s}.vjs-default-skin.vjs-big-play-centered .vjs-big-play-button{left:50%;margin-left:-2.1em;top:50%;margin-top:-1.4em}.vjs-default-skin.vjs-controls-disabled .vjs-big-play-button{display:none}.vjs-default-skin.vjs-has-started .vjs-big-play-button{display:none}.vjs-default-skin.vjs-using-native-controls .vjs-big-play-button{display:none}.vjs-default-skin:hover .vjs-big-play-button,.vjs-default-skin .vjs-big-play-button:focus{outline:0;border-color:#fff;background-color:#505050;background-color:rgba(50,50,50,0.75);-webkit-box-shadow:0 0 3em #fff;-moz-box-shadow:0 0 3em #fff;box-shadow:0 0 3em #fff;-webkit-transition:all 0;-moz-transition:all 0;-o-transition:all 0;transition:all 0}.vjs-default-skin .vjs-big-play-button:before{content:"\e001";font-family:VideoJS;line-height:2.6em;text-shadow:.05em .05em .1em #000;text-align:center;position:absolute;left:0;width:100%;height:100%}.vjs-error .vjs-big-play-button{display:none}.vjs-error-display{display:none}.vjs-error .vjs-error-display{display:block;position:absolute;left:0;top:0;width:100%;height:100%}.vjs-error .vjs-error-display:before{content:'X';color:#666;text-shadow:.05em .05em .1em #000;text-align:center;vertical-align:middle;position:absolute;left:0;top:50%;margin-top:-.5em;width:100%;font:4em/1 Arial}.vjs-error-display div{position:absolute;bottom:1em;right:0;left:0;font-size:1.4em;text-align:center;padding:3px;background:#000;background:rgba(0,0,0,0.5)}.vjs-error-display a,.vjs-error-display a:visited{color:#F4A460}.vjs-loading-spinner{display:none;position:absolute;top:50%;left:50%;font-size:4em;line-height:1;width:1em;height:1em;margin-left:-.5em;margin-top:-.5em;opacity:.75}.vjs-waiting .vjs-loading-spinner,.vjs-seeking .vjs-loading-spinner{display:block;-webkit-animation:spin 1.5s infinite linear;-moz-animation:spin 1.5s infinite linear;-o-animation:spin 1.5s infinite linear;animation:spin 1.5s infinite linear}.vjs-error .vjs-loading-spinner{display:none;-webkit-animation:none;-moz-animation:none;-o-animation:none;animation:none}.vjs-default-skin .vjs-loading-spinner:before{content:"\e01e";font-family:VideoJS;position:absolute;top:0;left:0;width:1em;height:1em;text-align:center;text-shadow:0 0 .1em #000}@-moz-keyframes spin{0%{-moz-transform:rotate(0deg)}100%{-moz-transform:rotate(359deg)}}@-webkit-keyframes spin{0%{-webkit-transform:rotate(0deg)}100%{-webkit-transform:rotate(359deg)}}@-o-keyframes spin{0%{-o-transform:rotate(0deg)}100%{-o-transform:rotate(359deg)}}@keyframes spin{0%{transform:rotate(0deg)}100%{transform:rotate(359deg)}}.vjs-default-skin .vjs-menu-button{float:right;cursor:pointer}.vjs-default-skin .vjs-menu{display:none;position:absolute;bottom:0;left:0;width:0;height:0;margin-bottom:3em;border-left:2em solid transparent;border-right:2em solid transparent;border-top:1.55em solid #000;border-top-color:rgba(7,40,50,0.5)}.vjs-default-skin .vjs-menu-button .vjs-menu .vjs-menu-content{display:block;padding:0;margin:0;position:absolute;width:10em;bottom:1.5em;max-height:15em;overflow:auto;left:-5em;background-color:#07141e;background-color:rgba(7,20,30,0.7);-webkit-box-shadow:-.2em -.2em .3em rgba(255,255,255,0.2);-moz-box-shadow:-.2em -.2em .3em rgba(255,255,255,0.2);box-shadow:-.2em -.2em .3em rgba(255,255,255,0.2)}.vjs-default-skin .vjs-menu-button:hover .vjs-control-content .vjs-menu,.vjs-default-skin .vjs-control-content .vjs-menu.vjs-lock-showing{display:block}.vjs-default-skin .vjs-menu-button ul li{list-style:none;margin:0;padding:.3em 0;line-height:1.4em;font-size:1.2em;text-align:center;text-transform:lowercase}.vjs-default-skin .vjs-menu-button ul li.vjs-selected{background-color:#000}.vjs-default-skin .vjs-menu-button ul li:focus,.vjs-default-skin .vjs-menu-button ul li:hover,.vjs-default-skin .vjs-menu-button ul li.vjs-selected:focus,.vjs-default-skin .vjs-menu-button ul li.vjs-selected:hover{outline:0;color:#111;background-color:#fff;background-color:rgba(255,255,255,0.75);-webkit-box-shadow:0 0 1em #fff;-moz-box-shadow:0 0 1em #fff;box-shadow:0 0 1em #fff}.vjs-default-skin .vjs-menu-button ul li.vjs-menu-title{text-align:center;text-transform:uppercase;font-size:1em;line-height:2em;padding:0;margin:0 0 .3em;font-weight:700;cursor:default}.vjs-default-skin .vjs-subtitles-button:before{content:"\e00c"}.vjs-default-skin .vjs-captions-button:before{content:"\e008"}.vjs-default-skin .vjs-chapters-button:before{content:"\e00c"}.vjs-default-skin .vjs-chapters-button.vjs-menu-button .vjs-menu .vjs-menu-content{width:24em;left:-12em}.vjs-default-skin .vjs-captions-button:focus .vjs-control-content:before,.vjs-default-skin .vjs-captions-button:hover .vjs-control-content:before{-webkit-box-shadow:0 0 1em #fff;-moz-box-shadow:0 0 1em #fff;box-shadow:0 0 1em #fff}.video-js{background-color:#000;position:relative;padding:0;vertical-align:middle;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;font:400 10px Arial,sans-serif}.video-js .vjs-tech{position:absolute;top:0;left:0;width:100%;height:100%}.video-js:-moz-full-screen{position:absolute}body.vjs-full-window{padding:0;margin:0;height:100%;overflow-y:auto}.video-js.vjs-fullscreen{position:fixed;overflow:hidden;z-index:1000;left:0;top:0;bottom:0;right:0;width:100%!important;height:100%!important;_position:absolute}.video-js:-webkit-full-screen{width:100%!important;height:100%!important}.video-js.vjs-fullscreen.vjs-user-inactive{cursor:none}.vjs-poster{background-repeat:no-repeat;background-position:50% 50%;background-size:contain;cursor:pointer;margin:0;padding:0;position:absolute;top:0;right:0;bottom:0;left:0}.vjs-poster img{display:block;margin:0 auto;max-height:100%;padding:0;width:100%}.video-js.vjs-has-started .vjs-poster{display:none}.video-js.vjs-audio.vjs-has-started .vjs-poster{display:block}.video-js.vjs-controls-disabled .vjs-poster{display:none}.video-js.vjs-using-native-controls .vjs-poster{display:none}.video-js .vjs-text-track-display{text-align:center;position:absolute;bottom:4em;left:1em;right:1em}.video-js.vjs-user-inactive.vjs-playing .vjs-text-track-display{bottom:1em}.video-js .vjs-text-track{display:none;font-size:1.4em;text-align:center;margin-bottom:.1em;background-color:#000;background-color:rgba(0,0,0,0.5)}.video-js .vjs-subtitles{color:#fff}.video-js .vjs-captions{color:#fc6}.vjs-tt-cue{display:block}.video-js.vjs-fullscreen .vjs-text-track{font-size:3em}.vjs-default-skin .vjs-hidden{display:none}.vjs-lock-showing{display:block!important;opacity:1;visibility:visible}.vjs-no-js{padding:20px;color:#ccc;background-color:#333;text-align:center;width:300px;height:150px;margin:0 auto;font:18px Arial,sans-serif}.vjs-no-js a,.vjs-no-js a:visited{color:#F4A460}.videoWrapper{position:relative;padding-bottom:41%;padding-top:0;height:0;z-index:2}video{position:absolute!important;top:0;left:0;width:100%!important;height:100%!important;z-index:0}video.video-js{z-index:1000}.video-js .vjs-controls{z-index:1002}.video-js .vjs-big-play-button{z-index:1002}.videoWrapper .video-js{position:absolute;top:0;left:0;width:100%!important;height:100%!important;z-index:1;background:#000}.videoWrapper object,.videoWrapper embed{position:absolute;top:0;left:0;width:100%;height:100%!important;z-index:1}.vjs-spinner{display:none!important}.video-js img.vjs-poster{height:100%!important;width:100%!important;z-index:1;max-width:100%}

/*
    Zugo tables & grid views, Apps panel
*/

#search-toolbox-top {
    width: 40%;
    float: right;
}

.search-results-outer .header {
    margin: 0;
    height: 4rem;
}

.search-results-outer,
.results-container:not(table),
#results-container,
.scroll-search-container,
div[sng-zugo-delayed-request],
div[sng-zugo-triggered-request] {
    height: 100%;
}

#page > .results-container,
#page > #results,
#page > #results-container,
#page > div[sng-zugo] {
    height: 100%;
    min-height: 0;
}

#page > .search-results-outer {
    padding: 0 1rem .5rem;
}

.results-container {
    margin-bottom: 0;
}

.search-bar .input-group {
    float: right;
    width: calc(100% - 10rem);
}

.results-count-message:empty ~ .search-bar .input-group {
    width: 100%;
}

.search-bar .input-group .input-group-addon {
    background: transparent;
    color: var(--text-disabled);
    border-color: var(--text-disabled);
    cursor: pointer;
}

.search-filter {
    flex-wrap: nowrap;
}

    .search-filter .form-control {
        flex-shrink: 1;
    }

    .search-filter .input-group-addon {
        flex-shrink: 0;
        line-height: 2rem;
    }

    .search-filter .input-group .btn {
        margin: 0;
    }

.search-filter-container .factboard-zugo {
    display: none;
}

.factboard-select .search-filter-container .factboard-zugo {
    display: inline-block;
}

.search-filter-container .factboard-zugo {
    line-height: 0;
}

.search-filter-container button {
    margin-left: 0.75rem;
}

#cancel-search-button {
    z-index: 4;
    color: var(--muted);
}

.results-count-message {
    width: 10rem;
    text-align: right;
    line-height: 2.4rem;
    font-size: 0.875rem;
    padding-right: 0.75rem;
    color: var(--muted);
    float: left;
}

.search-results {
    height: 100%;
    overflow-y: auto;
    position: relative;
    width: 100%;
}

.zugo-item {
    position: relative;
}

.panel-item {
    float: left;
}

.apps-panel {
    padding-top: 1rem;
    background: var(--box);
    display: grid;
    flex-grow: 0;
    max-height: 100%;
    flex: 1 1 auto;
}

.lightbox .apps-panel {
    background: var(--modal);
}

.panel.results-panel.apps-panel {
	display: flex;
	flex: 0 1 auto;
	flex-wrap: wrap;
}

.panel.results-panel.apps-panel > * {
    justify-content: left;
    align-items: flex-start;
    padding: 10px;
}

.panel.results-panel.apps-panel.section {
    margin-bottom: 0;
}

.flex-container > .panel.results-panel.apps-panel {
    height: auto;
}

.apps-panel > div {
	height: 13rem;
	display: flex;
	align-content: center;
	justify-content: center;
	min-width: 0;
}

.apps-panel-item {
    overflow: hidden;
    position: relative;
}

    .apps-panel-item:hover {
        overflow: visible;
    }

.apps-panel-box {
    position: absolute;
    padding: 0.75rem;
    text-align: center;
    text-decoration: none;
    width: 13rem;
    border-radius: 2rem;
    cursor: pointer;
    position: relative;
    word-break: normal;
    display: block;
    background: 0;
    box-shadow: none;
    transition: background 0.2s ease, box-shadow 0.2s ease;
    z-index: 1;
    display: flex;
    flex-direction: column;
    align-items: center;
}

    .apps-panel-box.box {
        border: 0;
        background: 0;
    }

    .apps-panel-box.disabled {
        cursor: default;
    }

a.apps-panel-box {
    text-decoration: none;
}

.apps-panel-box:hover {
    background: var(--card-background);
    box-shadow: 0 4px 12px rgba(10, 20, 50, 0.15);
    z-index: 5;
}

.apps-panel-box:after {
    border-radius: 2rem;
}

.apps-panel-box.disabled:hover {
    background: 0;
    box-shadow: none;
}

.apps-panel-box.disabled .app-name {
    color: #7d92ad;
}

.apps-panel-box.disabled .app-description {
    display: none;
}

a.apps-panel-box:focus {
    box-shadow: none;
}

    a.apps-panel-box:focus:after {
        width: 100%;
        height: 11rem;
        border-radius: 2rem;
        position: absolute;
        top: 0;
        left: 0;
        border: solid 0.125rem rgba(var(--primary-rgb), 0.2);
        transition: border 0.2s ease;
        content: "";
    }

    a.apps-panel-box:focus:hover:after {
        height: 100%;
    }

.app-icon {
    padding: 0.875rem 0.75rem 0.75rem;
    position: relative;
    height: 6.5rem;
    width: 8rem;
    background: var(--app-icon);
    color: var(--navy);
    border-radius: 2rem;
    margin: 0 1.25rem 0.5rem;
    box-shadow: 2px 4px 10px rgba(29,62,111,0.1);
}

    .app-icon.app-icon-platform {
        background: linear-gradient(0deg, #140b3c 0%, #2c1c6a 100%);
        color: white;
    }

        .app-icon.app-icon-platform.disabled {
            background: 0;
            border: 1px solid var(--box-border);
        }

.app-icon-platform .disabled {
    cursor: not-allowed;
}

.app-icon .fa,
.app-icon .fo {
    font-size: 3.875rem;
}

.app-icon .sub-icon {
    font-size: 1.5rem;
    position: absolute;
    bottom: 1rem;
    right: 1.25rem;
    background: var(--navy);
    padding: 0.25rem 0.125rem;
    border-radius: 0.75rem;
    color: var(--app-icon-sub-icon);
    box-sizing: content-box;
    width: 1.28571429em;
}

.app-icon.app-folder-icon {
    width: 10rem;
    margin-top: 0.25rem;
    height: 6.25rem;
    padding-top: 0.75rem;
}

    .app-icon.app-folder-icon,
    .app-icon.app-folder-icon::after {
        border-radius: 0 1rem 1rem 1rem;
        background: rgba(var(--primary-rgb), 0.3);
        box-shadow: none;
        color: var(--navy);
    }

        .app-icon.app-folder-icon::after {
            content: "";
            display: block;
            width: 5rem;
            height: 0.75rem;
            position: absolute;
            top: -0.75rem;
            left: 0;
            border-radius: 0.675rem 0.675rem 0 0;
            border-bottom: 0;
        }

.apps-panel-box .button-icon {
    padding: 0;
    height: 4rem;
    font-size: 3.75rem;
    line-height: 3.75rem;
    display: inline-block;
    width: 5.5rem;
    position: relative;
    text-align: center;
    border-radius: 0.5rem;
    margin: 0.5rem;
    font-weight: 300;
}

.app-folder .button-icon:after {
    content: "";
    display: block;
    position: absolute;
    width: 2rem;
    height: 0.5rem;
    top: -0.25rem;
    left: 0.25rem;
}

.button-icon .sub-icon {
    bottom: 0;
    right: 0;
}

.app-name,
.app-description {
	line-height: 1.125rem;
	font-size: 0.8125rem;
	display: block;
	max-width: 150px;
}
.panel.results-panel.apps-panel .panel-item.zugo-item.no-checkbox.apps-panel-item .app-name,
.panel.results-panel.apps-panel .panel-item.zugo-item.no-checkbox.apps-panel-item .app-description {
	max-width: 150px;
}

.app-name {
	padding: 0.25rem;
	font-size: 1.25rem;
	letter-spacing: -0.03rem;
	color: var(--text);
}

.app-description {
    color: var(--muted);
    opacity: 0;
    transition: opacity 0.2s ease;
}

.app-icon:not(.app-folder-icon) {
    margin: 0 1.5rem 0.5rem;
}

.apps-panel-box:hover .app-description {
    opacity: 1;
}

.panel .no-results {
    display: inline-block;
    padding: 2rem;
}

.compass.compass-apps {
    height: 2rem;
    font-size: 1.125rem;
}
/* #13455 */
.panel-item.zugo-item + .no-results {
    display: none;
}

.search-results-wrapper .loading-bar-container {
    text-align: center;
    padding: 10px;
}

.fa.sort-icon-asc,
.fa.sort-icon-desc {
    line-height: 1rem;
    float: right;
    padding: 0.25rem 0.5rem;
}

.fa.sort-icon-asc {
    display: none;
}

.fa.sort-icon-desc {
    display: none;
}

.sort.asc .fa.sort-icon-asc {
    display: inline-block;
}

.sort.desc .fa.sort-icon-desc {
    display: inline-block;
}

.dyno-control-wrapper .search-results-wrapper {
    height: 300px;
}

.dyno-control-wrapper .search-loader {
    position: absolute;
    left: 0;
    right: 0;
    width: auto;
}

.search-results-wrapper {
    min-height: 3rem;
    top: 4.5rem;
}

.results-page-tabular-js {
    height: 100%;
    overflow-y: auto;
}

.page-content .search-results-wrapper,
.dyno-view .search-results-wrapper {
    position: relative;
    top: 0;
    min-height: 22rem;
}

.dyno-view-body .search-results-wrapper {
    min-height: 8rem;
}

.fixed-table-header,
.sng-fixed-table-header {
    position: relative;
    top: 0;
    left: 0;
    z-index: 3;
    width: 100%;
    overflow-x: hidden;
    table-layout: fixed;
}

    .fixed-table-header thead {
        position: fixed;
    }

.sng-fixed-table-header,
.table.sng-fixed-table-header {
    display: none;
}

#search-loader {
    position: fixed;
    bottom: 0;
    width: 100%;
    padding: 1.5rem;
    background: var(--nav);
    min-height: 5.5rem;
}

    #search-loader .section-controls {
        padding: 0;
    }

    #search-loader .buttons {
        position: absolute;
        top: 1.5rem;
        right: 1.5rem;
    }

/* stack */

.stack-select-all-wrapper,
.stack-item {
    padding: 0.5rem 1rem;
    cursor: pointer;
}

.stack-item {
}

    .stack-item.to-remove,
    .stack-item.to-add {
        border-left-width: 0.1875rem;
        border-left-style: solid;
        padding-left: 0.3125rem;
    }

    .stack-item.to-remove {
        border-left-color: var(--danger);
        color: var(--text-disabled);
    }

    .stack-item.to-add {
        border-left-color: var(--success);
    }

    .stack-item:not(.no-results):hover {
        background-color: rgba(var(--primary-rgb), 0.15);
    }

.stack-item-title,
.stack-item-content {
    white-space: normal;
    word-break: break-all;
    word-break: break-word;
    word-wrap: break-word;
}

.stack-item-title {
    color: var(--navy);
}

.stack-item-content {
    font-size: 0.875rem;
    color: var(--muted);
}

.stack-item .select-wrapper select {
    padding: 0.125rem;
    height: 2rem;
}

.stack-item .select-wrapper,
.stack-item .form-control {
    height: 2rem;
}

.stack-select-all-wrapper {
    margin-bottom: 0;
}

.stack-select-all {
    margin-right: 0.75rem;
}

.stack-item-checkbox {
    float: left;
    padding-right: 0.5rem;
}

.stack-item .disabled {
    color: var(--muted);
}

/*.stack-item .item-selection-column {
    padding: 1.25rem .75rem .5rem 0;
    float: left;
    height: 35px;
}*/

/*.stack-row-select {
    position: relative;
    top: -0.625rem;
}*/

/*.stack-item .content {
    display: block;
}*/

.stackview-content {
    font-size: 0.875rem;
    color: var(--muted);
}

.stackview-title {
    display: block;
}

.stackview-additional {
    float: right;
    font-size: 0.875rem;
    color: var(--muted);
}

.stackview-title .stackview-child {
    margin-left: 0.5rem;
}

.stack-item.zugo-item:after {
    clear: both;
    content: "";
    display: block;
}

.stackview-icon {
    padding: 0 5px 0 0;
}

.item-selection-column label {
    margin: 0;
    line-height: 1rem;
}
/* Apps */

.loading-indication {
    padding: 3.75rem 0 0;
    text-align: center;
    width: 100%;
    color: var(--text-disabled);
}

    .loading-indication img {
        width: 2.6875rem;
        height: 0.6875rem;
        display: inline-block;
    }

/* APPS MENU */
#apps {
    display: none;
    padding: 0.75rem;
}

#apps-search-container .panel {
    padding: calc(1% + 1rem) 5%;
}

#apps-search-container .search-container {
    height: 100%;
}

/* Preview Mode */

#preview-outer {
    position: fixed;
    left: 0;
    right: 0;
    bottom: 0;
    display: none;
    background-color: var(--modal);
    border-top: 1px solid var(--border-light);
    overflow: hidden;
    height: 50%;
}

    #preview-outer .title {
        padding: 0.5rem;
        text-transform: uppercase;
        font-size: 0.875rem;
        border-bottom: 1px solid var(--border-light);
        height: 2.5rem;
    }

        #preview-outer .title span {
            color: var(--text);
        }

            #preview-outer .title span:not(.fa) {
                font-weight: bold;
            }

        #preview-outer .title .close {
            position: absolute;
            cursor: pointer;
            font-size: 1rem;
            top: 0.5rem;
            right: 0.5rem;
            text-shadow: none;
            color: var(--text);
            opacity: 1;
        }

    #preview-outer #preview-spinner {
        padding: 0.5rem;
        font-size: 0.875rem;
        color: var(--muted);
        text-align: center;
    }

    #preview-outer iframe {
        display: none;
        width: 100%;
        height: 100%;
        border: 0;
        padding-bottom: 2.5rem;
    }

.search-results.split-view {
    overflow-y: scroll;
    margin-right: 0;
}

.no-results {
    padding: 0.5rem 1rem;
    font-size: 0.875rem;
}

/* Custom Case Number */

.ccn-label {
    padding: 0.25rem 0.5rem;
    border: 1px solid var(--modal-border);
    background: var(--box-border);
    font-size: 0.875rem;
    font-weight: bold;
    border-radius: 0.25rem;
    -moz-border-radius: 0.25rem;
    -webkit-border-radius: 0.25rem;
    margin: 0 0.5rem;
}

    .ccn-label:hover,
    .ccn-label.selected {
        border-color: rgba(var(--primary-rgb), 0.25);
    }

    .ccn-label.selected {
        background: var(--box);
    }

    .ccn-label.empty {
        padding: 0.25rem 2rem;
        border-style: dashed;
    }

.ccn-add {
    color: var(--muted);
}

    .ccn-add:hover {
        cursor: pointer;
        color: var(--navy);
    }

.ccn-type {
    display: block;
    padding: 0.5rem 0.25rem;
    float: left;
}

    .ccn-type .ccn-label {
        margin: 0;
    }

.ccn-pad {
    padding-bottom: 1rem;
}

#addNewRow {
    color: var(--navy);
    cursor: pointer;
}

.myTdInput {
    color: var(--text);
}

/* Zugo Angular styles */

	.zugo-header:not(#data-grid-header) {
		width: 100%;
		position: relative;
		z-index: 1;
		display: -ms-flexbox;
		display: flex;
		-ms-flex-wrap: nowrap;
		flex-wrap: nowrap;
	}

.zugo-hide-title {
    visibility: hidden;
}

.zugo-result-count-message {
    font-size: 0.875rem;
    color: var(--muted);
    text-align: right;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.filter-by-search .fa-remove,
.cancel-search {
    padding: 0.5rem;
    margin-left: -1.5rem;
    color: var(--muted);
    cursor: pointer;
}

    .filter-by-search .fa-remove:hover,
    .cancel-search:hover {
        color: var(--navy);
    }

table.table.table-fixed-header {
    margin-bottom: 0;
}
/* track */

#track-lite-close {
    position: absolute;
    top: 0.625rem;
    right: 0.625rem;
}

.track-loader {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: var(--modal);
    text-align: center;
    height: 100%;
    padding: 0;
}

#track-lite .table th,
#track-lite .table td {
    padding: 0.5rem;
}

#track-lite .table {
    margin-bottom: 0;
    border: 0;
}

#track-lite tr:last-child,
#track-lite tr:last-child td {
    border-bottom: 0;
}

#track-lite h3 {
    padding: 0.5rem;
}

.track-close {
    position: absolute;
    top: 0.625rem;
    right: 0.625rem;
    cursor: pointer;
    padding: .125rem .375rem;
    border-radius: 1rem;
    background: rgba(var(--primary-rgb), 0.25);
    transition: background 0.2s ease;
    color: var(--navy);
    cursor: pointer;
}

    .track-close:hover {
        background: rgba(var(--primary-rgb), 0.35);
    }

.track-icon {
    font-size: 1.125rem;
    color: var(--navy);
}

.pop-track-button,
.track-icon {
    font: normal normal normal 14px/1 FontAwesome;
}

.pop-track-wrapper {
    position: absolute;
    z-index: 3;
    top: 10%;
    left: 10%;
    width: 80%;
    height: 60%;
    border: 1px solid #777;
    background: var(--modal);
}

.pop-track-container {
    position: relative;
    width: 100%;
    height: 100%;
}

.pop-track-header {
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    height: 35px;
}

    .pop-track-header h3 {
        padding: 0.5rem;
    }

.pop-track-content {
    position: absolute;
    left: 0;
    right: 0;
    top: 36px;
    bottom: 0;
}

    .pop-track-content iframe,
    .zugo-pop-track-content iframe {
        height: 100%;
        width: 100%;
        border-top: 1px solid #777;
        border-bottom: 0;
        border-left: 0;
        border-right: 0;
        background: #ffffff;
    }

.sng-pop-track-column {
    text-align: center;
}

.pop-track-button {
    padding: 0.37rem 0.5rem;
    width: 1.28571429em;
    text-align: center;
    border-radius: 0.25rem;
    display: inline-block;
    box-sizing: content-box;
    color: var(--navy);
    cursor: pointer;
}

    .pop-track-button:hover {
        background: rgba(var(--accent-rgb) / 0.15);
    }

.zugo-tracks-wrapper {
    position: fixed;
    width: 300px;
    background: var(--modal);
    z-index: 60;
    border-radius: 1rem;
    box-shadow: 0.15rem 0.5rem 1rem 0px rgb(10 10 30 / 15%);
    padding-bottom: 0.2rem;
}

    .zugo-tracks-wrapper h3 {
        padding: 0.5rem;
        color: var(--navy);
        border-bottom: 0;
        margin-bottom: 0;
    }

.zugo-track-row {
    cursor: pointer;
    background: 0;
}

.sng-pop-track-column {
    width: 50px;
}

.zugo-pop-tracks-wrapper {
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    height: 50%;
    background: var(--modal);
}

    .zugo-pop-tracks-wrapper:after {
        display: block;
        clear: both;
        content: "";
    }

.zugo-results-split-top {
    height: 40%;
}

.zugo-pop-track-wrapper {
    position: relative;
    height: 100%;
    border: 1px solid var(--modal-border);
    float: left;
}

.zugo-pop-track-content {
    position: absolute;
    left: 0;
    right: 0;
    top: 36px;
    bottom: 0;
    overflow-y: hidden;
}

.zugo-pop-track-container {
    position: relative;
    height: 100%;
}

.zugo-track-icon {
    color: var(--muted);
    margin-right: 0.5rem;
}

.sng-results-container table.grid.table {
    margin-bottom: 0;
}

.simple-grid-input {
    position: relative;
    padding-right: 8.5rem;
}

    .simple-grid-input .form-control {
        max-width: none;
    }

    .simple-grid-input button {
        position: absolute;
        top: 0;
        right: 0;
        width: 8rem;
    }

.filteredselect-full-page .filtered-select {
    height: 100%;
}

.filteredselect-full-page {
    height: calc(100vh - 10rem);
}

    .filteredselect-full-page .section {
        height: 100%;
    }

    .filteredselect-full-page .section-content {
        height: calc(100% - 3rem);
    }

    .filteredselect-full-page .search-results-wrapper {
        min-height: 0;
    }

    .filteredselect-full-page .search-results {
        position: relative;
    }

    .filteredselect-full-page .sngfilter-existing {
        max-height: none;
        margin: 0;
        margin-top: -1px;
        height: calc(100% - 4rem);
    }

    .filteredselect-full-page .sngfilter {
        margin-bottom: 0.75rem;
    }

    .filteredselect-full-page .search-results-outer {
        height: 100%;
    }
/*
.filteredselect-full-page {
    height: calc(100vh - 5rem);
}

#user-groups-grid,
#user-location-groups-grid {
    height: 100%;
}

.filteredselect-full-page .section {
    height: 100%;
}

.filteredselect-full-page .section-content {
    height: calc(100% - 2rem);
}

.filteredselect-full-page .sngfilter-existing {
    height: 100%;
}
    */

/* new search container styles */

.search-container {
    position: relative;
    height: 100%;
}

    .search-container.has-search-header {
        height: calc(100% - 4.5rem);
        background: var(--box);
        border-radius: 1rem;
        box-shadow: 0 0.25rem 0.5rem rgba(10, 15, 40, 0.12);
        padding: .5rem;
    }

.zugobodywithtotals {
    /*padding-bottom: 41.5px;*/
}

@media (max-width: 576px) {
    .zugobodywithtotals {
        padding-bottom: 0;
    }
}

@media (min-width: 800px) {
	.zugo-total-mobile.custom-d-md-none {
		display: none !important;
	}
	.custom-d-md-block {
		display: block !important;
	}
}

#zugoTotalRowTbl.table{
	height: 3rem;
	margin-right: 30px;
}

/* change to small size */
@media (max-width: 800px) {

	.panel.results-panel.apps-panel > *{
		padding: 0px;
	}
}

/* Reduce all app icons to fit in cols*/
@media (max-width: 432px) {

	.apps-panel-box {
		width: 10rem;
	}
}

@media (max-width: 591px) {

	div#allAppsPanel {
		justify-content: center;
		justify-content: space-evenly;
	}
/*		div#allAppsPanel::after {
			content: "";
			flex: auto;
		}*/
}

.zugo-total-container {
	position: relative;
	display: block;
	height: 3rem;
	flex-shrink: 0;
	padding: 0 0.5rem;
	/*overflow: hidden;*/
	margin: 2px 0px;
	background: #fff;
}

#zugoTotalRowTbl tr th:hover{
	background-color:none;
}

.zugo-total {
	overflow: hidden;
}

    .zugo-total thead{
        background: 0;
    }

    .zugo-total-mobile {
        padding: 8px;
        padding-bottom: 3.5rem;
    }

.zugo-total-mobile-span {
    color: var(--table-footer-color);
    width: 9rem;
    font-size: 14px;
}

.hiddenTotal {
    color: var(--muted);
}

.data-grid-container {
    height: 100%;
    display: flex;
    flex-direction: column;
}

.search-container,
div[sng-zugo],
.zugo-container,
.zugo-body {
    height: 100%;
	flex: 1 1 auto;
}

.zugo-container {
    display: flex;
    flex-direction: column;
    padding: .5rem 1.5rem 1rem;
}

.zugo-body-container {
	padding: .5rem;
	flex: 1 1 auto;
	/*z-index: -1;*/
}

.zugo-container-size {
    min-height: 0;
}

.zugo-header ~ .zugo-body {
    flex-grow: 1;
    overflow-y: auto;
    position: relative;
    overflow-x: hidden;
}

/*
    Stacking required for fixed header feature in zugo grids:
    - body
        |- container within body for tables
           | - table with fixed header
    Some apps are overriding these stacking
    via cascade e.g. files app, so this has increased specificity
*/
div[sng-zugo] .zugo-body {
    position: relative;
}

div[sng-zugo] .fixed-table-container {
    height: 100%;
    position: static;
}

div[sng-zugo] .sng-fixed-table-header {
    position: absolute;
    z-index: 1;
}

div.zugo-body.zugobodywithtotals.zugobodywithdata .fixed-table-container.sng-results-container {
	display: flex;
	flex-flow: wrap;
	align-content: flex-start;
}

	div.zugo-body.zugobodywithtotals.zugobodywithdata .fixed-table-container.sng-results-container table.grid.table.scrollbar-check {
		flex: 1 1 100%;
	}

.fixed-table-container table {
	margin: 0;
}

.fixed-table-head,
.fixed-table-body,
.fixed-table-head thead,
.fixed-table-body tbody {
	width: 100%;
}

.fixed-table-head {
    height: 2.5rem;
}

    .fixed-table-head thead th {
        position: relative;
    }

.fixed-table-body {
    height: calc(100% - 2.5rem);
    overflow-y: auto;
}

.search-container > .fixed-table-head {
    position: absolute;
    top: 0;
    width: auto;
}

.search-container > .fixed-table-head-no-controls {
    position: absolute;
    top: 0;
    width: auto;
}

.sng-results-container {
    height: 100%;
    overflow-y: auto;
}

.zugo-header h1 {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.zugo-title {
    flex-basis: 50%;
}

.zugo-title,
.zugo-header .search-filter-container {
    flex: 1 1 auto;
    padding: .5rem .75rem;
}

.zugo-container .zugo-title,
.zugo-container .zugo-header .search-filter-container {
    padding: 0 0 0.5rem;
}

.zugo-header .search-filter-container {
    align-items: center;
    justify-content: right;
    display: flex;
    max-width: 40rem;
}

	.zugo-header .search-filter-container .search-filter input[type=search] {
		text-indent: 8px;
	}

.zugo-title h1 {
    margin: 0;
    padding: 0 0 0.25rem;
    font-size: 1.25rem;
    color: var(--navy);
}

.zugo-description {
    color: var(--muted);
}

.zugo-body th .sort-icon,
.dyno-table-body th .sort-icon {
    margin-left: 0.5rem;
    line-height: 1.5rem;
    color: var(--navy);
    opacity: 0;
    font-size: 0.875rem;
    font-weight: bold;
}


.zugo-body th:hover .sort-icon,
.dyno-table-body th:hover .sort-icon,
.zugo-body th.sort-column .sort-icon,
.dyno-table-body th.sort-column .sort-icon {
    opacity: 0.6;
}

.page-header-searchbox .zugo-container > .zugo-header {
    position: fixed;
    top: 4rem;
    width: 50%;
    right: 0;
    background: 0;
    box-shadow: none;
    z-index: 50;
}

    .page-header-searchbox .zugo-container > .zugo-header .zugo-title {
        display: none;
    }



/**
    sng-zugo-tracks component
    Lists smart tracks links as actual links with <a> tags
*/
sng-zugo-tracks {
    display: block;
}

sng-zugo-tracks a {
    display: flex;
    align-items: center;
    border-radius: 1rem;
    padding: .375rem .75rem;
    transition: background 0.2s ease;
    color: var(--navy);
}

sng-zugo-tracks a:focus,
sng-zugo-tracks a:hover {
    box-shadow: none;
    outline: none;
    text-decoration: none;
    cursor: pointer;
}

.zugo-track-row button {
    display: flex;
    align-items: center;
    border-radius: 1rem;
    padding: .375rem .75rem;
    transition: background 0.2s ease;
    color: var(--navy);
}

.zugo-track-row button:focus,
.zugo-track-row button:hover {
    box-shadow: none;
    outline: none;
    text-decoration: none;
    cursor: pointer;
}

sng-zugo-tracks button {
	display: flex;
	align-items: center;
	border-radius: 1rem;
	padding: .375rem .75rem;
	transition: background 0.2s ease;
	color: #1D3E6F;
}

sng-zugo-tracks button:focus,
sng-zugo-tracks button:hover {
	box-shadow: none;
	outline: none;
	text-decoration: none;
	cursor: pointer;
}

.zugo-track-row button {
	display: flex;
	align-items: center;
	border-radius: 1rem;
	padding: .375rem .75rem;
	transition: background 0.2s ease;
	color: #1D3E6F;
}

.zugo-track-row button:focus,
.zugo-track-row button:hover {
	box-shadow: none;
	outline: none;
	text-decoration: none;
	cursor: pointer;
}

.zugo-row-factboard-selected {
    background-color: rgba(var(--primary-rgb), 0.125);
}

    .zugo-row-factboard-selected > td {
        background-color: rgba(var(--primary-rgb), 0.125) !important;
    }

.zugo-search-description {
    display: inline-block;
    color: var(--muted);
    vertical-align: middle;
    font-size: small;
    margin-left: 0.5rem;
    font-weight: bold;
}

.zugo-title-wrapper {
    padding-bottom: 0.25rem;
    display: flex;
    align-items: center;
}

.variable-help-text {
    color: var(--success);
}

.total-box {
	border-bottom: none !important;
	text-align: right;
	padding-right: 0.75rem !important;
}

.zugo-total th:last-child {
	left: -0.5rem;
}

/*
	Generic print styles across the application
*/
@media print {
	body {
		-webkit-hyphens: auto;
		-moz-hyphens: auto;
		-ms-hyphens: auto;
		hyphens: auto;
		/* Ensure the colors are rendered as they appear on the screen */
		-webkit-print-color-adjust: exact !important;
		print-color-adjust: exact !important;
	}

	body,
	#scroll-content,
	.app-container {
		overflow: visible !important;
		height: auto !important;
	}

	body, #scroll-content, #page, #main-toolbar {
		background: #ebf1f7;
	}

	.flex-container,
	#page,
	.flex-body,
	.app-container {
		overflow: visible;
		height: auto;
		width: auto !important;
	}

	.app-menu-top {
		box-shadow: none;
	}

	#riddon-button-wrapper {
		flex-wrap: wrap !important;
	}

	#main-nav {
		flex-wrap: nowrap !important;
	}

	#riddon-button-wrapper > .nav-item > .nav-link, #data-policy-icon {
		font-size: 0.75rem;
		padding: 0.5rem;
		min-height: 1rem;
	}

	a:link {
		text-decoration: none;
	}

	#data-policy-icon {
		min-width: 45px;
	}

	/* prevents blank page at the end of the print */
	.dyno-row:last-child {
		page-break-after: auto
	}

	.d-lg-none {
        display: none !important;
    }

	.search-chart {
		height: max-content !important;
	}

	.highcharts-container, .highcharts-root {
		width: 100% !important;
	}

	.ng-lightbox-container,
	.lightbox-container {
		page-break-inside: avoid;
		position: absolute;
		bottom: auto;
		margin: auto;
		height: 100vh;
	}

	.dyno-row, .grid-section, .grid-section > .col, .dyno-control-wrapper, .section, .section-content {
		min-height: max-content !important;
	}

	.section, .section-content {
		overflow-y: auto !important;
	}
}