/* START OF ROOT COLORS */
:root {
    --kt-primary: #EC6F66 !important;
    --kt-primary-inverse: #ffffff !important;
}

/* END OF ROOT COLORS */

/* MAIN TEMPLATE STYLING */

.document-preview-backdrop.show {
    position: fixed;
    top: 0;
    left: 0;
    z-index: 1051;
    width: 100vw;
    height: 100vh;
    background-color: #000;
    opacity: 0.5;
}

/* END OF MAIN TEMPLATE STYLING */

/* START OF STYLE DROPZONE */
.fw_dropzone>div {
    border-radius: 0px 5px 5px 0px;
}

/* END OF START STYLE DROPZONE */

/* START OFFCANVAS STYLING */
.offcanvas.show {
    visibility: visible;
}

h5.offcanvastitle_main {
    width: fit-content;
}

.offcanvas {
    transition: transform 0.26s ease-in-out;
    /* Sneller dan default 0.3s */
}

.offcanvasProperty {
    margin-top: 1rem;
}

.offcanvas-backdrop {
    transition: opacity 0.26s ease-in-out;
}

.noResultsFound {
    display: flex;
    justify-content: center;
    color: #e7a488;
    background-color: #FDF6F3;
    border: 1px solid #f7dcd2;
    align-content: center;
    border-radius: 10px;
    padding: 5px;
}

.active-tasks-tooltip {
    box-shadow: rgba(99, 99, 99, 0.2) 0px 2px 8px 0px
}

/* END OF OFFCANVAS STYLING */



/* REAPP MEGA MENU MEGAMENU STYLING */


/* ====== Navbar container ====== */
.reapp-navbar {
    background-color: #44486484 !important;
    z-index: 1200 !important;
}

.reapp-navbar .nav-link {
    padding: .25rem 1rem !important;
    font-weight: 400 !important;
}

.reapp-navbar .nav-link:hover {
    border-radius: 50px;
    background-color: #55596E !important;
    text-decoration: none;
}

#menu-items-container .nav-link.active {
    border-radius: 50px !important;
    background-color: #55596E !important;
    border-bottom: 0 !important;
    color: #fff !important;
    margin-bottom: 0 !important;
    border-bottom: 0px !important;
}

/* ====== Dropdown (megamenu) ====== */
#dropdown-megamenu {
    z-index: 3000 !important;
    width: auto !important;
    top: 44px !important;
    min-width: auto !important;
    border-radius: 15px !important;
    padding: 0px !important;
}

.reapp-navbar .dropdown-menu[data-bs-popper] {
    top: 100% !important;
    left: 6% !important;
    margin-top: .125rem !important;
}

#MegaMenuBox.megamenu {
    display: flex;
    gap: 10px;
    /* (= de oude p-1/padding space tussen kaarten) */
    align-items: stretch;
    /* alle child columns even hoog */
    padding: 10px;
    /* kleine binnenmarge zoals voorheen */
    box-sizing: border-box;
}

/* ====== Typografie & opmaak binnen megamenu ====== */
#MegaMenuBox {
    font-size: 14px;
    font-family: Mulish, system-ui, sans-serif;
}

#menu-items-container {
    font-weight: normal !important;
}

#menu-items-container .seccond-text {
    color: rgb(33, 33, 33) !important;
    font-weight: 300 !important;
}

#menu-items-container .seccond-text.disabled {
    color: #3d3d3d82 !important;
    pointer-events: none;
}

#menu-items-container .fw-bold {
    font-weight: 700 !important;
}

#menu-items-container .first-item-box {
    height: 5.5rem !important;
}

/* Link pill baseline */
.megamenu .menu-link {
    display: inline-block;
    padding: 4px 0.6rem;
    border-radius: 30px;
    text-decoration: none;
    transition: background-color .15s ease;
    color: #1e202b !important;
    font-weight: 500 !important;

    &.disabled {
        pointer-events: none;
        color: rgba(255, 255, 255, 40%) !important;
    }
}



/* Hover-pill: 1e kolom zacht roze; overige wit */
.megamenu .col-2:first-child .menu-link:hover {
    background: #F7D7D1;
}

.megamenu .menu-link:hover {
    background: #fff;
}

.megamenu .bg-grad-home .menu-link:hover {
    background: #F7D7D1;
}

/* ====== Kolommen met gradient background via ::before/::after ====== */
.megamenu-column {
    flex: 1 0 auto;
    /* alle kaarten verdelen de rij gelijkmatig */
    /* width: 16.67%; */
    -webkit-box-shadow: rgba(0, 0, 0, 0.1) 0px 4px 12px;
    box-shadow: rgba(0, 0, 0, 0.1) 0px 4px 12px;
    width: 220px;
    min-width: 0;
    /* voorkomt overflow door lange woorden */
    position: relative;
    overflow: hidden;
    border-radius: 1.5rem;
    display: flex;
    flex-direction: column;
    min-height: 220px;
    /* baseline hoogte zoals voorheen */
    box-sizing: border-box;
}

/* remove box shadow from home column */
.megamenu-column.bg-grad-home {
    box-shadow: none;
    -webkit-box-shadow: none;
}

.megamenu-body {
    flex: 1 1 auto;
    overflow: hidden;
    padding-bottom: .5rem;
}

.megamenu-footer {
    margin-top: auto;
    z-index: 1;
}

.megamenu-footer-btn {
    min-width: 100px;
}

/* gradient lagen; kleuren via variabelen die uit module-classes komen */
.megamenu-column::before,
.megamenu-column::after {
    content: "";
    position: absolute;
    inset: 0;
    z-index: 0;
    transition: opacity .35s ease;
    border-radius: inherit;
}

.megamenu-column::before {
    background: var(--bg-gradient-low);
    opacity: 1;
}

.megamenu-column::after {
    background: var(--bg-gradient-high);
    opacity: 0;
}

.megamenu-column>* {
    position: relative;
    z-index: 1;
}

/* Hover wisselt naar de "high" gradient */
.megamenu-column:hover::after {
    opacity: 1;
}

.megamenu-column:hover::before {
    opacity: 0;
}

/* Actieve kolom blijft op "high" */
.megamenu-column.is-active::after {
    opacity: 1;
}

.megamenu-column.is-active::before {
    opacity: 0;
}

/* column disabled (doesnt have module) */

#menu-items-container .megamenu-column.disabled {
    pointer-events: none;
    background: linear-gradient(180deg, #E6E5E6 0%, #B4B4B4 100%) !important;
    color: #7A7B81 !important;

    .megamenu-footer-btn.menu-link {
        color: #1e202b !important;
    }

    .menu-link,
    .seccond-text {
        pointer-events: none;
        color: #7A7B81 !important;
    }
}

.megamenu-column.disabled::before {
    background: linear-gradient(180deg, #E6E5E6 0%, #B4B4B4 100%) !important;
    color: #7A7B81 !important;
}

.megamenu-column.disabled::after {
    background: linear-gradient(180deg, #E6E5E6 0%, #B4B4B4 100%) !important;
    color: #7A7B81 !important;
}

.megamenu-footer-learn-more {
    pointer-events: all !important;
}

/* ====== Per-module gradient variabelen ====== */
.bg-grad-home {
    --bg-gradient-low: linear-gradient(340deg, rgba(253, 253, 253, 0.25) 0%, rgba(253, 253, 253, 0.25) 100%);
    --bg-gradient-high: linear-gradient(340deg, rgba(253, 253, 253, 1) 0%, rgba(253, 253, 253, 1) 100%);
}

.bg-grad-asset_management {
    --bg-gradient-low: linear-gradient(340deg, rgba(45, 177, 156, 0.25) 0%, rgba(60, 211, 156, 0.25) 100%);
    --bg-gradient-high: linear-gradient(340deg, rgba(45, 177, 156, 1) 0%, rgba(60, 211, 156, 1) 100%);
}

.bg-grad-leasing {
    --bg-gradient-low: linear-gradient(340deg, rgba(236, 111, 102, 0.25) 0%, rgba(243, 161, 131, 0.25) 100%);
    --bg-gradient-high: linear-gradient(340deg, rgba(236, 111, 102, 1) 0%, rgba(243, 161, 131, 1) 100%);
}

.bg-grad-investments {
    --bg-gradient-low: linear-gradient(340deg, rgba(78, 149, 217, 0.25) 0%, rgba(131, 203, 235, 0.25) 100%);
    --bg-gradient-high: linear-gradient(340deg, rgba(78, 149, 217, 1) 0%, rgba(131, 203, 235, 1) 100%);
}

.bg-grad-market_insights {
    --bg-gradient-low: linear-gradient(340deg, rgba(229, 171, 240, 0.25) 0%, rgba(137, 195, 232, 0.25) 100%);
    --bg-gradient-high: linear-gradient(340deg, rgba(229, 171, 240, 1) 0%, rgba(137, 195, 232, 1) 100%);
}

.bg-grad-reporting {
    --bg-gradient-low: linear-gradient(340deg, rgba(240, 171, 208, 0.25) 0%, rgba(232, 214, 137, 0.25) 100%);
    --bg-gradient-high: linear-gradient(340deg, rgba(240, 171, 208, 1) 0%, rgba(232, 214, 137, 1) 100%);
}

/* ====== Knop (dropdown toggle) achtergrond per actieve module ====== */
.btn-grad-asset_management {
    background: var(--bg-am-high, linear-gradient(340deg, rgba(45, 177, 156, 1), rgba(60, 211, 156, 1)));
}

.btn-grad-leasing {
    background: var(--bg-leasing-high, linear-gradient(340deg, rgba(236, 111, 102, 1), rgba(243, 161, 131, 1)));
}

.btn-grad-investments {
    background: var(--bg-investments-high, linear-gradient(340deg, rgba(78, 149, 217, 1), rgba(131, 203, 235, 1)));
}

.btn-grad-market_insights {
    background: var(--bg-market-high, linear-gradient(340deg, rgba(229, 171, 240, 1), rgba(137, 195, 232, 1)));
}

.btn-grad-reporting {
    background: var(--bg-reporting-high, linear-gradient(340deg, rgba(240, 171, 208, 1), rgba(232, 214, 137, 1)));
}

.reapp-navbar .dropdown-toggle::after {
    display: none !important;
}

/* bootstrap caret uit */


/* END OF REAPP MEGA MENU STYLING */

/* MAPBOX */

.dashboard-card-item-map {
    padding: 0px !important;
}

.mapboxgl-popup-anchor-right .mapboxgl-popup-tip {
    border-color: #ffffff00 !important;
    border-left-color: #1E202B !important;
}

.mapboxgl-popup-anchor-top .mapboxgl-popup-tip {
    border-color: #ffffff00 !important;
    border-bottom-color: #1E202B !important;
}

.mapboxgl-popup-anchor-left .mapboxgl-popup-tip {
    border-color: #ffffff00 !important;
    border-right-color: #1E202B !important;
}

.mapboxgl-popup-anchor-top-left .mapboxgl-popup-tip {
    border-color: #ffffff00 !important;
    border-bottom-color: #1E202B !important;
}

.mapboxgl-popup-anchor-top-right .mapboxgl-popup-tip {
    border-color: #ffffff00 !important;
    border-bottom-color: #1E202B !important;
}

.mapboxgl-popup-anchor-bottom .mapboxgl-popup-tip {
    border-color: #ffffff00 !important;
    border-top-color: #1E202B !important;
}

.mapboxgl-popup-anchor-bottom-left .mapboxgl-popup-tip {
    border-color: #ffffff00 !important;
    border-top-color: #1E202B !important;
}

.mapboxgl-popup-anchor-bottom-right .mapboxgl-popup-tip {
    border-color: #ffffff00 !important;
    border-top-color: #1E202B !important;
}


/* END OF MAPBOX STYLING */

/* INPUT STYLING */
.autocomplete_tags_input:focus {
    border-bottom: 0px !important
}

/* END OF INPUT STYLING */

/* START OF TABLE CSS */

tbody.inquiryTableRow:hover {
    transform: unset !important;
}

.delete-table-record-btn {
    width: 25px;
    height: 25px;
    display: flex;
    align-content: center;
    justify-content: center;
    align-items: center;
    border-radius: 50%;
    padding: 20px;

}

.delete-table-record-btn:hover {
    background-color: #1e202b;
}


/* END OF TABLE CSS */

/* OFFCANVAS CONTROLS */

.offcanvas_control_btns {

    &&.inquiry_control_btns {
        margin-top: 5rem;
    }

    &&.opportunity_control_btns {
        margin-top: 5rem;
    }

    &&.lease_transaction_control_btns {
        margin-top: 5rem;
    }

    &&.investment_transaction_control_btns {
        margin-top: 5rem;
    }

}



/* END OF OFFCANVAS CONTROLS */


/* START OF SEARCHBAR STYLE */

.search_result .search-address::before {
    content: "" !important;
}

.search_result .search-property-address::before {
    content: "" !important;
}

#searchDocumentName {
    border-top-right-radius: 10px;
    border-bottom-right-radius: 10px;
    border-top: 1px solid #ced4da;
    border-right: 1px solid #ced4da;
}

/* END OF SEARCHBAR STYLE */


/* START OF STACKING STYLE */
.building-container {
    width: 100%;
    padding: 20px;
    overflow: hidden;
}

.floor-number-container {
    min-width: 40px;
    text-align: right;
}

.floor-number {
    padding: 0 10px;
}

.building-floor {
    display: flex;
    align-items: center;
    height: 30px;
    margin-bottom: 1px;
}

.floor-units {
    height: 30px;
    display: flex;
    column-gap: 2px;
    position: relative;
    z-index: unset;
}

.tenant-container {
    display: flex;
    flex-wrap: wrap;
    column-gap: 10px;
    align-items: center;
    padding: 3px 5px;
    white-space: nowrap;
    position: relative;
    z-index: unset;
}

.tenant-name {
    font-weight: bold;
}

.building-floor {
    height: auto;
}

.tenant-container {
    /* flex: 1 0 auto !important; */
    min-width: 105px;
    max-height: 45px;
    display: flex;
    column-gap: 10px;
    align-items: center;
    padding: 3px 5px;
    white-space: nowrap;
    z-index: unset;
    margin-top: 3px;
    margin-bottom: 3px;
}

.floor-units {
    height: auto;
    /* overflow: hidden; */
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
}

/* Tooltip text */
.tenant-container .tooltiptext {
    white-space: normal;
    visibility: hidden;
    width: 300px;
    height: auto;
    background-color: white;
    color: #fff;
    text-align: center;
    padding: 5px 0;
    border-radius: 6px;
    transform: translate(-50%, -50%);
    position: absolute !important;
    z-index: 99999;
}

/* Show the tooltip text when you mouse over the tooltip container */
.tenant-container:hover .tooltiptext {
    visibility: visible;
    display: block;
    position: fixed !important;
}

.tenant-container .tooltiptext::after {
    content: " ";
    position: absolute !important;
    /* bottom of tooltip */
    top: 100%;
    left: 50%;
    margin-left: -5px;
    /* rolate 90 degrees */
    transform: rotate(-90deg);
    border-width: 5px;
    border-style: solid;
    border-color: transparent white transparent transparent;
}

.tenant-status-vacant {
    background-color: #d4e7a6 !important;
    color: #2e3126;
}

.tenant-status-selected-vacant {
    background-color: #e75a5a !important;
    color: #ffffff !important;
    cursor: pointer;
}

.tenant-status-occupied {
    background-color: #657278 !important;
    color: white;
}

.tenant-status-ending {
    background-color: #657278;
    color: white;
}

.floor-units {
    cursor: pointer;
}


/* END OF STACKING STYLE */


/* START OF DEAD DEAL AND ACTIVE OPPORTUNITY TOOLTIP WITH CHART (OFFCANVAS PROPERTY) STYLING */

/* tooltip style */
.deaddeal-tooltip,
.active-opportunities-tooltip {
    white-space: normal;
    min-width: 350px;
    min-height: 230px;
    right: 150px;
    top: 260px;
    background-color: #ffffffc4;
    backdrop-filter: blur(8px);
    color: #fff;
    border-radius: 6px;
    position: absolute !important;
    z-index: 99999;
}

.active-opportunities-tooltip {
    right: unset !important;
    left: 140px !important;
    padding-left: 20px;
    padding-top: 5px;
}

.active-opportunities-tooltip::before {
    right: 100% !important;
    left: unset !important;
    transform: rotate(0deg) !important;
}

/* show arrow at bottom of tooltip */
.deaddeal-tooltip::before,
.active-opportunities-tooltip::before {
    content: " ";
    position: absolute !important;
    top: 20%;
    left: 100%;
    transform: rotate(-180deg);
    border-width: 5px;
    border-style: solid;
    border-color: transparent #ffffffc4 transparent transparent;
    backdrop-filter: blur(8px);
}



.deaddeal-chart-body {
    max-height: 200px;
    display: flex;
    position: relative;
    justify-content: flex-end;
    align-items: center;
}


.deaddeal-body,
.active-opportunities-body {
    display: flex;
    flex-direction: row;
    padding: 10px;
    min-height: 230px;
}

.active-opportunities-body {
    display: unset;
}

.deaddeal-legend-body,
.active-opportunities-legend-body {
    padding-right: 20px;

    h6 {
        font-size: 15px;
        font-weight: 600;
        color: #000;
    }
}

.active-opportunities-chart-body {
    display: flex;
    justify-content: start;
}



.deaddeal-chart-body,
.deaddeal-legend-body,
.active-opportunities-chart-body,
.active-opportunities-legend-body {
    flex: 1;
}


/* END OF DEAD DEAL AND ACTIVE OPPORTUNITY TOOLTIP STYLING */


.offcanvas-body .table>:not(caption)>*>* {
    padding: .25rem .25rem;
}

#object_property_log .propertylog-item {
    border-bottom: #0000001a 1px solid;
    padding-top: 10px;
    padding-bottom: 10px;
    margin-top: 10px;
    margin-bottom: 10px;
}

#object_property_log .propertylog-item-content {
    padding-left: 15px;
}

#object_property_log .propertylog-item-icon {
    min-width: 20px;
    height: auto;
}

.property-log-clickable-link {
    cursor: pointer;
}

#object_property_log .propertylog-secondary-content {
    padding-left: 35px;
}

.tenant-tooltip-body {
    background-color: #ffffff !important;
    background: none !important;
}

.lease_control_btns {
    margin-top: 5rem !important;
}

.offcanvas_control_btns {
    display: flex;
    flex-direction: column;
    align-content: center;
    justify-content: space-between;
    align-items: center;
}

.btn-close {
    background: none;
}

.stage-onhold-color {
    background-color: black;
}

.btn-offcanvas-close {
    font-size: 16px;
    color: #000 !important;
    font-weight: 100;
}

.propertylog-secondary-content a {
    float: none !important;
    margin-left: 35px;
}

.edit-note-save-btn {
    font-size: 15px;
    text-decoration: none;
    cursor: pointer;
}

.edit-note-save-btn:hover {
    text-decoration: none;
}

.edit-note-cancel-btn {
    font-size: 15px;
    text-decoration: none;
    cursor: pointer;
    color: #7A7B82 !important;
    margin-right: 0.4rem;
}

.edit-note-buttons {
    display: flex;
    justify-content: flex-start;
    align-items: center;
}


.offcanvas-title {
    color: #ffffff;
}

.btn-property-log-filter {
    background-color: #D54074;
    color: #ffffff;
    border: 0px;
    border-radius: 10px;
    padding: 5px 15px 5px 15px;
    margin-right: 10px;
}

.btn-property-log-filter.active {
    background-color: #ffffff;
    color: #D54074;
}

.propertylog_drop_in_agenda {
    display: block;
    margin-top: 10px;
    margin-left: 30px;
    width: 15%;
    background: white !important;
    border-color: #D54074 !important;
}

input.form-checkbox {
    margin-top: 10px;
    padding: .375rem .75rem;
}

.property-note-header {
    /* border bottom thin line to invisible */
    border-bottom: 1px solid #00000014;

}

.usernote:hover .notes-action-delete-button {
    animation: show-ease-in 0.5s forwards 0.2s;
}

.dropdown-remove-data-btn {
    color: #CDCDCD !important;
}

.prime-rent-icon,
.average-rent-icon {
    margin-left: -20px;
}

.rent-icon-neutral {
    /* orange */
    color: #DE7628;
}

.rent-icon-positive {
    /* green */
    color: #00BFA6;
}

.rent-icon-negative {
    /* red */
    color: #FF5252;
}

.usernote:hover .notes-action-edit-button {
    animation: show-ease-in 0.5s forwards;
}

.notes {
    color: #1E202B !important;
}

@keyframes show-ease-in {
    0% {
        opacity: 0;
    }

    100% {
        opacity: 1;
    }
}

.usernote .notes-action-edit-button,
.usernote .notes-action-delete-button {
    opacity: 0;
}

#leasesStatsDiv {
    margin-top: 1rem;
    margin-bottom: 1rem;
    margin-left: 1rem;
    margin-right: 1rem;
    background-color: #79a2db;
    border-radius: 15px;
    padding: 10px;
}


.primary-nav-dropdown>.dropdown-menu-right {
    /* align menu right and text left */
    right: 0 !important;
    left: auto !important;
    text-align: left !important;
}

.primary-nav-dropdown>.dropdown-toggle::after {
    /* hide arrow */
    display: none;
}

.primary-nav-dropdown>.dropdown-toggle {
    /* background white */
    background-color: #ffffff !important;
    /* margins */
    margin-right: 10px;
    margin-left: 10px;
}

.dd-reason-heart-icon,
.dd-reason-x-icon {
    /* color gray */
    color: #7A7B82;
    /* font size */
    font-size: 2.1em;
}

.dd-reason-heart-icon.active,
.dd-reason-x-icon.active {
    color: #D54074;
    transition-duration: 0.5s;
}

.dd-reason-heart-icon:hover,
.dd-reason-x-icon:hover {
    /* spring out */
    transform: scale(1.3);
    transition-duration: 0.3s;
}

.dd-reason {
    /* bold */
    font-weight: 600;

}

.lease-years-left {
    /* grayed out */
    color: #7A7B82;

}

#JSFrameworkOffCanvasend.show {
    z-index: 1041;
}

#accordionReappTesting {

    .reapp-testing-header-spinner,
    .reapp-testing-header-success,
    .reapp-testing-header-error {
        margin-left: 10px;
    }

    .reapp-testing-function-spinner,
    .reapp-testing-function-error,
    .reapp-testing-function-success {
        margin-right: 10px;
    }

    .accordion-body {
        background-color: #c6c8df;
    }

    .accordion-item {
        background-color: #1f2135;
    }

    .accordion-button {
        background-color: #8e92c3;
    }
}

.lease-secondary-info,
.lease-transaction-secondary-info {
    font-style: italic;
    font-size: 12px;
    font-weight: 300;
    color: #7A7B82;
}

.like-icon {
    position: absolute;
    bottom: 0;
    left: 40px;
    /* font size */
    font-size: 1.2em;
}

.like-icon:hover {
    /* spring out */
    transform: scale(1.3);
    transition-duration: 0.3s;


}

#skeleton-comment-field {
    margin-bottom: 2rem;
}

.skeleton {
    animation: skeleton-loading 1s linear infinite alternate;
}

@keyframes skeleton-loading {
    0% {
        background-color: hsl(200, 20%, 80%);
    }

    100% {
        background-color: hsl(200, 20%, 95%);
    }
}

.skeleton-text {
    width: 100%;
    height: 0.7rem;
    margin-bottom: 0.5rem;
    border-radius: 0.25rem;
}

.skeleton-text-small {
    width: 30%;
}


#reappAiAwnserTextArea {
    width: 100%;
    /* height: max-content; */
    min-height: 100px;
    /* max-height: 400px; */
    /* overflow-y: hidden; */
    resize: none;
    background: none;
    border: none;
    color: white;
    padding-inline: 14px;
}

.loader {
    width: 48px;
    height: 48px;
    border-radius: 50%;
    display: inline-block;
    position: fixed;
    top: 50%;
    left: 50%;
    border: 3px solid;
    border-color: #d5407460 #d5407460 transparent;
    box-sizing: border-box;
    animation: rotation 1s linear infinite;
}

.loader::after {
    content: '';
    box-sizing: border-box;
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    margin: auto;
    border: 3px solid;
    border-color: transparent #EC6F66 #EC6F66;
    width: 24px;
    height: 24px;
    border-radius: 50%;
    animation: rotationBack 0.5s linear infinite;
    transform-origin: center center;
}

@keyframes rotation {
    0% {
        transform: rotate(0deg);
    }

    100% {
        transform: rotate(360deg);
    }
}

@keyframes rotationBack {
    0% {
        transform: rotate(0deg);
    }

    100% {
        transform: rotate(-360deg);
    }
}

.tooltip.bs-tooltip-top {
    z-index: 9999;
}

.table-log tr>:nth-child(3) {
    min-width: 0px;
}

.inquiry-back-btn {
    cursor: pointer;
}

.inquiryFirstTableRow {
    border-bottom: hidden;
}

.inquiryFirstTableRow:hover {
    border-bottom: hidden !important;
}

/* if .inquiryFirstTableRow gets hover background color the closest .inquirySecondaryTableRow */
/* will get the same background color */
tr.inquiryFirstTableRow:hover+tr.inquirySecondaryTableRow {
    background-color: #ffffff40 !important;
    border-bottom: #ffff 1px solid !important;
}

/* if secondary row gets hover do same to first tabel row */
tr.inquiryFirstTableRow:has(+tr.inquirySecondaryTableRow:hover) {
    background-color: #ffffff40 !important;
    box-shadow: 0px !important;
    -webkit-box-shadow: 0px !important;
}

tr.inquirySecondaryTableRow:hover,
tr.inquiryFirstTableRow:hover {
    box-shadow: none !important;
    -webkit-box-shadow: none !important;
}

tr.inquirySecondaryTableRow>td {
    padding-top: 0px !important;
}

.tblProposalShared>table>tbody>tr>td {
    color: #000000;
}


.tenant-id {
    display: none;
}

.selectedProperty {
    background-color: #d5407460 !important;
    border-radius: 10px;
}

.addPropertyDiv {
    background-color: #ffffff;
    border-radius: 10px;
    padding: 10px;
    margin-bottom: 10px;
    cursor: pointer;
    transition: all 0.09s;
    color: #000000;
}


.selectedCompany {
    background-color: #d5407460;
    border-bottom: 2px solid #D54074 !important;
}

.selectedSharedProperty {
    background-color: #d5407460;
    border-bottom: 2px solid #D54074 !important;
    transition: 0s !important;
}

#tBodyAllPropertiesTable .selectedSharedProperty:hover {
    background-color: #d5407460 !important;
    border-bottom: 2px solid #D54074 !important;
    transition: 0s !important;
}

#tBodyAllPropertiesTable .propertyDiv:hover {
    border-bottom-color: rgba(240, 240, 242, 0.5) !important;
    border-radius: 0px !important;
    box-shadow: unset;
    transition: 0s !important;
    background-color: unset;
}

.no-wrap-text {
    max-width: 100px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.offcanvasOppertunity_mainDetails {
    color: #7A7B82;
    font-family: 'Mulish' !important;
    font-weight: 300;
    font-size: 18px;
}

.offcanvasOppertunity_mainDetails_div {
    min-width: 125px;
}

#object_analytics {
    padding: 10px;
}

.oppertunityStage_div {
    border-width: 7px 2px 35px 2px;
    border-style: solid;
    text-align: center;
    border-color: black;
    border-radius: 9px;
    height: 36px;
    border-top-color: black;
    border-top-style: solid;
    margin-top: 5px;
    margin-left: auto;
    max-width: 185px;
}

.oppertunityStage_div span {
    font-size: 14px;
    font-weight: 600;
    color: #000;
    margin-top: 5px;

}

.offcanvas-secondaryInfo {
    display: flex;
    flex-direction: column;
    flex-wrap: wrap;
    align-content: flex-end;
    justify-content: center;
    align-items: flex-end;
    color: #7A7B82;
    text-align: end;
}

/* addproperty table */
.propertyInfoTD {
    min-width: 50px;
}

.propertyInfoTD a {
    min-width: 50px;
}

/* end addproperty table */
/* start offcanvas property info */
.property-data-title,
.property-data-value {
    width: 50%;
}

.property-data-title {
    font-weight: 600;
    color: #EC6F66;
    width: 30%;

}

#objectPropertyInfo {
    margin-top: 20px;
}

#objectPropertyInfo .col {
    align-content: center;
    border-bottom: 1px solid #00000017;
}

#JSFrameworkOffCanvasend:has(#sharedPropertyInfoOffCanvas) {
    z-index: 1151;
}

/* end offcanvas property info */
.addBtnSvg {
    position: relative;
    text-align: center;
    display: block;
    background-image: linear-gradient(to right, #D54074, #DE7628);
    -webkit-box-shadow: 1pt 0pt 2pt 0pt rgba(0%, 0%, 0%, 0.2);
    cursor: pointer;
    height: 40px;
    width: 45px;
    border-radius: 10%;
}

.addBtnSvg svg {
    transition: all 0.2s;
    filter: invert(1);
}

.hidden-save-btn {
    display: none;
}


#addCompanyBtn {
    position: relative;
    text-align: center;
    display: block;
    background-image: linear-gradient(to right, #D54074, #DE7628);
    -webkit-box-shadow: 2pt 0pt 4pt 0pt rgba(0%, 0%, 0%, 0.4);
    cursor: pointer;
    height: 40px;
    width: 45px;
    border-radius: 10%;
}

#addBtn {
    background-color: #ffffff;
    font-weight: 600;
    color: #D54074;
    top: 145px;
    left: 0px;
    width: 50px;
    height: 50px;
    position: absolute !important;
    text-align: center;
    display: block;
    border-top-right-radius: 5px 5px;
    border-bottom-right-radius: 5px 5px;
    border-bottom-left-radius: 0px 0px;
    border-top-left-radius: 0px 0px;
    background-image: linear-gradient(to right, #D54074, #DE7628);
    -webkit-box-shadow: 2pt 0pt 4pt 0pt rgba(0%, 0%, 0%, 0.4);
    cursor: pointer;
}

#addBtnIcon svg {
    transition: all 0.2s;
}

#addBtn:hover svg {
    opacity: 0.8;
}

#addBtnIcon {
    color: #ffffff;
    display: inline-block;
    vertical-align: middle;
    margin-top: 20%;
}

#addBtnIcon,
#addCompanyBtn svg {
    filter: invert(100%);
}

#addItemsContentContainer {
    opacity: 0.95;
    position: absolute;
    top: 140px;
    left: 70px;
    z-index: 98;
}

#arrowAddItems {
    position: absolute;
    top: 15px;
    left: -5px;
    width: 25px;
    height: 25px;
    background-color: #ffffff;
    transform: rotate(45deg);
    overflow: hidden;
}

#addItemsDiv {
    position: relative;
    text-align: left;
    background-color: #ffffff;
    border-top-width: 1px;
    border-right-width: 1px;
    border-bottom-width: 1px;
    border-left-width: 1px;
    border-top-right-radius: 12px 12px;
    border-bottom-right-radius: 12px 12px;
    border-bottom-left-radius: 12px 12px;
    border-top-left-radius: 12px 12px;
    width: 235px;
}

#addItemDiv {
    font-family: "AvenirNext-Regular", "Avenir Next", Arial;
    width: 100%;
    height: 47px;
    position: relative;
    overflow: visible;
    display: block;
    font-size: 15px;
    color: #272B38;
    cursor: pointer;
    border-bottom-color: #E6E6E6;
    border-bottom-width: 1px;
    border-bottom-style: solid;
}

#addItem {
    margin: 0;
    position: absolute;
    top: 50%;
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
    padding-left: 16px;
}

#addItemDiv:hover #addItem {
    color: #D54074 !important;
    opacity: 2;
    font-weight: bold;
}

.progress-reapp {
    display: flex;
    height: 3px;
    overflow: hidden;
    font-size: .75rem;
    background-color: #e9ecef;
    border-radius: 0.25rem;
    margin-left: 1rem;
    margin-right: 1rem;
    width: 100%;
}

.progress-bar-reapp {
    display: flex;
    flex-direction: column;
    justify-content: center;
    overflow: hidden;
    color: #fff;
    text-align: center;
    white-space: nowrap;
    background-color: #D54074;
    transition: width .6s ease;
}

.lease-property {
    transition: all 0.2s;
}

.lease-property:hover {
    opacity: 0.8;
}

.card-select {
    transition: all 0.2s;
}

.card-selected {
    border-radius: 10px;
    background-color: #d5407433;
    transition: all 0.2s;
}

.card-select:hover {
    opacity: 0.8;
    cursor: pointer;
}

.add-modal-back-button {
    width: 25px;
    height: auto;
    cursor: pointer;
    transition: all 0.3s;
}

.add-modal-back-button:hover {
    opacity: 0.8;
    filter: invert(100%);
}

.selectedSubmarket {
    background-color: #D54074;
}

.selected-dropdown-item {
    background-color: #D54074;
}

.dropdown-item {
    text-decoration: none;
}

.dropdown-item:hover {
    background-color: #d5407437;
    text-decoration: none;
}

.table-sort-link {
    cursor: pointer;
}

.typeahead>li {
    background-image: linear-gradient(to right, #D54074, #DE7628);
    color: #ffffff;
}

.typeahead {
    background-image: linear-gradient(to right, #D54074, #DE7628);
    color: #ffffff;
    opacity: 0.95;
}

.typeahead>li:hover,
li.active {
    text-decoration: none;
    color: #ffffff;
}

.typeahead>li>a {
    text-decoration: none;
    color: #dddbe1;
}

.typeahead>li>a>span {
    padding: 10px;
}

.mention_username {
    color: #d8d3d3;
}

#searchCompanyTable p {
    color: #000000;
}

table {
    color: #ffffff !important;
    padding: .25rem .25rem;
}

table a {
    color: #ffffff;
}

table a:hover {
    color: #ffffff;
}

table .btn-primary {
    color: #D54074 !important;
}

table .btn-primary:hover {
    color: #ffffff !important;
}

tr {
    border: none;
    border-bottom-color: #40424B;
}

#addPropertyTable {
    color: #000000 !important;
}

.addPropertyTitle {
    color: #0000002e !important;
}

.property-table-div {
    max-height: 45vh;
    overflow: auto;
}

.img-thumbnail {
    background-color: #1E202B;
    border: 0px;
    border-radius: 10px;
}

.img-thumbnail:hover {
    background-image: linear-gradient(to right, #D54074, #DE7628);
}

body {
    background-color: #1E202B;
    font-family: Poppins, sans-serif;
    font-size: 14px;
    font-weight: 400;
    color: #D6DAE3;
}

.navbar {
    background-image: linear-gradient(to right, #D54074, #DE7628);
}

.nav-item {
    font-family: Poppins, sans-serif;
    font-size: 16px;
    font-weight: 600;
    color: #ffffff;
    text-transform: lowercase;
    padding: 0px 5px 0px 5px;

}

.nav-item:active {
    text-decoration: underline;
}

.nav-link {
    color: #D6DAE3;
}

.nav-link:hover {
    color: #D6DAE3;
}

h1 {
    font-size: 32px;
    font-weight: 800;
    text-transform: lowercase;
    color: #ffffff;
}

h5 {
    font-size: 18px;
    font-weight: 800;
    color: #DE7628;
}

h6 {
    font-size: 16px;
    font-weight: 700;
    color: #1E202B;
}

a:link {
    text-decoration: none;
}

a:hover {
    text-decoration: underline;
}

th {
    font-family: Poppins, sans-serif;
    font-size: 14px;
    font-weight: 800;
    color: #DE7628;
}

.inquiryDetailsReadOnly>.row>.col-6>div.row.mb-2 {
    --bs-gutter-x: 0;
}

.badge.selected-unit {
    background-color: #f3a18324 !important;
    color: #2D2F3A !important;
    font-weight: 300 !important;
    border-radius: 6px;

}

.text-grayed-out {
    color: #D6DAE3 !important;
}

.black-bold {
    color: #000000;
    font-weight: 600;
}

.primary-color-reapp {
    background-image: linear-gradient(to right, #D54074, #DE7628);
    color: #ffffff;
}

.secondary-color-reapp {
    color: #DE7628 !important;
}

.secondary-background-reapp {
    background-color: #EB6E66 !important;
}

.form-label,
.text-nowrap {
    font-size: 16px !important;
}

.form-control-sm {
    font-size: 14px !important;
}

.offcanvas-header {
    background-image: linear-gradient(to right, #DE7628, #D54074);
}

.btn-reapp {
    background: linear-gradient(to right, #DE7628, #D54074) !important;
}

.btn-reapp:hover {
    box-shadow: 0px 0px 10px 0px black !important;
    transition: 0.2s;
}

.offcanvas-body {
    background-color: #ffffff;
    padding: 0px !important;
}

.offcanvas-secondary-background {
    background-color: #E9E9EA;
}

.rounded-5 {
    border-radius: 0.5rem !important;
}


.mt-7 {
    margin-top: 5rem !important;
}

.form-control {
    background-color: #E9E9EA;
    font-family: Poppins, sans-serif;
    font-size: 16px;
    font-weight: 400;
    color: #1E202B;
    border-radius: 10px;
}

.offcanvas {
    background-color: #1E202B;
}

.btn {
    border-radius: 10px;
    border: 0px;
    text-transform: lowercase;
    padding: 5px 15px 5px 15px;
}

.btn-primary {
    background-color: #ffffff;
    font-weight: 600;
    color: #D54074;
}

.btn-primary:hover {
    background-color: #D54074;
    color: #ffffff;
    text-decoration: none;
}

.submarkets-dropdown {
    background-color: #D54074 !important;
    color: #ffffff !important;

}

.btn-secondary {
    background-color: #D54074;
    font-weight: 600;
    color: #ffffff;
}

.btn-secondary:hover {
    background-color: #ffffff;
    border: 2px;
    border-color: #D54074;
    font-weight: 600;
    color: #D54074;
}

.btn.btn-primary.btn-sm {
    float: right;
    border: 2px;
}

.btn-warning {
    background-color: #ffffff;
    font-weight: 600;
    color: #D54074;
}

.btn-warning:hover {
    background-color: #D54074;
    font-weight: 600;
    color: #ffffff;
    text-decoration: none;
}

.btn-danger:hover {
    text-decoration: none;
}

tbody tr:hover {
    background-color: rgba(222, 118, 40, 0.2);
    border-bottom: 2px solid rgba(222, 118, 40, 1);
}


.bg-success-subtle {
    background-color: #b3feb9a8;
    color: #000000;
}

.bg-warning-subtle {
    background-color: #ffeaa3c5;
    color: #000000;
}

.bg-danger-subtle {
    background-color: #ffaaaa;
    color: #000000;
}

.text-log-items {
    color: #000000;
}

/* REAPP TOAST CSS START*/
#reappToastDiv {
    position: absolute;
}

div#reappToastDiv {
    right: 1rem;
}

#reappToastDiv {
    visibility: hidden;
    position: fixed;
    bottom: 6%;
    min-width: 100vw;
    margin: 0px;
    display: flex;
    justify-content: center;
    z-index: 9999;
}

.toastContentDiv {
    margin: 0px;
    background-color: #1E202B;
    color: #fff;
    max-width: 600px;
    font-size: 17px;
    height: 40px;
    line-height: 10px;
    border-radius: 2rem;
    display: flex;
    position: absolute;
}

.toastContent {
    margin-bottom: 0px;
    margin: 15px;
}

#reappToastDiv.show {
    visibility: visible !important;
    -webkit-animation: fadein 0.5s;
    animation: fadein 0.5s;
}

#reappToastDiv.finished {
    animation: fadeout 2s;
}

@-webkit-keyframes fadein {
    from {
        bottom: 0;
        opacity: 0;
    }

    to {
        bottom: 6%;
        opacity: 1;
    }
}

@keyframes fadein {
    from {
        bottom: 0;
        opacity: 0;
    }

    to {
        bottom: 6%;
        opacity: 1;
    }
}

@-webkit-keyframes fadeout {
    from {
        bottom: 6%;
        opacity: 1;
    }

    to {
        bottom: 0;
        opacity: 0;
    }
}

@keyframes fadeout {
    from {
        bottom: 6%;
        opacity: 1;
    }

    to {
        bottom: 0;
        opacity: 0;
    }
}


/* REAPP TOAST CSS END */

/* REAPP SUCCESS MARK START */

.checkmark {
    width: 30px;
    height: 30px;
    border-radius: 50%;
    /* display: block; */
    margin: 5px;
    stroke-width: 2;
    stroke: white;
    stroke-miterlimit: 10;
    box-shadow: inset 0px 0px 0px #2db19c;
    animation: fill .4s ease-in-out .4s forwards, scale .3s ease-in-out .9s both;
}

.checkmark__circle {
    stroke-dasharray: 166;
    stroke-dashoffset: 166;
    stroke-width: 2;
    stroke-miterlimit: 10;
    stroke: #2db19c;
    fill: none;
    animation: stroke .6s cubic-bezier(0.650, 0.000, 0.450, 1.000) forwards;
}

.checkmark__check {
    transform-origin: 50% 50%;
    stroke-dasharray: 48;
    stroke-dashoffset: 48;
    animation: stroke .3s cubic-bezier(0.650, 0.000, 0.450, 1.000) .8s forwards;
}

@keyframes stroke {
    100% {
        stroke-dashoffset: 0;
    }
}

@keyframes scale {

    0%,
    100% {
        transform: none;
    }

    50% {
        transform: scale3d(1.1, 1.1, 1);
    }
}

@keyframes fill {
    100% {
        box-shadow: inset 0px 0px 0px 30px #2db19c;
    }
}

/* REAPP SUCCESS MARK END*/

/* REAPP ERROR CROSS START */
.crossmark__circle.animateElement {
    stroke-dasharray: 166;
    stroke-dashoffset: 166;
    stroke-width: 2;
    stroke-miterlimit: 10;
    stroke: #ff0000;
    fill: none;
    animation: stroke 0.6s cubic-bezier(0.65, 0, 0.45, 1) forwards;
}

.crossmark.animateElement {
    width: 20px;
    height: 20px;
    border-radius: 50%;
    display: block;
    stroke-width: 2;
    stroke: #ff0000;
    stroke-miterlimit: 10;
    margin: 10% auto;
    box-shadow: inset 0px 0px 0px #ff0000;
    animation: fillred .4s ease-in-out .4s forwards, scale .3s ease-in-out .9s both;
}



.cross__path.animateElement {
    stroke: #ffffff;
    stroke-dasharray: 48;
    stroke-dashoffset: 48;
    transform-origin: 50% 50% 0;
}

.cross__path--right.animateElement {
    animation: 0.3s ease normal forwards 1 running stroke;
}

.cross__path--left.animateElement {
    animation: 1s ease normal forwards 1 running stroke;
}

@keyframes fillred {
    100% {
        box-shadow: inset 0px 0px 0px 30px #ff0000;
    }

}

@keyframes stroke {
    100% {
        stroke-dashoffset: 0;
    }
}

.circular-loader {
    -webkit-animation: rotate 2s linear infinite;
    animation: rotate 2s linear infinite;
    height: 30px;
    -webkit-transform-origin: center center;
    -ms-transform-origin: center center;
    transform-origin: center center;
    width: 30px;
    position: absolute;
    top: 0;
    left: 0;
    margin: auto;
}

.loader-path {
    stroke-dasharray: 150, 200;
    stroke-dashoffset: -10;
    -webkit-animation: dash 1s ease-in-out infinite, color 6s ease-in-out infinite;
    animation: dash 1s ease-in-out infinite, color 6s ease-in-out infinite;
    stroke-linecap: round;
}

@-webkit-keyframes rotate {
    100% {
        -webkit-transform: rotate(360deg);
        transform: rotate(360deg);
    }
}

@keyframes rotate {
    100% {
        -webkit-transform: rotate(360deg);
        transform: rotate(360deg);
    }
}

@-webkit-keyframes dash {
    0% {
        stroke-dasharray: 1, 200;
        stroke-dashoffset: 0;
    }

    50% {
        stroke-dasharray: 89, 200;
        stroke-dashoffset: -35;
    }

    100% {
        stroke-dasharray: 89, 200;
        stroke-dashoffset: -124;
    }
}

@keyframes dash {
    0% {
        stroke-dasharray: 1, 200;
        stroke-dashoffset: 0;
    }

    50% {
        stroke-dasharray: 89, 200;
        stroke-dashoffset: -35;
    }

    100% {
        stroke-dasharray: 89, 200;
        stroke-dashoffset: -124;
    }
}

@-webkit-keyframes color {
    0% {
        stroke: #ffffff;
    }

    40% {
        stroke: #ffffff;
    }

    66% {
        stroke: #ffffff;
    }

    80%,
    90% {
        stroke: #ffffff;
    }
}

@keyframes color {
    0% {
        stroke: #ffffff;
    }

    40% {
        stroke: #ffffff;
    }

    66% {
        stroke: #ffffff;
    }

    80%,
    90% {
        stroke: #ffffff;
    }
}

.crossMarkContainer {
    transform-origin: center;
    animation: PopIn .8s ease-in-out forwards;
    width: 20px;
    height: 20px;
    margin-left: 10px;
    margin-top: 7px;
    margin-right: 10px;
}


@keyframes PopIn {
    0% {
        transform: scale(1.3);
    }

    50% {
        transform: scale(2);
    }

    90% {
        transform: scale(1.4);
    }

    100% {
        transform: scale(1.5);
    }
}

/* REAPP ERROR CROSS END */
@media screen and (min-width: 894px) {

    /* START Active Task POPUP */
    .active-tasks-tooltip {
        white-space: normal;
        min-width: 600px;
        max-width: 600px;
        min-height: 230px;
        max-height: 350px;
        right: 80px;
        top: 50px;
        background-color: #ffffff;
        /* backdrop-filter: blur(8px); */
        /* color: #000000; */
        border-radius: 10px;
        position: absolute !important;
        z-index: 99999;
        padding-left: 20px;
        padding-top: 5px;
        -ms-overflow-style: none;
        /* IE and Edge */
        scrollbar-width: none;
        /* Firefox */

    }


    /* show arrow at bottom of tooltip */
    .active-tasks-tooltip::before {
        content: " ";
        position: absolute !important;
        top: -20px;
        right: 32px !important;
        transform: rotate(90deg) !important;
        border-width: 10px;
        border-style: solid;
        border-color: transparent #ffffff transparent transparent;
        /* backdrop-filter: blur(8px); */
    }

    /* START Active Task POPUP */
    .custom-message-menu {
        white-space: normal;
        min-width: 420px;
        max-width: 420px;
        min-height: 230px;
        /* max-height: 350px; */
        right: -19px;
        top: 50px;
        background-color: #d2d2d4;
        /* backdrop-filter: blur(8px); */
        /* color: #000000; */
        border-radius: 10px;
        position: absolute !important;
        z-index: 99999;
        /* padding-left: 20px;
        padding-top: 5px; */
        -ms-overflow-style: none;
        /* IE and Edge */
        scrollbar-width: none;
        /* Firefox */

    }


    /* show arrow at bottom of tooltip */
    .custom-message-menu::before {
        content: " ";
        position: absolute !important;
        top: -20px;
        right: 32px !important;
        transform: rotate(90deg) !important;
        border-width: 10px;
        border-style: solid;
        border-color: transparent #ffffff transparent transparent;
        /* backdrop-filter: blur(8px); */
    }

    .navTaskList {
        max-height: 275px;
        overflow: auto;
    }

    #tasks_today {
        margin-top: 15px;

    }

    #tasks_week {
        margin-top: 15px;
    }

    #tasks_all {
        margin-top: 15px;
    }

    .navTaskList::-webkit-scrollbar {
        display: none;
    }

    .active-tasks-btn {
        color: #ffffff !important;
        cursor: pointer;
    }
}



@media (min-width: 320px) and (max-width: 573px) {
    .active-tasks-tooltip {
        white-space: normal;
        min-width: 100vw;
        max-width: 100vw;
        min-height: 230px;
        max-height: 355px;
        right: 0px;
        top: 125px;
        background-color: #ffffff;
        /* backdrop-filter: blur(8px); */
        /* color: #000000; */
        border-radius: 10px;
        position: absolute !important;
        z-index: 99999;
        padding-left: 20px;
        padding-top: 5px;
        -ms-overflow-style: none;
        /* IE and Edge */
        scrollbar-width: none;
        /* Firefox */

    }


    /* .active-tasks-tooltip::before {
        right: 100% !important;
        left: unset !important;
    } */

    /* show arrow at bottom of tooltip */
    .active-tasks-tooltip::before {
        content: " ";
        position: absolute !important;
        top: -20px;
        right: 120px !important;
        transform: rotate(90deg) !important;
        border-width: 10px;
        border-style: solid;
        border-color: transparent #ffffff transparent transparent;
        /* backdrop-filter: blur(8px); */
    }

    .navTaskList {
        max-height: 275px;
        overflow: auto;
    }

    #tasks_today {
        margin-top: 15px;

    }

    #tasks_week {
        margin-top: 15px;
    }

    #tasks_all {
        margin-top: 15px;
    }

    .navTaskList::-webkit-scrollbar {
        display: none;
    }

    .active-tasks-btn {
        color: #ffffff !important;
        cursor: pointer;
    }

    .offcanvas-title {
        max-width: 250px;
    }

    .offcanvas-header .offcanvas-close-button .btn-close {
        top: 40px;
        left: -46px;
    }

    .shadow-sm {
        max-width: 90vw;
    }

    .offcanvas-body {
        overflow-x: hidden;
    }

    #main-app-content-body {
        max-width: 100%;
    }

    #inquiryTable tr {
        justify-content: unset;
    }

    .opportunitiesTable tr {
        justify-content: unset;
    }

    .opportunitiesTable {
        max-width: 90vw;
    }

    #inquiryTable {
        max-width: 90vw;
        overflow-x: hidden;
    }

    #offcanvasInquiry {
        padding-left: 0.5rem !important;
    }

    .imgSharedProperty img {
        width: 35px !important;
        height: 35px !important;
    }

    #leasesTable {
        max-width: 90vw;
    }

    .allPropertyTH,
    .propertyCheckTD,
    .allOpportunityTH,
    .opportunityCheckTD {
        min-width: 30px;
        max-width: 30px;
    }

}


@media (min-width: 320px) and (max-width: 900px) {

    .opportunity-offcanvas {
        .col-8 {
            width: 100% !important;

            #opportunityDetailsDiv {
                margin-right: 0px !important;
            }
        }

        .col-4 {
            width: 100% !important;
            margin-top: 15px;
        }
    }

    .lease-offcanvas {
        .col-8 {
            width: 100% !important;

            .bg-body {
                margin-right: 0px !important;
            }
        }

        .col-4 {
            width: 100% !important;
            margin-top: 15px;
        }
    }

    .offcanvasLeaseTransaction,
    .offcanvasLease {
        .leasedAreaDetails .row {
            --bs-gutter-x: 1.5rem !important;
        }
    }

    div.offcanvas-end {
        width: 90vw !important;
    }

    #navItemsTable {
        flex-wrap: wrap;

        .table-filters {
            flex-wrap: wrap;
        }
    }

    .quarterlyDateAndTargetSize {
        margin-left: 2px;
    }
}

#JSFrameworkError-body {
    color: white;
}

@media only screen and (max-width: 573px) {
    .offcanvasProperty .stats-container {
        display: flex !important;
        max-width: 100%;
        overflow-x: auto;
    }

    .mobile-stats {
        display: contents;
        overflow-y: none;
        padding: 5px;
    }

    .opportunities-stat {
        max-height: 50px;
        min-width: 135px;
    }

    .nav {
        overflow-y: hidden;
    }

    .card-select-opportunity {
        max-height: 100px;
    }

    .mobile-arrow {
        position: absolute;
        top: 40%;
        left: 90%;
    }

    .status-mobile {
        height: 10px !important;
        width: 10px !important;
        margin-top: 5px !important;
    }

    .leases-company-name {
        margin-left: 5px;
    }

    .lease-data p {
        margin-bottom: 0px !important;
    }

    .market-info-label {
        padding-right: 5px;
        color: #7A7B82;
    }

    .market-info-value {
        text-align: right;
    }

    .prime-rent-icon,
    .average-rent-icon {
        margin-left: 0px;
    }

    .market-data-size {
        margin-left: 13.5%;
    }

    .market-data-parking {
        margin-left: 7%;
    }

    .market-data-rent {
        margin-left: 12.5%;
    }

    .market-data-break {
        margin-left: 10.5%;
    }

    .market-data-expiry {
        margin-left: 9.5%;
    }

    .table-document-filename {
        min-width: 125px;
    }

    div.modal-dialog:has(div#attendees_div) {
        max-width: 100% !important;
    }

    .navbar_search_div #navbar_search_results {
        width: 100% !important;
        max-height: 70vh !important;
        overflow-y: auto;
    }

    div.modal-dialog:has(div#floorsAndUnitsBody) {
        max-width: 100% !important;
    }
}

@media only screen and (max-width: 600px) {
    #JSFrameworkOffCanvasend.offcanvas {
        z-index: 1041 !important;
    }

    nav.navbar {
        z-index: 1046 !important;
    }

    #JSFrameworkModal.modal.show {
        z-index: 1055 !important;
    }

    .modal.show#JSFWModal {
        z-index: 1150 !important;
    }

    div#JSFrameworkOffCanvasend.offcanvas.show:has(#sharedPropertyInfoOffCanvas) {
        z-index: 1041 !important;
    }

    .excel-export-btn {
        display: none;
    }

    #propertiesTable thead {
        display: none;
    }

    #propertiesTable .mobile-visible-td {
        display: block !important;
    }

    /* all tds in properties table without class mobile-visible-td, display none */
    #propertiesTable td:not(.mobile-visible-td) {
        display: none;
    }

    .table#propertiesTable .property-image-container>.property-svg-div>svg,
    .table#propertiesTable .property-image-container img {
        width: 65px !important;
        height: 65px !important;
    }

}

div.mobile-property-shared-by {
    display: block;
    font-size: 10px;
    border-radius: 5px;
    padding: 1px 5px 1px 5px;
    margin-top: 2px;
    background-color: #393753;
    color: #8E8CAF;
    max-width: 150px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    width: fit-content;
    &&.grey {
        background-color: #E6E5E6;
        color: #7d7d7d;
    }
}


.fw-600 {
    font-weight: 600 !important;
}

.fw-800 {
    font-weight: 800 !important;
}

.fw-700 {
    font-weight: 700 !important;
}


.normal-case {
    text-transform: none !important;
}

.fs-18 {
    font-size: 18px !important;
}

.fs-28 {
    font-size: 28px !important;
}

.text-color-mute {
    color: #ffffff9c;
}

.opportunities-stage {
    max-height: 20px;
    --vacant: linear-gradient(150deg, rgb(152, 153, 155) 0%, rgb(192, 193, 194) 100%);
    --occupied: linear-gradient(150deg, rgba(227, 228, 231, 1) 0%, rgba(227, 228, 231, 1) 100%);
    --active: linear-gradient(150deg, rgba(227, 228, 231, 1) 0%, rgba(227, 228, 231, 1) 100%);
    --target: linear-gradient(150deg, rgb(152, 153, 155) 0%, rgb(192, 193, 194) 100%);
    --orientation: linear-gradient(150deg, rgba(235, 110, 102, 1) 0%, rgba(242, 161, 131, 1) 100%);
    --viewing: linear-gradient(150deg, rgba(235, 158, 102, 1) 0%, rgba(242, 187, 131, 1) 100%);
    --consideration: linear-gradient(150deg, rgba(80, 98, 149, 1) 0%, rgba(76, 141, 206, 1) 100%);
    --negotiation: linear-gradient(150deg, rgb(55, 99, 138) 0%, rgba(75, 129, 175, 1) 100%);
    --exclusive: linear-gradient(150deg, rgb(34, 127, 113) 0%, rgba(45, 177, 156, 1) 100%);
    --dead-deal: linear-gradient(150deg, rgb(38, 38, 38) 0%, rgb(82, 82, 82) 100%);
    --deal-completed: linear-gradient(150deg, rgb(90, 87, 115) 0%, rgb(116, 34, 127) 100%);
    --onhold: linear-gradient(150deg, rgb(248, 71, 65) 0%, rgb(253, 129, 71) 100%);
    color: #fff;
    /* padding: 10px !important; */
    box-shadow: rgba(0, 0, 0, 0.15) 0px 1px 6px;
    cursor: pointer;
    transition: 0.2s;
    max-width: 100px;
    border-radius: 10px;
    margin-left: 10px;
    text-align: center;
}

/* END ACTIVE TASK POPUP */
/* START Marketdata */
div#marketDataDiv>.flex-column {
    background: white;
}

div#marketDataDiv {
    margin-left: 5px;
}

.marketdata-content {
    background: white;
}

.dashboard-data-chart-popup {
    background-color: #ffffff !important;
    font-family: 'Mulish' !important;
    color: #1e202b !important;
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.18);

    .dashboard-data-label-text {
        color: #6C687F !important;
        font-weight: 200 !important;
    }
}

/* END Marketdata */


/* FW errors */

#JSFrameworkError {
    z-index: 9998 !important;

    .modal-dialog {
        z-index: 9999 !important;
    }
}

/* start offcanvas proposal styling */

.offcanvas-proposal-btns-div {
    border-radius: 25px;
    width: auto;
    display: flex;
    padding: 5px 10px 5px 10px;
    visibility: hidden;
    background: linear-gradient(to right, #F3A183, #ec6f64);
}

.offcanvas-proposal-btn {
    width: 25px;
    height: auto;
    margin-right: 5px;
    padding: 5px;
    color: #ffffff !important;
    border-radius: 5px;
}

.offcanvas-proposal-btn:hover {
    opacity: 0.8;
    background-color: #fffdfd69 !important;
}

.proposal-card:hover .offcanvas-proposal-btns-div {
    cursor: pointer;
    visibility: visible;
}

/* end offcanvas proposal styling */


/* confirm model styling */
#JSFrameworkConfirm .modal-content {
    box-shadow: 0 .5rem 1rem rgba(0, 0, 0, 0.15) !important
}

/* start Marketdata infobar */
#marketDataInfoBarDiv {
    display: flex;
    justify-content: center;
    position: absolute;
    pointer-events: none;
    bottom: 50px;
    left: 0px;
    width: 100%;
    height: 75px;
    z-index: 8;
}

/* container uses flex instead of a fixed width so children share available space */
#marketDataInfoBar {
    display: flex;
    justify-content: space-around !important;
    background-color: #ffffff2f;
    border-radius: 10px;
    min-width: 500px;
    /* removed fixed width so it can grow/shrink with content */
    backdrop-filter: blur(8px);
    z-index: 8;
    padding: 10px;
    box-shadow: 0px 0px 0px 0.5px rgb(255, 255, 255);
    align-items: center;
    justify-content: center;
    flex-wrap: nowrap; /* change to wrap if you want items to wrap on small screens */
}

/* each marketDataInfo takes equal share of the container */
.marketDataInfo {
    min-width: 0; /* allow content to shrink properly in flex items */
    height: 100%;
    text-align: center;
    align-content: center;
    display: flex;
    flex-direction: column;
}

.marketDataInfoData {
    font-size: 24px;
    font-weight: 800;
    white-space: nowrap;
    color: #ffffff;
}

.marketDataInfoTitle {
    font-size: 12px;
    font-weight: 400;
    color: #ffffff;
    white-space: nowrap;
}

/* offcanvas Company START */



/* offcanvas Comany END */

.nav-tabs>.nav-item>.nav-link {
    user-select: none !important;
}

/* START REAPP Modal Standard Styles */

#JSFrameworkModal-title {
    width: 100%;
}

.reapp-modal-form-control {
    border: 1px solid #D6DAE3;
    border-radius: 10px;
    height: 43px;
    line-height: normal;
    display: block;
    width: 100%;
    padding: 6px 12px;
    font-size: 14px;
    line-height: 1.42857143;
    background-color: #fff;
    background-image: none;
    border: 1px solid #ccc;
    margin-bottom: 10px;
}

.reapp-modal-form-control:disabled {
    opacity: .5;
}

.reapp-modal-form-control:focus {
    border: 1px solid #f3a183;
    box-shadow: 0 0 0 4px rgba(236, 111, 102, 0.1);
    transition: 0.2s;
}

.reapp-modal-form-control:hover {
    border: 1px solid #f3a183;
    box-shadow: 0 0 0 4px rgba(236, 111, 102, 0.1);
    transition: 0.2s;
}

.reapp-modal-form-control:hover:disabled {
    border: 1px solid #D6DAE3;
    box-shadow: none;
}

.reapp-modal-form-control:focus-visible {
    outline: none;
}



.reapp-modal-title h2,
h2.reapp-modal-title {
    color: #1E202B !important;
    font-weight: 200 !important;
}

.reapp-modal-edit-title h2 {
    color: #1E202B !important;
    font-weight: 200 !important;
}

.reapp-modal-title h1,
h1.reapp-modal-title,
h1.reapp-modal-title-secondary,
.reapp-modal-title-secondary h1 {
    color: #EC6F66 !important;
}

.modal-content .modal-header .btn-close {
    background-color: transparent !important;
}

.modal-content:has(.modal-body > .reapp-modal-edit) {
    height: 95vh;
    top: 2.5vh;
    background-color: rgba(255, 255, 255, 0.839);
    margin-top: 0 !important;
    border-radius: 0px;
    border-top-left-radius: 20px !important;
    border-top-right-radius: 20px !important;
}

.modal-dialog:has(.modal-content > .modal-body > .reapp-modal-edit) {
    height: 100%;
    margin: 0 auto;
}



.reapp-modal-edit {
    height: 100%;
    background-color: #ffffff;
    padding: 20px 20px 0px 20px;
    box-shadow: 0px -1px 2px #ddd;
    border-top-left-radius: 20px;
    border-top-right-radius: 20px;
}

.modal-header:has(.reapp-modal-edit-title) {
    height: 5%;
    padding-bottom: 5px !important;
}


.modal-body:has(.reapp-modal-edit) {
    padding: 0px 10px 0px 10px;
    height: 95%;
}

.reapp-modal-edit-title h2 {
    font-size: 1rem;
}

/* END REAPP Modal Standard Styles */

/* START REAPP Offcanvas Standard Styles */

.reapp-offcanvas-form-control:hover {
    border-bottom: solid 1px #F3A183;
    transition: 0.3s;
}

.reapp-offcanvas-form-control {
    font-family: 'Mulish' !important;
    font-size: 14px;
    font-weight: 400;
    background-color: #fff;
    border-top: none;
    border-left: none;
    border-right: none;
    border-radius: 0px;
    border-bottom: 1px solid #E6E5E6;
    vertical-align: inherit;
    color: #1E202B;
    width: 100%;
}

.reapp-offcanvas-form-control:focus {
    border-bottom: solid 1px #F3A183 !important;
    outline: none !important;
    box-shadow: none !important;
}

/* END REAPP Offcanvas Standard Styles */

.reapp-title-color {
    color: #EC6F66 !important;
    font-weight: 500 !important;
}


/* START REAPP Global Styles */

.reapp-toggle-view-btns {
    background-color: #F3F3F3;
    color: #7A7B82;
    border-radius: 19px;
}

.reapp-toggle-view-btns {

    .btn.active,
    .btn.active:hover {
        background: rgb(243, 161, 131) !important;
        color: white;
        box-shadow: rgba(0, 0, 0, 0.15) 0px 1px 6px;
    }
}

.reapp-toggle-view-btns .btn {
    transition: background .3s ease, color .3s ease;
}

/* reapp input styles */

.reapp-advanced-input-div {
    display: flex;
    align-items: center;
    position: relative;

    input {
        background: none;
    }
}

.reapp-input-span-end {
    position: absolute;
    right: 5px;
    padding-inline: 10px;
    color: #1E202B;
    pointer-events: none;
}

.reapp-input-span-start {
    position: absolute;
    left: 5px;
    padding-inline: 10px;
    color: #1E202B;
    pointer-events: none;
}

.reapp-advanced-input-div:has(.reapp-input-span-start) input {
    padding-left: 30px;
}

/* .reapp-offcanvas-save-btn {
    bottom: 40px;
    z-index: 999;
    max-width: 200px !important;
    width: 200px !important;
    height: 40px;
    transform: translate(-50%, -50%);
    left: 50vw !important;
    position: fixed;
} */


.reapp-excel-export-btn:hover i {
    color: #ffffff !important;
}

.reapp-btn-list-item {
    background: unset;
    border-radius: 5px !important;
    transition: all 0.3s ease-in-out;
    color: #000000 !important;
    background-color: transparent;
}

.reapp-btn-list-item:hover {
    color: #EC6F66 !important;
}

.reapp-btn-list-item:focus {
    box-shadow: unset;
}

.reapp-btn-list-item.active {
    background: linear-gradient(270deg, #E7A488, #DD766B);
    color: white !important;
}

.reapp-bg-primary {
    background-image: linear-gradient(320deg, rgba(236, 111, 102, 1) 0%, rgba(243, 161, 131, 1));
}

.reapp-bg-primary-inverse {
    background-image: linear-gradient(135deg, rgba(236, 111, 102, 1) 0%, rgba(243, 161, 131, 1));
}

.reapp-bg-secondary {
    background: linear-gradient(135deg, rgb(78, 149, 217) 0%, rgb(131, 203, 235) 100%);
}

.reapp-btn-cancel {
    color: #212529;
    background-color: transparent;
}

.reapp-btn-save {
    background: #EC6F66 !important;
    color: #fcece6 !important;
    font-size: 14px;
    font-weight: 600;
    max-height: 31px;
    border-radius: 19px;
    border: none;
    outline: none;
    text-transform: lowercase;
    padding: 5px 15px 5px 15px;
    text-decoration: none;
}

.reapp-btn-save:disabled {
    background: #EC6F66 !important;
    color: #fcece6 !important;
    opacity: 0.5;
    cursor: not-allowed;
}

.reapp-btn-save:hover:disabled {
    cursor: not-allowed;
}

.reapp-btn-save:hover {
    background: #EC6F66 !important;
    color: #fcece6 !important;
    text-decoration: none;
    cursor: pointer;
}

.reapp-btn-save:focus {
    color: #fff;
    background-color: #0b5ed7;
    border-color: #0a58ca;
    box-shadow: 0 0 0 .25rem rgba(49, 132, 253, .5);
}

.reapp-btn-primary {
    background: linear-gradient(#fcece6, #fcece6) padding-box, linear-gradient(to right, #F3A183, #ec6f66) border-box;
    color: #EC6F66 !important;
    font-size: 14px;
    font-weight: 600;
    max-height: 38px;
    border-radius: 19px;
    border: none;
    outline: none;
    text-transform: lowercase;
    padding: 5px 15px 5px 15px;
    text-decoration: none;
}

.reapp-btn-primary:disabled {
    background: linear-gradient(#fcece6, #fcece6) padding-box, linear-gradient(to right, #F3A183, #ec6f66) border-box;
    color: #EC6F66 !important;
    opacity: 0.5;
    cursor: not-allowed;
}

.reapp-btn-primary:hover:disabled {
    cursor: not-allowed;
}

.reapp-btn-primary:hover {
    background: linear-gradient(#fce6f9, #fce6f9) padding-box, linear-gradient(to right, #b983f3, #ec66b6) border-box;
    transition: 0.3s;
    color: rgb(59, 39, 70) !important;
    text-decoration: none;
    cursor: pointer;
}

.reapp-btn-primary:focus {
    color: #fff;
    background-color: #0b5ed7;
    border-color: #0a58ca;
    box-shadow: 0 0 0 .25rem rgba(49, 132, 253, .5);
}

.reapp-btn-confirm {
    min-width: fit-content;
    color: white !important;
    font-size: 14px;
    font-weight: 600;
    max-height: 31px;
    border-radius: 19px;
    transition: 0.5s;
    border: none;
    outline: none;
    text-transform: lowercase;
    padding: 5px 15px 5px 15px;
    text-decoration: none;
}

.reapp-btn-confirm:disabled {
    color: white !important;
    opacity: 0.5;
    cursor: not-allowed;
}

.reapp-btn-confirm:hover:disabled {
    cursor: not-allowed;
}

.reapp-btn-confirm:hover {
    color: white !important;
    text-decoration: none;
    cursor: pointer;
}

.reapp-btn-confirm:focus {
    color: #fff;
    background-color: #0b5ed7;
    border-color: #0a58ca;
    box-shadow: 0 0 0 .25rem rgba(49, 132, 253, .5);
}

.reapp-btn-confirm-sm {
    min-width: fit-content;
    color: white !important;
    font-size: 14px;
    font-weight: 600;
    max-height: 31px;
    border-radius: 19px;
    transition: 0.5s;
    border: none;
    outline: none;
    float: right;
    text-transform: lowercase;
    padding: 5px 15px 5px 15px;
    text-decoration: none;
}

.reapp-btn-confirm-sm:disabled {
    color: white !important;
    opacity: 0.5;
    cursor: not-allowed;
}

.reapp-btn-confirm-sm:hover:disabled {
    cursor: not-allowed;
}

.reapp-btn-confirm-sm:hover {
    color: white !important;
    text-decoration: none;
    cursor: pointer;
}

.reapp-btn-confirm-sm:focus {
    color: #fff;
    background-color: #0b5ed7;
    border-color: #0a58ca;
    box-shadow: 0 0 0 .25rem rgba(49, 132, 253, .5);
}

.reapp-btn-green {
    background: none !important;
    background-color: #2DB19C !important;
    color: #fff !important;
}

.reapp-btn-green:hover {
    background: none !important;
    background-color: #2DB19C !important;
    color: #fff !important;
}

.gradient-confirm {
    position: relative;
    background-image: linear-gradient(to right,
            #E7A488,
            #DD766B);
    z-index: 1;
}

.gradient-confirm::before {
    position: absolute;
    border-radius: 19px;
    content: "";
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    background-image: linear-gradient(to bottom,
            #4E97E0,
            #b0a3e6);
    z-index: -1;
    transition: opacity 0.3s linear;
    opacity: 0;
}

.gradient-confirm:hover::before {
    opacity: 1;
}

.reapp-btn-primary-sm:disabled {
    background: linear-gradient(#fcece6, #fcece6) padding-box, linear-gradient(to right, #F3A183, #ec6f66);
    color: #EC6F66 !important;
    opacity: 0.5;
    cursor: not-allowed;
}

.reapp-btn-primary-sm:hover:disabled {
    cursor: not-allowed;
}

.reapp-bg-light-orange {
    background: #F3A183 !important;
}

.reapp-btn-primary-sm {
    background: linear-gradient(#fcece6, #fcece6) padding-box, linear-gradient(to right, #F3A183, #ec6f66);
    font-weight: 600;
    color: #EC6F66 !important;
    font-size: 1rem;
    border-radius: 19px;
    border: none;
    outline: none;
    float: right;
    width: fit-content;
    text-transform: lowercase;
    padding: 5px 15px 5px 15px;
    text-decoration: none;
}


.reapp-btn-primary-sm:hover {
    background: linear-gradient(#fce6f9, #fce6f9) padding-box, linear-gradient(to right, #b983f3, #ec66b6) border-box;
    transition: 0.3s;
    color: rgb(59, 39, 70) !important;
    text-decoration: none;
    cursor: pointer;
}


.reapp-btn-primary-sm:focus {
    color: #fff;
    background-color: #0b5ed7;
    border-color: #0a58ca;
    box-shadow: 0 0 0 .25rem rgba(49, 132, 253, .5);
}

.reapp-confirmBox {
    font-size: 1rem;
}

.reapp-form-select {
    border: 1px solid #D6DAE3;
    text-align: start;
    border-radius: 10px;
    height: 38px;
    line-height: normal;
    display: block;
    width: 100%;
    background-image: url(data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3e%3cpath fill='none' stroke='%23343a40' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M2 5l6 6 6-6'/%3e%3c/svg%3e);
    background-repeat: no-repeat;
    background-position: right .75rem center;
    padding: 6px 12px;
    font-size: 14px;
    line-height: 1.42857143;
    background-color: #fff;
    border: 1px solid #ccc;
}

.reapp-form-select:disabled {
    opacity: .5;
}

.reapp-form-select:focus {
    border: 1px solid #f3a183;
    /* box-shadow: 0 0 0 4px rgba(236, 111, 102, 0.1); */
    transition: 0.2s;
}

.reapp-form-select:hover {
    border: 1px solid #f3a183;
    /* box-shadow: 0 0 0 4px rgba(236, 111, 102, 0.1); */
    transition: 0.2s;
}

.reapp-form-select:hover:disabled {
    border: 1px solid #D6DAE3;
    box-shadow: none;
}

.reapp-form-select:focus-visible {
    outline: none;
}

.reapp-form-select::after {
    content: none;
}

.reapp-modal-form-select {
    border: 1px solid #D6DAE3 !important;
    text-align: start;
    border-radius: 10px !important;
    height: 43px !important;
    line-height: normal;
    display: block;
    width: 100%;
    background-image: url(data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3e%3cpath fill='none' stroke='%23343a40' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M2 5l6 6 6-6'/%3e%3c/svg%3e);
    background-repeat: no-repeat;
    background-position: right .75rem center;
    padding: 6px 12px;
    font-size: 14px;
    line-height: 1.42857143;
    background-color: #fff;
    border: 1px solid #ccc;
}
.reapp-modal-form-select::after {
    content: none !important;
}

.reapp-modal-form-select:disabled {
    opacity: .5;
}

.reapp-modal-form-select:focus {
    border: 1px solid #f3a183 !important;
    box-shadow: 0 0 0 4px rgba(236, 111, 102, 0.1) !important;
    transition: 0.2s !important;
}

.reapp-modal-form-select:hover {
    border: 1px solid #f3a183 !important;
    box-shadow: 0 0 0 4px rgba(236, 111, 102, 0.1) !important;
    transition: 0.2s !important;
}

.reapp-modal-form-select:hover:disabled {
    border: 1px solid #D6DAE3 !important;
    box-shadow: none;
}

.reapp-modal-form-select:focus-visible {
    outline: none;
}

.reapp-modal-form-select::after {
    content: none;
}

.reapp-sort-dropdown {
    position: relative;
    width: 220px;
    border: 1px solid #E6E5E6;
    border-radius: 10px;
    background: #fff;
    padding: 8px 10px;
    cursor: pointer;
    font-size: 14px;
    color: #7a7b82;
    min-height: 38px;
    max-height: 38px;
}

.reapp-sort-selected {
    height: 22px;
}

.reapp-sort-icon {
    display: flex;
    flex-direction: column;
    justify-content: center;
}

.reapp-sort-placeholder {
    color: #7a7b82;
    font-size: 14px;
    margin-left: 8px;
}

.reapp-sort-options {
    position: absolute;
    left: 0;
    top: 100%;
    width: 100%;
    background: #fff;
    border: 1px solid #d3d6df;
    border-radius: 10px 10px 10px 10px;
    box-shadow: 0 4px 16px rgba(0, 0, 0, 0.07);
    margin: 0;
    padding: 0;
    list-style: none;
    z-index: 10;
    font-size: 14px;
}

.reapp-sort-options li {
    padding: 12px 20px;
    cursor: pointer;
    color: #212529;
    transition: background 0.15s;
}

.reapp-sort-options li:hover {
    background: #f3a18348;
}

.reapp-sort-options li.active {
    background: #F3A183;
}

.reapp-property-opportunities-sort-dropdown {
    position: relative;
    width: 220px;
    border: 1px solid #E6E5E6;
    border-radius: 10px;
    background: #fff;
    padding: 8px 10px;
    cursor: pointer;
    font-size: 14px;
    color: #7a7b82;
    min-height: 38px;
    max-height: 38px;
}

.reapp-property-opportunities-sort-selected {
    height: 22px;
}

.reapp-property-opportunities-sort-icon {
    display: flex;
    flex-direction: column;
    justify-content: center;
}

.reapp-property-opportunities-sort-placeholder {
    color: #7a7b82;
    font-size: 14px;
    margin-left: 8px;
}

.reapp-property-opportunities-sort-options {
    position: absolute;
    left: 0;
    top: 100%;
    width: 100%;
    background: #fff;
    border: 1px solid #d3d6df;
    border-radius: 10px 10px 10px 10px;
    box-shadow: 0 4px 16px rgba(0, 0, 0, 0.07);
    margin: 0;
    padding: 0;
    list-style: none;
    z-index: 10;
    font-size: 14px;
}

.reapp-property-opportunities-sort-options li {
    padding: 12px 20px;
    cursor: pointer;
    color: #212529;
    transition: background 0.15s;
}

.reapp-property-opportunities-sort-options li:hover {
    background: #f3a18348;
}

.reapp-property-opportunities-sort-options li.active {
    background: #F3A183;
}

.first-sort-option {
    border-top-left-radius: 10px;
    border-top-right-radius: 10px;
}

.last-sort-option {
    border-bottom-left-radius: 10px;
    border-bottom-right-radius: 10px;
}


.btn-group.reapp-toggle-segment-group {
    background-color: rgba(255, 255, 255, 0.1);
    position: relative;
    display: inline-flex;
    border-radius: 20px;
    padding: 4px;
    --segment-width: 0px;
    --segment-offset: 0px;
}

.btn-group.reapp-toggle-segment-group .btn + .btn {
    margin-left: 0;
}

.btn-group.reapp-toggle-segment-group .btn {
    flex: 1 1 0;
    margin: 0;
    padding: 8px 16px;
    color: rgba(255, 255, 255, 0.7) !important;
    background: transparent !important;
    border: none;
    position: relative;
    z-index: 1;
    /* transition: color 0.25s ease; */
    cursor: pointer;
    border-radius: 20px;
}

.btn-group.reapp-toggle-segment-group .btn span {
    white-space: nowrap;
    display: inline-block;
}

.btn-group.reapp-toggle-segment-group .btn:focus {
    box-shadow: none;
    outline: none;
}

.btn-group.reapp-toggle-segment-group .btn.active {
    color: #fff !important;
}

.btn-group.reapp-toggle-segment-group::before {
    content: '';
    position: absolute;
    top: 4px;
    bottom: 4px;
    left: 4px;
    right: 4px;
    height: auto;
    width: calc(var(--segment-width) - 8px);
    background: linear-gradient(106deg, #7474C2 0%, #4E4D95 100%);
    border-radius: 20px;
    z-index: 0;
    box-shadow: rgba(0, 0, 0, 0.15) 0px 1px 6px;
    transition: none;
    transform: translateX(var(--segment-offset));
}

.btn-group.reapp-toggle-segment-group.is-ready::before {
    transition: transform 0.35s cubic-bezier(0.34, 1.56, 0.64, 1),
                width 0.35s cubic-bezier(0.34, 1.56, 0.64, 1);
}

.marketdata-chart-title {
    color: #7D7DA9;
    font-size:13px !important;
    text-transform: uppercase !important;
    font-weight: 400 !important;
    margin-bottom: 0px !important;
    margin-top: 1rem !important;
}

/* END REAPP Global Styles */

/* START MODAL BACKDROP FIX*/
.modal-backdrop.fade.show {
    z-index: 1049 !important;
}

/* END MODAL BACKDROP FIX */

/* START LEASED AREAS TABLE STYLES */
.proposal-table-leased-area-prices th,
.proposal-table-leased-area th {
    color: rgb(83, 83, 83);
    font-size: 16px;
    font-weight: bolder;
}

.proposal-table-leased-area-prices td,
.proposal-table-leased-area td {
    font-weight: 400;
    color: rgb(83, 83, 83);
    outline: none;
    border-radius: 3px;
}

.proposal-table-leased-area-prices tr:hover,
.proposal-table-leased-area tr:hover {
    border-radius: unset !important;
    background-color: unset !important;
    border-bottom: 0px !important;
    box-shadow: unset;
    -webkit-box-shadow: unset;
    -moz-box-shadow: unset;
    transition: unset;
}

.proposal-table-leased-area-prices td:nth-child(5) {
    text-align: right;
}

.proposal-table-leased-area-prices td {
    min-width: 130px !important;
}

.proposal-table-leased-area-prices td:nth-child(2) {
    min-width: 220px !important;
}

.proposal-table-leased-area-prices th {
    min-width: 130px !important;
}

.proposal-table-leased-area-prices td:nth-child(3) {
    min-width: 80px !important;
}

.proposal-table-leased-area th {
    min-width: 130px !important;
}

.proposal-table-leased-area td:nth-child(2) {
    min-width: 220px !important;

}


.proposal-leased-area-table-total-row,
.proposal-leased-area-table-total-row {
    border-top: 1px solid rgb(83, 83, 83) !important;
}

.readonly-proposal-content {
    color: rgb(83, 83, 83);
}

/* END LEASED AREAS TABLE STYLES */

/* coming soon banner */
.coming-soon-banner {
    border-radius: 15px;
    background: linear-gradient(90deg, #4E97E0 0%, #b0a3e6 66%);
    width: 100%;
    padding: 10px;
    text-align: center;
}

.coming-soon-banner h1 {
    color: white;
    font-weight: 600;
}

.coming-soon-banner p {
    color: #000;
    font-size: 16px;
    font-weight: 600;
}

.reapp-modal-title .reapp-mail-header {
    font-size: 20px;
    font-weight: 400 !important;
    margin-left: 10px;
    margin-bottom: 0px !important;
}

.pointer {
    cursor: pointer;
}

.input-group-reapp {
    border: 1px solid #D6DAE3 !important;
    position: relative;
    display: flex;
    align-items: stretch;
    height: 38px;
    width: 226px;
    border-radius: 6px;
}

.input-group-reapp-span {
    background: none !important;
    border: none !important;
    border-top-left-radius: 6px;
    border-bottom-left-radius: 6px;
    display: flex;
    align-items: center;
    padding: .375rem .5rem 0.375rem 0.375rem;
    font-size: 14px;
    font-weight: 400;
    line-height: 1.5;
    color: #212529;
    text-align: center;
    white-space: nowrap;
}

.input-group-reapp:has(button:focus) {
    box-shadow: 0 0 0 4px rgba(236, 111, 102, 0.1);
    border: solid 1px #F3A183 !important;
}

.input-group-reapp:has(button:focus) {
    box-shadow: 0 0 0 4px rgba(236, 111, 102, 0.1);
    border: solid 1px #F3A183 !important;
    transition: 0.2s;
}

#importObjectsHeader {
    font-size: 14px;
}