/* Minification failed. Returning unminified contents.
(5,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(6,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(185,28): run-time error CSS1039: Token not allowed after unary operator: '-light-grey-tint'
(196,29): run-time error CSS1039: Token not allowed after unary operator: '-primary'
(200,29): run-time error CSS1039: Token not allowed after unary operator: '-secondary'
(204,29): run-time error CSS1039: Token not allowed after unary operator: '-success'
(208,29): run-time error CSS1039: Token not allowed after unary operator: '-danger'
(212,29): run-time error CSS1039: Token not allowed after unary operator: '-warning'
(216,29): run-time error CSS1039: Token not allowed after unary operator: '-info'
(309,28): run-time error CSS1039: Token not allowed after unary operator: '-light-gray'
(369,17): run-time error CSS1039: Token not allowed after unary operator: '-light-gray-variant'
(533,17): run-time error CSS1039: Token not allowed after unary operator: '-blue-dk'
(604,17): run-time error CSS1039: Token not allowed after unary operator: '-dark-grey-variant'
(741,17): run-time error CSS1039: Token not allowed after unary operator: '-theme-primary'
(952,32): run-time error CSS1039: Token not allowed after unary operator: '-light-grey-tint'
(1151,28): run-time error CSS1039: Token not allowed after unary operator: '-light-grey-tint'
(1163,28): run-time error CSS1039: Token not allowed after unary operator: '-light-grey-variant'
(1164,28): run-time error CSS1039: Token not allowed after unary operator: '-light-grey-tint'
(1168,34): run-time error CSS1039: Token not allowed after unary operator: '-light-grey-variant'
(1176,17): run-time error CSS1039: Token not allowed after unary operator: '-dark-grey-variant'
(1184,17): run-time error CSS1039: Token not allowed after unary operator: '-blue-dk'
(1195,17): run-time error CSS1039: Token not allowed after unary operator: '-dark-grey-variant'
(1228,28): run-time error CSS1039: Token not allowed after unary operator: '-light-grey'
(1253,21): run-time error CSS1039: Token not allowed after unary operator: '-dark-grey-variant'
(1274,32): run-time error CSS1039: Token not allowed after unary operator: '-light-grey'
(1284,28): run-time error CSS1039: Token not allowed after unary operator: '-light-grey-tint'
(1298,28): run-time error CSS1039: Token not allowed after unary operator: '-light-grey-tint'
(1341,28): run-time error CSS1039: Token not allowed after unary operator: '-light-grey'
(1342,34): run-time error CSS1039: Token not allowed after unary operator: '-dark-grey-tint'
(1361,37): run-time error CSS1039: Token not allowed after unary operator: '-dark-grey-tint'
(1373,38): run-time error CSS1039: Token not allowed after unary operator: '-dark-grey-tint'
(1384,33): run-time error CSS1039: Token not allowed after unary operator: '-dark-grey-tint'
(1409,33): run-time error CSS1039: Token not allowed after unary operator: '-theme-primary'
(1439,24): run-time error CSS1039: Token not allowed after unary operator: '-theme-info'
(1444,28): run-time error CSS1039: Token not allowed after unary operator: '-theme-success'
(1448,29): run-time error CSS1039: Token not allowed after unary operator: '-theme-info'
(1452,33): run-time error CSS1039: Token not allowed after unary operator: '-theme-success'
(1496,29): run-time error CSS1039: Token not allowed after unary operator: '-blue'
(1518,32): run-time error CSS1039: Token not allowed after unary operator: '-blue'
(1556,29): run-time error CSS1039: Token not allowed after unary operator: '-yellow'
(1561,32): run-time error CSS1039: Token not allowed after unary operator: '-light-grey'
(1565,29): run-time error CSS1039: Token not allowed after unary operator: '-red'
(1569,32): run-time error CSS1039: Token not allowed after unary operator: '-red'
(1570,35): run-time error CSS1039: Token not allowed after unary operator: '-red'
(1574,33): run-time error CSS1039: Token not allowed after unary operator: '-red'
(1578,34): run-time error CSS1039: Token not allowed after unary operator: '-red'
(1582,28): run-time error CSS1039: Token not allowed after unary operator: '-yellow'
(1583,31): run-time error CSS1039: Token not allowed after unary operator: '-yellow'
(1587,29): run-time error CSS1039: Token not allowed after unary operator: '-yellow'
(1591,30): run-time error CSS1039: Token not allowed after unary operator: '-yellow'
(1628,29): run-time error CSS1039: Token not allowed after unary operator: '-red'
(1721,17): run-time error CSS1039: Token not allowed after unary operator: '-blue-dk'
(1727,17): run-time error CSS1039: Token not allowed after unary operator: '-dark-grey-variant'
(1732,28): run-time error CSS1039: Token not allowed after unary operator: '-light-grey-tint'
(1742,21): run-time error CSS1039: Token not allowed after unary operator: '-dark-grey-variant'
(1764,29): run-time error CSS1039: Token not allowed after unary operator: '-theme-primary'
(1779,29): run-time error CSS1039: Token not allowed after unary operator: '-theme-success'
(1784,17): run-time error CSS1039: Token not allowed after unary operator: '-yellow'
(1796,17): run-time error CSS1039: Token not allowed after unary operator: '-dark-gray-variant'
(1802,28): run-time error CSS1039: Token not allowed after unary operator: '-light-gray-variant'
(1807,33): run-time error CSS1039: Token not allowed after unary operator: '-light-grey-variant'
(1812,21): run-time error CSS1039: Token not allowed after unary operator: '-dark-grey-variant'
(1820,17): run-time error CSS1039: Token not allowed after unary operator: '-dark-grey-variant'
(1851,17): run-time error CSS1039: Token not allowed after unary operator: '-blue-dk'
(1910,28): run-time error CSS1039: Token not allowed after unary operator: '-light-grey'
(1978,28): run-time error CSS1039: Token not allowed after unary operator: '-light-gray'
(1988,37): run-time error CSS1039: Token not allowed after unary operator: '-TPConfig_TossToAnimationMs'
(1992,37): run-time error CSS1039: Token not allowed after unary operator: '-TPConfig_TossToAnimationMs'
(1996,42): run-time error CSS1039: Token not allowed after unary operator: '-TPConfig_TossToShakeAnimationMs'
 */
/*#region GENERAL */

:root {
    /* ORDER VARS */
    --order-step-sticky-height: 3.25rem;
    --order-internal-sticky-height: 0rem;
}
    .noselect {
    -webkit-touch-callout: none; /* iOS Safari */
    -webkit-user-select: none; /* Safari */
    -khtml-user-select: none; /* Konqueror HTML */
    -moz-user-select: none; /* Old versions of Firefox */
    -ms-user-select: none; /* Internet Explorer/Edge */
    user-select: none; /* Non-prefixed version, currently supported by Chrome, Edge, Opera and Firefox */
}

.full-width-layout {
    margin-left: -15px;
    margin-right: -15px;
}

.hidden {
    display: none;
}

.transition-none {
    transition: none !important;
}

.absolute-fill {
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
}

.clean-btn {
    outline: none;
    border: none;
    background: transparent;
}

.tp-shadow {
    box-shadow: 0 2px 8px 0 rgba(0, 0, 0, 0.15);
}

.tp-shadow-large {
    box-shadow: 0 0 10px 0 rgba(0, 0, 0, 0.25);
}

.alert-container {
    position: absolute;
    top: 0;
    right: 0;
}

    .alert-container .toast-body-line + .toast-body-line {
        border-top: 1px solid;
        margin-top: 0.25rem;
        padding-top: 0.25rem;
    }

    .close.close-light {
        text-shadow: none;
        color: white;
        opacity: 0.75;
    }

    .close.close-light:not(:disabled):not(.disabled):focus,
    .close.close-light:not(:disabled):not(.disabled):hover {
        opacity: 1;
    }

    .close.close-light:hover {
        color: white;
    }

#tpMenu .dropdown-menu {
    overflow-y: auto;
    max-height: 90vh;
}

.production-navbar .dropdown-menu {
    padding: 0;
}

    .production-navbar .dropdown-menu .dropdown-item {
        padding: 2px 8px 2px 8px;
    }

[menumobileonly] .mobile-menu-hidden {
    display: none !important;
}

.sandbox-menu {
    border: 3px solid red !important;
}

.shade-item {
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    background-color: rgba(255,255,255,0.75);
}

.loading-shade {
    flex-direction: column;
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    background-color: rgba(255,255,255,0.75);
    display: none;
    justify-content: center;
    align-items: center;
    z-index: 1000;
}

    .loading-shade.active {
        display: flex;
    }

    body > .loading-shade {
        position: fixed;
    }

    .loading-shade .loading-text {
        background-color: white;
        color: #0d6efd;
        font-weight: bold;
        font-size: 14px;
        font-family: Helvetica Neue;
    }

.bg-img-aspect-ratio {
    background-size: contain;
    background-position: center;
    background-repeat: no-repeat;
    padding-bottom: 66.66%;
}

.number-input {
    max-width: 100px;
}

.number-button-sm {
    line-height: 1;
    padding: 2px;
    font-size: 12px;
    min-width: 20px;
}

.hide-collapsing .collapsing {
    -webkit-transition: none;
    transition: none;
    display: none;
}

.collapse-btn {
    line-height: 1;
}

.collapse-btn > .collapse-icon {
    display: inline-block;
    transition: transform 0.2s;
}

.collapse-btn.collapsed > .collapse-icon {
    transform: rotate(-90deg);
}

.h-0 {
    height: 0 !important;
}

.section-aside {
    padding: 0.125rem;
    padding-left: 1rem;
    border: 1px solid #dee2e6;
    border-left: 3px solid;
    background-color: var(--light-grey-tint);
}

.section-aside .section-aside-title {
    margin-left: -1rem;
    margin-bottom: 0.25rem;
    padding-left: 0.5rem;
    font-weight: bold;
}

.section-aside-primary {
    border-left-color: var(--primary);
}

.section-aside-secondary {
    border-left-color: var(--secondary);
}

.section-aside-success {
    border-left-color: var(--success);
}

.section-aside-danger {
    border-left-color: var(--danger);
}

.section-aside-warning {
    border-left-color: var(--warning);
}

.section-aside-info {
    border-left-color: var(--info);
}

.schedule-zone-dot {
    display: inline-block;
    width: 9px;
    height: 9px;
    border-radius: 50%;
}

.gap-0 {
    gap: 0;
}

.gap-1 {
    gap: 0.25rem;
}

.gap-2 {
    gap: 0.5rem;
}

.gap-3 {
    gap: 1rem;
}

.gap-4 {
    gap: 1.5rem;
}

.gap-5 {
    gap: 3rem;
}

.gap-x-0 {
    column-gap: 0;
}

.gap-x-1 {
    column-gap: 0.25rem;
}

.gap-x-2 {
    column-gap: 0.5rem;
}

.gap-x-3 {
    column-gap: 1rem;
}

.gap-x-4 {
    column-gap: 1.5rem;
}

.gap-x-5 {
    column-gap: 3rem;
}

.gap-y-0 {
    row-gap: 0;
}

.gap-y-1 {
    row-gap: 0.25rem;
}

.gap-y-2 {
    row-gap: 0.5rem;
}

.gap-y-3 {
    row-gap: 1rem;
}

.gap-y-4 {
    row-gap: 1.5rem;
}

.gap-y-5 {
    row-gap: 3rem;
}

hr.Small {
    margin: 0;
}

.opacity-50 {
    opacity: 50%;
}

/* #region TELERIK */
/* there is no read-only styling on the kendo inputs */
input.k-input-inner[readonly] {
    background-color: var(--light-gray);
}

.kendo-window-container {
    width: 100%;
    height: 100%;
    display: flex;
    flex-direction: column;
    flex-wrap: nowrap;
}

.k-window-content.k-window-content-with-footer {
    display: flex !important;
    flex-direction: column;
    height: 100%;
    overflow: hidden;
}

.kendo-window-content-wrapper {
    display: flex;
    flex-direction: column;
    flex-grow: 1;
    min-height: 0; /* required to make the overflow property work properly in a flex container */
}

.kendo-window-header {
    flex-shrink: 0;
    margin-bottom: 1rem;
    padding-bottom: 19px;
    border-bottom: 1px solid #e5e5e5;
}

.kendo-window-body {
    flex-grow: 1;
    overflow: auto;
    min-height: 2em;
}

.kendo-window-footer {
    flex-shrink: 0;
    margin-top: 1rem;
    padding-top: 19px;
    border-top: 1px solid #e5e5e5;
}

.k-window-content.k-window-content-with-footer .kendo-window-footer {
    margin-top: 0;
}

/* More obvious disabled styles */
/* buttons */
.k-button:disabled, .k-button.k-disabled {
    opacity: 0.3 !important;
    filter: grayscale(0.6) !important;
}

/* stepper */
.k-stepper .k-step.k-step-disabled .k-step-indicator, 
.k-stepper .k-step.k-disabled .k-step-indicator, 
.k-stepper .k-step:disabled .k-step-indicator {
    color: var(--light-gray-variant) !important;
}


/* we want our "OK" on the right and "Cancel" on the left so we need to reverse it */
/* there is now no distinction in the css classes for confirm vs dialog. So comment this out because it reverses the dialogs where you have control of the button order. */
/* UPDATE: we can use data-role="confirm/prompt" to target */
.k-dialog > .k-dialog-content[data-role="confirm"] ~ .k-dialog-actions,
.k-dialog > .k-dialog-content[data-role="prompt"] ~ .k-dialog-actions {
    flex-direction: row-reverse;
}

/* CALENDAR */
.k-calendar-small .k-calendar-view {
    width: 210px;
    height: 210px;
    min-height: 210px;
    padding: 0;
}

.k-calendar-small .k-calendar-monthview td,
.k-calendar-small .k-month td,
.k-calendar-small .k-calendar-monthview .k-link,
.k-calendar-small .k-month .k-link {
    width: 30px;
    height: 30px;
}

.k-calendar-small .k-calendar-yearview .k-link,
.k-calendar-small .k-year .k-link,
.k-calendar-small .k-calendar-decadeview .k-link,
.k-calendar-small .k-decade .k-link,
.k-calendar-small .k-calendar-centuryview .k-link,
.k-calendar-small .k-century .k-link {
    width: 52px;
    height: 52px;
    font-size: 14px;
    padding: 0.25rem;
}

.k-calendar-small .k-header a {
    padding: 0;
}

.k-calendar-small .k-header .k-nav-prev,
.k-calendar-small .k-header .k-nav-next {
    width: 1.5em;
    height: 1.5em;
}

.k-calendar-small .k-calendar-view .k-calendar-th {
    padding: 0;
    width: 30px;
    height: 30px;
}

.marked-date-cell {
    position: relative;
}

    .marked-date-cell::after {
        content: '';
        position: absolute;
        top: 0;
        left: 0;
        border-color: transparent;
        border-style: solid;
        border-width: 8px;
        border-left-color: #28a745;
        border-top-color: #28a745;
    }

.highlighted-date-cell {
    background-color: #d0e7ff;
}

    .k-calendar-td:not(.k-selected) .highlighted-date-cell:hover {
        background-color: #c4e1ff !important;
    }

.current-week-date-cell {
    font-weight: bold;
}

/* UPLOADER PROGRESS BAR */
.k-upload .k-progressbar.upload-progress-bar {
    bottom: 0.25rem;
    height: 1rem;
}

.k-upload .k-dropzone.show-progress-bar {
    padding-bottom: 1.5rem;
}

.k-upload .k-dropzone:not(.show-progress-bar) .k-progressbar.upload-progress-bar {
    display: none;
}

.progress-status {
    padding: 0 0.5rem;
    -webkit-padding-before: 0;
    padding-block-start: 0;
    -webkit-padding-after: 0;
    padding-block-end: 0;
    -webkit-padding-start: 0.5rem;
    padding-inline-start: 0.5rem;
    -webkit-padding-end: 0.5rem;
    padding-inline-end: 0.5rem;
    min-width: 10px;
    text-align: center;
    display: inline-block;
    white-space: nowrap;
}

.k-upload:not(.show-file-results) .k-upload-files {
    display: none;
}

.k-upload .k-file-success.k-file-invalid-override .k-progressbar-value {
    background-color: #dc3545;
}

.k-upload .k-file-success.k-file-invalid-override .k-file-validation-message {
    color: #dc3545;
}

/* EXTRA SMALL STYLES */
/* KENDO SWITCH */
.k-switch-xs,
.k-switch-xs .k-switch-track {
    width: 40px;
    height: 22px;
}

    .k-switch-xs.k-switch-off .k-switch-thumb-wrap {
        left: 11px;
    }

    .k-switch-xs.k-switch-on .k-switch-thumb-wrap {
        left: calc(100% - 11px);
    }

    .k-switch-xs .k-switch-thumb {
        width: 16px;
        height: 16px;
    }


/* #endregion */

/* #region TEXT */
.tp-icon {
    line-height: 1;
    display: inline-block;
}

    .tp-icon > svg {
        width: 1em;
        height: 1em;
        fill: currentColor;
        vertical-align: bottom;
    }

.cp-color-primary {
    color: var(--blue-dk);
}

.cp-color-secondary {
    color: #34495e;
}

.text-xs {
    font-size: 10px !important;
}

.text-sm {
    font-size: 12px !important;
}

.text-md {
    font-size: 14px !important;
}

.text-lg {
    font-size: 16px !important;
}

.text-xl {
    font-size: 18px !important;
}

.text-xxl {
    font-size: 20px !important;
}

.line-height-0 {
    line-height: 0 !important; 
}

.line-height-1 {
    line-height: 1 !important;
}

.text-underline {
    text-decoration: underline !important;
}
/* #endregion */

/*#region FORMS*/
.bootstrap-form-sm label {
    font-size: 0.875rem;
    margin-bottom: 0;
}

.bootstrap-form-sm .form-group {
    margin-bottom: 0.5rem;
}

.custom-control.custom-checkbox.custom-checkbox-standalone {
    padding-left: 0;
}

    .custom-control.custom-checkbox.custom-checkbox-standalone .custom-control-label {
        width: 1em;
        height: 1em;
    }

        .custom-control.custom-checkbox.custom-checkbox-standalone .custom-control-label::before,
        .custom-control.custom-checkbox.custom-checkbox-standalone .custom-control-label::after {
            left: 0;
        }
/*#endregion*/

/* #region TABLE */
.field-name {
    color: var(--dark-grey-variant);
    font-size: 14px;
    line-height: 24px;
}

tr.tr-pt-1 > td {
    padding-top: 0.25rem !important;
}

tr.tr-pt-2 > td {
    padding-top: 0.5rem !important;
}

tr.tr-pt-3 > td {
    padding-top: 1rem !important;
}

tr.tr-pt-4 > td {
    padding-top: 1.5rem !important;
}

tr.tr-pt-5 > td {
    padding-top: 3rem !important;
}

tr.tr-pb-1 > td {
    padding-bottom: 0.25rem !important;
}

tr.tr-pb-2 > td {
    padding-bottom: 0.5rem !important;
}

tr.tr-pb-3 > td {
    padding-bottom: 1rem !important;
}

tr.tr-pb-4 > td {
    padding-bottom: 1.5rem !important;
}

tr.tr-pb-5 > td {
    padding-bottom: 3rem !important;
}

td.min {
    width: 1%;
    white-space: nowrap;
}

tr.secondary-row {
    background-color: #f8f9fa;
}
/* #endregion */

.highlight-blinking {
    animation: highlight-blink 2s 3;
}

@keyframes highlight-blink {
    0%, 100% {
        background-color: transparent;
    }
    50% {
        background-color: rgba(255, 255, 0, 0.5);
    }
}

/*#endregion */

/*#region MENU*/
.nav-link .nav-icon {
    font-size: 1rem;
}

.nav-link.nav-link-stacked {
    font-size: 12px;
}


    .nav-link.nav-link-stacked .nav-icon {
        margin-right: 0.5rem;
        text-align: center;
    }

#NavbarNavNoCollapse {
    flex-direction: row;
}

.superscript-badge {
    position: relative;
    top: -0.5rem;
    right: 0.25rem;
    padding-left: 0.3rem;
    padding-right: 0.4rem;
}


.upper-right-badge {
    position: relative;
    top: -0.75rem;
    right: 0.25rem;
    padding-left: 0.3rem;
    padding-right: 0.4rem;
}


.lower-right-badge {
    position: relative;
    bottom: -0.75rem;
    left: -2.1rem;
    padding-left: 0.3rem;
    padding-right: 0.4rem;
}

/*#endregion*/
    /*#region HELP */
    .help-icon-container {
    padding-right: 14px;
    position: relative;
    white-space: nowrap;
}

    .help-icon-container.hide-help-icon > .help-icon {
        visibility: hidden;
    }

.help-icon {
    font-size: 14px;
    color: #505050;
    position: absolute;
    top: 0;
    right: 0;
}

.help-icon-popup:hover {
    cursor: pointer;
    color: var(--theme-primary);
}
/*#endregion */

/*#region SMART TEXT AREA */
.smart-text-area-wrapper {
    display: block;
}

    .smart-text-area-wrapper > textarea {
        max-width: 100%;
        width: 100%;
    }

    .smart-text-area-wrapper > .character-count {
        text-align: right;
        line-height: 1;
        display: block;
    }
/*#endregion */

/*#region TOUR */

table.VFPT_InfoMLSData {
    width: 100%;
    table-layout: fixed;
}

    table.VFPT_InfoMLSData td {
        width: 50%;
        vertical-align: top;
        padding-right: 1rem;
        padding-bottom: 0.5rem;
        word-break: break-word;
    }

p.table-heading {
    font-weight: 600;
    margin-bottom: 0.5rem;
    margin-top: 0.5rem;
    border-bottom: 2px solid #4a4a4a;
}

/* dropdown nav menu */
.dropdown-menu-container {
    padding-top: 2px;
    padding-bottom: 2px;
    background-color: rgba(255, 255, 255, 0.9);
    border-radius: 5px;
    font-size: 12pt;
    font-family: Lato;
    box-shadow: 0 2px 6px rgba(0,0,0,.3);
}

.level-menu-wrapper {
    position: absolute;
    display: flex;
    top: 10px;
    right: 10px;
    left: auto;
    z-index: 101;
    font-size: 12px;
}

/* COLLAPSIBLE NAV MENU */
.collapsible-nav-menu {
    position: relative;
}

    .collapsible-nav-menu:not(.menu-collapsed) {
        display: flex;
        flex-wrap: wrap;
        justify-content: flex-end;
        gap: 4px;
    }

    .collapsible-nav-menu.menu-collapsed {
        padding: 0;
        border-radius: 3px;
    }

    .collapsible-nav-menu.menu-collapsed,
    .collapsible-nav-menu:not(.menu-collapsed) > * {
        background-color: rgba(255, 255, 255, 0.9);
        box-shadow: 0 2px 6px rgba(0,0,0,.3);
    }

    .collapsible-nav-menu > * {
        padding: 0.125rem 0.5rem;
        border-radius: 3px;
    }

.collapsible-nav-item {
    color: black;
}

    .collapsible-nav-item.active {
        font-weight: bold;
    }

    .collapsible-nav-item:hover {
        color: black;
        text-decoration: none;
        background-color: #eee;
    }

/* make sure you can't click during transition */
.collapsible-nav-menu.collapsed.menu-transitioning > *,
.collapsible-nav-menu.collapsed:not(.menu-open) > * {
    pointer-events: none;
}

.collapsible-nav-menu.menu-collapsed > .collapsible-nav-item {
    display: block;
    padding-right: 30px;
    transition: line-height 0.5s, opacity 0.5s, color 0.5s;
    outline: none;
}

.collapsible-nav-menu.menu-collapsed:not(.menu-open) > .collapsible-nav-item:not(.active) {
    line-height: 0;
    opacity: 0;
    padding-top: 0;
    padding-bottom: 0;
}

.dropdown-menu-container.no-dropdown a {
    margin-right: 4px;
}

.dropdown-menu-toggle-btn {
    border: none;
    outline: none !important;
    position: absolute;
    top: 0;
    right: 0;
    z-index: 1;
}

.collapsible-nav-menu:not(.menu-collapsed) > .dropdown-menu-toggle-btn,
.collapsible-nav-menu.menu-collapsed.no-dropdown > .dropdown-menu-toggle-btn,
.collapsible-nav-menu.menu-collapsed:not(.menu-open) > .dropdown-menu-toggle-btn > .fa-caret-up,
.collapsible-nav-menu.menu-collapsed.menu-open > .dropdown-menu-toggle-btn > .fa-caret-down {
    display: none;
}

a.link-button:focus {
    outline: none;
}

a.link-button:not(.disabled):hover {
    cursor: pointer;
}

/* label box */
.label-box {
    position: absolute;
    bottom: 0px;
    left: 10px;
    font-size: 13px;
    max-width: 230px;
    padding: 0px;
    margin: 0px;
    border-radius: 4px;
    vertical-align: middle;
    color: white;
    text-shadow: 2px 2px 2px black
}

    .label-box .description {
        font-size: 10px;
    }

.customer-provided, .not-ready {
    font-size: 12px;
    opacity: 0.85;
}

@media (min-width: 576px) and (min-height: 500px) {
    .label-box {
        max-width: 325px;
    }

    .label-box {
        display: block;
    }
}

/*#endregion TOUR */

/*#region REGION TREE */
/* maybe add some min/max width here */
.region-tree .k-widget.k-dropdowntree {
    width: auto;
}

.region-tree .k-icon.k-clear-value.k-i-close {
    right: 21px;
}
/*#endregion REGION TREE */

/*#region FILTERABLE TABLE */
table.filterable-table {
    font-size: 14px;
    color: black;
    border-bottom: 1px solid #dee2e6;
}

    table.filterable-table > thead th {
        vertical-align: top;
        font-weight: bold;
        background-color: var(--light-grey-tint);
        border-width: 0;
        padding-bottom: 0.5rem;
        text-align: center;
    }

    table.filterable-table td {
        vertical-align: middle;
    }

    table.filterable-table tbody.loading {
        opacity: 0.5;
    }

.col-sort-wrapper {
    margin-left: 8px;
    display: flex;
    flex-direction: column;
    justify-content: center;
}

.col-sort {
    color: #6c757d;
    padding-bottom: 2px;
}

    .col-sort.col-sort-desc {
        padding-top: 2px;
        padding-bottom: 0;
    }

    .col-sort:hover,
    .col-sort.active {
        color: #007bff;
    }

    .col-sort > span {
        width: 0;
        height: 0;
        border-left: 7px solid transparent;
        border-right: 7px solid transparent;
        border-bottom: 7px solid;
        display: block;
    }

    .col-sort.col-sort-desc > span {
        border-bottom: none;
        border-top: 7px solid;
    }

/* #endregion FILTERABLE TABLE */

/* #region THUMB SLIDER */
.thumb-slider {
    overflow: hidden;
    white-space: nowrap;
    cursor: pointer;
}

    .thumb-slider > * {
        height: 100%;
        display: inline-block;
        white-space: normal
    }

    .thumb-slider img {
        pointer-events: none;
    }

    .thumb-slider > .thumb-loading {
        background-color: rgba(66,66,66,.2);
        webkit-animation: thumb-pulse 1.5s ease-in-out .5s infinite;
        animation: thumb-pulse 1.5s ease-in-out .5s infinite;
    }

@keyframes thumb-pulse {
    0% {
        opacity: 1;
    }

    50% {
        opacity: 0.5;
    }

    100% {
        opacity: 1;
    }
}
/* #endregion THUMB SLIDER */

/* #region GOT IT */
.tooltip.tooltip-got-it.show {
    opacity: 1;
}

.tooltip-got-it .tooltip-inner {
    background-color: #007bff;
    border-radius: 0px;
    box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.5);
    padding: 4px;
    text-align: left;
    /*width: 156px;*/
}

.tooltip-arrow-shadow {
    width: 4px;
    height: 4px;
    display: inline-block;
    position: absolute;
    box-shadow: 0px 0px 8px 1px rgba(0,0,0,0.5);
    z-index: -1;
}

.tooltip-got-it.bs-tooltip-left .tooltip-arrow-shadow {
    top: 50%;
    margin-top: -2px;
    left: 0;
}

.tooltip-got-it.bs-tooltip-right .tooltip-arrow-shadow {
    top: 50%;
    margin-top: -2px;
    right: 0;
}

.tooltip-got-it.bs-tooltip-top .tooltip-arrow-shadow {
    left: 50%;
    margin-left: -2px;
    top: 0;
}

.tooltip-got-it.bs-tooltip-bottom .tooltip-arrow-shadow {
    left: 50%;
    margin-left: -2px;
    bottom: 0;
}

.bs-tooltip-auto[x-placement^=left] .arrow::before,
.tooltip-got-it.bs-tooltip-left .arrow::before {
    border-left-color: #007bff;
}

.bs-tooltip-auto[x-placement^=right] .arrow::before,
.tooltip-got-it.bs-tooltip-right .arrow::before {
    border-right-color: #007bff;
}

.bs-tooltip-auto[x-placement^=top] .arrow::before,
.tooltip-got-it.bs-tooltip-top .arrow::before {
    border-top-color: #007bff;
}

.bs-tooltip-auto[x-placement^=bottom] .arrow::before,
.tooltip-got-it.bs-tooltip-bottom .arrow::before {
    border-bottom-color: #007bff;
}

.got-it-button {
    display: inline-block;
    font-size: 10px;
    font-family: Lato;
    font-weight: 800;
    letter-spacing: 0.43px;
    color: #6d7278;
    padding: 0.125rem 0.25rem;
    line-height: normal;
    border: none;
    border-radius: 1px;
    background-color: #e1e3e9;
    cursor: pointer;
}

    .got-it-button:hover {
        color: #6d7278;
        text-decoration: none;
    }

.tooltip-got-it .got-it-content {
    font-family: Lato;
    font-size: 10px;
    font-weight: 500;
    line-height: normal;
    letter-spacing: 0.43px;
    color: white;
}

.tooltip-got-it img {
    margin-left: 2px;
    margin-right: 2px;
}

.tooltip-got-it .tooltip-bottom {
    text-align: right;
    margin-top: 0.25rem;
}
/*#endregion*/

/* #region PICK */
.pick-app-container {
    background-color: var(--light-grey-tint);
}

.pick-footer {
    box-shadow: 0px -4px 3px rgba(50, 50, 50, 0.10);
    background-color: white;
    z-index: 1;
}

/* #region PROPERTY MENU */
.navbar.property-menu {
    padding: 0.25rem 1rem !important;
    border: 1px solid var(--light-grey-variant);
    background-color: var(--light-grey-tint);
}

.property-menu > .navbar-brand {
    border-right: 1px solid var(--light-grey-variant);
    margin-right: 0;
    padding-right: 1rem;
    display: flex;
    align-items: center;
}

.property-menu .back-icon {
    color: var(--dark-grey-variant);
    font-size: 30px;
    margin-right: 0.5rem;
}

.property-menu-address,
.property-menu .nav-item .nav-link {
    font-size: 18px;
    color: var(--blue-dk);
}

    .property-menu .nav-item.active .nav-link,
    .property-menu .nav-item .nav-link:hover {
        color: #58a5b3;
        font-weight: bold;
    }

.order-add-ons-link {
    display: flex;
    color: var(--dark-grey-variant);
    align-items: center;
}

    .order-add-ons-link .nav-icon {
        font-size: 20px;
        width: 20px;
        margin-right: 0.5rem;
    }

    .order-add-ons-link span {
        font-size: 12px;
    }
/* #endregion */

/* #region IMAGES MENU */
.images-menu {
    display: flex;
    padding-bottom: 5px;
}

.base-button {
    border-radius: 3px;
    font-size: 12px;
    font-weight: bold;
    padding: 0.4rem 0.5rem;
    letter-spacing: 2px;
}

.menu-tabs-container {
    display: flex;
    align-items: stretch;
    padding: 0 0.5rem;
    background-color: var(--light-grey);
    justify-content: space-between;
    width: 100%;
}
    
    .menu-tabs-container .menu-tabs-pinned,
    .menu-tabs-container .menu-tabs-left,
    .menu-tabs-container .menu-tabs-right {
        display: flex;
        flex-wrap: nowrap;
        padding-top: 0.25rem;
    }

    .menu-tabs-container .menu-tabs-left {
        flex-grow: 1;
        overflow-x: auto;
        position: relative;
    }

    .menu-tabs-container .menu-tabs-right {
        align-items: center;
        gap: 4px;
    }

    .menu-tabs-container .menu-tabs-right i {
        color: var(--dark-grey-variant);
    }

.menu-tab-wrapper {
    text-align: center;
    display: inline-flex;
    align-items: center;
    position: relative;
    white-space: nowrap;
    height: 35px;
}

    .menu-tab-wrapper > .menu-tab {
        height: 100%;
        padding-right: 16px;
        padding-left: 16px;
        display: flex;
        align-items: center;
        color: #4a4a4a;
        outline: none;
        border: none;
        background-color: var(--light-grey);
        font-size: 14px;
        border-radius: 10px 10px 0 0;
    }

.interior-level-label {
    font-weight: bold;
}

.menu-tab-wrapper.active > .menu-tab {
    background-color: var(--light-grey-tint);
    z-index: 3;
}

.menu-tab-wrapper:not(.active):not(.menu-tab-pinned) > .menu-tab:hover {
    background-color: #f1f2f4;
    box-shadow: 0 2px 8px 0 rgba(0, 0, 0, 0.15);
    z-index: 2;
}

.rounded-tab {
    position: absolute;
    bottom: 0;
    width: 0.5rem;
    background-color: var(--light-grey-tint);
    height: 0.5rem;
    z-index: 1;
}

.menu-tab-wrapper:not(.active) > .rounded-tab {
    display: none;
}

.rounded-tab-left {
    right: 100%;
}

    .rounded-tab-left::after {
        content: ' ';
        width: 100%;
        height: 100%;
        background-color: rgba(222, 225, 230, 0.68);
        border-radius: 0 0 0.5rem 0;
        display: block;
    }

.rounded-tab-right {
    left: 100%;
}

    .rounded-tab-right::after {
        content: ' ';
        width: 100%;
        height: 100%;
        background-color: rgba(222, 225, 230, 0.68);
        border-radius: 0 0 0 0.5rem;
        display: block;
    }

.menu-tab-wrapper:not(:last-child):not(.active):not(.menu-tab-pinned):not(:hover)::before {
    content: ' ';
    display: block;
    position: absolute;
    bottom: 6px;
    left: 100%;
    top: 10px;
    width: 2px;
    background-color: var(--light-grey);
    border-right: 1px solid var(--dark-grey-tint);
    z-index: 1;
}

.menu-tabs-pinned,
.menu-tabs-right {
    position: relative;
    z-index: 4;
}

    .menu-tabs-pinned::before {
        content: ' ';
        display: block;
        position: absolute;
        bottom: 0;
        top: 0;
        left: 100%;
        width: 0.5rem;
        background: linear-gradient(to right, rgba(0, 0, 0, 0.15), transparent);
        border-left: 1px solid var(--dark-grey-tint);
    }

    .menu-tabs-right::before {
        content: ' ';
        display: block;
        position: absolute;
        bottom: 0;
        top: 0;
        right: 100%;
        width: 0.5rem;
        background: linear-gradient(to left, rgba(0, 0, 0, 0.15), transparent);
        border-right: 1px solid var(--dark-grey-tint);
    }

    .menu-tab-wrapper.menu-tab-pinned .menu-tab {
        padding-left: 8px;
        padding-right: 8px;
    }

.menu-tabs-right .menu-tab-wrapper:not(.active)::before {
    left: auto;
    right: 100%;
    border-left: 1px solid var(--dark-grey-tint);
    border-right: none;
}

.menu-tab-wrapper:first-of-type,
.menu-tab-wrapper.active,
.menu-tab-wrapper.active:not(.dragging) + .menu-tab-wrapper {
    border-color: transparent;
}
/* #endregion */

/* #region LEVEL EDIT */
.level-order-tile-container {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
}

.level-order-tile {
    outline-offset: -1px;
    padding-left: 14px;
    padding-right: 14px;
}

    .level-order-tile.selected {
        outline: 2px solid var(--theme-primary);
    }

    .level-order-tile.new-level-order-tile,
    .image-card-wrapper.new-image-card {
        outline: 1px dashed !important;
    }

    .level-order-tile .drag-level-icon {
        visibility: hidden;
        position: absolute;
        top: 2px;
        left: 2px;
    }

    .level-order-tile:hover .drag-level-icon {
        visibility: visible;
    }
/* #endregion */

/* #region IMAGE CARD */
.image-card-wrapper {
    width: 115px;
    margin: 2px;
    transition: width 0.35s ease-in-out, margin 0.35s ease-in-out;
}

.image-card-wrapper.bracket-group .image-card-body, 
.upload-tile-wrapper.bracket-group .image-card-body {
    border-top: 0.5rem solid;
    border-color: var(--theme-info);
}

    .image-card-wrapper.bracket-group.bracket-group-variant .image-card-body,
    .upload-tile-wrapper.bracket-group.bracket-group-variant .image-card-body {
        border-color: var(--theme-success);
    }

.image-card-wrapper.bracket-base-image .image-card {
    outline: 2px solid var(--theme-info);
}

    .image-card-wrapper.bracket-base-image.bracket-group-variant .image-card {
        outline: 2px solid var(--theme-success);
    }

    .image-card-wrapper.bracket-base-image .image-card-body {
        background-color: #d8f0f3;
    }

.image-card-placeholder {
    width: 0;
    height: 0;
    margin: 0;
    padding: 0;
    border: 0;
    visibility: hidden;
}

.animate-row-change{
    position: absolute;
    z-index: 1;
    pointer-events: none;
}

.image-card-spacer {
    visibility: hidden;
    background-color: red;
}

.image-card-spacer:not(.spacer-expand) {
    width: 0;
    margin: 0;
    border: 0;
}

.image-card-spacer.spacer-hidden {
    position: absolute;
}

/* so we can hide the very first animation to avoid flicker */
.image-card-spacer.no-transition {
    transition: none;
}

.original-placeholder {
    width: 0;
    outline: 2px solid var(--blue);
    margin-top: 4px;
    margin-bottom: 4px;
    position: relative;
    z-index: 1;
}

    .original-placeholder::before {
        bottom: 100%;
    }

    .original-placeholder::after {
        top: 100%;
    }

    .original-placeholder::before,
    .original-placeholder::after {
        content: '';
        width: 10px;
        height: 10px;
        display: block;
        border-radius: 100%;
        background-color: var(--blue);
        position: absolute;
        left: -5px;
    }

.image-card {
    height: 100%;
    text-align: center;
    cursor: pointer;
    display: flex;
    flex-direction: column;
    position: relative;
    user-select: none;
    box-shadow: 0 2px 8px 0 rgba(0, 0, 0, 0.05);
    outline-offset: -1px;
    overflow: visible;
}

    .image-card .image-card-photo {
        height: 73px;
        background-size: cover;
        background-position: center center;
        background-repeat: no-repeat;
    }

    .image-card.image-card-video .image-card-photo {
        background-size: contain;
        background-color: white;
    }

    .image-card .image-card-body {
        background-color: white;
        flex-grow: 1;
        position: relative;
    }

.image-container-body:not(.dragging-image):not(.media-sync-container) .image-card-wrapper:not(.worksheet-item):not(.selected) .image-card:hover:not(.pano-hotspot-image),
.image-container-body:not(.dragging-image):not(.media-sync-container) .image-card-wrapper:not(.worksheet-item):not(.selected) .image-card.hover:not(.pano-hotspot-image) {
    outline: 2px solid var(--yellow);
}

    .image-container-body:not(.dragging-image) .image-card:hover .image-card-body,
    .image-container-body:not(.dragging-image) .image-card.hover .image-card-body {
        background-color: var(--light-grey);
    }

.image-card-wrapper.unselected-floor-plan > .image-card {
    outline: 2px solid var(--red);
}

.image-card-wrapper.worksheet-item > .image-card {
    border-top: 2px solid var(--red);
    border-bottom: 2px solid var(--red);
}

.image-card-wrapper.worksheet-item.image-group-start > .image-card {
    border-left: 2px solid var(--red);
}

.image-card-wrapper.worksheet-item.image-group-end > .image-card {
    border-right: 2px solid var(--red);
}

.image-card-wrapper.worksheet-item > .image-card.image-group-hover {
    border-top-color: var(--yellow);
    border-bottom-color: var(--yellow);
}

.image-card-wrapper.worksheet-item.image-group-start > .image-card.image-group-hover {
    border-left-color: var(--yellow);
}

.image-card-wrapper.worksheet-item.image-group-end > .image-card.image-group-hover {
    border-right-color: var(--yellow);
}

.image-card-wrapper.worksheet-item:not(.image-group-start) {
    margin-left: 0;
    width: 117px;
}

.image-card-wrapper.worksheet-item:not(.image-group-end) {
    margin-right: 0;
    width: 117px;
}

.image-card-wrapper.worksheet-item:not(.image-group-start):not(.image-group-end) {
    width: 119px;
}

.image-card-wrapper.worksheet-item:not(.image-group-start) > .image-card {
    border-top-left-radius: 0;
    border-bottom-left-radius: 0;
}

.image-card-wrapper.worksheet-item:not(.image-group-end) > .image-card {
    border-top-right-radius: 0;
    border-bottom-right-radius: 0;
}

.image-card-wrapper.image-size-unavailable,
.image-card-wrapper.image-revision-unavailable {
    pointer-events: none;
}

.image-card-wrapper:not(.image-size-unavailable) .image-size-unavailable-message {
    display: none;
}

.pano-hotspot-image {
    outline: 2px solid var(--red);
}

.image-card-badge {
    position: absolute;
    top: 2px;
    left: 50%;
    transform: translateX(-50%);
}

.image-card-menu {
    display: none;
    flex-direction: column;
    flex-wrap: wrap;
    position: absolute;
    height: 100%;
    align-items: center;
    background-image: linear-gradient(to right, rgba(0,0,0,0.4), rgba(0,0,0,0.4), transparent);
    font-size: 16px;
}

    .image-card-menu.image-card-menu-right {
        right: 0;
        background-image: linear-gradient(to left, rgba(0,0,0,0.4), rgba(0,0,0,0.4), transparent);
    }

    .image-card-icon-wrapper {
        position: relative;
        margin: 2px;
    }

    .image-card-icon-wrapper .image-card-icon {
        display: block;
    }

.image-card:not(:hover) .image-card-menu > i {
    display: none;
}

.image-card:hover .image-card-menu,
.image-card.hover .image-card-menu,
.image-card.featured:not(.hide-stars) .image-card-menu-left,
.image-card.has-revision .image-card-menu-left,
.image-card.selected .image-card-menu-right,
/*.image-card-wrapper.select-mode .image-card .image-card-menu-right,*/
.upload-tile.is-secondary .image-card-menu-left,
.upload-tile.do-not-show .image-card-menu-left,
.upload-tile.specific-label .image-card-menu-left,
.upload-tile.edit-clone-request .image-card-menu-left,
.upload-tile.comment .image-card-menu-left {
    display: flex;
}

.image-card .featured-icon-inactive,
.image-card .selected-icon-inactive,
.upload-tile .is-secondary-icon-inactive,
.upload-tile .do-not-show-icon-inactive,
.upload-tile .specific-label-icon-inactive,
.upload-tile .edit-clone-request-icon-inactive,
.upload-tile .comment-icon-inactive {
    color: white;
    opacity: 60%;
}

    .image-card.featured .featured-icon-inactive,
    .image-card .featured-icon-inactive:hover,
    .image-card.selected .selected-icon-inactive,
    .image-card .selected-icon-inactive:hover,
    .image-card-wrapper.select-mode .image-card:hover .selected-icon-inactive,
    .image-card-wrapper.select-mode .image-card.hover .selected-icon-inactive,
    .upload-tile .is-secondary-icon-inactive:hover,
    .upload-tile.is-secondary .is-secondary-icon-inactive,
    .upload-tile .do-not-show-icon-inactive:hover,
    .upload-tile.do-not-show .do-not-show-icon-inactive,
    .upload-tile .specific-label-icon-inactive:hover,
    .upload-tile.specific-label .specific-label-icon-inactive,
    .upload-tile .edit-clone-request-icon-inactive:hover,
    .upload-tile.edit-clone-request .edit-clone-request-icon-inactive,
    .upload-tile .comment-icon-inactive:hover,
    .upload-tile.comment .comment-icon-inactive {
        opacity: 100%;
    }

.image-card .image-card-body > div {
    text-overflow: ellipsis;
    white-space: nowrap;
    overflow: hidden;
    padding-left: 2px;
    padding-right: 2px;
}

.image-card-title {
    font-size: 12px;
    color: var(--blue-dk);
    font-weight: 600;
}

.image-card-name {
    font-size: 12px;
    color: var(--dark-grey-variant);
    word-break: break-all;
}

.image-card .image-card-footer {
    background-color: var(--light-grey-tint);
    height: 23px;
    display: flex;
    font-size: 16px;
    justify-content: space-around;
    align-items: center;
}

    .image-card .image-card-footer .move-icon,
    .image-card .image-card-footer .edit-icon {
        color: var(--dark-grey-variant);
    }

    .image-card .image-card-footer .display-icon {
        color: #9a9a9a;
    }

.hide-icon {
    color: #d17878;
}

.featured-icon-active {
    color: #ba8b00;
}


.image-card.hide-image .display-icon,
.image-card:not(.hide-image) .hide-icon {
    display: none;
}

.image-card.selected {
    outline: 2px solid var(--theme-primary);
    outline-offset: -1px;
}

.image-card .selected-icon-active {
    position: absolute;
    z-index: 1;
    background-color: white;
    outline: 1px solid white;
    border-radius: 100%;
    right: 1px;
    top: 1px;
}

.image-card.default-image {
    outline: 2px solid var(--theme-success);
    outline-offset: -1px;
}

.image-card .summary-image-number {
    color: var(--yellow);
}

.image-card-wrapper.new-image-card {
    min-height: 73px;
}
/* #endregion */

/* #region EXIF INFO */
.exif-info-container {
    white-space: nowrap;
    font-size: 13px;
    color: var(--dark-gray-variant);
    font-family: arial narrow;
    line-height: normal;
}

.exif-info-container .exif-exposure-time {
    background-color: var(--light-gray-variant);
}
/*#endregion*/

.images-action-menu {
    border-left: 1px solid var(--light-grey-variant);
}

    .images-action-menu .navbar-brand {
        font-size: 14px;
        color: var(--dark-grey-variant);
    }

#ContentContainer.show-all .level-action-menu {
    display: none;
}

.level-action-menu {
    color: var(--dark-grey-variant);
    font-size: 14px;
    display: flex;
    align-items: center;
    height: 100%;
}

    .level-action-menu .level-name-label {
        color: #858585;
        font-size: 16px;
    }

    .level-action-menu .level-name {
        color: #34495e;
        font-size: 18px;
        text-transform: uppercase;
        font-weight: bold;
    }

/* #region IMAGE CONTAINER */
.image-container {
    padding: 0.5rem;
    margin-bottom: 14px;
}

.image-container-header {
    display: flex;
    justify-content: space-between;
}

.pick-container-header-content {
    color: var(--blue-dk);
    font-size: 14px;
}

    .pick-container-header-content.header-content-left {
        display: flex;
        align-items: center;
    }

.image-container-body {
    display: flex;
    justify-content: flex-start;
    flex-wrap: wrap;
    position: relative;
}

/*#ContentContainer:not(.show-all) .image-container:not(.selected),
#ContentContainer.show-all .image-container.show-all-ignore,*/
.image-container.selected .image-container-header {
    display: none;
}

.image-container.selected .image-container-body {
    background-color: white;
}
/* #endregion */

.short-cut-grid-container {
    display: grid;
    grid-template-columns: repeat(auto-fill, 78px);
    grid-column-gap: 8px;
    grid-row-gap: 4px;
    max-width: calc(78px * 10 + 8px * 9); /* auto fill a max of 10 columns */
}

.short-cut-button {
    font-family: Arial;
    border-radius: 0.25rem;
    font-size: 10px;
    width: 78px;
    padding: 0px;
    margin: 0px;
    font-weight: normal;
    text-align: center;
    white-space: nowrap;
    overflow: hidden;
    border: none;
    padding: 2px 0;
}

    .short-cut-button:hover {
        box-shadow: 0 2px 8px 0 rgba(0, 0, 0, 0.15);
    }

    .short-cut-button-wrapper.new-row {
        grid-column-start: 1;
    }

.ShortCut {
    background-color: var(--light-grey);
}

.ShortCutHighlight {
    background-color: lightblue;
}

.ShortCutOutside {
    background-color: #bbd002;
    color: black;
}

.ShortCutVideo {
    color: #940000;
}

.settings-grid-container {
    display: grid;
    grid-template-columns: max-content auto;
    grid-row-gap: 0.25rem;
    grid-column-gap: 0.5rem;
}

/* #endregion */

/*#region TILE UPLOAD*/
.upload-tile:not(.selected) .selected-icon-active {
    display: none;
}

.upload-tile.select-mode .image-card-menu-right {
    display: flex;
}

.upload-tile:not(.is-secondary) .is-secondary-icon-active,
.upload-tile:not(.do-not-show) .do-not-show-icon-active,
.upload-tile:not(.specific-label) .specific-label-icon-active,
.upload-tile:not(.edit-clone-request) .edit-clone-request-icon-active,
.upload-tile:not(.comment) .comment-icon-active {
    display: none;
}

.upload-tile.do-not-show .do-not-show-icon-inactive {
    color: transparent;
}

.upload-tile-container {
    display: grid;
    grid-template-columns: repeat(auto-fill, 115px);
    grid-column-gap: 0.25rem;
    grid-row-gap: 0.25rem;
}

.upload-preview-container.show-large-thumbs .upload-tile-container {
    grid-template-columns: repeat(auto-fill, 345px);
}

.upload-preview-container.show-large-thumbs .upload-tile.image-card .image-card-photo {
    height: 219px;
}

.upload-preview-container:not(.show-file-name) .upload-tile .upload-tile-file-name,
.upload-preview-container.show-file-name .upload-tile .upload-tile-image-number {
    display: none;
}
/*#endregion*/
/*#region IMAGES*/
.bg-image-placeholder {
    background-color: var(--light-gray) !important;
    /* font aweasome SVG */
    background-image: url('data:image/svg+xml;charset=utf-8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512" fill="%23D4D7D9"><!--! Font Awesome Pro 6.4.0 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license (Commercial License) Copyright 2023 Fonticons, Inc. --><path d="M0 96C0 60.7 28.7 32 64 32H448c35.3 0 64 28.7 64 64V416c0 35.3-28.7 64-64 64H64c-35.3 0-64-28.7-64-64V96zM323.8 202.5c-4.5-6.6-11.9-10.5-19.8-10.5s-15.4 3.9-19.8 10.5l-87 127.6L170.7 297c-4.6-5.7-11.5-9-18.7-9s-14.2 3.3-18.7 9l-64 80c-5.8 7.2-6.9 17.1-2.9 25.4s12.4 13.6 21.6 13.6h96 32H424c8.9 0 17.1-4.9 21.2-12.8s3.6-17.4-1.4-24.7l-120-176zM112 192a48 48 0 1 0 0-96 48 48 0 1 0 0 96z"/></svg>') !important;
    background-size: contain !important;
}
/*#endregion*/

/*#region TOSS*/
.toss-item-wrapper {
    position: fixed;
    transition: transform calc(var(--TPConfig_TossToAnimationMs) * 1ms) linear /* cubic-bezier(0.7, 0.44, 0.44, 0.165) */;
}

.toss-item {
    transition: transform calc(var(--TPConfig_TossToAnimationMs) * 1ms) linear /* cubic-bezier(0.165, 0.44, 0.44, 0.7) */;
}

.toss-target-shake {
    animation: tossTargetShake calc(var(--TPConfig_TossToShakeAnimationMs) * 1ms);
}

@keyframes tossTargetShake {
    25% {
        transform: translateX(6px);
    }

    50% {
        transform: translateX(-4px);
    }

    75% {
        transform: translateX(2px);
    }

    100% {
        transform: translateX(0);
    }
}
/*#endregion*/

.pulse-size {
    animation: pulseSize 1s linear infinite;
}

@keyframes pulseSize {
    0% {
        transform: scale(1, 1);
    }

    50% {
        transform: scale(1.3, 1.3);
    }

    100% {
        transform: scale(1, 1);
    }
}

@media (min-width: 768px) {
    .label-box {
        font-size: 15px;
    }

        .label-box .description {
            font-size: 12px;
        }

    .tooltip-got-it .tooltip-inner {
        padding: 6px 8px 8px 8px;
    }

    .tooltip-got-it .got-it-content {
        font-size: 12px;
    }

    .got-it-button {
        font-size: 12px;
        padding: 0.25rem 1rem;
    }

    .tooltip-got-it .tooltip-bottom {
        margin-top: 1rem;
    }
}

.tiny { font-size:8px; }

tr.text-right, td.text-right    { text-align: right !important; }
tr.text-left, td.text-left      { text-align: left !important; }
tr.text-center, td.text-center  { text-align: center !important; }
