.dropZone-fd16778 {
    height: 100%;
    width: 100%;
    /* ast-grep-ignore prefer-dropzone-utility */
    border: 3px dashed var(--bs-secondary-border-subtle);
    border-radius: var(--radius-xl);
    background-color: var(--bs-secondary-bg-subtle);
    transition: all var(--transition-base);
    cursor: pointer;

    .instructions-fd16778 {
        padding: var(--space-4);

        p {
            text-align: center;
            margin: var(--space-1) 0;
        }
    }

    &:hover {
        background-color: var(--bs-primary-bg-subtle);
        border-color: var(--bs-primary-border-subtle);
    }
}


.aiPanel-67f2b5c {
    width: 30vw;
    min-width: 280px;
    max-width: 95vw;
    height: 100vh;
    padding: 0;
    margin: 0;
    container-type: inline-size;

    .container-67f2b5c {
        position: fixed !important;
        right: 0;
        top: 0;
        z-index: 1055;
        width: 100cqw;
        height: 100vh;
        background-color: var(--bs-secondary-bg-subtle) !important;
        display: flex;
        flex-direction: column;

        .chatboxContainer-67f2b5c {
            display: flex;
            flex-direction: column;
            height: 100%;
            background-color: var(--bs-body-bg);
            overflow: hidden;

            .chatboxBody-67f2b5c {
                flex: 1;
                background-color: var(--bs-body-bg);
                overflow-y: auto;
                display: flex;
                flex-direction: column;
            }
        }

        .nav-tabs .nav-link.active {
            background-color: var(--bs-body-bg);
            border-bottom-color: var(--bs-body-bg);
        }

        .resizeHandle-67f2b5c {
            position: absolute;
            left: 0;
            top: 0;
            bottom: 0;
            width: 6px;
            cursor: ew-resize;
            z-index: 2;
            user-select: none;
            touch-action: none;
            background-color: transparent;
            transition: background-color var(--transition-fast);

            &:hover,
            &:active {
                background-color: var(--bs-primary);
                opacity: 0.4;
            }
        }
    }
}


.welcomeMessage-2096523 {
    flex: 1;
    padding: var(--space-8);
    color: var(--bs-secondary-color);
    text-align: center;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 0.95rem;
}

.messagesContainer-2096523 {
    flex: 1;
    padding: var(--space-4);
    overflow-y: auto;
    display: flex;
    flex-direction: column;
    gap: var(--space-3);

    /* Reduce heading sizes in chat messages */
    h1 {
        font-size: 1.5rem;
        margin: var(--space-3) 0 var(--space-2);
    }

    h2 {
        font-size: 1.3rem;
        margin: 0.65rem 0 0.45rem;
    }

    h3 {
        font-size: 1.15rem;
        margin: 0.6rem 0 0.4rem;
    }

    h4 {
        font-size: 1.05rem;
        margin: 0.5rem 0 0.35rem;
    }

    h5 {
        font-size: 0.95rem;
        margin: 0.45rem 0 0.3rem;
    }

    h6 {
        font-size: 0.85rem;
        margin: 0.4rem 0 0.25rem;
    }

    /* Make tables horizontally scrollable with Bootstrap striped styling */
    table {
        display: block;
        width: 100%;
        overflow-x: auto;
        margin: var(--space-3) 0;
        border-collapse: collapse;
        font-size: 0.875rem;
        color: var(--bs-body-color);
        vertical-align: top;
        border: 1px solid var(--bs-border-color);

        thead,
        tbody,
        tfoot,
        tr,
        td,
        th {
            display: revert;
        }

        thead th {
            font-weight: 600;
            padding: var(--space-2);
            border-bottom: 2px solid var(--bs-border-color);
            background-color: var(--bs-light);
            color: var(--bs-emphasis-color);
            text-align: left;
            white-space: nowrap;
        }

        td,
        th {
            padding: var(--space-2);
            border: 1px solid var(--bs-border-color);
            text-align: left;
        }

        tbody {
            tr:nth-of-type(odd) > * {
                background-color: rgba(var(--bs-emphasis-color-rgb), 0.05);
            }

            tr:hover > * {
                background-color: rgba(var(--bs-primary-rgb), 0.075);
                transition: background-color var(--transition-fast);
            }
        }
    }

    .userMessage-2096523 {
        display: flex;
        justify-content: flex-end;

        .messageContent-2096523 {
            max-width: 70%;
            padding: var(--space-3) var(--space-4);
            border-radius: var(--radius-2xl);
            word-wrap: break-word;
            white-space: pre-wrap;
            background-color: var(--bs-primary);
            color: var(--bs-white);
            border-bottom-right-radius: var(--radius-sm);
        }
    }
}

.assistantMessage-2096523 {
    .messageContent-2096523 {
        max-width: 70%;
        padding: var(--space-3) var(--space-4);
        border-radius: var(--radius-2xl);
        word-wrap: break-word;
        white-space: pre-wrap;
        background-color: var(--bs-tertiary-bg);
        color: var(--bs-body-color);
        border: 1px solid var(--bs-border-color);
        border-bottom-left-radius: var(--radius-sm);
    }

    .errorMessageContent-2096523 {
        max-width: 70%;
        padding: 0;
    }
}

.messageInput-2096523 {
    max-height: 120px;
    overflow-y: auto;
    resize: none;
}


.tabContent-3276c20 {
    flex: 1;
    padding: var(--space-6);
    overflow-y: auto;
}

.connectSection-3276c20 {
    margin-bottom: var(--space-4);

    h6 {
        margin-top: 0;
        margin-bottom: var(--space-2);
        font-weight: 600;
    }
}

.codeBlock-3276c20 {
    background-color: var(--bs-tertiary-bg);
    border: 1px solid var(--bs-border-color);
    border-radius: var(--radius-md);
    padding: var(--space-3);
    font-size: 0.85rem;
    overflow-x: auto;
    white-space: pre;
    margin-bottom: var(--space-2);
}


.tabContent-476fddb {
    flex: 1;
    padding: var(--space-6);
    overflow-y: auto;
}

.itemsContainer-476fddb {
    display: flex;
    flex-direction: column;
    gap: var(--space-3);

    .itemCard-476fddb {
        display: flex;
        align-items: center;
        gap: var(--space-3);
        padding: var(--space-4);
        background-color: var(--bs-tertiary-bg);
        border: 1px solid var(--bs-border-color);
        border-radius: var(--radius-md);
        cursor: pointer;
        transition:
            background-color var(--transition-base),
            border-color var(--transition-base);

        &:hover {
            background-color: var(--bs-secondary-bg);
            border-color: var(--bs-primary);
        }

        .itemCardContent-476fddb {
            flex: 1;
            cursor: pointer;
            min-width: 0;

            .itemText-476fddb {
                margin: 0;
                color: var(--bs-body-color);
                font-size: 0.95rem;
                overflow: hidden;
                text-overflow: ellipsis;
                display: -webkit-box;
                -webkit-line-clamp: 2;
                line-clamp: 2;
                -webkit-box-orient: vertical;
            }
        }
    }
}


.tabContent-58feda7 {
    flex: 1;
    padding: var(--space-6);
    overflow-y: auto;
}

.dropZoneSection-58feda7 {
    flex-shrink: 0;
    min-height: 180px;
    margin-bottom: var(--space-6);
}



.tabContent-6b499a4 {
    flex: 1;
    padding: var(--space-6);
    overflow-y: auto;
}

.itemsContainer-6b499a4 {
    display: flex;
    flex-direction: column;
    gap: var(--space-3);

    .itemCard-6b499a4 {
        display: flex;
        align-items: center;
        gap: var(--space-3);
        padding: var(--space-4);
        background-color: var(--bs-tertiary-bg);
        border: 1px solid var(--bs-border-color);
        border-radius: var(--radius-md);
        cursor: pointer;
        transition:
            background-color var(--transition-base),
            border-color var(--transition-base);

        &:hover {
            background-color: var(--bs-secondary-bg);
            border-color: var(--bs-primary);
        }

        .itemCardContent-6b499a4 {
            flex: 1;
            cursor: pointer;
            min-width: 0;

            .itemText-6b499a4 {
                margin: 0;
                color: var(--bs-body-color);
                font-size: 0.95rem;
                overflow: hidden;
                text-overflow: ellipsis;
                display: -webkit-box;
                -webkit-line-clamp: 2;
                line-clamp: 2;
                -webkit-box-orient: vertical;
            }
        }

        .itemCardActions-6b499a4 {
            flex-shrink: 0;
        }
    }
}


.chartSvg-de799a4 {
    max-height: 300px;
}

.legendMarker-de799a4 {
    display: inline-block;
    width: 10px;
    height: 10px;
    border-radius: 2px;
}


.block-fc5bc89 {
    margin-bottom: var(--space-3);
}

.block-fc5bc89:last-child {
    margin-bottom: 0;
}

.fallback-fc5bc89 {
    white-space: pre-wrap;
    word-break: break-word;
    font-size: 0.85rem;
    margin: 0;
    max-height: 400px;
    overflow-y: auto;
}


.chartSvg-f81f65d {
    max-height: 300px;
}

.legendMarker-f81f65d {
    display: inline-block;
    width: 10px;
    height: 10px;
    border-radius: 50%;
}


.legendMarker-ede8857 {
    display: inline-block;
    width: 10px;
    height: 10px;
    border-radius: 50%;
}


.progressBar-12c6e9b {
    height: 8px;
}

.progressFill-12c6e9b {
    width: 0%;
}


.calendarTypeMultiselect-d91079e {
    min-width: 22rem;
}


.pastEvent-9695e44,
.pastEvent-9695e44 a {
    color: var(--bs-secondary) !important;
    opacity: 0.75;
}


.compactCalendar-a4b8ba0 {
    min-height: unset;

    /* Force compact row heights even in full-month mode (num_weeks=None),
       where the underlying CalendarBodyMonthly does not apply its `.compact`
       modifier. Without these overrides the widget grows to 5 × 10rem just
       for the week rows, overflowing the dashboard grid. Stylance hashes
       class names so we target via [class*="..."]; the extra .dates ancestor
       lifts specificity above body_monthly.css's `.dates .dayItem` rule. */
    [class*="dates"] {
        flex: none;
        grid-auto-rows: auto;
    }

    [class*="dates"] [class*="dayItem"] {
        cursor: default;
        pointer-events: none;
        min-height: unset;
    }

    /* Clip horizontally so a long event title that overflows its column does
       not leak past the right edge of the row. Vertical overflow is left
       visible — body_monthly.css already sizes weekRow to its lane count, so
       there is nothing to clip vertically in normal use. */
    [class*="dates"] [class*="weekRow"] {
        min-height: unset;
        overflow-x: hidden;
    }
}


.flag-13baac3 {
    min-width: 3ex;
    text-align: center;
    margin-inline-end: var(--space-1);
}


.pageViewSpaced-d8ca171 {
    --bs-gutter-x: 1.5rem;
    --bs-gutter-y: 0;
    margin-top: var(--space-3);
    width: 100%;
    padding-right: calc(var(--bs-gutter-x) * 0.5);
    padding-left: calc(var(--bs-gutter-x) * 0.5);
    margin-right: auto;
    margin-left: auto;
}

.pageViewFlex-d8ca171 {
    display: flex;
    flex-direction: column;
    flex-grow: 1;
    /* Override implicit `min-height: auto` so flex-grow can shrink
       this below content height — needed for inner scroll containers
       (e.g. SplitTabList paneBody) to bound correctly. */
    min-height: 0;
}

@keyframes tabInA {
    from {
        opacity: 0;
        transform: translateY(-120px);
    }
}

@keyframes tabInB {
    from {
        opacity: 0;
        transform: translateY(-120px);
    }
}

.animA-d8ca171 > * {
    animation: tabInA 0.2s ease-out;
}

.animB-d8ca171 > * {
    animation: tabInB 0.2s ease-out;
}

@media (prefers-reduced-motion: reduce) {
    .animA-d8ca171 > *,
    .animB-d8ca171 > * {
        animation: none;
    }
}

.tabOutlet-d8ca171 {
    overflow: hidden;
}

.tabOutlet-d8ca171:has(> nav.navbar.screenBottom) {
    overflow: visible;
    clip-path: inset(0 -100vw);
}

.tabOutlet-d8ca171 > nav.navbar.screenBottom {
    z-index: 1020;
    padding-left: calc(var(--bs-gutter-x) * 0.5);
    padding-right: calc(var(--bs-gutter-x) * 0.5);
}

.tabSpaced-d8ca171 {
    --bs-gutter-x: 1.5rem;
    --bs-gutter-y: 0;
    margin-top: var(--space-3);
    width: 100%;
    padding-right: calc(var(--bs-gutter-x) * 0.5);
    padding-left: calc(var(--bs-gutter-x) * 0.5);
    margin-right: auto;
    margin-left: auto;
}

.tabFlex-d8ca171 {
    display: flex;
    flex-direction: column;
    flex-grow: 1;
}


/* Skin the mantiq `<Multiselect>` trigger so it renders as a flat
   icon-only button. The mantiq component always wraps its trigger in
   `.form-control.form-select`, which Bootstrap paints white via
   `background-color: var(--bs-body-bg)` and tops with a caret SVG via
   `background-image`. Stylance-scoped descendants of `.paneSelect` would
   normally outrank Bootstrap on specificity, but Bootstrap's stylesheet
   gets loaded after the per-component modules in dev builds, so we use
   `!important` to make the override deterministic. */

.paneSelect-c54e4b4 .form-control,
.paneSelect-c54e4b4 .form-select,
.paneSelect-c54e4b4 .form-control.form-select {
    background-color: transparent !important;
    background-image: none !important;
    border: 0 !important;
    box-shadow: none !important;
    padding: 0 !important;
    min-height: 0 !important;
    width: auto !important;
    color: inherit !important;
}

.paneSelect-c54e4b4 .form-control.form-select > button {
    background: transparent;
    border: 0;
    padding: var(--space-1) var(--space-2);
    width: auto;
    color: var(--bs-body-color, inherit);
    line-height: 1;
    border-radius: var(--bs-border-radius, 0.375rem);
    transition: background-color 120ms ease, color 120ms ease;
}

.paneSelect-c54e4b4 .form-control.form-select > button:hover {
    background-color: var(--bs-secondary-bg, rgba(0, 0, 0, 0.05));
    color: var(--bs-primary, #0d6efd);
}

.paneSelect-c54e4b4 .form-control.form-select > button:focus,
.paneSelect-c54e4b4 .form-control.form-select > button:focus-visible {
    outline: 0;
    box-shadow: 0 0 0 0.2rem rgba(13, 110, 253, 0.25);
}



.resizeHandle-f6e3cd9 {
    flex: 0 0 8px;
    cursor: col-resize;
    user-select: none;
    touch-action: none;
    align-self: stretch;
    position: relative;
    background-color: transparent;
}

/* Visible 2px line centered in the 8px hit area. */
.resizeHandle-f6e3cd9::after {
    content: "";
    position: absolute;
    top: 0;
    bottom: 0;
    left: 3px;
    width: 2px;
    background-color: var(--bs-border-color, #dee2e6);
    transition: background-color 120ms ease;
}

.resizeHandle-f6e3cd9:hover::after,
.resizeHandle-f6e3cd9.resizing::after {
    background-color: var(--bs-primary, #0d6efd);
    left: 1px;
    width: 6px;
}


/* Layout primitives Bootstrap can't express. The flex/sizing utilities
   live on the view (`d-flex flex-column flex-grow-1 w-100` etc.); only
   `min-{h,w}: 0` and similar leftover declarations stay here, plus the
   `.splitTabList` / `.panesRow` / `.pane` class hooks needed by the
   `.multiPane` and `:global(.focused)` selectors below. */

.splitTabList-fd3e08d {
    min-height: 0;
}

.tabBarTabs-fd3e08d {
    min-width: 0;
}

.iconButton-fd3e08d {
    background: transparent;
    border: 0;
    padding: var(--space-1) var(--space-2);
    color: var(--bs-body-color, inherit);
    cursor: pointer;
    line-height: 1;
    border-radius: var(--bs-border-radius, 0.375rem);
    transition: background-color 120ms ease, color 120ms ease;
}

.iconButton-fd3e08d:hover {
    background-color: var(--bs-secondary-bg, rgba(0, 0, 0, 0.05));
    color: var(--bs-primary, #0d6efd);
}

.iconButton-fd3e08d:focus-visible {
    outline: 0;
    box-shadow: 0 0 0 0.2rem rgba(13, 110, 253, 0.25);
}

.panesRow-fd3e08d {
    min-height: 0;
}

.pane-fd3e08d {
    /* `flex-basis: 0` makes the resize-handle's percentage-based
       `flex-grow` values map proportionally to pane widths; Bootstrap
       has no equivalent utility. */
    flex-basis: 0;
    min-width: 0;
    min-height: 0;
}

/* Multi-pane only. `overflow: hidden` on an ancestor makes it a
   sticky-containing-block, so applying it unconditionally would
   pin a child `position: sticky` nav to `.pane`'s bottom (off
   screen) instead of the document viewport. */
.splitTabList-fd3e08d.multiPane .panesRow-fd3e08d,
.splitTabList-fd3e08d.multiPane .pane-fd3e08d {
    overflow: hidden;
}

.paneHeaderLabel-fd3e08d {
    min-width: 0;
}

.paneClose-fd3e08d {
    font-size: 0.75rem;
}

.pane-fd3e08d.focused {
    box-shadow: inset 0 -2px 0 var(--bs-primary, #0d6efd);
}

.paneBody-fd3e08d {
    flex: 1 1 auto;
    overflow: auto;
    /* min-height/width: 0 let the flex item shrink below content size,
       so `overflow: auto` produces scrollbars instead of expanding. */
    min-height: 0;
    min-width: 0;
}

.splitTabList-fd3e08d.multiPane .paneBody-fd3e08d {
    overflow: auto;
}

/* Defeat layout.css's `.tabOutlet:has(> nav.screenBottom)` rule that
   sets overflow:visible — in split mode paneBody must keep scrolling. */
.splitTabList-fd3e08d.multiPane .paneBody-fd3e08d:has(> nav.navbar.screenBottom) {
    overflow: auto;
    clip-path: none;
}

/* Two-axis sticky pin to the pane viewport. `left: 0` handles wide
   tables that scroll horizontally; margins reset because app.css sets
   negative gutter margins that only make sense outside a pane. */
.splitTabList-fd3e08d.multiPane .paneBody-fd3e08d .navbar.screenBottom {
    position: sticky;
    bottom: 0;
    left: 0;
    margin-left: 0;
    margin-right: 0;
    z-index: var(--bs-zindex-sticky, 1020);
}

@keyframes tabInSplit {
    from {
        opacity: 0;
        transform: translateY(-30px);
    }
}

.paneBody-fd3e08d > * {
    animation: tabInSplit 0.18s ease-out;
}

@media (prefers-reduced-motion: reduce) {
    .paneBody-fd3e08d > * {
        animation: none;
    }
}


.mapContainer-a4440b4 {
    position: relative;
    display: flex;
    overflow: hidden;

    .controls-a4440b4 {
        position: absolute;
        z-index: 1;
        top: 10px;
        [dir="ltr"] & {
            right: 10px;
        }

        [dir="rtl"] & {
            right: 10px;
        }
    }

    .map-a4440b4 {
        flex-grow: 1;
    }

    .offcanvas {
        position: absolute !important;
        top: 0 !important;
        bottom: 0 !important;
        height: auto !important;
        max-height: 100% !important;
    }

    [dir="ltr"] & .offcanvas-end {
        right: 0 !important;
    }

    [dir="rtl"] & .offcanvas-end {
        left: 0 !important;
    }

    .offcanvas-backdrop {
        position: absolute !important;
        top: 0 !important;
        left: 0 !important;
        right: 0 !important;
        bottom: 0 !important;
    }
}

.mapFullScreen-a4440b4 {
    position: fixed !important;
    top: 0 !important;
    left: 0 !important;
    right: 0 !important;
    bottom: 0 !important;
    width: 100% !important;
    height: 100% !important;
    z-index: 1060 !important;
    background-color: white;
}

.streetViewContainer-a4440b4 {
    display: none;
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 10;
    background: #000;
}

.streetViewVisible-a4440b4 {
    display: block;
}

.streetViewPanorama-a4440b4 {
    width: 100%;
    height: 100%;
}

.streetViewCloseBtn-a4440b4 {
    position: absolute;
    z-index: 11;
    top: 10px;
    background: white;
    border: none;
    border-radius: var(--radius-sm);
    padding: var(--space-2) var(--space-3);
    cursor: pointer;
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.3);

    &:hover {
        background: #f0f0f0;
    }

    [dir="ltr"] & {
        right: 10px;
    }

    [dir="rtl"] & {
        left: 10px;
    }
}

*:has(.mapFullScreen-a4440b4) {
    view-transition-name: none !important;
}


.accessGrid-5987577 {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(18rem, 1fr));
    grid-gap: 1.25rem;
    align-items: start;
}

.userImageContainer-5987577 {
    padding: 0;
    overflow: clip;
    flex-shrink: 0;
}

.userImageContainer-5987577 img {
    object-fit: cover;
    width: 2.25em;
    height: 2.25em;
}

.inputGroupHeight-5987577 {
    height: 2.25em;
}

.userSelectInline-5987577 {
    min-width: 22rem;
}


@keyframes badgeCounterUpdate {
    0% {
        transform: scale(1);
        box-shadow: 0 0 0 0 rgba(var(--bs-primary-rgb), 0.7);
    }
    30% {
        transform: scale(1.3);
        box-shadow: 0 0 0 4px rgba(var(--bs-primary-rgb), 0);
    }
    50% {
        transform: scale(0.95);
    }
    70% {
        transform: scale(1.05);
    }
    100% {
        transform: scale(1);
        box-shadow: 0 0 0 0 rgba(var(--bs-primary-rgb), 0);
    }
}

.badgeCounter-64623ad {
    transition: all 0.3s ease-out;
    transform-origin: center;
    transition-property: transform, box-shadow, background-color, color;

    &.updating-64623ad {
        animation: badgeCounterUpdate 0.6s ease-out;
    }
}


.companyBadge-d8f231e {
    color: var(--bs-dark);
    background-color: var(--bs-white);
    display: inline-block;
    padding: 0 var(--space-1);
    height: 1.5em;
    line-height: 1.25;
    font-size: 75%;
    font-weight: 700;
    text-transform: uppercase;
    text-align: center;
    white-space: nowrap;
    vertical-align: text-bottom;
    border-radius: var(--bs-border-radius);
    border: solid var(--bs-border-width) black;
}


.companySvgIcon-547a89c {
    display: inline-block;
    vertical-align: middle;
    max-height: 45px;
}


.companyInlineMultiSelect-3694dc0 {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(15rem, 1fr));
    grid-gap: 1rem;
    align-items: start;

    .selectedCompanyIconContainer-3694dc0 {
        padding: 0;
        overflow: clip;

        img {
            max-height: 2.25em;
            width: 2.25em;
            object-fit: contain !important;
        }
    }
}

/* Rendered inside `<Multiselect children>`, which portals out of the wrapper.
   Stylance-hashed so it stays unique to this component even at top level. */
.companyIconContainer-3694dc0 {
    display: inline-block;
    width: 4ex;
    text-align: center;
    margin-inline-end: var(--space-4);

    img {
        width: auto;
        max-width: 4ex;
        object-fit: contain !important;
    }
}


.companyIconContainer-3a5d784 {
    display: inline-block;
    width: 4ex;
    text-align: center;
    margin-inline-end: var(--space-4);

    img {
        width: auto;
        max-width: 4ex;
        object-fit: contain !important;
    }
}


/* Rendered inside `<SingleSelect children>` which portals out of the
   SingleSelect wrapper. Stylance-hashed so it stays unique to this component
   at top level. */
.iconContainer-4f4bdbf {
    display: inline-block;

    table & {
        width: 1.5rem;
        text-align: center;
        margin-inline-end: var(--space-3);
    }

    img {
        width: 1.5rem;
        max-height: 1.5rem;
        margin-inline-end: var(--space-3);
        object-fit: contain !important;
    }
}


.image-2ab86ce {
    width: 100%;
    object-fit: cover;
    border-radius: var(--bs-border-radius);
    display: block;
}


.donutChart-63925fc {
    overflow: visible;
}

.segment-63925fc {
    transition: stroke-width var(--transition-fast);
    cursor: pointer;
}

.legendItem-63925fc {
    cursor: pointer;
    transition: font-weight var(--transition-fast);
}

.centerContent-63925fc {
    pointer-events: none;
}


.feedbackPanel-d0268bc {
    padding: 0;
    margin-bottom: var(--space-5);
    border: 1px solid transparent;
    border-radius: var(--radius-sm);
    position: fixed;
    bottom: 20px;
    right: 20px;
    width: 300px;
    overflow: hidden;
    z-index: 10000;
}

.feedbackPanelList-d0268bc {
    margin: 0;
    padding: 0;
    list-style-type: none;
    width: 100%;
}

.feedbackPanelItem-d0268bc {
    margin: 0;
    padding: 0;
    display: block;
    width: 100%;
    transition: background-color var(--transition-base);
}

.feedbackPanelItem-d0268bc:hover {
    filter: brightness(85%);
}

.feedbackPanelItemContent-d0268bc {
    padding: 12px 15px;
    width: 100%;
}


.previewButton-db538d4 {
    width: 100%;
    padding: 0;
    border: 0;
    background: transparent;
    cursor: zoom-in;
}

/* Mirrors FileLightboxPortal: dark backdrop comes from Bootstrap, the
   content layer is a transparent flex column, and the body is a flex
   centre with the image scaled to fit via object-fit:contain. Chained
   with `:global(.modal-…)` to outrank Bootstrap's responsive defaults. */
.previewDialog-db538d4.modal-dialog {
    width: 90%;
    max-width: 1400px;
}

/* `pointer-events: none` lets clicks outside the image fall through to
   Bootstrap's backdrop-dismiss; the image and close button re-enable
   pointer events on themselves so they remain interactive. */
.previewContent-db538d4.modal-content {
    position: relative;
    height: 90vh;
    background-color: transparent !important;
    border: 0 !important;
    border-radius: 0;
    box-shadow: none;
    pointer-events: none;
}

.previewBody-db538d4 {
    flex: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
    min-height: 0;
    position: relative;
}

/* `height: 100%; width: auto` collapses the <img> box to the bitmap's
   own aspect ratio inside the centred flex parent, so the rounded
   corners trace the visible image rather than the surrounding box. */
.previewImage-db538d4 {
    height: 100%;
    width: auto;
    max-width: 100%;
    border-radius: var(--bs-border-radius-lg);
    pointer-events: auto;
}

.previewClose-db538d4.btn-close {
    position: absolute;
    top: var(--space-3);
    right: var(--space-3);
    z-index: 2;
    width: 2.5rem;
    height: 2.5rem;
    background-color: var(--bs-body-bg) !important;
    border-radius: 50% !important;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.3);
    opacity: 1;
    background-size: 1rem;
    background-position: center;
    pointer-events: auto;
}

.previewClose-db538d4.btn-close:hover {
    background-color: var(--bs-body-bg) !important;
    opacity: 0.85;
}


.invitationsHolder-43d281c {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(15rem, 1fr));
    grid-gap: 1rem;
    align-items: start;
    margin-bottom: var(--space-4);
    .input-group {
        .input-group-text {
            background-color: var(--bs-secondary-bg);
        }
    }
}


.userImageContainer-1eca496 {
    padding: 0;
    overflow: clip;
    flex-shrink: 0;
}

.userImageContainer-1eca496 img {
    object-fit: cover;
    width: 2.25em;
    height: 2.25em;
}

.userSelectInline-1eca496 {
    min-width: 22rem;
}

/*
 * Stop the Read / Edit / Delete column headers from drifting right as the
 * User column widens to fit longer names. Each permission column gets a
 * fixed footprint (icon + short label + checkbox padding) so the User
 * column absorbs all extra horizontal space.
 */
.permissionCol-1eca496 {
    width: 5rem;
}

.actionsCol-1eca496 {
    width: 3rem;
}



.pageHeaderBreadcrumb-b587cb5 {
    font-size: 1.75rem;
    --bs-breadcrumb-divider: var(--pageHeaderDivider, ">");

    a:not(:hover) {
        text-decoration: none;
    }

    li > svg[role="graphics-symbol"],
    li > a > svg[role="graphics-symbol"] {
        margin-inline-end: var(--space-2);
    }

    li > a > img {
        margin-inline-end: var(--space-2);
    }
}


.statusPanel-a66280b {
    .breadcrumbTriangle-a66280b {
        --breadcrumbTriangle-bg: var(--bs-tertiary-bg);
        --breadcrumbTriangle-arrow-color: var(--bs-body-bg);
        display: inline-block;
        overflow: hidden;
        border-radius: var(--bs-border-radius) var(--bs-border-radius) 0 0;
        counter-reset: flag;
        text-align: center;
        padding: 0 0.125em;
        vertical-align: middle;
        background-color: var(--breadcrumbTriangle-bg);

        /* Dark theme override */
        [data-bs-theme="dark"] & {
            --breadcrumbTriangle-arrow-color: var(--bs-body-bg);
        }

        li {
            text-decoration: none;
            outline: none;
            display: block;
            float: left;
            line-height: 3em;
            padding: 0 1em 0 3em;
            position: relative;
            margin: 0.125em 0;
            color: var(--bs-body-color);
            background: var(--bs-secondary-bg);
            transition: all 0.5s;

            /* Arrow after each item */
            &::after {
                content: "";
                position: absolute;
                top: 0;
                right: -1.5em;
                width: 3em;
                height: 3em;
                transform: scale(0.707) rotate(45deg);
                z-index: 1;
                box-shadow: 0.2em -0.2em 0 0.2em
                    var(--breadcrumbTriangle-arrow-color);
                border-radius: 0 var(--bs-border-radius) 0 3em;
                background-color: var(--bs-secondary-bg);
                transition: all 0.5s;
            }

            /* Number circles for numbered lists */
            &::before {
                color: var(--bs-body-color);
                background: var(--bs-body-bg);
                box-shadow: 0 0 0 0.1em var(--bs-border-color);
            }

            &:first-child {
                padding-left: 1em;
                border-radius: var(--bs-border-radius) 0 0
                    var(--bs-border-radius);

                &::before {
                    left: 1em;
                }
            }

            &:last-child {
                border-radius: 0 var(--bs-border-radius-sm)
                    var(--bs-border-radius-sm) 0;

                &::after {
                    content: none;
                }
            }

            /* Single item (e.g., cancelled status) needs rounded corners on all sides */
            &:first-child:last-child {
                border-radius: var(--bs-border-radius);
            }

            /* Coloured chip states. Each variant sets `--chipBg` (and
             * `font-weight: bold` for the in-flight states), the shared block
             * paints the chip and its arrow ::after pseudo-element. Adding a
             * new state = one line. */
            &.active-a66280b,
            &.cancelled-a66280b,
            &.success-a66280b {
                color: var(--chipFg) !important;
                background: var(--chipBg) !important;
                -webkit-print-color-adjust: exact;
                print-color-adjust: exact;

                &::after {
                    background: var(--chipBg) !important;
                    -webkit-print-color-adjust: exact;
                    print-color-adjust: exact;
                }
            }

            &.active-a66280b    { --chipBg: var(--bs-primary); --chipFg: var(--bs-white); font-weight: bold; }
            &.cancelled-a66280b { --chipBg: var(--bs-danger);  --chipFg: var(--bs-white); font-weight: bold; }
            &.success-a66280b   { --chipBg: var(--bs-success); --chipFg: var(--bs-white); }

            /* Warning override for the active step. Used when the status's
             * `basic_theme_color()` is `Warning` (e.g. ReviewChangesRequired)
             * so the chip reads as a "needs attention" state instead of the
             * default in-progress blue. Yellow + white is unreadable, so
             * darken the text to match Bootstrap's `text-bg-warning` pairing. */
            &.activeWarning-a66280b { --chipBg: var(--bs-warning); --chipFg: var(--bs-dark); }
        }
    }

    .alert {
        margin-bottom: 0;
    }

    .float-end button::last-child.me-2 {
        margin-inline-end: 0 !important;
    }

    /* The action-button footer becomes a flex-wrap row so buttons get
     * consistent horizontal and vertical gaps when they wrap. The
     * `.float-end` group (Comment / Hold / Cancel / Override) doesn't
     * float in a flex container — `margin-left: auto` pushes it to the
     * trailing edge instead, matching the original visual. The per-button
     * `me-2` margins become redundant inside this flex parent (gap handles
     * spacing). */
    .card-footer {
        /* ast-grep-ignore prefer-bootstrap-flex-utility */
        display: flex;
        flex-wrap: wrap;
        align-items: center;
        gap: var(--space-2);
    }

    .card-footer .float-end {
        margin-left: auto;
        float: none !important;
    }

    /* Scope to direct children only — buttons inside `.float-end` aren't
     * flex items of the card-footer, so they still need their own `me-2`
     * margins to space themselves apart. */
    .card-footer > .me-2 {
        margin-inline-end: 0 !important;
    }
}


.secondaryBreadcrumb-601d02e {
    --bs-breadcrumb-divider: var(--secondaryBreadcrumbDivider, "/");

    a:not(:hover) {
        text-decoration: none;
    }

    & > ol {
        margin-bottom: 0;
    }

    li > svg[role="graphics-symbol"],
    li > a > svg[role="graphics-symbol"] {
        margin-inline-end: var(--icon-spacing);
    }

    li > a > img {
        height: 24px;
        max-height: 24px;
        width: auto;
    }
}


.userImageContainer-768ad49 {
    padding: 0;
    overflow: clip;
    flex-shrink: 0;
}

.userImageContainer-768ad49 img {
    object-fit: cover;
    width: 2.25em;
    height: 2.25em;
}

.minWidth0-768ad49 {
    min-width: 0;
}

.sharedUrl-768ad49 {
    word-break: break-all;
}


.statusChangeLogPanel-944173f {
    list-style: none;
    padding: 0;
    border-bottom-left-radius: var(--bs-border-radius);
    border-bottom-right-radius: var(--bs-border-radius);
    overflow: clip;

    .card:has(+ &) {
        border-bottom-left-radius: 0;
        border-bottom-right-radius: 0;
    }

    .card + & {
        border-top-left-radius: 0;
        border-top-right-radius: 0;
    }

    li {
        border-inline-start: 4px solid var(--bs-info);
        background-color: var(--bs-info-bg-subtle);

        p {
            margin-top: var(--space-2);
            margin-bottom: 0;
        }

        cite {
            font-style: normal;
            font-weight: 500;
        }
    }

    .item-944173f {
        display: grid;
        grid-template-rows: 1fr;
        opacity: 1;
        padding: var(--space-3) var(--space-4);
        transition:
            grid-template-rows 0.3s ease-in-out,
            opacity 0.3s ease-in-out,
            padding 0.3s ease-in-out,
            margin 0.3s ease-in-out;

        &.collapsed-944173f {
            grid-template-rows: 0fr;
            opacity: 0;
            padding-top: 0;
            padding-bottom: 0;
            margin: 0;
        }

        .itemInner-944173f {
            min-height: 0;
            overflow: hidden;
        }

        .notes-944173f {
            white-space: pre-wrap;

            &:empty {
                display: none;
            }
        }
    }
}
.footerContainer-944173f {
    padding: 0 var(--bs-border-radius);

    .expandFooter-944173f {
        border-top: 0.175rem solid var(--bs-secondary) !important;
    }
}


.input-group .input-group-text:has(img.userImage-67c3db5) {
    overflow: clip;

    img.userImage-67c3db5 {
        object-fit: cover !important;
    }
}

.userImage-67c3db5 {
    object-fit: cover;
}


.userInlineMultiselect-fc9eaae {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(15rem, 1fr));
    grid-gap: 1rem;
    align-items: start;

    .disabledInput-fc9eaae {
        .input-group-text {
            background-color: var(--bs-secondary-bg);
        }
    }
}

/* The rules below target elements inside the dropdown menu. The menu renders
   in a <Portal> (under <body> or the open modal) and is no longer a DOM
   descendant of `.userInlineMultiselect`, so we can't scope to that wrapper.
   The classes used here are stylance-hashed and unique to this component,
   so writing them at the top level stays scoped in practice. */

.userImageContainer-fc9eaae {
    padding: 0;
    overflow: clip;

    img {
        object-fit: cover;
        width: 2.25em;
        height: 2.25em;
    }
}

td:has(.multiselectSelectedIcon-fc9eaae) {
    display: none;
}

.dropdown-menu:has(.multiselectSelectedIcon-fc9eaae) td {
    padding-top: 0.125rem;
    padding-bottom: 0.125rem;
}

/* Applied to the portaled menu via `menu_class`. Hides the select-all /
   unselect-all icon buttons next to the search input; per-row delete
   buttons live outside the menu and are untouched. */
.hideBulkActions-fc9eaae {
    input[type="search"] ~ button {
        display: none;
    }
}


.userAvatar-2d12a7a {
    width: 2.25em;
    height: 2.25em;
    overflow: hidden;
    flex-shrink: 0;
}

.userAvatar-2d12a7a img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}


.ratingContainer-ed1a3ba {
    position: relative;
    z-index: 2; /* sit above .stretched-link::after (z-index: 1) */
    width: fit-content;

    .hoverTooltip-ed1a3ba {
        position: absolute;
        left: 50%;
        gap: 0.45rem;
        white-space: nowrap;
        padding: var(--bs-tooltip-padding-y, 0.25rem)
            var(--bs-tooltip-padding-x, 0.5rem);
        border-radius: var(
            --bs-tooltip-border-radius,
            var(--bs-border-radius, 0.375rem)
        );
        background-color: var(--bs-tooltip-bg, var(--bs-emphasis-color));
        color: var(--bs-tooltip-color, var(--bs-body-bg));
        font-size: var(--bs-tooltip-font-size, 0.875rem);
        box-shadow: var(--bs-box-shadow-sm);
        opacity: 0;
        visibility: hidden;
        pointer-events: none;
        transition:
            opacity 120ms ease,
            transform 120ms ease,
            visibility 120ms ease;
        z-index: var(--bs-tooltip-zindex, 1080);

        &::after {
            content: "";
            position: absolute;
            left: 50%;
            transform: translateX(-50%);
            border-style: solid;
        }
    }

    .hoverTooltipTop-ed1a3ba {
        bottom: calc(100% + var(--bs-tooltip-arrow-height, 0.4rem));
        transform: translate(-50%, 0.25rem);

        &::after {
            top: 100%;
            border-width: var(--bs-tooltip-arrow-height, 0.4rem)
                calc(var(--bs-tooltip-arrow-width, 0.8rem) / 2) 0;
            border-color: var(--bs-tooltip-bg, var(--bs-emphasis-color))
                transparent transparent;
        }
    }

    .hoverTooltipBottom-ed1a3ba {
        top: calc(100% + var(--bs-tooltip-arrow-height, 0.4rem));
        transform: translate(-50%, -0.25rem);

        &::after {
            bottom: 100%;
            border-width: 0 calc(var(--bs-tooltip-arrow-width, 0.8rem) / 2)
                var(--bs-tooltip-arrow-height, 0.4rem);
            border-color: transparent transparent
                var(--bs-tooltip-bg, var(--bs-emphasis-color));
        }
    }

    &:hover,
    &:focus-within {
        .hoverTooltip-ed1a3ba {
            opacity: var(--bs-tooltip-opacity, 0.9);
            visibility: visible;
            transform: translate(-50%, 0);
        }
    }

    .tooltipText-ed1a3ba {
        min-width: 0;
        gap: 0.15rem;
    }
}


.entriesTable-aee9449 {
    table-layout: fixed;
}

.colDate-aee9449 {
    width: 20%;
}

.colAmount-aee9449 {
    width: 10%;
}

.colActions-aee9449 {
    width: 5%;
}


.formField-14cdb60 {
    max-width: 400px;
}


.tableHead-89d6fe4 {
    border-bottom: 1px solid black;
}

.totalFirstRow-89d6fe4 {
    border-top: 1px solid black;
}


.dateColumn-90506d2 {
    min-width: 10rem;
}


.widgetEmpty-7baaca7 {
    text-align: center;
    padding: var(--space-8) var(--space-4);
}

.widgetEmptyIcon-7baaca7 {
    font-size: 2rem;
    color: var(--bs-secondary-color);
    margin-bottom: var(--space-2);
}

.widgetEmptyText-7baaca7 {
    color: var(--bs-secondary-color);
    margin: 0;
}


.contentLayer-72f6989 {
    position: relative;
    z-index: 1;
}

.bottomNavLayer-72f6989 {
    position: relative;
    z-index: 1;
}


.tableLayer-77f5f89 {
    position: relative;
    z-index: 1;
}

.bottomNavLayer-77f5f89 {
    position: relative;
    z-index: 1;
}


.treeView-67d9b51 {
    --tree-line-color: var(--bs-border-color);
    --tree-hover-bg: var(--bs-tertiary-bg);
    --tree-button-bg: var(--bs-body-bg);
    --tree-button-fg: var(--bs-tertiary-color);
    --tree-node-height: 2rem;
    overflow: clip;
}

.treeList-67d9b51 {
    list-style: none;
    margin: 0;
    padding: 0;
}

.treeNode-67d9b51 {
    position: relative;
    line-height: normal;
}

.treeNodeContent-67d9b51 {
    height: var(--tree-node-height);
    padding: 0 var(--space-2);
    cursor: default;
    border-radius: var(--radius-sm);
    transition: background-color 0.15s ease;

    &:hover {
        background-color: var(--tree-hover-bg);
    }
}

.treeIndent-67d9b51 {
    height: 100%;
}

.treeLine-67d9b51 {
    width: 1.25rem;
    position: relative;
    flex-shrink: 0;

    /* Vertical line - full height to connect nodes */
    &::before {
        content: "";
        position: absolute;
        left: 0.525rem;
        top: calc(-0.26 * var(--tree-node-height));
        bottom: calc(-0.5 * var(--tree-node-height));
        width: 1px;
        background-color: var(--tree-line-color);
    }

    /* Horizontal connector */
    &::after {
        content: "";
        position: absolute;
        left: 0.525rem;
        top: 50%;
        width: 0.625rem;
        height: 1px;
        background-color: var(--tree-line-color);
    }

    /* Last child - vertical line only goes to middle */
    &.lastChild-67d9b51::before {
        bottom: 50%;
    }

    /* Empty - no lines (for ancestors where parent was last child) */
    &.empty-67d9b51::before,
    &.empty-67d9b51::after {
        display: none;
    }

    /* Continuation - only vertical line, no horizontal */
    &.continuation-67d9b51::after {
        display: none;
    }
}

.toggleBtn-67d9b51 {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 1rem;
    height: 1rem;
    margin-right: 0.375rem;
    z-index: 2;
    padding: 0;
    border: none;
    cursor: pointer;
    border-radius: 0.1875rem;
    flex-shrink: 0;
    box-shadow: var(--shadow-xs);
    transition: all 0.15s ease;
    background: var(--tree-button-bg);
    color: var(--tree-button-fg);

    &:hover {
        background-color: var(--bs-gray-300);
        color: var(--bs-gray-700);
        box-shadow: 0 1px 3px rgba(0, 0, 0, 0.12);
    }

    &:focus {
        outline: none;
    }

    svg {
        width: 1rem;
        height: 1rem;
    }
}

.nodeLabel-67d9b51 {
    flex: 1;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-size: 0.875rem;
    padding: var(--space-2) 0;
}

.childrenList-67d9b51 {
    list-style: none;
    margin: 0;
    padding: 0;
}


.helpText-a198eb9 {
    font-size: 0.75rem;
    color: var(--bs-secondary);
    text-transform: uppercase;
}


.colShrink-6f75eef {
    width: 1%;
}


.dropZone-5b2ac49 {
    flex-grow: 1;
    width: 100%;
    max-height: 150px;
    /* ast-grep-ignore prefer-dropzone-utility */
    border: 3px dashed var(--bs-secondary-border-subtle);
    border-radius: var(--radius-2xl);
    background-color: var(--bs-secondary-bg-subtle);
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    padding: var(--space-4);
}


.legendCount-f83d612 {
    font-size: 0.8rem;
}


.filterColumn-2bee96b {
    min-width: 200px;
}

.amountInput-2bee96b {
    width: 120px;
}

.actionBar-2bee96b {
    z-index: 1020;
}


.ackHeader-3fa6833 {
    width: 8em;
    max-width: 8em;
}

.companiesHeader-3fa6833 {
    width: 6em;
    max-width: 6em;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.dateHeader-3fa6833 {
    width: 9em;
    max-width: 9em;
}

.headerRow-3fa6833 th {
    padding-bottom: var(--space-3);
}

.openHeader-3fa6833 {
    width: 4em;
    max-width: 4em;
}

.titleCell-3fa6833 {
    max-width: 20vw;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}


.announcementBody-33c6e19 {
    font-size: 0.9rem;
}

.announcementBody-33c6e19 .markdown-preview {
    margin-bottom: 0;
    color: var(--bs-body-color);
}

.announcementCard-33c6e19 {
    flex: 0 1 24rem;
    max-width: 24rem;
    transition: box-shadow var(--transition-fast);
}

.announcementCard-33c6e19:hover {
    box-shadow: 0 0.25rem 0.5rem rgba(0, 0, 0, 0.1);
}



.announcementList-9f83b77 {

    .announcementItem-9f83b77 {
        padding: var(--space-3) var(--space-4);
        border-bottom: 1px solid var(--bs-border-color-translucent);

        &:last-child {
            border-bottom: 0;
        }

        .announcementHead-9f83b77 {
            margin-bottom: 0.35rem;

            .announcementLink-9f83b77 {
                font-weight: 600;
                color: var(--bs-body-color);
                text-decoration: none;
            }
        }

        .announcementBody-9f83b77 {
            font-size: 0.9rem;

            .markdown-preview {
                margin-bottom: 0;
                color: var(--bs-body-color);
            }
        }
    }
}



.vatRateInput-b0de86f {
    max-width: 5em;
}


.invoiceLinesTable-e91b3f8 th {
    font-size: 0.85rem;
    font-weight: 600;
    white-space: nowrap;
}

.invoiceLinesTable-e91b3f8 td {
    vertical-align: middle;
    padding: 0.25rem 0.35rem;
}

/* Column widths. Description (1st) has no fixed width and absorbs leftover
   space; the remaining input-bearing columns need explicit widths so their
   inputs don't collapse below a usable size. */
.invoiceLinesTable-e91b3f8 th:nth-child(2) {
    width: 220px;
}

.invoiceLinesTable-e91b3f8 th:nth-child(3),
.invoiceLinesTable-e91b3f8 th:nth-child(4) {
    width: 100px;
}

.invoiceLinesTable-e91b3f8 th:nth-child(8) {
    width: 40px;
}


.cellWrap-8cdcc25 {
    position: relative;
    border-bottom: 1px solid var(--bs-border-color-translucent);
}

.cell-8cdcc25 {
    background-color: transparent;
    border: none;
    text-align: left;
    text-decoration: none;
    transition: background-color var(--transition-fast);

    &:hover {
        background-color: var(--bs-tertiary-bg);
    }
}

.progressSegment-8cdcc25 {
    width: 0%;
}


.companyList-78e3219 {
    width: 360px;
    min-width: 320px;
}


.caseIds-7edeb60 {
    max-width: 25vw;
    overflow: hidden;
}

.expandRows-7edeb60 .caseIds-7edeb60 {
    white-space: normal;
}

.compactRows-7edeb60 .caseIds-7edeb60 {
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
}


.maxWidthNotes-efb7fb2 {
    max-width: 200px;
}


/* Related parties list specific styles */

.relatedPartiesContainer-47ec959 {
    height: 100%;
    overflow-y: auto;
}

.levelCard-47ec959 {
    border-left: 4px solid var(--bs-primary);
}

.levelBadge-47ec959 {
    font-size: 0.875rem;
    font-weight: 600;
}

.searchButton-47ec959 {
    min-width: 38px;
}

.filterCard-47ec959 {
    background-color: var(--bs-light);
}

/* Nested table styling for level groups */
.levelTable-47ec959 {
    margin-bottom: 0;
}

.levelTable-47ec959 thead th {
    border-top: none;
    font-weight: 600;
}

/* Quick search button in table */
.quickSearchBtn-47ec959 {
    opacity: 0.7;
    transition: opacity var(--transition-base);
}

.quickSearchBtn-47ec959:hover {
    opacity: 1;
}

/* Responsive adjustments */
@media (max-width: 768px) {
    .filterCard-47ec959 .row-47ec959 > div {
        margin-bottom: var(--space-4);
    }

    .filterCard-47ec959 .row-47ec959 > div:last-child {
        margin-bottom: 0;
    }
}


.graphContainer-f53924f {
    flex: 1 1 0;
    min-height: 0;
    width: 100%;
    height: 100%;
    position: relative;
    overflow: hidden;
    display: flex;
    flex-direction: column;
    padding-bottom: var(--space-4);

    .graphCanvas-f53924f {
        flex: 1 1 0;
        min-height: 0;
        width: 100%;
        height: 100%;
        display: block;
        border: 1px solid #dee2e6;
        background: #fff;
        cursor: grab;
        touch-action: none;

        &:active {
            cursor: grabbing;
        }
    }
}


.table-3f06c26 {
    border-collapse: collapse;
}

.table-3f06c26 th,
.table-3f06c26 td {
    padding: 6px;
    text-align: left;
}

.granted-3f06c26 {
    color: green;
    font-weight: bold;
}

.denied-3f06c26 {
    color: red;
    font-weight: bold;
}


.basicInfo-42cb60d {
    .userImageContainer-42cb60d {
        padding: 0;
        overflow: clip;

        img {
            object-fit: cover !important;
            height: 2.25em;
        }
    }
}


.cursorPointer-594eb1f {
    cursor: pointer;

    &:hover {
        opacity: 0.8;
    }
}


.basicInfo-2304d82 {
    .head-2304d82 {
        gap: var(--space-2) !important;
    }

    .companyIcon-2304d82 {
        width: 32px;
        height: 32px;
    }

    .statusBadge-2304d82 {
        -webkit-print-color-adjust: exact;
        print-color-adjust: exact;
    }
}


.versionCard-9c7ec03 {
    transition: all 0.2s ease-in-out;
}

.versionCardCurrent-9c7ec03 {
    border-color: var(--bs-success) !important;
    border-width: 2px;
}

.dropZone-9c7ec03 {
    flex-grow: 1;
    width: 100%;
    /* ast-grep-ignore prefer-dropzone-utility */
    border: 3px dashed var(--bs-secondary-border-subtle);
    border-radius: var(--radius-2xl);
    background-color: var(--bs-secondary-bg-subtle);
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    padding: var(--space-4);
    transition: all 0.2s ease-in-out;
}

.dropZone-9c7ec03:hover {
    border-color: var(--bs-primary);
    background-color: var(--bs-primary-bg-subtle);
}


.table-b4b6c8a {
    .completed-b4b6c8a {
        display: none;
    }

    tr {
        vertical-align: middle;
        &.table-success {
            .progress {
                display: none;
            }

            .completed-b4b6c8a {
                display: block;
            }
        }

        td {
            &:has(.progress) {
                min-width: 40%;
                vertical-align: middle;
            }
        }
    }
}


.field_input_page-51200c3 {
    width: 5rem;
}

.pages_stack-51200c3 {
    max-width: 900px;
    margin: 0 auto;
    padding-right: var(--space-2);
}

.preview_page-51200c3 {
    position: relative;
    width: 100%;
    aspect-ratio: 1 / 1.4142;
    background-color: #f8f9fa;
    border: 1px solid #dee2e6;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
    margin-bottom: var(--space-3);
    cursor: crosshair;
    user-select: none;
    touch-action: none;
    line-height: 0;
}

.preview_page_image-51200c3 {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: contain;
    pointer-events: none;
    user-select: none;
}

.preview_page_label-51200c3 {
    position: absolute;
    top: 0.25rem;
    left: 0.25rem;
    font-size: 0.75rem;
    color: #6c757d;
    pointer-events: none;
}

.preview_field-51200c3 {
    position: absolute;
    border: 2px dashed;
    background-color: rgba(13, 110, 253, 0.15);
    overflow: hidden;
    font-size: 0.7rem;
    cursor: move;
    box-sizing: border-box;
    touch-action: none;
}

.preview_field_label-51200c3 {
    padding: var(--space-1);
    pointer-events: none;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.preview_field_selected-51200c3 {
    border-style: solid;
    box-shadow: 0 0 0 2px rgba(13, 110, 253, 0.4);
}

.resize_handle-51200c3 {
    position: absolute;
    right: 0;
    bottom: 0;
    width: 12px;
    height: 12px;
    background-color: #0d6efd;
    cursor: nwse-resize;
    border-radius: 0 0 2px 0;
}

.preview_field_signature-51200c3 {
    border-color: #0d6efd;
    color: #0d6efd;
}

.preview_field_initials-51200c3 {
    border-color: #6610f2;
    color: #6610f2;
    background-color: rgba(102, 16, 242, 0.15);
}

.preview_field_date-51200c3 {
    border-color: #198754;
    color: #198754;
    background-color: rgba(25, 135, 84, 0.15);
}

.preview_field_text-51200c3 {
    border-color: #fd7e14;
    color: #fd7e14;
    background-color: rgba(253, 126, 20, 0.15);
}

.field_popover-51200c3 {
    position: absolute;
    z-index: 20;
    width: 220px;
    max-width: 90%;
    padding: var(--space-2);
    background: white;
    border: 1px solid #dee2e6;
    border-radius: 6px;
    box-shadow: 0 6px 18px rgba(0, 0, 0, 0.18);
    cursor: default;
    user-select: auto;
    touch-action: auto;
    pointer-events: auto;
    line-height: 1.4;
}


.userImageContainer-31a5598 {
    overflow: clip;

    img {
        object-fit: cover !important;
    }
}


.filterContainer-118d281 {
    width: 60ex;
    min-width: 45ex;
}

.directoryGrid-118d281 {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(350px, 1fr));
    gap: var(--space-6);
    margin-top: var(--space-2);
    --card-height: 225px;

    .employeeCard-118d281 {
        position: relative;
        border-radius: var(--bs-border-radius-xl);
        box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
        overflow: hidden;
        transition: all var(--transition-slow);
        cursor: pointer;
        height: var(--card-height);

        &:hover {
            box-shadow: var(--bs-box-shadow) !important;
        }

        .slide-118d281 {
            position: absolute;
            width: 100%;
            height: var(--card-height);
            transition: transform 0.5s cubic-bezier(0.4, 0, 0.2, 1);
        }

        .leaveIconsContainer-118d281 {
            display: none;
        }

        .frontSlide-118d281 {
            background: var(--bs-dark);
            color: var(--bs-light);
            z-index: 2;

            .avatar-118d281 {
                width: 100px;
                height: 100px;
                border-radius: 50%;
                box-shadow: var(--shadow-md);
                overflow: hidden;

                svg {
                    opacity: 0.75;
                }

                img {
                    width: 100%;
                    height: 100%;
                    object-fit: cover;
                }
            }

            .basicInfo-118d281 {
                text-align: center;
                margin-top: var(--space-3);
                padding: 0 var(--space-4);
            }

            .name-118d281 {
                font-size: 1.1rem;
                font-weight: 600;
                margin: 0;
                line-height: 1.3;
            }

            .position-118d281 {
                font-size: 0.85rem;
                opacity: 0.95;
                margin-top: var(--space-1);
                font-variant: small-caps;
                text-transform: capitalize;
            }
        }

        &.onLeave-118d281 .frontSlide-118d281 {
            background: var(--bs-secondary);

            .leaveIconsContainer-118d281 {
                display: block;
                position: absolute;
                top: 1rem;
                right: 1rem;
            }
        }

        &:hover .frontSlide-118d281 {
            transform: translateY(calc(-1 * var(--card-height)));
        }

        .innerSlide-118d281 {
            background: rgba(var(--bs-light-rgb), var(--bs-bg-opacity, 1));
            padding: var(--space-5);
            transform: translateY(200px);
            z-index: 1;
            flex-direction: column;
            align-items: flex-start;
            justify-content: flex-start;
            overflow-y: auto;
            opacity: 0;

            .position-118d281 {
                font-variant: small-caps;
                text-transform: capitalize;
            }

            a {
                text-decoration: none;

                &:hover {
                    text-decoration: underline;
                }
            }

            div {
                text-overflow: ellipsis;
            }

            .actions-118d281 {
                float: inline-end;

                a,
                button {
                    text-align: center;
                    padding: 0;
                }
            }
        }

        &:hover .innerSlide-118d281 {
            transform: translateY(0);
            opacity: 1;
        }
    }
}

.modal-118d281 {
    img.businessCardImage-118d281 {
        max-height: 75vh;
    }
}


.filterDropdownLayer-2842979 {
    position: relative;
    z-index: 3000;

    .dropdown-menu.show {
        z-index: 3001 !important;
    }
}

.tableOverlayLayer-2842979 {
    position: relative;
    z-index: 3002;
}

.bottomNavLayer-2842979 {
    position: relative;
    z-index: 1;
}

.formerEmployee-2842979 {
    background-color: lightgray;
}


.eventTypeIcon-5464644 {
    border-color: var(--bs-success);
}


.badgeWrapper-92d4564 {
    position: relative;
    display: inline-block;
}

.companiesCell-92d4564 {
    z-index: 2;
    cursor: pointer;
}

.companiesCell-92d4564:hover {
    background-color: var(--bs-tertiary-bg);
}

.companiesDropdown-92d4564 {
    display: none;
    position: absolute;
    top: 0;
    left: 100%;
    margin-left: var(--space-4);
    min-width: 150px;
    max-height: 200px;
    overflow-y: auto;
    background: var(--bs-body-bg);
    border: 1px solid var(--bs-border-color);
    border-radius: 0.375rem;
    box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.15);
    z-index: 1000;
}

.companiesHeader-92d4564 {
    width: 6em;
    max-width: 6em;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.fromHeader-92d4564,
.toHeader-92d4564 {
    width: 7em;
    max-width: 7em;
}

.headerRow-92d4564 th {
    padding-bottom: var(--space-3);
}

.open-92d4564 {
    z-index: 1001;
}

.open-92d4564 .companiesDropdown-92d4564 {
    display: block;
}

.tentativeHeader-92d4564 {
    width: 3em;
    max-width: 3em;
}

.titleCell-92d4564 {
    max-width: 20vw;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.typeHeader-92d4564 {
    width: 10em;
    max-width: 10em;
}

.workingHoursHeader-92d4564 {
    width: 6em;
    max-width: 6em;
}


.descriptionInput-f511032 {
    width: 100%;
    min-height: 80px;
    /* Auto-grow vertically to fit content (Chromium 123+, Safari 17.4+, Firefox 135+).
       Falls back to min-height when unsupported. */
    field-sizing: content;
    resize: none;
    overflow: hidden;
}

/* Halve the gap between FilePreviewInline header and preview body
   (Bootstrap p-3 = 1rem → 0.5rem). */
.previewWrap-f511032 .card-body {
    padding-top: var(--space-2) !important;
}

/* Split layout: data on the left, supporting documents on the right.
   Below 1300px the two panes stack and a tab bar switches between them —
   that's when the right-pane previews stop being readable side-by-side. */
.splitPane-f511032 {
    flex: 1 1 50%;
    min-width: 0;
}

@media (max-width: 1299.98px) {
    .splitLayout-f511032 {
        flex-direction: column;
    }

    .splitPane-f511032 {
        flex: 1 1 100%;
        width: 100%;
    }

    .hiddenOnMobile-f511032 {
        display: none !important;
    }
}

/* Locks the currency dropdown of the VAT MoneyInput — user cannot click/change. */
.lockedCurrency-f511032 .form-select {
    pointer-events: none;
    background-color: var(--bs-secondary-bg);
    color: var(--bs-secondary-color);
    opacity: 0.85;
}

/* Match the MoneyInput's combined max-width (number input 10em + currency
 * dropdown 5.25em) so the Total amount value's right edge lines up with the
 * right edge of the currency dropdown above, at any viewport width.
 * Anchored in `em` so a font-size change scales both consistently. */
.totalValueWidth-f511032 {
    flex: 0 0 calc(10em + 5.25em);
    max-width: calc(10em + 5.25em);
}


.avatar-efb9f21 {
    width: 2.25em;
    height: 2.25em;
    object-fit: cover;
    border-radius: 50%;
    margin-right: var(--space-2);
}

/* Inside the SingleSelect trigger (collapsed/selected display), shrink the
 * avatar so the button's total height matches sibling .form-control inputs.
 * Dropdown option rows live in `.dropdown-menu` and keep the 2.25em avatar. */
.form-control.form-select > button .avatar-efb9f21 {
    width: 1.5em;
    height: 1.5em;
}

/* Allow the inner `text-truncate` span to shrink below its content size.
 * Bootstrap's flex children default to `min-width: auto` which blocks the
 * ellipsis from kicking in when the employee+company string overflows the
 * column. */
.label-efb9f21 {
    min-width: 0;
}


.dropZone-7370663 {
    flex-grow: 1;
    width: 100%;
    max-height: 150px;
    /* ast-grep-ignore prefer-dropzone-utility */
    border: 3px dashed var(--bs-secondary-border-subtle);
    border-radius: var(--radius-2xl);
    background-color: var(--bs-secondary-bg-subtle);
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    padding: var(--space-4);
}


.table-3079df8 {
    .completed-3079df8 {
        display: none;
    }

    tr {
        vertical-align: middle;
        &.table-success {
            .progress {
                display: none;
            }

            .completed-3079df8 {
                display: block;
            }
        }

        td {
            &:has(.progress) {
                min-width: 40%;
                vertical-align: middle;
            }
        }
    }
}


.titleInput-145b676 {
    min-width: 300px;
}

.projectSelectWrapper-145b676 {
    max-width: 400px;
}

.pointsInput-145b676 {
    max-width: 120px;
}


.avatar-128a62a {
    width: 2.25em;
    height: 2.25em;
    object-fit: cover;
    border-radius: 50%;
    margin-right: var(--space-2);
}


.dropZone-3fbcd29 {
    flex-grow: 1;
    width: 100%;
    max-height: 150px;
    /* ast-grep-ignore prefer-dropzone-utility */
    border: 3px dashed var(--bs-secondary-border-subtle);
    border-radius: var(--radius-2xl);
    background-color: var(--bs-secondary-bg-subtle);
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    padding: var(--space-4);
}


.calendarFilter-b56b78a {
    min-width: 15rem;
}


/* Container-aware sizing: each column wants to be at least 640px wide
   (roughly the request table's intrinsic comfort width with its multiselect
   filter dropdowns in the header). When available width drops below
   ~1280px the grid collapses to one column so the request table's
   horizontal scroll is preferred over a visible scrollbar inside a
   side-by-side cell. This responds to the *content area* width (which
   shrinks when the sidebar is open), not the viewport width — viewport
   media queries miss that case. */
.gridContainer-3c91b07 {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(min(640px, 100%), 1fr));
    gap: var(--space-4);
    align-items: start;
}

.gridContainer-3c91b07 > table {
    min-width: 0;
}

/* Each column lets its content shrink to fit. Horizontal scrolling is
   handled by the inner `.table-responsive` wrapper for the request table
   and by the calendar's own min-width-0 grid, so we don't add overflow-x
   here. */
.tableColumn-3c91b07,
.calendarColumn-3c91b07 {
    min-width: 0;
}


.leaveTypeIcon-641f3b4 {
    border-color: var(--bs-primary);
}

.overNavbar-641f3b4 {
    z-index: 1050;
}

.employeeSelector-641f3b4 {
    /* Ensure dropdown appears above bottom navbar (z-index: 1050) */
    position: relative;
    z-index: 1060;
    /* Prevent resizing when selecting different length names */
    width: 100%;

    & > * {
        width: 100%;
    }
}


.avatar-1bf745c {
    width: 2em;
    height: 2em;
    border-radius: 50%;
    object-fit: cover;
}


.actionCell-f092216 {
    white-space: nowrap;
}

.companyLogo-f092216 {
    max-height: 32px;
}

/* Amounts cell: tight nested 2-column table. Bootstrap's `.table` paints
 * every cell using BOTH `background-color: var(--bs-table-bg)` AND a
 * full-cell `box-shadow: inset 0 0 0 9999px var(--bs-table-bg-state, ...)`,
 * so overriding `--bs-table-bg` alone leaves the shadow to repaint the
 * dark body background on top of the parent row's status tint. Clear all
 * three (bg, shadow accent, state) and inherit the row colour. */
/* `!important` is needed because Bootstrap's `.table` rule loads after
 * the stylance bundle and resets `--bs-table-bg` to the body bg with
 * the same specificity, so source order wins without it. */
.amountsTable-f092216 {
    --bs-table-bg: transparent !important;
    --bs-table-bg-state: transparent !important;
    --bs-table-bg-type: transparent !important;
    --bs-table-accent-bg: transparent !important;
    --bs-table-color: inherit !important;
    background-color: transparent;
}

.amountsTable-f092216 td {
    padding: 0 var(--space-1);
    background-color: transparent !important;
    box-shadow: none !important;
    border: none;
}

.totalsRow-f092216 td {
    border-top: 1px solid var(--bs-border-color);
    padding-top: var(--space-1);
}


.suggestions-63fe0d3 {
    top: 100%;
}

.description-63fe0d3 {
    white-space: pre-line;
}


.employeeInOutStatsGraph-d480413 {
    position: relative;
    width: 100%;

    svg.svg-d480413 {
        display: block;
        width: 100%;
        min-height: 300px;
        height: 50vh;
        max-height: 500px;

        text {
            fill: var(--bs-body-color);
            stroke-width: 0;
        }

        .axis-d480413 {
            shape-rendering: crispEdges;

            line {
                stroke: var(--bs-border-color);
                stroke-width: 2;
                stroke-dasharray: 4 2;
            }
            text {
                font-size: 12px;
            }

            .xTick-d480413 {
                text {
                    text-anchor: end;
                    dominant-baseline: hanging;
                }
            }

            .yTick-d480413 {
                text {
                    text-anchor: end;
                    dominant-baseline: central;
                }
            }
        }

        .bars-d480413 {
            cursor: pointer;

            .barIn-d480413 {
                fill: var(--bs-success);
                opacity: 0.8;
            }

            .barOut-d480413 {
                fill: var(--bs-danger);
                opacity: 0.8;
            }

            &:hover {
                .barIn-d480413,
                .barOut-d480413 {
                    opacity: 1;
                }
            }
        }

        .countLine-d480413 {
            stroke: var(--bs-primary);
            stroke-width: 2.5;
        }

        .countDot-d480413 {
            fill: var(--bs-primary);
            stroke: var(--text-emphasis);
            stroke-width: 2;
            cursor: pointer;

            &:hover {
                r: 6;
            }
        }
    }

    .legend-d480413 {
        margin-top: var(--space-2);
        font-size: 0.875rem;

        .legendLine-d480413 {
            display: inline-block;
            width: 24px;
            height: 3px;
            background-color: var(--bs-primary);
            border-radius: 2px;
        }

        .legendBarIn-d480413 {
            display: inline-block;
            width: 12px;
            height: 12px;
            background-color: var(--bs-success);
            border-radius: 2px;
        }

        .legendBarOut-d480413 {
            display: inline-block;
            width: 12px;
            height: 12px;
            background-color: var(--bs-danger);
            border-radius: 2px;
        }
    }

    .tooltip-d480413 {
        position: absolute;
        pointer-events: none;
        z-index: 1000;
        min-width: 180px;
        font-size: 0.875rem;
    }
}


.gradeBadge-dd7e9ec {
    color: black !important;
    background-color: gold !important;
    font-family: var(--bs-body-font-family);
    place-items: center;
    padding: 0 var(--space-1);
    height: 1.5em;
    font-size: 75%;
    font-weight: 700;
    white-space: nowrap;
    vertical-align: text-bottom;
}


.gradesSalaryGraph-6565728 {
    position: relative;
    width: 100%;

    svg.svg-6565728 {
        display: block;
        width: 100%;
        min-height: 400px;
        height: 70vh;
        max-height: 800px;

        text {
            fill: var(--bs-body-color);
            stroke-width: 0;
        }

        .axis-6565728 {
            shape-rendering: crispEdges;

            .yTick-6565728 {
                text-anchor: end;
                dominant-baseline: central;
                font-size: 15px;
            }

            .xTick-6565728 {
                text-anchor: middle;
                dominant-baseline: hanging;
                font-size: 18px;
                font-weight: bold;
            }

            line {
                stroke: var(--bs-border-color);
                stroke-width: 1.25;
            }
        }

        .interactivePoint-6565728 {
            cursor: pointer;
        }

        .bucket-6565728 {
            fill: var(--bs-primary);
            stroke: var(--bs-primary-border-subtle);
            stroke-width: 3;
            cursor: pointer;

            rect {
                rx: 3px;
                ry: 3px;
            }

            text {
                text-anchor: middle;
                dominant-baseline: central;
                font-size: 20px;
                font-weight: bold;
                pointer-events: none;
            }
        }
    }

    .tooltipBox-6565728 {
        position: absolute;
        pointer-events: none;
        z-index: 1000;
        min-width: 250px;
    }
}


.nationalityFilter-dcc543c {
    max-width: 10ex;
}


.preserve_whitespace-67699dd {
    white-space: pre-wrap;
}

.frequency_select-67699dd {
    flex: 0 0 auto;
    width: auto;
    min-width: 8rem;
}

.bonus_row-67699dd > .input-group {
    display: contents;
}

.bonus_row-67699dd > .input-group > .form-control,
.bonus_row-67699dd > .input-group > .form-select {
    border-radius: 0;
}

.clickable_row-67699dd {
    cursor: pointer;
}


.columnHeader-8dc53db {
    white-space: nowrap;

    button {
        padding: 0.05rem 0.25rem 0 0.25rem;
    }
}


.matrix-edcdd0c {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 1px;
    background-color: var(--bs-border-color-translucent);
    border-top: 1px solid var(--bs-border-color-translucent);
}

.matrixCell-edcdd0c {
    padding: 0.9rem 1rem;
    background-color: var(--bs-body-bg);
    color: inherit;
    text-decoration: none;
    transition: background-color var(--transition-fast);

    &:hover {
        background-color: var(--bs-tertiary-bg);
    }
}

.matrixBadge-edcdd0c {
    min-width: 2.5rem;
    padding: 0.35rem 0.6rem;
    border-radius: 999px;
    font-size: 1.1rem;
    font-weight: 700;
    text-align: center;
}

.matrixLabel-edcdd0c {
    font-size: 0.9rem;
    font-weight: 500;
}


.reportEdit-9ddeb66 {
    .ql-toolbar.ql-snow {
        background-color: white;
        border-color: var(--bs-border-color);
    }

    .ql-toolbar.ql-snow .ql-stroke {
        stroke: var(--bs-body-color);
    }

    .ql-toolbar.ql-snow .ql-fill {
        fill: var(--bs-body-color);
    }

    .ql-toolbar.ql-snow .ql-picker-label {
        color: var(--bs-body-color);
    }

    .ql-toolbar.ql-snow .ql-picker-options {
        background-color: white;
        border-color: var(--bs-border-color);
    }

    .ql-container.ql-snow {
        border-color: var(--bs-border-color);
    }

    .ql-editor {
        background-color: white;
        color: var(--bs-body-color);
        min-height: 200px;
        max-height: 400px;
        overflow-y: auto;
    }

    .ql-editor.ql-blank::before {
        color: var(--bs-secondary-color);
    }
}


.threadHeading-d27de9e {
    font-size: 1.75rem;
}

.threadDate-d27de9e {
    font-size: 80%;
}


.formSelects-526a300 [class*="itemSelector"] {
    z-index: auto;
}


.dateField-cffa3a5 {
    width: 100%;

    input[type="date"] {
        width: 100% !important;
    }
}


.preWrap-d09c3a3 {
    white-space: pre-wrap;
}

.formSelects-d09c3a3 [class*="itemSelector"] {
    z-index: auto;
}


.checkInOutBtn-cfc9c97 {
    height: 100px;
    font-size: 1.2rem;
    font-weight: bold;
}

.checkInOutBtn-cfc9c97:disabled {
    opacity: 0.5;
}


.avatar-a4fa249 {
    width: 64px;
    height: 64px;
    flex-shrink: 0;
}

.avatar-a4fa249 img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}


.employeeSelector-9ceb9b5 {
    max-width: 400px;
}


.number-ced1db2 {
    font-variant-numeric: tabular-nums;
    text-align: end;
}


.graph-ad65c36 {
    position: relative;
    height: 500px;
    width: 100%;

    .graphSvg-ad65c36 {
        width: 100%;
        height: 100%;
        display: block;
    }

    .axis-ad65c36 {
        font-family: var(--bs-font-sans-serif);
        font-size: 0.9rem;
    }

    .yGrid-ad65c36,
    .xGrid-ad65c36 {
        stroke: #777;
        stroke-dasharray: 2 2;
        shape-rendering: crispEdges;
    }

    .yTickLabel-ad65c36,
    .xTick-ad65c36 {
        fill: var(--bs-body-color);
    }

    .yTickLabel-ad65c36 {
        dy: -0.25rem;
        dominant-baseline: ideographic;
    }

    .tradeTickLabel-ad65c36 {
        fill: #fb8b1e;
        opacity: 0.8;
    }

    .foreignOwnershipLine-ad65c36 {
        stroke: #60481c;
        stroke-width: 3px;
        fill: none;
    }

    .foreignOwnershipDataPoint-ad65c36 {
        stroke: #60481c;
        stroke-width: 1.5px;
        opacity: 0.9;
        fill: #fff;
        cursor: pointer;
    }

    .notes-ad65c36 {
        stroke: #000;
        fill: silver;
        opacity: 1;
    }

    .stockPrice-ad65c36 {
        shape-rendering: geometricprecision;
        stroke: #fb8b1e;
        stroke-linejoin: round;
        stroke-width: 2px;
        stroke-opacity: 0.9;
        fill: none;
    }

    .tooltipBox-ad65c36 {
        position: absolute;
        z-index: 10;
        pointer-events: none;
    }
}

.asOfDate-ad65c36 {
    text-align: end;
    font-style: italic;
    color: var(--bs-secondary-color);
}


.mapGraphContainer-6b89ed4 {
    position: relative;
    width: 100%;
    min-height: 520px;
}

.mapGraphInner-6b89ed4 {
    position: relative;
    width: 100%;
    height: 520px;
    overflow: hidden;
    background: var(--bs-body-bg);
}

.mapSvg-6b89ed4 {
    width: 100%;
    height: 100%;
    display: block;
    user-select: none;
    cursor: grab;
}

.mapSvg-6b89ed4:active {
    cursor: grabbing;
}

.mapBackground-6b89ed4 {
    fill: var(--bs-info-bg-subtle);
}

.globeOutline-6b89ed4 {
    fill: none;
    stroke: rgba(0, 0, 0, 0.18);
    stroke-width: 0.8;
    vector-effect: non-scaling-stroke;
}

.countryFill-6b89ed4 {
    fill: var(--bs-body-bg);
}

.countryFill-6b89ed4:hover {
    fill: var(--bs-secondary-bg);
}

.countryStroke-6b89ed4 {
    fill: none;
    stroke: rgba(0, 0, 0, 0.28);
    stroke-width: 0.6;
    vector-effect: non-scaling-stroke;
}

.bubbleTooltip-6b89ed4 {
    position: absolute !important;
    z-index: 5;
    pointer-events: none;
    min-width: 200px;
    max-width: 340px;
}

.sharesBubble-6b89ed4 {
    opacity: 0.7;
    transition: opacity 0.12s ease-in-out;
}

.bubbleGroup-6b89ed4:hover .sharesBubble-6b89ed4 {
    opacity: 1;
}

.bubbleHitZone-6b89ed4 {
    cursor: pointer;
}

.colorMarker-6b89ed4 {
    width: 10px;
    height: 10px;
    border-radius: 50%;
    flex: 0 0 auto;
    border: 1px solid var(--bs-border-color);
}

.dateHeader-6b89ed4 {
    display: inline-block;
    font-variant-numeric: tabular-nums;
    width: 10ex;
    text-align: end;
}


.navGraphContainer-539b3fa {
    position: relative;
    min-height: 520px;
    width: 100%;
}

.navGraphContainer-539b3fa.withPerformance-539b3fa {
    min-height: 1040px;
}

.svg-539b3fa {
    width: 100%;
    height: 100%;
    min-height: 520px;

    .axis-539b3fa line {
        stroke: var(--bs-border-color);
        stroke-dasharray: 2, 2;
    }

    .axis-539b3fa text {
        font-size: 14px;
        fill: var(--bs-body-color);
    }

    .yTick-539b3fa text {
        font-size: 14px;
    }

    .xTick-539b3fa {
        font-size: 14px;
        fill: var(--bs-body-color);
    }

    .yearBackground-539b3fa {
        fill: none;
    }

    .yearBackgroundOdd-539b3fa {
        fill: rgba(128, 128, 128, 0.15);
    }

    .performanceYear-539b3fa {
        fill: rgb(186, 148, 88);
        text-anchor: middle;
        font-size: 20px;
    }

    .performance-539b3fa {
        stroke: #ccc;
        stroke-width: 20px;
    }

    .performanceMarker-539b3fa {
        stroke: none;
        fill: #ccc;
    }

    .performanceText-539b3fa {
        text-anchor: middle;
        dominant-baseline: middle;
        font-size: 20px;
        fill: var(--bs-body-color);
    }

    .axis-539b3fa .portfolioTick-539b3fa {
        fill: rgb(186, 148, 88);
        font-size: 14px;
    }

    .axis-539b3fa .portfolioAxisCaption-539b3fa {
        fill: rgb(186, 148, 88);
        font-size: 16px;
        text-anchor: middle;
    }

    .stockPerformanceTick-539b3fa {
        fill: rgb(186, 148, 88);
        font-size: 14px;
    }

    .stockPerformanceAxisCaption-539b3fa {
        fill: rgb(186, 148, 88);
        text-anchor: middle;
        font-size: 16px;
    }

    .stockPerformanceZeroLine-539b3fa {
        stroke: #777;
        stroke-width: 1px;
    }

    .stockPerformanceCalculation-539b3fa {
        shape-rendering: geometricprecision;
        stroke-linejoin: round;
        stroke-width: 2px;
        stroke-opacity: 0.9;
        fill: none;
    }

    .portfolioSizeArea-539b3fa {
        stroke: none;
        fill: rgba(186, 148, 88, 0.25);
    }

    .portfolioSizeLine-539b3fa {
        stroke: rgb(186, 148, 88);
        stroke-width: 1px;
        fill: none;
    }

    .navLine-539b3fa {
        stroke: #60481c;
        stroke-width: 3px;
        fill: none;
        stroke-linejoin: round;
        stroke-linecap: round;
    }

    .navLineDataPoint-539b3fa {
        stroke: #60481c;
        stroke-width: 2px;
        fill: #fff;
        cursor: pointer;
    }

    .navLineDataPointNotes-539b3fa {
        stroke: #000;
        fill: silver;
    }

    .stockPrice-539b3fa {
        shape-rendering: geometricprecision;
        stroke: #fb8b1e;
        stroke-linejoin: round;
        stroke-width: 2px;
        stroke-opacity: 0.9;
        fill: none;
    }

    .stockPriceHidden-539b3fa {
        display: none;
    }

    .stockPriceRange-539b3fa {
        shape-rendering: geometricprecision;
        stroke: #000;
        stroke-linejoin: round;
        stroke-width: 0.5px;
        stroke-opacity: 0.5;
        fill: #c09c78;
        opacity: 0.6;
    }

    .dividend-539b3fa {
        fill: #000;
    }

    .dividendText-539b3fa {
        font-size: 16px;
        fill: var(--bs-body-color);
        dominant-baseline: hanging;
    }

    .dividendDropLine-539b3fa {
        stroke: #000;
        stroke-width: 1.5px;
        stroke-dasharray: 4, 4;
        opacity: 0.8;
    }

    .dividendDropLineMarker-539b3fa {
        fill: #000;
    }

    .dividendDistributionText-539b3fa {
        fill: rgba(0, 0, 0, 0.5);
        font-size: 11px;
        dominant-baseline: hanging;
    }

    .ipoLine-539b3fa {
        stroke: #800000;
        stroke-width: 2px;
        stroke-dasharray: 2, 2;
    }

    .ipoText-539b3fa {
        fill: #800000;
        font-size: 12px;
    }
}

.tooltipBox-539b3fa {
    position: absolute;
    background: var(--bs-body-bg);
    border: 1px solid var(--bs-border-color);
    border-radius: var(--bs-border-radius);
    padding: var(--space-3);
    box-shadow: var(--bs-box-shadow);
    z-index: 1000;
    min-width: 200px;
    pointer-events: none;
}

.tooltipBox-539b3fa table {
    font-size: 0.875rem;
}

.tooltipBox-539b3fa table td {
    padding: 0.125rem 0.25rem;
}


.scrollableCardBody-15f3d82 {
    max-height: 400px;
    overflow-y: auto;
}


.graphContainer-2385aec {
    position: relative;
    min-height: 600px;

    .svg-2385aec {
        width: 100%;
        min-height: 600px;

        .axis-2385aec line {
            fill: none;
            stroke: #777;
            stroke-dasharray: 2, 2;
            shape-rendering: crispEdges;
        }

        .axis-2385aec text {
            fill: var(--bs-secondary-color, #6c757d);
            font-family:
                "Avenir LT Std 45 Book", "Droid Sans", "Helvetica Neue",
                Helvetica, Arial, sans-serif;
            font-size: 14px;
        }

        .yTick-2385aec text {
            font-size: 14px;
        }

        .xAxis-2385aec text {
            font-family:
                "Avenir LT Std 45 Book", "Droid Sans", "Helvetica Neue",
                Helvetica, Arial, sans-serif;
            font-size: 14px;
            fill: var(--bs-secondary-color, #6c757d);
        }

        .xTick-2385aec {
            font-size: 14px;
        }

        .shareBookDates-2385aec line {
            stroke: black;
            stroke-width: 1px;
            opacity: 0.3;
        }

        .shareholderEntry-2385aec {
            cursor: pointer;
            stroke: #ddd;
            stroke-width: 0.3px;
            opacity: 0.95;
            fill-opacity: 0.85;
            transition: opacity 0.15s ease;
        }

        .contextArea-2385aec {
            opacity: 0.5;
            stroke: none;
        }

        .context-2385aec {
            cursor: ew-resize;
        }

        .contextFrame-2385aec {
            fill: none;
            stroke: var(--bs-border-color, #dee2e6);
            stroke-width: 1px;
        }

        .brushSelection-2385aec {
            fill: rgba(13, 110, 253, 0.15);
            stroke: #fff;
            stroke-width: 1px;
            cursor: grab;
        }

        .brushSelection-2385aec:active {
            cursor: grabbing;
        }

        .y0-2385aec {
            stroke: black;
            stroke-width: 2px;
            opacity: 0.5;
        }

        .hover-2385aec .shareholderEntry-2385aec {
            opacity: 0.5;
        }

        .hover-2385aec .shareholderEntry-2385aec.hovered-2385aec {
            opacity: 1;
            stroke: red;
            stroke-width: 2px;
        }
    }

    .tooltipBox-2385aec {
        position: absolute;
        background: var(--bs-body-bg);
        border: 1px solid var(--bs-border-color);
        border-radius: var(--bs-border-radius);
        padding: var(--space-2);
        box-shadow: var(--bs-box-shadow);
        pointer-events: none;
        z-index: 1000;
        min-width: 150px;

        table {
            font-size: 0.875rem;
        }

        td {
            padding: 0.1rem 0.25rem;
        }
    }
}


.number-e21b56f {
    text-align: right;
    font-variant-numeric: tabular-nums;
}

.positive-e21b56f {
    color: var(--bs-success);
}

.negative-e21b56f {
    color: var(--bs-danger);
}

.orderBookTable-e21b56f {
    font-size: 0.875rem;
}

.orderBookTable-e21b56f th,
.orderBookTable-e21b56f td {
    padding: var(--space-2);
}

.metricCard-e21b56f {
    border-radius: var(--radius-md);
}

.metricValue-e21b56f {
    font-size: 1.25rem;
    font-weight: 600;
    font-variant-numeric: tabular-nums;
}

.metricLabel-e21b56f {
    font-size: 0.75rem;
    text-transform: uppercase;
    letter-spacing: 0.05em;
}


.maxWidthDateInput-d0d637b {
    max-width: 14rem;
}


.companyRow-61127a8 {
    position: relative;
    z-index: 3;
}


.companyRow-b70cd04 {
    position: relative;
    z-index: 3;
}


/* Outer wrapper for the shared media-listing preview body.
   Self-contained: scopes the media-exchange dark theme tokens and font
   families so the component renders correctly in any binary, even
   ones that don't ship the global [data-theme="media-exchange"]
   overrides (e.g. the ERP admin "Preview" tab). */
.mlp-body-32f19f5 {
    --bg: #0a0a0e;
    --bg-2: #0f1014;
    --surface: #15161c;
    --surface-2: #1c1d25;
    --border: #242530;
    --border-2: #323340;
    --text: #ecebe5;
    --text-dim: #a8a698;
    --text-mute: #6b6a60;
    --accent: #d9a54f;
    --accent-deep: #a77d30;
    --accent-soft: rgba(217, 165, 79, 0.12);
    --good: #5ed38d;
    --serif: 'Playfair Display', Georgia, serif;
    --sans: 'Inter', system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
    --mono: 'JetBrains Mono', ui-monospace, 'SF Mono', Consolas, monospace;

    background: var(--bg);
    color: var(--text);
    font-family: var(--sans);
    position: relative;
}

/* ---- Hero ---- */
.mlp-hero-32f19f5 {
    position: relative;
    height: 520px;
    overflow: hidden;
}

.mlp-heroBackdrop-32f19f5 {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    filter: brightness(0.5) saturate(1.1);
}

.mlp-heroOverlay-32f19f5 {
    position: absolute;
    inset: 0;
    background:
        linear-gradient(
            180deg,
            rgba(10, 10, 14, 0.3) 0%,
            rgba(10, 10, 14, 0.75) 60%,
            var(--bg) 100%
        ),
        radial-gradient(circle at 20% 50%, var(--accent-soft), transparent 50%);
}

.mlp-heroInner-32f19f5 {
    position: relative;
    height: 100%;
    max-width: 1320px;
    margin: 0 auto;
    padding: 40px 48px 80px;
    gap: var(--space-8);
}

.mlp-heroPoster-32f19f5 {
    width: 220px;
    aspect-ratio: 2 / 3;
    border-radius: 12px;
    overflow: hidden;
    border: 1px solid var(--border-2);
    flex-shrink: 0;
    box-shadow: 0 30px 80px rgba(0, 0, 0, 0.6);
}

.mlp-heroPosterImg-32f19f5 {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.mlp-heroPosterPlaceholder-32f19f5 {
    width: 100%;
    height: 100%;
    background: linear-gradient(135deg, var(--surface), var(--surface-2));
}

.mlp-heroContent-32f19f5 {
    flex: 1;
    padding-bottom: 10px;
}

.mlp-heroBadgeRow-32f19f5 {
    gap: 10px;
    margin-bottom: 14px;
}

.mlp-heroStage-32f19f5 {
    padding: 4px 10px;
    border-radius: 999px;
    background: var(--accent-soft);
    color: var(--accent);
    font-size: 10.5px;
    font-weight: 500;
    letter-spacing: 0.04em;
}

.mlp-heroTicker-32f19f5 {
    font-family: var(--mono);
    font-size: 11px;
    color: var(--accent);
    letter-spacing: 0.1em;
}

.mlp-heroTitle-32f19f5 {
    font-family: var(--serif);
    font-size: 64px;
    font-weight: 400;
    margin: 0;
    letter-spacing: -0.025em;
    line-height: 1;
    color: #fff;
}

.mlp-heroLogline-32f19f5 {
    font-family: var(--serif);
    font-style: italic;
    font-size: 18px;
    color: var(--accent);
    margin-top: 10px;
    letter-spacing: 0.01em;
}

.mlp-heroMeta-32f19f5 {
    gap: var(--space-3);
    margin-top: 18px;
    color: var(--text-dim);
    font-size: 13px;
    white-space: nowrap;
}

.mlp-heroActions-32f19f5 {
    gap: 10px;
    margin-top: 22px;
}

.mlp-btnPrimary-32f19f5 {
    padding: 11px 22px;
    background: var(--accent);
    color: #0a0a0e;
    border: none;
    border-radius: 10px;
    font-size: 13px;
    font-weight: 600;
    cursor: pointer;
    gap: var(--space-2);
    white-space: nowrap;
    text-decoration: none;
    transition: filter 0.15s ease;
}

.mlp-btnPrimary-32f19f5:hover {
    filter: brightness(1.08);
    color: #0a0a0e;
}

.mlp-btnSecondary-32f19f5 {
    padding: 11px 20px;
    background: transparent;
    color: var(--text);
    border: 1px solid var(--border-2);
    border-radius: 10px;
    font-size: 13px;
    font-weight: 500;
    cursor: pointer;
    gap: var(--space-2);
    white-space: nowrap;
    text-decoration: none;
    transition: border-color 0.15s ease, color 0.15s ease;
}

.mlp-btnSecondary-32f19f5:hover {
    border-color: var(--accent);
    color: var(--accent);
}

.mlp-iconBtn-32f19f5 {
    width: 42px;
    height: 42px;
    border-radius: 10px;
    background: transparent;
    border: 1px solid var(--border-2);
    color: var(--text-dim);
    cursor: pointer;
    display: grid;
    place-items: center;
    transition: all 0.15s ease;
}

.mlp-iconBtn-32f19f5:hover {
    color: var(--accent);
    border-color: var(--accent);
}

/* ---- Inner content wrapper (below the hero) ---- */
.mlp-content-32f19f5 {
    max-width: 1320px;
    width: 100%;
    margin: var(--space-5) auto var(--space-0);
    padding: 0 48px 60px;
    position: relative;
    z-index: 5;
    flex: 1;
}

.mlp-statsBar-32f19f5 {
    display: grid;
    grid-template-columns: repeat(6, 1fr);
    gap: var(--space-3);
}

.mlp-stat-32f19f5 {
    background: var(--surface);
    border: 1px solid var(--border);
    border-radius: 12px;
    padding: 14px 16px;
    gap: 6px;
}

.mlp-statLabel-32f19f5 {
    color: var(--text-mute);
    font-size: 11px;
    font-weight: 500;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    white-space: nowrap;
}

.mlp-statValue-32f19f5 {
    font-size: 18px;
    font-weight: 600;
    color: var(--text);
    font-family: var(--serif);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.mlp-statSub-32f19f5 {
    font-size: 10.5px;
    color: var(--text-mute);
    font-family: var(--mono);
}

.mlp-columns-32f19f5 {
    display: grid;
    grid-template-columns: 1fr 360px;
    gap: var(--space-6);
    margin-top: var(--space-6);
}

.mlp-mainCol-32f19f5 {
    gap: var(--space-5);
}

.mlp-sideCol-32f19f5 {
    position: relative;
}

@media (max-width: 1100px) {
    .mlp-statsBar-32f19f5 { grid-template-columns: repeat(3, 1fr); }
    .mlp-columns-32f19f5 { grid-template-columns: 1fr; }
    .mlp-heroTitle-32f19f5 { font-size: 44px; }
    .mlp-heroInner-32f19f5 { flex-direction: column; align-items: stretch; padding: var(--space-8) var(--space-6) var(--space-12); }
}

/* ---- Cards ---- */
.mlp-card-32f19f5 {
    background: var(--surface);
    border: 1px solid var(--border);
    border-radius: 14px;
    padding: var(--space-6);
}

.mlp-cardTitle-32f19f5 {
    margin: 0;
    font-size: 13px;
    font-weight: 600;
    letter-spacing: 0.06em;
    color: var(--text-dim);
    text-transform: uppercase;
}

.mlp-cardSerifBody-32f19f5 {
    font-family: var(--serif);
    font-size: 19px;
    line-height: 1.5;
    color: var(--text);
    margin: 14px 0 0;
    font-weight: 400;
    letter-spacing: -0.005em;
    text-wrap: pretty;
}

/* ---- Credits ---- */
.mlp-creditsGrid-32f19f5 {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 18px;
    margin-top: 18px;
}

@media (max-width: 900px) {
    .mlp-creditsGrid-32f19f5 { grid-template-columns: repeat(2, 1fr); }
}

.mlp-creditCell-32f19f5 {
    gap: 5px;
}

.mlp-creditLabel-32f19f5 {
    color: var(--text-mute);
    font-size: 10.5px;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.mlp-creditValue-32f19f5 {
    color: var(--text);
    font-size: 13px;
    font-weight: 500;
}

.mlp-creditsFooter-32f19f5 {
    margin-top: 22px;
    padding-top: 18px;
    border-top: 1px solid var(--border);
    gap: var(--space-3);
}

.mlp-genreChips-32f19f5 {
    gap: var(--space-2);
}

.mlp-genreChip-32f19f5 {
    padding: 6px 12px;
    background: var(--surface-2);
    border: 1px solid var(--border);
    border-radius: 999px;
    font-size: 12px;
    color: var(--text);
}

/* ---- Stills gallery ---- */
.mlp-galleryHead-32f19f5 {
    gap: 10px;
}

.mlp-galleryCount-32f19f5 {
    font-family: var(--mono);
    font-size: 10.5px;
    color: var(--text-mute);
}

.mlp-galleryGrid-32f19f5 {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 10px;
    margin-top: var(--space-4);
}

.mlp-galleryThumb-32f19f5 {
    position: relative;
    aspect-ratio: 16 / 10;
    border-radius: 10px;
    overflow: hidden;
    border: 1px solid var(--border);
    padding: 0;
    background: var(--surface-2);
    cursor: pointer;
    transition: border-color 0.15s ease;
}

.mlp-galleryThumb-32f19f5:hover {
    border-color: var(--accent);
}

.mlp-galleryThumb-32f19f5 img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

.mlp-lightbox-32f19f5 {
    position: fixed;
    inset: 0;
    background: rgba(5, 5, 8, 0.92);
    backdrop-filter: blur(10px);
    z-index: 200;
    display: grid;
    place-items: center;
    padding: var(--space-10);
    animation: lightbox-fade 0.2s ease both;
}

@keyframes lightbox-fade {
    from { opacity: 0; } to { opacity: 1; }
}

.mlp-lightboxImg-32f19f5 {
    max-width: 90vw;
    max-height: 86vh;
    border-radius: 12px;
    box-shadow: 0 30px 80px rgba(0, 0, 0, 0.6);
}

.mlp-lightboxClose-32f19f5 {
    position: absolute;
    top: 24px;
    right: 24px;
    width: 40px;
    height: 40px;
    border-radius: 10px;
    background: rgba(22, 22, 28, 0.9);
    border: 1px solid var(--border-2);
    color: var(--text);
    cursor: pointer;
    display: grid;
    place-items: center;
    font-size: 24px;
    line-height: 1;
}

.mlp-lightboxPosition-32f19f5 {
    position: absolute;
    bottom: 32px;
    font-family: var(--mono);
    font-size: 12px;
    color: var(--text-dim);
}

/* ---- Investment sidebar ---- */
.mlp-sidebar-32f19f5 {
    gap: var(--space-4);
    position: sticky;
    top: 84px;
}

.mlp-sidebarLabel-32f19f5 {
    color: var(--text-mute);
    font-size: 10.5px;
    letter-spacing: 0.1em;
    text-transform: uppercase;
}

.mlp-sidebarLabelSmall-32f19f5 {
    font-size: 11px;
    color: var(--text-dim);
    letter-spacing: 0.06em;
}

.mlp-sidebarValueRow-32f19f5 {
    gap: 10px;
    margin-top: 6px;
}

.mlp-sidebarValue-32f19f5 {
    font-family: var(--serif);
    font-size: 36px;
    font-weight: 500;
    color: var(--text);
    letter-spacing: -0.015em;
}

.mlp-sidebarChange-32f19f5 {
    font-family: var(--mono);
    font-size: 12px;
    color: var(--good);
}

.mlp-sidebarTicker-32f19f5 {
    font-family: var(--mono);
    font-size: 10.5px;
    color: var(--text-mute);
    margin-top: var(--space-1);
}

.mlp-amountSection-32f19f5 {
    gap: var(--space-2);
    margin-top: var(--space-4);
}

.mlp-amountWrap-32f19f5 {
    position: relative;
}

.mlp-amountSign-32f19f5 {
    position: absolute;
    left: 14px;
    top: 50%;
    transform: translateY(-50%);
    color: var(--text-mute);
    font-size: 14px;
}

.mlp-amountInput-32f19f5 {
    width: 100%;
    padding: 12px 14px 12px 28px;
    background: var(--bg-2);
    border: 1px solid var(--border);
    border-radius: 10px;
    color: var(--text);
    font-size: 15px;
    font-family: var(--mono);
    outline: none;
}

.mlp-amountInput-32f19f5:focus {
    border-color: var(--accent);
}

.mlp-presetRow-32f19f5 {
    gap: 6px;
    margin-top: 2px;
}

.mlp-preset-32f19f5 {
    flex: 1;
    padding: 6px 0;
    background: var(--surface-2);
    border: 1px solid var(--border);
    border-radius: 7px;
    color: var(--text-dim);
    font-size: 11px;
    cursor: pointer;
    font-family: var(--mono);
}

.mlp-presetActive-32f19f5 {
    background: var(--accent-soft);
    border-color: var(--accent);
    color: var(--accent);
}

.mlp-breakdown-32f19f5 {
    gap: var(--space-2);
    padding: 14px 0;
    margin-top: var(--space-4);
    border-top: 1px solid var(--border);
    border-bottom: 1px solid var(--border);
}

.mlp-breakdownRow-32f19f5 {
    font-size: 12px;
    gap: 10px;
}

.mlp-breakdownLabel-32f19f5 {
    color: var(--text-mute);
}

.mlp-breakdownValue-32f19f5 {
    font-family: var(--mono);
    color: var(--text);
}

.mlp-cta-32f19f5 {
    width: 100%;
    padding: 13px;
    background: var(--accent);
    color: #0a0a0e;
    border: none;
    border-radius: 10px;
    font-size: 13px;
    font-weight: 700;
    cursor: pointer;
    letter-spacing: 0.02em;
    margin-top: var(--space-4);
    transition: filter 0.15s ease;
}

.mlp-cta-32f19f5:hover {
    filter: brightness(1.1);
}

.mlp-disclaimer-32f19f5 {
    font-size: 10.5px;
    color: var(--text-mute);
    text-align: center;
    line-height: 1.5;
    margin-top: var(--space-3);
}

/* ---- Data Room ---- */
.mlp-dataRoomTitle-32f19f5 {
    margin: 0;
    font-size: 12.5px;
    font-weight: 600;
    letter-spacing: 0.06em;
    color: var(--text-dim);
    text-transform: uppercase;
}

.mlp-dataRoomList-32f19f5 {
    gap: 2px;
    margin-top: 14px;
}

.mlp-dataRoomItem-32f19f5 {
    gap: 10px;
    padding: 10px;
    border-radius: 8px;
    text-decoration: none;
    color: var(--text);
    transition: background 0.15s ease;
}

.mlp-dataRoomItem-32f19f5:hover {
    background: var(--surface-2);
}

.mlp-dataRoomIcon-32f19f5 {
    color: var(--text-mute);
    flex-shrink: 0;
}

.mlp-dataRoomInfo-32f19f5 {
    flex: 1;
    min-width: 0;
}

.mlp-dataRoomName-32f19f5 {
    font-size: 12px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.mlp-dataRoomSize-32f19f5 {
    font-size: 10px;
    font-family: var(--mono);
    color: var(--text-mute);
}

.mlp-dataRoomDownload-32f19f5 {
    color: var(--text-mute);
    flex-shrink: 0;
}

/* ---- Asset manager card ---- */
.mlp-assetManager-32f19f5 {
    background: var(--surface);
    border: 1px solid var(--border);
    border-radius: 14px;
    padding: var(--space-5);
    gap: var(--space-3);
}

.mlp-assetManagerAvatar-32f19f5 {
    width: 40px;
    height: 40px;
    border-radius: 50%;
    background: linear-gradient(135deg, var(--accent), var(--accent-deep));
    display: grid;
    place-items: center;
    font-weight: 700;
    color: #0a0a0e;
    font-size: 13px;
    flex-shrink: 0;
}

.mlp-assetManagerInfo-32f19f5 {
    flex: 1;
    min-width: 0;
}

.mlp-assetManagerLabel-32f19f5 {
    color: var(--text-mute);
    font-size: 10px;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.mlp-assetManagerName-32f19f5 {
    font-size: 12.5px;
    font-weight: 500;
    color: var(--text);
    margin-top: 3px;
}

/* The .related* classes live with the RelatedTitles component in
   bins/the_exchange (preview.css) — it composes around this body but
   stays out of the shared crate because the ERP preview tab doesn't
   render the "more titles" rail. */

/* ---- Lightbox prev/next chevrons ---- */
.mlp-lightboxNav-32f19f5 {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    width: 44px;
    height: 44px;
    border-radius: 10px;
    background: rgba(22, 22, 28, 0.85);
    border: 1px solid var(--border-2);
    color: var(--text);
    cursor: pointer;
    display: grid;
    place-items: center;
    font-size: 22px;
    line-height: 1;
}

.mlp-lightboxNav-32f19f5:hover {
    background: rgba(22, 22, 28, 1);
    color: var(--accent);
}

.mlp-lightboxNavPrev-32f19f5 { left: 24px; }
.mlp-lightboxNavNext-32f19f5 { right: 24px; }


.coverAspect-f528392 {
    aspect-ratio: 2 / 3;
}


.mediaListingEditForm-acb78e2 {
    .searchSelect {
        width: 100%;
    }

    .searchSelect input {
        width: 100% !important;
        min-width: 100% !important;
    }

    .searchSelect input::placeholder {
        color: var(--bs-body-color);
        opacity: 0.85;
    }
}

.posterColumn-acb78e2 {
    flex: 0 0 180px;
    width: 180px;
    max-width: 180px;

    @media (min-width: 1200px) {
        flex: 0 0 200px;
        width: 200px;
        max-width: 200px;
    }

    @media (min-width: 1400px) {
        flex: 0 0 230px;
        width: 230px;
        max-width: 230px;
    }

    @media (max-width: 575.98px) {
        flex: 0 0 auto;
        width: 100%;
        max-width: 200px;
        margin-inline: auto;
    }
}

.mediaListingEditForm-acb78e2 textarea {
    field-sizing: content;
    min-height: 4lh;
}


.portfolioEditForm-757513d {
    .filesUpload-757513d {
        width: 100%;
        height: 120px;
    }

    .dropZone-757513d {
        width: 100%;
        height: 100%;
        border: 2px dashed var(--bs-secondary);
        background-color: var(--bs-secondary-bg);
        border-radius: var(--radius-md);
        cursor: pointer;

        &:hover {
            background-color: var(--bs-primary-bg-subtle);
        }
    }

    .instructions-757513d {

        p {
            text-align: center;
            margin: 0;
        }
    }
}


.headerGrid-1948639 {
    grid-template-columns: minmax(0, 1fr) auto;
}


.gallery-cbe7b1f {
    padding: var(--space-4);
    overflow-y: auto;
}

.noImages-cbe7b1f {
    width: 100%;
    text-align: center;
    padding: var(--space-12);
}


.coverThumbnail-5a34539 {
    width: 48px;
    height: 68px;
    object-fit: cover;
    border-radius: var(--bs-border-radius);
    flex-shrink: 0;

    @media (min-width: 1200px) {
        width: 56px;
        height: 80px;
    }

    @media (min-width: 1400px) {
        width: 64px;
        height: 92px;
    }

    @media (min-width: 1800px) {
        width: 76px;
        height: 108px;
    }
}


.imageCell-36d5307 {
    max-width: 48px;
    vertical-align: middle;
}

.clickableRow-36d5307 {
    cursor: pointer;
}


.portfolioInlineMultiselect-731822a {
    width: 100%;
}

/* Applied to both the selected portfolio chips and the dropdown items so the
   sizing keeps working after the dropdown portals out of the wrapper. */
.coverImage-731822a {
    width: 32px;
    object-fit: cover;
}


.previewWrapper-f4e73ff {
    background: #0a0a0e;
    min-height: calc(100vh - 180px);
    margin: var(--space-3);
}


.canvasViewport-f538e82 {
    position: relative;
    flex: 1 1 auto;
    min-height: 0;
    overflow: auto;
    -webkit-overflow-scrolling: touch;
    cursor: grab;
    user-select: none;

    &:active {
        cursor: grabbing;
    }
}

.scaleFrame-f538e82 {
    flex: 0 0 auto;
    position: relative;
    width: max-content;
    height: max-content;
}

.canvas-f538e82 {
    transform-origin: 0 0;
    width: max-content;
    height: max-content;
    overflow: hidden;
}


.modalOverlay-d94a004 {
    z-index: 1055;
}


.col25-10ce7bd { width: 25%; }
.col35-10ce7bd { width: 35%; }
.col10-10ce7bd { width: 10%; }

.treeContainer-10ce7bd {
    background: var(--bs-body-bg);
    border-radius: 0.375rem;
    overflow-x: auto;

    table {
        table-layout: fixed;
        width: 100%;
    }

    td {
        overflow: hidden;
        text-overflow: ellipsis;
    }

    .groupRow-10ce7bd {
        transition: background-color var(--transition-fast);
    }

    .groupRow-10ce7bd:hover {
        background-color: var(--bs-gray-100);
    }

    .treeCell-10ce7bd {}

    .expandBtn-10ce7bd {
        background: none;
        border: none;
        padding: 0;
        width: 20px;
        height: 20px;
        cursor: pointer;
        transition: transform var(--transition-base);
    }

    .expandSpacer-10ce7bd {
    width: 20px;
    display: inline-block;
}

.expandBtn-10ce7bd:hover {
        transform: scale(1.2);
    }

    .expandBtn-10ce7bd i {
        font-size: 0.875rem;
    }
}


.chartContainer-7b1d29f {
    flex: 1 1 0;
    min-height: 0;
    width: 100%;
    flex-direction: column;
    overflow: hidden;
    position: relative;

    & > * {
        animation: orgChartFadeIn 0.3s ease-out;
    }

    .orgTree-7b1d29f {
        --popoverWidth: 320px;
        --popoverMaxHeight: 420px;
        --popoverGap: 0.6rem;

        display: flex;
        justify-content: center;
        align-items: flex-start;
        gap: var(--space-12);
        padding: var(--space-6);
        padding-right: calc(var(--space-6) + var(--popoverWidth) + var(--popoverGap));
        padding-bottom: calc(var(--space-6) + var(--popoverMaxHeight) + var(--popoverGap));
        min-width: max-content;
        min-height: max-content;

        &.layoutVertical-7b1d29f {
            flex-direction: column;
            align-items: flex-start;
            justify-content: flex-start;
        }
    }
}

@keyframes orgChartFadeIn {
    from {
        opacity: 0;
        transform: translateY(10px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}


.chartContainer-8496320 {
    height: 600px;
    width: 100%;
    flex-direction: column;
    overflow: hidden;
    position: relative;
    margin: 0 var(--space-4);

    & > * {
        animation: orgChartFadeIn 0.3s ease-out;
    }

    .orgTree-8496320 {
        padding: 4rem 0;
        min-width: max-content;
        min-height: max-content;
    }

    .overlayControls-8496320 {
        position: absolute;
        top: 1rem;
        right: 1rem;
        z-index: 10;
    }
}

@keyframes orgChartFadeIn {
    from {
        opacity: 0;
        transform: translateY(10px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}

/* Selection Node Styles */
@keyframes nodeAppear {
    from {
        opacity: 0;
        transform: scale(0.9);
    }

    to {
        opacity: 1;
        transform: scale(1);
    }
}

@keyframes childrenAppear {
    from {
        opacity: 0;
        transform: translateY(-10px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}

.selectionNode-8496320 {
    --connectorsColor: var(--bs-gray);
    --cardWidth: 200px;

    display: flex;
    flex-direction: column;
    align-items: center;
    animation: nodeAppear 0.4s ease-out;

    .nodeCard-8496320 {
        width: var(--cardWidth);
        transition: all var(--transition-base);
        position: relative;
        cursor: pointer;

        &:hover {
            box-shadow: var(--bs-box-shadow);
        }

        &:has(input.form-check-input:checked) {
            background-color: var(--bs-primary-bg-subtle);
        }
    }

    .childrenContainer-8496320 {
        display: flex;
        flex-direction: column;
        align-items: center;
        position: relative;
        margin-top: 0;
        animation: childrenAppear 0.3s ease-out;
    }

    .connectorLine-8496320 {
        width: 2px;
        height: 40px;
        background: var(--connectorsColor);
        position: relative;
        margin-bottom: 0;
    }

    .childrenNodes-8496320 {
        --childGap: 2rem;
        display: flex;
        justify-content: center;
        position: relative;
        gap: var(--childGap);

        /* Horizontal connector line between siblings */
        &::before {
            content: "";
            position: absolute;
            top: 0;
            height: 2px;
            background: var(--connectorsColor);
            z-index: 1;
        }

        /* Position horizontal line to span from first to last child */
        &:not(:has(:only-child))::before {
            left: calc(50% / var(--child-count, 2));
            right: calc(50% / var(--child-count, 2));
        }

        &:has(:only-child)::before {
            display: none;
        }

        .childWrapper-8496320 {
            display: flex;
            flex-direction: column;
            align-items: center;
            position: relative;
            padding-top: var(--space-10);
            flex: 0 0 auto;

            &::before {
                content: "";
                position: absolute;
                top: 0;
                left: 50%;
                transform: translateX(-50%);
                width: 2px;
                height: 40px;
                background: var(--connectorsColor);
                z-index: 2;
            }

            .childConnector-8496320::before {
                content: "";
                position: absolute;
                top: 0;
                right: 50%;
                width: calc(50% + (var(--childGap) / 2));
                height: 2px;
                background: var(--connectorsColor);
                z-index: 1;
            }

            .childConnector-8496320::after {
                content: "";
                position: absolute;
                top: 0;
                left: 50%;
                width: calc(50% + (var(--childGap) / 2));
                height: 2px;
                background: var(--connectorsColor);
                z-index: 1;
            }

            &:first-child > .childConnector-8496320::before,
            &:only-child > .childConnector-8496320::before {
                content: none;
            }

            &:last-child > .childConnector-8496320::after,
            &:only-child > .childConnector-8496320::after {
                content: none;
            }
        }
    }
}


@keyframes nodeAppear {
    from {
        opacity: 0;
        transform: scale(0.9);
    }

    to {
        opacity: 1;
        transform: scale(1);
    }
}

.userAvatarSlot-abc32de {
    width: 40px;
    flex-shrink: 0;
}

.roleBadge-abc32de {
    background: var(--bs-primary);
    color: white;
    padding: 0.15rem 0.4rem;
    border-radius: var(--radius-sm);
    font-size: 0.7rem;
}

.container-abc32de {
    --connectorsColor: var(--bs-gray);
    --cardWidth: 240px;

    display: flex;
    flex-direction: column;
    align-items: center;
    animation: nodeAppear 0.4s ease-out;

    .nodeCard-abc32de {
        width: var(--cardWidth);
        cursor: pointer;
        transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
        position: relative;
        text-decoration: none;
        border-color: var(--bs-border-color);
        cursor: pointer;

        &:hover {
            box-shadow: var(--bs-box-shadow);
            border-color: var(--bs-primary);
        }

        .rolesPopover-abc32de {
            position: absolute;
            top: 0;
            left: calc(100% + 0.6rem);
            width: 320px;
            max-height: 420px;
            overflow-y: auto;
            padding: 0.6rem 0.75rem;
            border-radius: var(--bs-border-radius, 0.375rem);
            background-color: var(--bs-body-bg);
            color: var(--bs-body-color);
            border: 1px solid var(--bs-border-color);
            box-shadow: var(--bs-box-shadow);
            font-size: 0.8125rem;
            text-align: left;
            cursor: default;
            opacity: 0;
            visibility: hidden;
            pointer-events: none;
            transform: translateX(-0.25rem);
            transition:
                opacity 120ms ease,
                transform 120ms ease,
                visibility 120ms ease;
            z-index: var(--bs-tooltip-zindex, 1080);

            /* arrow pointing left to the card */
            &::before {
                content: "";
                position: absolute;
                top: 1rem;
                right: 100%;
                border-style: solid;
                border-width: 0.4rem 0.4rem 0.4rem 0;
                border-color: transparent var(--bs-border-color) transparent
                    transparent;
            }

            &::after {
                content: "";
                position: absolute;
                top: 1rem;
                right: calc(100% - 1px);
                border-style: solid;
                border-width: 0.4rem 0.4rem 0.4rem 0;
                border-color: transparent var(--bs-body-bg) transparent
                    transparent;
            }
        }

        &:hover .rolesPopover-abc32de,
        &:focus-within .rolesPopover-abc32de {
            opacity: 1;
            visibility: visible;
            pointer-events: auto;
            transform: translateX(0);
            transition-delay: 120ms;
        }

        .popoverHeader-abc32de {
            margin-bottom: 0.4rem;
            padding-bottom: 0.35rem;
            border-bottom: 1px solid var(--bs-border-color);
            color: var(--bs-emphasis-color);
        }

        .popoverSection-abc32de {
            margin-bottom: var(--space-2);

            &:last-child {
                margin-bottom: 0;
            }
        }

        .popoverSectionTitle-abc32de {
            font-weight: bold;
            color: var(--bs-secondary-color);
            margin-bottom: var(--space-1);
        }

        .popoverPermissionType-abc32de {
            color: var(--bs-secondary-color);
        }

        /* Permission filter highlighting */
        &.highlighted-abc32de {
            /* Override Bootstrap text-secondary to be visible on success background */
            .text-secondary {
                color: rgba(255, 255, 255, 0.75) !important;
            }

            &:hover {
                box-shadow: var(--bs-box-shadow);
            }
        }

        /* Permission filter dimming */
        &.dimmed-abc32de {
            opacity: 0.4;

            &:hover {
                opacity: 0.7;
            }
        }

        .nodeTitle-abc32de {
            &:hover {
                font-weight: bold;
            }

            button.expand-abc32de {
                &:active {
                    transform: scale(0.95);
                }
            }
        }

        .groupDescription-abc32de:has(small:empty) {
            display: none;
        }
    }

    .childrenContainer-abc32de {
        display: flex;
        flex-direction: column;
        align-items: center;
        position: relative;
        margin-top: 0;
        animation: childrenAppear 0.3s ease-out;
    }

    @keyframes childrenAppear {
        from {
            opacity: 0;
            transform: translateY(-10px);
        }

        to {
            opacity: 1;
            transform: translateY(0);
        }
    }

    .connectorLine-abc32de {
        width: var(--connector-line-width, 2px);
        height: 40px;
        background: var(--connectorsColor);
        position: relative;
        margin-bottom: 0;
    }

    .childrenNodes-abc32de {
        --childGap: 3rem;
        display: flex;
        justify-content: center;
        position: relative;
        gap: var(--childGap);

        /* Horizontal connector line between siblings */
        &::before {
            content: "";
            position: absolute;
            top: 0;
            height: var(--connector-line-width, 2px);
            background: var(--connectorsColor);
            z-index: 1;
        }

        /* Position horizontal line to span from first to last child */
        &:not(:has(:only-child))::before {
            left: calc(50% / var(--child-count, 2));
            right: calc(50% / var(--child-count, 2));
        }

        &:has(:only-child)::before {
            display: none;
        }

        .childWrapper-abc32de {
            display: flex;
            flex-direction: column;
            align-items: center;
            position: relative;
            padding-top: var(--space-10);
            flex: 0 0 auto;

            &::before {
                content: "";
                position: absolute;
                top: 0;
                left: 50%;
                transform: translateX(-50%);
                width: var(--connector-line-width, 2px);
                height: 40px;
                background: var(--connectorsColor);
                z-index: 2;
            }

            .childConnector-abc32de::before {
                content: "";
                position: absolute;
                top: 0;
                right: 50%;
                width: calc(50% + (var(--childGap) / 2));
                height: var(--connector-line-width, 2px);
                background: var(--connectorsColor);
                z-index: 1;
            }

            .childConnector-abc32de::after {
                content: "";
                position: absolute;
                top: 0;
                left: 50%;
                width: calc(50% + (var(--childGap) / 2));
                height: var(--connector-line-width, 2px);
                background: var(--connectorsColor);
                z-index: 1;
            }

            &:first-child > .childConnector-abc32de::before,
            &:only-child > .childConnector-abc32de::before {
                content: none;
            }

            &:last-child > .childConnector-abc32de::after,
            &:only-child > .childConnector-abc32de::after {
                content: none;
            }
        }
    }

    &.layoutVertical-abc32de {
        flex-direction: row;
        align-items: center;

        .childrenContainer-abc32de {
            flex-direction: row;
            align-items: center;
        }

        .nodeCard-abc32de {
            .rolesPopover-abc32de {
                top: calc(100% + 0.6rem);
                left: 0;
                transform: translateY(-0.25rem);

                &::before {
                    top: auto;
                    right: auto;
                    bottom: 100%;
                    left: 1rem;
                    border-width: 0 0.4rem 0.4rem 0.4rem;
                    border-color: transparent transparent
                        var(--bs-border-color) transparent;
                }

                &::after {
                    top: auto;
                    right: auto;
                    bottom: calc(100% - 1px);
                    left: 1rem;
                    border-width: 0 0.4rem 0.4rem 0.4rem;
                    border-color: transparent transparent var(--bs-body-bg)
                        transparent;
                }
            }

            &:hover .rolesPopover-abc32de,
            &:focus-within .rolesPopover-abc32de {
                transform: translateY(0);
            }
        }

        .connectorLine-abc32de {
            width: 40px;
            height: var(--connector-line-width, 2px);
        }

        .childrenNodes-abc32de {
            flex-direction: column;
            justify-content: flex-start;

            &::before {
                top: auto;
                left: 0;
                width: var(--connector-line-width, 2px);
                height: auto;
            }

            &:not(:has(:only-child))::before {
                top: calc(50% / var(--child-count, 2));
                bottom: calc(50% / var(--child-count, 2));
                left: 0;
                right: auto;
            }

            .childWrapper-abc32de {
                flex-direction: row;
                align-items: center;
                padding-top: 0;
                padding-left: var(--space-10);

                &::before {
                    top: 50%;
                    left: 0;
                    transform: translateY(-50%);
                    width: 40px;
                    height: var(--connector-line-width, 2px);
                }

                .childConnector-abc32de::before {
                    top: auto;
                    bottom: 50%;
                    right: auto;
                    left: 0;
                    width: var(--connector-line-width, 2px);
                    height: calc(50% + (var(--childGap) / 2));
                }

                .childConnector-abc32de::after {
                    top: 50%;
                    left: 0;
                    width: var(--connector-line-width, 2px);
                    height: calc(50% + (var(--childGap) / 2));
                }
            }
        }
    }
}


/* `.iconContainer` and `.companyName` render inside `<SingleSelect children>`,
   which portals out of the SingleSelect wrapper. Stylance-hashed so they stay
   unique to this component at top level. */
.iconContainer-bd8ba1c {
    width: 1.5rem;
    text-align: center;
    flex-grow: 0 !important;

    img {
        width: 1.5rem;
        max-height: 1.5rem;
        object-fit: contain !important;
    }
}

.companyName-bd8ba1c {
    flex-grow: 1 !important;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

/* Forces the single `<td>` in each dropdown row to take the full width.
   Scoped via `:has(.iconContainer)` so it only matches rows of this select. */
td:has(.iconContainer-bd8ba1c) {
    width: 100%;
}


.filterContainer-b5556f2 {
    min-width: 280px;

    .inputWrapper-b5556f2 {
        position: relative;

        input[type="search"] {
            padding-right: var(--space-10);
        }
    }

    .inputIcon-b5556f2 {
        position: absolute;
        right: 0.75rem;
        top: 50%;
        transform: translateY(-50%);
        color: var(--bs-secondary-color);
        pointer-events: none;
    }

    .clearBtn-b5556f2 {
        position: absolute;
        right: 0.25rem;
        top: 50%;
        transform: translateY(-50%);
        padding: var(--space-1) var(--space-2);
        border: none;
        background: none;
        color: var(--bs-secondary-color);
        cursor: pointer;

        &:hover {
            color: var(--bs-body-color);
        }
    }

    .matchBadge-b5556f2 {
        display: block;
        margin-top: var(--space-1);
        font-size: 0.75rem;
    }

    .dropdown-menu {
        max-height: 50vh;
        overflow-y: auto;
        min-width: 100%;
        width: max-content;
        max-width: 500px;
    }
}


.permissionPicker-1b505f9 {
    .permissionRow-1b505f9 {
        padding: var(--space-2) 0;
        border-bottom: 1px solid var(--bs-border-color-translucent);

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

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


.filterContainer-bdcaa24 {
    min-width: 280px;

    .inputWrapper-bdcaa24 {
        position: relative;

        input[type="search"] {
            padding-right: var(--space-10);
        }
    }

    .inputIcon-bdcaa24 {
        position: absolute;
        right: 0.75rem;
        top: 50%;
        transform: translateY(-50%);
        color: var(--bs-secondary-color);
        pointer-events: none;
    }

    .clearBtn-bdcaa24 {
        position: absolute;
        right: 0.25rem;
        top: 50%;
        transform: translateY(-50%);
        padding: var(--space-1) var(--space-2);
        border: none;
        background: none;
        color: var(--bs-secondary-color);
        cursor: pointer;

        &:hover {
            color: var(--bs-body-color);
        }
    }

    .matchBadge-bdcaa24 {
        display: block;
        margin-top: var(--space-1);
        font-size: 0.75rem;
    }

    .dropdown-menu {
        max-height: 50vh;
        overflow-y: auto;
        min-width: 100%;
        width: max-content;
        max-width: 500px;
    }
}


.rolePicker-62205df {
    /* Section styles */
    .roleSection-62205df {
        border: 1px solid var(--bs-border-color);
        border-radius: var(--bs-border-radius);
        padding: var(--space-4);
        margin-bottom: var(--space-4);
        background: var(--bs-body-bg);
    }

    .roleSectionHeader-62205df {
        margin-bottom: var(--space-3);
    }

    .roleSectionTitle-62205df {
        font-weight: 600;
        color: var(--bs-primary);
    }

    /* Card styles */
    .roleCard-62205df {
        border: 1px solid var(--bs-border-color);
        border-radius: var(--bs-border-radius);
        padding: var(--space-3);
        margin-bottom: var(--space-2);
        background: var(--bs-body-bg);
        transition: border-color var(--transition-base);

        &:hover {
            border-color: var(--bs-primary);
        }

        &:last-child {
            margin-bottom: 0;
        }
    }

    .roleName-62205df {
        font-weight: 500;
    }

    .roleDescription-62205df {
        font-size: 0.85rem;
        color: var(--bs-secondary);
    }

    /* Permissions preview */
    .permissionsPreview-62205df {
        margin-top: var(--space-3);
        padding-top: var(--space-3);
        border-top: 1px solid var(--bs-border-color-translucent);
    }

    .permissionsAccordion-62205df {
        font-size: 0.875rem;

        .accordion-button {
            padding: var(--space-2) var(--space-3);
            font-size: 0.875rem;
        }

        .accordion-body {
            padding: var(--space-2) var(--space-3);
        }
    }

    .permissionBadge-62205df {
        background: rgba(var(--bs-primary-rgb), 0.1);
        color: var(--bs-primary);
        padding: 0.2rem 0.5rem;
        border-radius: var(--radius-sm);
        font-size: 0.75rem;
        margin: 0.125rem;
    }

    /* Dropdown styles */
    .dropdownMenu-62205df {
        max-height: 300px;
        overflow-y: auto;
    }

    /* Badge styles */
    .roleBadge-62205df {
        background: var(--bs-primary);
        color: white;
        padding: var(--space-1) var(--space-2);
        border-radius: var(--radius-sm);
        font-size: 0.75rem;
    }

    /* Empty state */
    .noRoles-62205df {
        color: var(--bs-secondary);
        font-style: italic;
        padding: var(--space-4);
        text-align: center;
    }

    /* Expand button */
    .expandButton-62205df {
        padding: 0;
        border: none;
        background: transparent;
        color: var(--bs-secondary);
        cursor: pointer;
        transition: transform var(--transition-base);

        &:hover {
            color: var(--bs-primary);
        }

        &.expanded-62205df {
            transform: rotate(180deg);
        }
    }
}


.card-6f859c6 {
    border-radius: var(--radius-md);
    transition: box-shadow var(--transition-fast);
}

.card-6f859c6:hover {
    box-shadow: var(--bs-box-shadow);
}

.header-6f859c6 {
    border-bottom: 1px solid var(--bs-border-color);
}

.groupSection-6f859c6 {
    /* Anchor for the adjacent-sibling separator below. */
}

.groupSection-6f859c6 + .groupSection-6f859c6 {
    padding-top: var(--space-3);
    border-top: 1px dashed var(--bs-border-color-translucent);
}

.roleRow-6f859c6 {
    align-items: center;
}

.chips-6f859c6 {
    max-height: 16rem;
    overflow-y: auto;
}

.chip-6f859c6 {
    border-radius: var(--radius-sm);
    overflow: hidden;
    font-size: 0.75rem;
    line-height: 1.2;
    border: 1px solid rgba(var(--bs-primary-rgb), 0.25);
}

.chipEntity-6f859c6 {
    background: rgba(var(--bs-primary-rgb), 0.18);
    color: var(--bs-primary);
    padding: 0.2rem 0.45rem;
    font-weight: 600;
    white-space: nowrap;
}

.chipAction-6f859c6 {
    background: rgba(var(--bs-primary-rgb), 0.06);
    color: var(--bs-body-color);
    padding: 0.2rem 0.45rem;
    white-space: nowrap;
}


.root-77b8769 {
    width: 100%;
}

.pickerCard-77b8769 {
    border-radius: var(--radius-md);
}

.pickerControl-77b8769 {
    min-width: 0;
}

.emptyState-77b8769 {
    background: var(--bs-body-bg);
    border: 1px dashed var(--bs-border-color);
    border-radius: var(--radius-md);
}

.emptyIcon-77b8769 {
    width: 2.5rem;
    height: 2.5rem;
    opacity: 0.5;
}


.permissionsContainer-183084f {
    max-width: 800px;
}

.permissionsContainer-183084f h4 {
    margin-bottom: var(--space-2);
}

.featuresGrid-183084f {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
    gap: var(--space-4);
    margin-top: var(--space-6);
}

.featureCard-183084f {
    padding: var(--space-4);
    background: var(--bs-gray-100);
    border-radius: 0.375rem;
    border: 1px solid var(--bs-border-color);
    transition: all var(--transition-base);
}

.featureCard-183084f:hover {
    background: var(--bs-gray-200);
    border-color: var(--bs-primary);
}


.productionCoverSheet-ad4574d {
    -webkit-print-color-adjust: exact;
    print-color-adjust: exact;
    max-width: 1200px;
    margin: 0 auto;

    .weekColorMarker-ad4574d {
        position: relative;
        width: 2.5rem;
        height: 2.5rem;
        background: var(--bs-tertiary-bg);
        border-radius: 50%;
        margin-right: var(--space-2);

        .weekNumber-ad4574d {
            position: absolute;
            bottom: 2px;
            font-weight: 900;
            font-size: 0.75rem;
        }
    }

    .qrCodeSection-ad4574d {
        padding: var(--space-2);
        background: white;
        border-radius: var(--bs-border-radius);
        box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
    }

    .qrCodePlaceholder-ad4574d {
        width: 200px;
        height: 200px;
        border: 2px dashed var(--bs-border-color);
        border-radius: var(--bs-border-radius);
        background-color: var(--bs-tertiary-bg);

        i {
            color: var(--bs-secondary-color);
        }
    }

    .qrCodeClickable-ad4574d {
        cursor: pointer;
        border-radius: var(--bs-border-radius);
        transition:
            transform var(--transition-base),
            box-shadow var(--transition-base);

        &:hover {
            transform: scale(1.02);
            box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
        }

        img {
            display: block;
            border-radius: var(--bs-border-radius);
        }
    }

    .employees-ad4574d {
        display: grid;
        grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
        gap: var(--space-4);
    }

    .employeeCard-ad4574d {
        height: 100%;
        border: 1px solid var(--bs-border-color);
        border-radius: var(--bs-border-radius);
        background: var(--bs-body-bg);
        transition: box-shadow var(--transition-base);

        &:hover {
            box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
        }
    }

    .employeeCard-ad4574d.onLeave-ad4574d {
        opacity: 0.6;
        background: var(--bs-warning-bg-subtle);
    }

    .position-ad4574d {
        margin-top: -2px;
        color: #a6844e;
        font-variant: small-caps;
        text-transform: capitalize;
        font-size: 0.85rem;
    }
}

@media screen {
    .productionCoverSheet-ad4574d {
        padding: var(--space-6);
    }
}

@media print {
    .productionCoverSheet-ad4574d {
        padding: 0;
    }
}


.avatarCell-e7435d6 {
    width: 48px;
}


.previewPdf-7fdda1d {
	width: 100%;
	height: 600px;
	border: 0;
}

.previewImage-7fdda1d {
	max-width: 100%;
	max-height: 600px;
}


.flagCell-4ab4189 {
	width: 2em;
}

.cheapestIcon-4ab4189 {
	display: none;
}

tr.cheapest-4ab4189 .cheapestIcon-4ab4189 {
	display: inline-block;
}


.canvas-f46579e {
    cursor: crosshair;
    max-width: 100%;
}


.chartContainer-a6ba634 {
    min-height: 400px;
    max-height: 650px;
    height: 70vh;
}


.progressReport-7aa2bf6 {
    /* Compact header on mobile */
    .cardHeaderMeta-7aa2bf6 {
        font-size: 0.875rem;
        color: var(--bs-secondary-color);
    }

    .cardSubtitle-7aa2bf6 h5 {
        margin-bottom: 0;
        font-size: 1rem;
    }

    .cardSubtitle-7aa2bf6 cite {
        /* ast-grep-ignore prefer-bootstrap-flex-utility */
        display: flex;
        align-items: center;
        font-size: 0.875rem;
    }

    .cardBody-7aa2bf6 {
        padding: var(--space-3);
    }

    .cardBody-7aa2bf6 .card-text {
        font-size: 0.9rem;
        margin-bottom: var(--space-3);
    }
}

/* Desktop improvements */
@media (min-width: 768px) {
    .progressReport-7aa2bf6 {
        .cardHeader-7aa2bf6 {
            gap: var(--space-3);
        }

        .cardHeaderTop-7aa2bf6 {
            flex-direction: row;
            justify-content: space-between;
            align-items: flex-start;
        }

        .cardSubtitle-7aa2bf6 {
            flex-direction: row;
            justify-content: space-between;
            align-items: center;
        }

        .cardSubtitle-7aa2bf6 h5 {
            font-size: 1.1rem;
        }

        .cardBody-7aa2bf6 {
            padding: var(--space-4);
        }

        .cardBody-7aa2bf6 .card-text {
            font-size: 1rem;
            margin-bottom: var(--space-4);
        }
    }
}


.breadcrumbItem-82816b7 {
    max-width: 300px;
}


@media (min-width: 768px) {
    .progressReportsList-510fa33 {
        display: grid;
        grid-template-columns: repeat(auto-fill, minmax(32rem, 1fr));
        grid-auto-flow: dense;
    }
}


.matrix-8201667 {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 1px;
    background-color: var(--bs-border-color-translucent);
    border-top: 1px solid var(--bs-border-color-translucent);
}

.matrixCell-8201667 {
    padding: 0.9rem 1rem;
    background-color: var(--bs-body-bg);
    color: inherit;
    text-decoration: none;
    transition: background-color var(--transition-fast);

    &:hover {
        background-color: var(--bs-tertiary-bg);
    }
}

.matrixBadge-8201667 {
    min-width: 2.5rem;
    padding: 0.35rem 0.6rem;
    border-radius: 999px;
    font-size: 1.1rem;
    font-weight: 700;
    text-align: center;
}

.matrixLabel-8201667 {
    font-size: 0.9rem;
    font-weight: 500;
}


/* Bootstrap utilities cover most layout (flex, gap, padding, borders, colors).
 * What remains here is what Bootstrap doesn't ship: a custom row hover, the
 * color-mix accent backgrounds for pending/awaiting rows, and the markdown
 * fade-out clamp. Keep this file small. */

.row-7180e79 {
    border-left: 3px solid transparent;
    transition: background-color 0.12s ease-in-out;

    &:hover {
        background-color: var(--bs-tertiary-bg);
    }

    &:last-child {
        border-bottom: 0 !important;
    }
}

.rowPending-7180e79 {
    border-left-color: var(--bs-primary);
    background-color: color-mix(in srgb, var(--bs-primary) 5%, transparent);
}

.rowAwaiting-7180e79 {
    border-left-color: var(--bs-warning);
    background-color: color-mix(in srgb, var(--bs-warning) 6%, transparent);
}

.notes-7180e79 {
    .markdown-preview {
        margin-bottom: 0;
        max-height: 4.5rem;
        overflow: hidden;
        position: relative;
    }

    .markdown-preview::after {
        content: "";
        position: absolute;
        inset: auto 0 0 0;
        height: 1.25rem;
        background: linear-gradient(to bottom, transparent, var(--bs-body-bg));
        pointer-events: none;
    }
}


/* Work center edit view — soft-card design tokens. Stylance-scoped.
 *
 * Flex layout primitives (display:flex, align-items, justify-content, gap,
 * flex-direction) live on the view via Bootstrap utilities — this module
 * only carries visual properties (border, background, radius, sizing). */

.shell-3b9ee02 {
    width: 100%;
}

.subSectionLabel-3b9ee02 {
    font-size: 0.78rem;
    font-weight: 600;
    color: var(--bs-body-color);
    margin-bottom: var(--space-2);
}

.teamColumn-3b9ee02 {
    background: var(--bs-tertiary-bg);
    border-radius: var(--radius-md);
    padding: 0.85rem;
    height: 100%;
}

.sectionCount-3b9ee02 {
    font-size: 0.7rem;
    font-weight: 500;
    background: var(--bs-secondary-bg);
    color: var(--bs-secondary-color);
    padding: 0.05rem 0.4rem;
    border-radius: var(--radius-sm);
    margin-left: var(--space-1);
    letter-spacing: 0;
    text-transform: none;
}

.softCard-3b9ee02 {
    border: 0.5px solid rgba(0, 0, 0, 0.08);
    border-radius: var(--radius-xl);
    box-shadow: none;

    .card-header {
        padding: var(--space-3) var(--space-5);
        background: transparent;
    }

    .card-body {
        padding: var(--space-5);
    }
}

.formLabelSm-3b9ee02 {
    font-size: 0.78rem;
    color: var(--bs-secondary-color);
    margin-bottom: var(--space-1);
    font-weight: 400;
}

.iconFrame-3b9ee02 {
    position: relative;
    aspect-ratio: 1 / 1;
    background: var(--bs-tertiary-bg);
    border-radius: var(--radius-md);
    overflow: hidden;
    max-width: 12rem;
    margin: 0 auto;
}

.iconPlaceholder-3b9ee02 {
    color: var(--bs-secondary-color);
    font-size: 0.85rem;
}

.machineRow-3b9ee02 {
    padding: 0.7rem 1.25rem;
    border: 1px solid rgba(0, 0, 0, 0.08);
    border-radius: var(--radius-md);
    margin-bottom: var(--space-2);
    position: relative;
    background: var(--bs-body-bg);
}

.machineRow-3b9ee02:last-of-type {
    margin-bottom: var(--space-3);
}

.machineIcon-3b9ee02 {
    flex-shrink: 0;
    width: 2rem;
    height: 2rem;
    border-radius: 0.4rem;
    background: var(--bs-tertiary-bg);
    color: var(--bs-secondary-color);
    overflow: hidden;
}

.machineIcon-3b9ee02 > img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.machineName-3b9ee02 {
    font-size: 0.9rem;
    color: var(--bs-body-color);
}

.machineChevron-3b9ee02 {
    flex-shrink: 0;
    color: var(--bs-secondary-color);
    opacity: 0.6;
}


/* Machine edit view — soft-card design tokens. Stylance-scoped.
 *
 * Flex layout primitives live on the view via Bootstrap utilities — this
 * module only carries visual properties (border, background, radius). */

.shell-1b0e4c5 {
    width: 100%;
}

.sectionCount-1b0e4c5 {
    font-size: 0.7rem;
    font-weight: 500;
    background: var(--bs-secondary-bg);
    color: var(--bs-secondary-color);
    padding: 0.05rem 0.4rem;
    border-radius: var(--radius-sm);
    margin-left: var(--space-1);
    letter-spacing: 0;
    text-transform: none;
}

.softCard-1b0e4c5 {
    border: 0.5px solid rgba(0, 0, 0, 0.08);
    border-radius: var(--radius-xl);
    box-shadow: none;

    .card-header {
        padding: var(--space-3) var(--space-5);
        background: transparent;
    }

    .card-body {
        padding: var(--space-5);
    }
}

.formLabelSm-1b0e4c5 {
    font-size: 0.78rem;
    color: var(--bs-secondary-color);
    margin-bottom: var(--space-1);
    font-weight: 400;
}

.pictureFrame-1b0e4c5 {
    position: relative;
    aspect-ratio: 4 / 3;
    background: var(--bs-tertiary-bg);
    border-radius: var(--radius-md);
    overflow: hidden;
}

.pictureFrame-1b0e4c5 img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

.picturePlaceholder-1b0e4c5 {
    color: var(--bs-secondary-color);
    font-size: 0.85rem;
}

.probeRow-1b0e4c5 {
    padding: 0.7rem 0.9rem;
    border: 1px solid rgba(0, 0, 0, 0.08);
    border-radius: var(--radius-md);
    margin-bottom: var(--space-2);
    position: relative;
    background: var(--bs-body-bg);
}

.probeRow-1b0e4c5:last-of-type {
    margin-bottom: var(--space-3);
}

.probeIcon-1b0e4c5 {
    flex-shrink: 0;
    width: 2rem;
    height: 2rem;
    border-radius: 0.4rem;
    background: var(--bs-tertiary-bg);
    color: var(--bs-secondary-color);
}

.probeBody-1b0e4c5 {
    flex-grow: 1;
    min-width: 0;
}

.probeName-1b0e4c5 {
    font-size: 0.9rem;
    font-weight: 600;
    color: var(--bs-body-color);
}

.probeValue-1b0e4c5 {
    font-size: 0.8rem;
    color: var(--bs-secondary-color);
    font-family: var(--bs-font-monospace);
}

.probeChevron-1b0e4c5 {
    flex-shrink: 0;
    color: var(--bs-secondary-color);
    opacity: 0.6;
}

.statusRow-1b0e4c5 {
    height: calc(1.5em + 0.75rem + 2px);
}


/* Probe edit view — soft-card design tokens. Stylance-scoped. */

.shell-a7bd351 {
    width: 100%;
}

.softCard-a7bd351 {
    border: 0.5px solid rgba(0, 0, 0, 0.08);
    border-radius: var(--radius-xl);
    box-shadow: none;

    .card-header {
        padding: var(--space-3) var(--space-5);
        background: transparent;
    }

    .card-body {
        padding: var(--space-5);
    }
}

.formLabelSm-a7bd351 {
    font-size: 0.78rem;
    color: var(--bs-secondary-color);
    margin-bottom: var(--space-1);
    font-weight: 400;
}

.statusRow-a7bd351 {
    height: calc(1.5em + 0.75rem + 2px);
}


.colName-e8d28d3 {
    width: 25%;
}


.shell-16e67d2 {
    width: 100%;
    padding-top: var(--space-2);
}

.statusCard-16e67d2 {
    border: 0.5px solid rgba(0, 0, 0, 0.08);
    border-left: 4px solid transparent;
    border-radius: var(--radius-xl);
    box-shadow: none;
}

.statusCard-16e67d2 .card-body {
    padding: var(--space-5);
}

.statusRunning-16e67d2 {
    border-left-color: var(--bs-success);
}

.statusIdle-16e67d2 {
    border-left-color: var(--bs-warning);
}

.sectionHeading-16e67d2 {
    margin-top: var(--space-4);
    margin-bottom: var(--space-2);
}

.historyTable-16e67d2 td {
    vertical-align: middle;
}


.delayBar-c358f64 {
    height: 3px;
}

.progressFill-c358f64 {
    width: 0%;
}


.progressFill-b8f249c {
    width: 0%;
}


/* Status badge text on quotation rows is hidden by default (icon + tooltip
   carry the meaning) and only revealed on very wide viewports, because the
   table is rendered inside a half-width col-md-6 card on desktop. */
.statusBadgeText-138984a {
    display: none;
}

.clickableCell-138984a {
    cursor: pointer;
}

@media (min-width: 2400px) {
    .statusBadgeText-138984a {
        display: inline;
    }
}


table {
    .imageCol-416e2f0 {
        width: 5rem;
    }

    td.imageCol-416e2f0 img {
        max-width: 4rem;
        max-height: 4rem;
        object-fit: contain;
    }

    .codeCol-416e2f0 {
        width: 12rem;
    }

    .pkgRateCol-416e2f0 {
        width: 16rem;
    }

    .grossAmountCol-416e2f0 {
        width: 16rem;
    }

    .discountCol-416e2f0 {
        width: 8rem;
    }

    .vatCol-416e2f0 {
        width: 16rem;
    }

    .qtyPerPkgInput-416e2f0 {
        width: 5rem;
        flex: 0 0 5rem;
    }

    .numPkgInput-416e2f0 {
        width: 4rem;
        flex: 0 0 4rem;
    }

    .unitText-416e2f0 {
        width: 3rem;
        flex: 0 0 3rem;
        justify-content: center;
    }
}


.invoiceCountInput-b5af0e4 {
    max-width: 80px;
}

/* Label-only validation decorator: the wrapping div is the col-sm-3 grid
 * column itself. Hide the inline .invalid-feedback message — the top
 * UiErrorsPanel already surfaces it; rendering it inside a narrow left
 * column breaks the form alignment. */
.costLabelDecorator-b5af0e4 > .invalid-feedback {
    display: none;
}


.checkboxColumn-e31df08 {
    width: 40px;
}


.checkboxColumn-840ed76 {
    width: 2.5rem;
}


.progressBar-7fca964 {
    height: 20px;
}

.progressSegment-7fca964 {
    width: 0%;
}


.headerGrid-dfb815a {
    grid-template-columns: minmax(0, 1fr) auto;
}


.approveCell-f057cca {
    position: relative;
    z-index: 2;
}


.dropzoneLabel-7976462 {
    cursor: pointer;
}

/* Mirrors mantiq_utils FilePreviewInline's filePreviewPdfContainer
   (min-height 350px, height 500px) so the pre-save preview matches the
   post-save accordion preview. */
.pdfPreviewFrame-7976462 {
    min-height: 350px;
    height: 500px;
}


.row-fcbb634 {
    height: 1px;

    .cell-fcbb634 {
        height: 100%;

        .cellContent-fcbb634 {
            height: 100%;
        }
    }
}


.companyIcon-7aa5b6c {
    width: 1.5rem;
    height: 1.5rem;
    flex-shrink: 0;
}


.colDragHandle-4e809d6 {
    width: 40px;
}

.colCount-4e809d6 {
    width: 100px;
}

.colMoney-4e809d6 {
    width: 250px;
}


.partsTable-d01c009 {
    table-layout: fixed;
}

.colPart-d01c009 {
    width: 25%;
}

.colCount-d01c009 {
    width: 120px;
}

.notesCell-d01c009 {
    white-space: pre-line;
}


.ganttContainer-53a9a57 {
    position: relative;
    background: var(--bs-body-bg);

    --gantt-grid-color: rgba(var(--bs-border-color-rgb), 0.55);
    --gantt-grid-major-color: rgba(var(--bs-border-color-rgb), 0.9);
    --gantt-header-bg: var(--bs-tertiary-bg);
    --gantt-name-bg: var(--bs-body-bg);
    --gantt-row-even: rgba(var(--bs-tertiary-bg-rgb), 0.12);
    --gantt-row-odd: rgba(var(--bs-tertiary-bg-rgb), 0.22);
    --gantt-task-bar: var(--bs-success-bg-subtle);
    --gantt-task-stroke: var(--bs-success);
    --gantt-group-bar: var(--bs-info-bg-subtle);
    --gantt-group-stroke: var(--bs-info);
    --gantt-progress-bar: var(--bs-success);
    --gantt-dependency-color: var(--bs-secondary-color);

    .svg-53a9a57 {
        display: block;
        width: 100%;
    }

    .headerBackground-53a9a57 {
        fill: var(--gantt-header-bg, #f8f9fa);
    }

    .headerLabel-53a9a57 {
        font-size: 11px;
        font-weight: 600;
        fill: var(--bs-body-color);
        letter-spacing: 0.02em;
        font-family:
            "Avenir LT Std 45 Book", "Droid Sans", "Helvetica Neue", Helvetica,
            Arial, sans-serif;
    }

    .headerLabelMuted-53a9a57 {
        font-size: 11px;
        font-weight: 600;
        fill: var(--bs-secondary-color);
        letter-spacing: 0.02em;
        font-family:
            "Avenir LT Std 45 Book", "Droid Sans", "Helvetica Neue", Helvetica,
            Arial, sans-serif;
    }

    .outlineControl-53a9a57 {
        opacity: 0.55;
        cursor: pointer;
        transition: opacity var(--transition-base);
    }

    .outlineControl-53a9a57:hover {
        opacity: 1;
    }

    .outlineControlHit-53a9a57 {
        fill: rgba(var(--bs-body-color-rgb), 0.06);
        stroke: rgba(var(--bs-body-color-rgb), 0.18);
    }

    .outlineControlIcon-53a9a57 {
        fill: var(--bs-body-color);
        text-anchor: middle;
        dominant-baseline: middle;
        font-size: 12px;
        font-weight: 600;
    }

    .nameColumnBackground-53a9a57 {
        fill: var(--gantt-name-bg, #ffffff);
    }

    .monthBand-53a9a57 {
        fill: rgba(var(--bs-secondary-rgb), 0.03);
    }

    .monthBandAlt-53a9a57 {
        fill: rgba(var(--bs-secondary-rgb), 0.06);
    }

    .headerDivider-53a9a57,
    .columnDivider-53a9a57 {
        stroke: var(--bs-border-color, #dee2e6);
        stroke-width: 1px;
    }

    .timeAxis-53a9a57 {
        .gridLineMinor-53a9a57 {
            stroke: var(--gantt-grid-color, #dee2e6);
            stroke-width: 1px;
            shape-rendering: crispEdges;
        }

        .gridLineMajor-53a9a57 {
            stroke: var(--gantt-grid-major-color, #adb5bd);
            stroke-width: 1.5px;
            shape-rendering: crispEdges;
        }

        .axisLabel-53a9a57 {
            font-size: 10px;
            fill: var(--bs-secondary-color, #6c757d);
            font-family:
                "Avenir LT Std 45 Book", "Droid Sans", "Helvetica Neue",
                Helvetica, Arial, sans-serif;
        }

        .axisLabelYear-53a9a57 {
            font-size: 11px;
            font-weight: 600;
            fill: var(--bs-body-color, #212529);
            font-family:
                "Avenir LT Std 45 Book", "Droid Sans", "Helvetica Neue",
                Helvetica, Arial, sans-serif;
        }
    }

    .todayLine-53a9a57 {
        stroke: var(--bs-danger, #dc3545);
        stroke-width: 1px;
        stroke-dasharray: 4, 4;
    }

    .dependencyLine-53a9a57 {
        stroke: var(--gantt-dependency-color, #6c757d);
        stroke-width: 1.2px;
        opacity: 0.85;
    }

    .dependencyLineActive-53a9a57 {
        stroke: var(--bs-primary);
        stroke-width: 2.5px;
        stroke-dasharray: 6 4;
    }

    .dependencyArrow-53a9a57 {
        fill: var(--gantt-dependency-color, #6c757d);
    }

    .dependencyArrowActive-53a9a57 {
        fill: var(--bs-primary);
    }

    .loggedTimeLine-53a9a57 {
        fill: rgba(255, 165, 0, 0.25);
        stroke: orange;
        stroke-width: 1.5px;
    }

    .tooltipBox-53a9a57 {
        position: absolute;
        background: var(--bs-body-bg);
        border: 1px solid var(--bs-border-color);
        border-radius: var(--bs-border-radius);
        padding: var(--space-2);
        box-shadow: var(--bs-box-shadow);
        pointer-events: none;
        z-index: 1000;
        width: 30vw;
        min-width: min(90vw, 300px);
        max-width: 560px;

        .tooltipHeader-53a9a57 {
            font-weight: 600;
            margin-bottom: var(--space-1);
        }

        .tooltipImage-53a9a57 {
            width: 32px;
            height: 24px;
            object-fit: cover;
            border-radius: var(--radius-sm);
        }

        .tooltipLink-53a9a57 {
            color: var(--bs-body-color);
            text-decoration: none;
        }

        .tooltipLink-53a9a57:hover {
            text-decoration: underline;
        }

        table {
            font-size: 0.875rem;
        }

        td {
            padding: 0.1rem 0.25rem;
        }
    }
}

@keyframes taskHoverHighlight {
    0% {
        stroke-dashoffset: 120;
    }

    100% {
        stroke-dashoffset: 0;
    }
}

.summaryLoggedRow-53a9a57 {
    pointer-events: none;
}

.summaryLoggedBackground-53a9a57 {
    fill: rgba(var(--bs-warning-rgb), 0.08);
}

.summaryLoggedLabel-53a9a57 {
    font-size: 12px;
    fill: var(--bs-secondary-color);
}

.staffList-53a9a57 {
    margin-top: var(--space-2);
}

.staffListItems-53a9a57 {
    gap: 0.35rem;
}

.staffItem-53a9a57 {
    display: flex;
    align-items: center;
    gap: var(--space-2);
    font-size: 0.85rem;

    img {
        width: 24px;
        height: 24px;
        object-fit: cover;
        flex-shrink: 0;
    }
}


.taskRow-6057c74 {
    .rowBackground-6057c74 {
        fill: var(--gantt-row-even, transparent);
        cursor: pointer;
        transition: fill 0.15s ease;
    }

    .rowSeparator-6057c74 {
        stroke: rgba(var(--bs-border-color-rgb), 0.48);
        stroke-width: 1px;
        shape-rendering: crispEdges;
    }

    .rowBackgroundAlt-6057c74 {
        fill: var(--gantt-row-odd, transparent);
    }

    .rowBackground-6057c74:hover {
        fill: rgba(var(--bs-primary-rgb), 0.08);
    }

    .rowCurrent-6057c74 {
        fill: var(--bs-primary-bg-subtle) !important;
    }

    .rowActive-6057c74 {
        fill: rgba(var(--bs-primary-rgb), 0.12) !important;
    }
}

.expandButton-6057c74 {
    cursor: pointer;

    .expandIcon-6057c74 {
        font-size: 10px;
        fill: var(--bs-secondary-color, #6c757d);
        dominant-baseline: middle;
    }
}

.taskName-6057c74 {
    font-size: 13px;
    fill: var(--bs-body-color, #212529);
    font-family:
        "Avenir LT Std 45 Book", "Droid Sans", "Helvetica Neue", Helvetica,
        Arial, sans-serif;
}

.outlineNumber-6057c74 {
    font-size: 12px;
    fill: var(--bs-secondary-color);
    font-family:
        "Avenir LT Std 45 Book", "Droid Sans", "Helvetica Neue", Helvetica,
        Arial, sans-serif;
}

.taskNameCurrent-6057c74 {
    fill: var(--bs-primary);
    font-weight: 600;
}

.trackImage-6057c74 {
    clip-path: inset(0 round 4px);
}

.staffAvatarImg-6057c74 {
    width: 12px;
    height: 12px;
    border-radius: 50%;
    object-fit: cover;
    display: block;
    opacity: 0.35;
    transition: opacity var(--transition-base);
}

.taskRow-6057c74:hover .staffAvatarImg-6057c74 {
    opacity: 1;
}

.taskBar-6057c74 {
    cursor: pointer;
    opacity: 0.95;
    stroke-width: 1.4px;
}

.taskBarLeaf-6057c74 {
    stroke: var(--gantt-task-stroke, #198754);
}

.taskBarGroup-6057c74 {
    stroke: var(--gantt-group-stroke, #0dcaf0);
}

.taskBarLate-6057c74 {
    fill: var(--bs-danger-bg-subtle);
    stroke: var(--bs-danger);
}

.taskBarCompletedLate-6057c74 {
    fill: var(--bs-warning-bg-subtle);
    stroke: var(--bs-warning);
}

.taskBarUndefined-6057c74 {
    stroke: var(--bs-warning);
}

.dependencyPredecessor-6057c74,
.dependencySuccessor-6057c74 {
    stroke-width: 3px;
    stroke-dasharray: 8 6;
}

.taskBar-6057c74:hover {
    opacity: 1;
    stroke-width: 2px;
}

.progressBar-6057c74 {
    pointer-events: none;
    opacity: 0.88;
}

.progressText-6057c74 {
    font-size: 11px;
    fill: white;
    font-weight: 500;
    pointer-events: none;
    font-family:
        "Avenir LT Std 45 Book", "Droid Sans", "Helvetica Neue", Helvetica,
        Arial, sans-serif;
}

.noDates-6057c74 {
    font-size: 12px;
    fill: var(--bs-secondary-color, #6c757d);
    font-style: italic;
}

.loggedTimeLine-6057c74 {
    fill: rgba(255, 165, 0, 0.25);
    stroke: orange;
    stroke-width: 1.5px;
}

.staffBadgeCircle-6057c74 {
    fill: var(--bs-primary);
}

.staffBadgeText-6057c74 {
    fill: white;
    font-size: 9px;
    text-anchor: middle;
    dominant-baseline: middle;
    font-weight: 600;
}

.rowClosed-6057c74 {
    opacity: 0.6;
}

.rowCurrent-6057c74 {
    fill: rgba(var(--bs-primary-rgb), 0.18);
}

.taskNameClosed-6057c74 {
    fill: var(--bs-secondary-color, #6c757d);
}

.taskBarClosed-6057c74 {
    opacity: 0.5;
}

.taskBarCurrent-6057c74 {
    stroke: var(--bs-primary);
    stroke-width: 2.2px;
}

.overdueOverlay-6057c74 {
    fill: rgba(var(--bs-danger-rgb), 0.15);
    pointer-events: none;
}


.warningCell-98e1ae1 {
    transition: color var(--transition-base);
}

.warningText-98e1ae1 {
    color: var(--bs-danger) !important;
    font-weight: 600;
}

/* Kanban board layout */
.kanbanBoard-98e1ae1 {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
    gap: var(--space-4);
}

.kanbanColumn-98e1ae1 {
    background: var(--bs-tertiary-bg);
    border-radius: var(--bs-border-radius);
    padding: var(--space-3);
    min-height: 220px;
    transition:
        background-color var(--transition-base),
        border-color var(--transition-base);
    border: 2px solid transparent;
}

.kanbanColumnDragOver-98e1ae1 {
    background: rgba(var(--bs-primary-rgb), 0.08);
    border-color: rgba(var(--bs-primary-rgb), 0.3);
}

.kanbanDropPlaceholder-98e1ae1 {
    height: 60px;
    border: 2px dashed var(--bs-primary);
    border-radius: var(--bs-border-radius);
    background: rgba(var(--bs-primary-rgb), 0.05);
    animation: pulse 1.5s ease-in-out infinite;
}

@keyframes pulse {
    0%,
    100% {
        opacity: 0.5;
    }
    50% {
        opacity: 1;
    }
}

.kanbanCard-98e1ae1 {
    background: var(--bs-body-bg);
    border: 1px solid var(--bs-border-color);
    border-radius: var(--bs-border-radius);
    padding: var(--space-3);
    cursor: grab;
    box-shadow: var(--bs-box-shadow-sm);
    transition:
        opacity var(--transition-base),
        transform var(--transition-base);
}

.kanbanCard-98e1ae1:active {
    cursor: grabbing;
}

.kanbanCardDragging-98e1ae1 {
    opacity: 0.5;
    transform: scale(0.98);
}

.kanbanCardSelected-98e1ae1 {
    border-color: var(--bs-primary);
    box-shadow: 0 0 0 0.2rem rgba(var(--bs-primary-rgb), 0.15);
}

.kanbanCardTitle-98e1ae1 {
    font-weight: 600;
}

.kanbanCardMeta-98e1ae1 {
    font-size: 0.85rem;
    color: var(--bs-secondary-color);
}



.projectHeader-a2f938a {
    cursor: pointer;
    transition: background-color var(--transition-fast);
}

.projectHeader-a2f938a:hover {
    background-color: var(--bs-tertiary-bg);
}

.projectProgress-a2f938a {
    height: 8px;
}

.employeeProgress-a2f938a {
    height: 6px;
}

.progressFill-a2f938a {
    width: 0%;
}

.companyIcon-a2f938a {
    width: 1.5rem;
    height: 1.5rem;
    flex-shrink: 0;
}

.rotated-a2f938a {
    transform: rotate(180deg);
    transition: transform 0.2s ease-in-out;
}


.rowClosed-328990c {
    opacity: 0.6;
}

.warningCell-328990c {
    transition: color var(--transition-base);
}

.warningText-328990c {
    color: var(--bs-danger) !important;
    font-weight: 600;
}

.successText-328990c {
    color: var(--bs-success) !important;
    font-weight: 600;
}

.ganttTable-328990c {
    --gantt-table-indent: 1.25rem;

    th {
        white-space: nowrap;
    }
}

.outlineHeader-328990c {
    width: 80px;
}

.reorderHeader-328990c {
    width: 150px;
}

.reorderCell-328990c {
    width: 150px;
}

.outlineCell-328990c {
    font-weight: 600;
    color: var(--bs-secondary-color);
}

.dragGrip-328990c {
    cursor: grab;
    opacity: 0.2;
    transition: opacity var(--transition-base);
}

.dragGripIcon-328990c {
    transform: rotate(90deg);
}

.ganttTable-328990c tr:hover .dragGrip-328990c {
    opacity: 1;
}

.summaryRow-328990c {
    background: rgba(var(--bs-info-rgb), 0.08);
    font-weight: 600;
}

.currentTaskRow-328990c {
    background: rgba(var(--bs-primary-rgb), 0.08);
}

.draggedRow-328990c {
    opacity: 0.65;
}

.taskNameText-328990c {
    font-weight: 500;
}

.progressBarTrack-328990c {
    width: 100%;
    max-width: 120px;
    height: 6px;
    background: rgba(var(--bs-secondary-rgb), 0.2);
    border-radius: 999px;
    overflow: hidden;
}

.progressBarFill-328990c {
    height: 100%;
    width: 0%;
    background: var(--bs-success);
}

.progressLabel-328990c {
    font-size: 0.75rem;
    color: var(--bs-secondary-color);
}

.expandButton-328990c {
    width: 26px;
    height: 26px;
    padding: 0;
}


/* Tree styling for lazy-loading tree view - matches TreeView component */

.treeView-1d1d72c {
    --tree-line-color: var(--bs-border-color);
    --tree-hover-bg: var(--bs-tertiary-bg);
    --tree-button-bg: var(--bs-body-bg);
    --tree-button-fg: var(--bs-tertiary-color);
    --tree-node-height: 1.75rem;
    overflow: clip;
}

.treeList-1d1d72c {
    list-style: none;
    margin: 0;
    padding: 0;
}

.treeNode-1d1d72c {
    position: relative;
    line-height: 1;
}

.treeNodeContent-1d1d72c {
    height: var(--tree-node-height);
    padding: 0 var(--space-2);
    cursor: default;
    border-radius: var(--radius-sm);
    transition: background-color 0.15s ease;

    &:hover {
        background-color: var(--tree-hover-bg);
    }
}

.treeIndent-1d1d72c {
    height: 100%;
}

.treeLine-1d1d72c {
    width: 1.25rem;
    position: relative;
    flex-shrink: 0;

    /* Vertical line - full height to connect nodes */
    &::before {
        content: "";
        position: absolute;
        left: 0.525rem;
        top: calc(-0.26 * var(--tree-node-height));
        bottom: calc(-0.5 * var(--tree-node-height));
        width: 1px;
        background-color: var(--tree-line-color);
    }

    /* Horizontal connector */
    &::after {
        content: "";
        position: absolute;
        left: 0.525rem;
        top: 50%;
        width: 0.625rem;
        height: 1px;
        background-color: var(--tree-line-color);
    }

    /* Last child - vertical line only goes to middle */
    &.lastChild-1d1d72c::before {
        bottom: 50%;
    }

    /* Empty - no lines (for ancestors where parent was last child) */
    &.empty-1d1d72c::before,
    &.empty-1d1d72c::after {
        display: none;
    }

    /* Continuation - only vertical line, no horizontal */
    &.continuation-1d1d72c::after {
        display: none;
    }
}

.toggleBtn-1d1d72c {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 1rem;
    height: 1rem;
    margin-right: 0.375rem;
    z-index: 2;
    padding: 0;
    border: none;
    cursor: pointer;
    border-radius: 0.1875rem;
    flex-shrink: 0;
    box-shadow: var(--shadow-xs);
    transition: all 0.15s ease;
    background: var(--tree-button-bg);
    color: var(--tree-button-fg);

    &:hover {
        background-color: var(--bs-gray-300);
        color: var(--bs-gray-700);
        box-shadow: 0 1px 3px rgba(0, 0, 0, 0.12);
    }

    &:focus {
        outline: none;
    }

    svg {
        width: 1rem;
        height: 1rem;
    }
}

.nodeLabel-1d1d72c {
    flex: 1;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-size: 0.875rem;
    padding: var(--space-2) 0;
}

.childrenList-1d1d72c {
    list-style: none;
    margin: 0;
    padding: 0;
}


.warningText-4bd309b {
    color: var(--bs-danger) !important;
    font-weight: 600;
}

.successText-4bd309b {
    color: var(--bs-success) !important;
    font-weight: 600;
}

.taskEditorCard-4bd309b {
    border-color: rgba(var(--bs-primary-rgb), 0.2);
}



.updateIndicator-84cc10b {
    position: absolute;
    top: 0.75rem;
    right: 0.75rem;
    z-index: 5;
    padding: 0.35rem 0.6rem;
    background: var(--bs-body-bg);
    border: 1px solid var(--bs-border-color);
    border-radius: var(--bs-border-radius);
    box-shadow: var(--bs-box-shadow-sm);
    font-size: 0.85rem;
    color: var(--bs-secondary-color);
}

.settingsPanel-84cc10b {
    max-width: 420px;
}

.taskOverlay-84cc10b {
    position: fixed;
    inset: 0;
    z-index: 1055;
    background-color: rgba(0, 0, 0, 0.55);
    padding: var(--space-4);
}

.taskDialog-84cc10b {
    margin: 0;
    width: min(1100px, 100%);
    max-height: calc(100vh - 2rem);
}


.cell-768d4b2 {
    transition: background-color var(--transition-fast);
}

.cell-768d4b2:hover {
    background-color: var(--bs-tertiary-bg);
}


/* Dashboard chart card CSS module */

.modalBackdrop-97a620f {
    background-color: rgba(0, 0, 0, 0.5);
}

.modalChart-97a620f {
    min-height: 480px;
}

.titleButton-97a620f {
    border: 0;
    background: none;
    padding: 0;
    font-weight: bold;
    color: var(--bs-body-color);
    text-decoration: none;
    cursor: pointer;
}

.titleButton-97a620f:hover {
    color: var(--bs-link-color);
    text-decoration: underline;
}


/* Stat badge with hover popover (start / end / change) */
.statWrapper-93d8131 {
    position: relative;
    cursor: help;
}

.statPopover-93d8131 {
    position: absolute;
    bottom: calc(100% + 0.25rem);
    right: 0;
    z-index: 10;
    min-width: 12rem;
    padding: var(--space-2) var(--space-3);
    border-radius: 0.375rem;
    background: var(--bs-body-bg);
    color: var(--bs-body-color);
    box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.15);
    font-size: 0.8125rem;
    white-space: nowrap;
    opacity: 0;
    pointer-events: none;
    transition: opacity 0.1s ease-out;
}

.statWrapper-93d8131:hover .statPopover-93d8131,
.statWrapper-93d8131:focus-within .statPopover-93d8131 {
    opacity: 1;
}

.statPopoverRow-93d8131 + .statPopoverRow-93d8131 {
    margin-top: 0.125rem;
}

.statPopoverLabel-93d8131 {
    color: var(--bs-secondary-color);
}

.statPopoverDivider-93d8131 {
    margin: var(--space-1) 0;
    border: 0;
    border-top: 1px solid var(--bs-border-color);
}


/* Matches Java PropertyOverviewPanel.css floor layout */

.floorSection-2b860e8 {
    margin-top: var(--space-3);
    margin-bottom: var(--space-3);
    border: 1px solid rgba(15, 23, 42, 0.08);
    border-radius: 0.9rem;
    padding: 0.5rem 0.75rem 0.85rem;
    background: rgba(255, 255, 255, 0.72);
    transition:
        border-color 160ms ease,
        box-shadow 160ms ease,
        background-color 160ms ease;
}

.floorSection-2b860e8:hover {
    border-color: rgba(13, 110, 253, 0.18);
    box-shadow: 0 10px 24px rgba(15, 23, 42, 0.08);
    background: rgba(255, 255, 255, 0.96);
}

.floorSection-2b860e8:focus-within {
    border-color: rgba(13, 110, 253, 0.2);
    box-shadow: 0 10px 24px rgba(15, 23, 42, 0.08);
    background: rgba(255, 255, 255, 0.98);
}

.floorSection-2b860e8 legend {
    padding: 0 var(--space-2);
    width: 100%;
    float: none;
    margin-bottom: 0.35rem;
}

.floorTitle-2b860e8 {
    text-decoration: none;
    color: inherit;
    font-weight: 700;
}

.floorTitle-2b860e8:hover {
    text-decoration: underline;
}

.floorSection-2b860e8:hover .floorTitle-2b860e8,
.floorSection-2b860e8:focus-within .floorTitle-2b860e8 {
    color: var(--bs-primary);
}

.floorStats-2b860e8 {
    font-size: 1rem;
    margin-left: auto;
}

.unitGrid-2b860e8 {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(100px, 1fr));
    grid-gap: 5px;
    align-items: stretch;
}


.map-c9bf9f3 {
    width: 100%;
    min-height: 500px;
    flex: 1 1 auto;
    height: 100%;
}

.numericGroup-c9bf9f3 {
    max-width: 200px;
}

.dateGroup-c9bf9f3 {
    max-width: 300px;
}


/* Timeline range input — draggable date-range slider. */

.wrapper-acca9b9 {
    /* Fixed wide width so the year ticks have room to breathe; the
     * picker is right-aligned by `ms-auto` on its parent. */
    width: 760px;
    max-width: 100%;
}

.svgRail-acca9b9 {
    touch-action: none;
    user-select: none;
    cursor: pointer;
    width: 100%;
    display: block;
}

.handle-acca9b9 {
    cursor: ew-resize;
}

.tooltip-acca9b9 {
    pointer-events: none;
}


/* Matches Java PropertyOverviewPanel.css */

.unitCell-ef7c011 {
    --border-color: var(--bs-border-color);
    border-color: var(--border-color);
    border-radius: var(--radius-lg);
    transition:
        box-shadow 160ms ease,
        border-color 160ms ease,
        background-color 160ms ease;
}

.unitCell-ef7c011:hover {
    box-shadow: 0 10px 24px rgba(15, 23, 42, 0.12);
}

.unitCell-ef7c011:focus-within {
    box-shadow: 0 10px 24px rgba(15, 23, 42, 0.12);
}

.unitStatus-ef7c011 {
    display: block;
    font-variant: small-caps;
    text-transform: capitalize;
    white-space: nowrap;
    text-align: center;
    font-weight: 500;
    font-size: 0.75rem;
    max-height: 0;
    opacity: 0;
    overflow: hidden;
    border-bottom: solid 1px transparent;
    transition:
        max-height 160ms ease,
        opacity 160ms ease,
        border-color 160ms ease,
        padding 160ms ease;
}

.unitCell-ef7c011:hover .unitStatus-ef7c011,
.unitCell-ef7c011:focus-within .unitStatus-ef7c011 {
    max-height: 1.5rem;
    opacity: 0.95;
    border-bottom-color: var(--border-color);
    padding: 0.2rem 0.35rem 0.15rem;
}

.unit-ef7c011 {
    display: flex;
    flex-direction: column;
    flex-grow: 1;
    overflow: hidden;
    border: solid 1px var(--border-color);
    border-radius: var(--radius-lg);
    padding: 0 5px;
    transition:
        border-color 160ms ease,
        background-color 160ms ease,
        box-shadow 160ms ease;
}

.unitCell-ef7c011:hover .unit-ef7c011,
.unitCell-ef7c011:focus-within .unit-ef7c011 {
    box-shadow: 0 0 0 1px rgba(13, 110, 253, 0.08);
}

.unit-ef7c011 .title-ef7c011 {
    font-weight: bold;
    min-width: 0;
}

.unitLink-ef7c011 {
    text-decoration: none;
    color: inherit;
    min-width: 0;
    flex: 1;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.unitLink-ef7c011:hover {
    text-decoration: underline;
}

.unitArea-ef7c011 {
    display: inline-block;
    font-size: 66%;
    text-align: right;
    white-space: nowrap;
    margin-left: auto;
    flex-shrink: 0;
    color: rgba(33, 37, 41, 0.72);
}

.leases-ef7c011 {
    display: flex;
    flex-direction: column;
    flex-grow: 1;
    margin: 0 -5px;
}

.leases-ef7c011 * {
    font-size: x-small;
}

.currentLease-ef7c011,
.potentialLease-ef7c011 {
    width: 100%;
    padding: 0.5rem 5px;
}

.currentLease-ef7c011 {
    flex-grow: 1;
    background: linear-gradient(
        90deg,
        rgba(0, 0, 0, 0.1) 0%,
        rgba(0, 0, 0, 0.1) var(--completion, 0%),
        transparent calc(var(--completion, 0%) + 0.01%),
        transparent 100%
    );
}

.currentLease-ef7c011:not(:first-child),
.potentialLease-ef7c011:not(:first-child) {
    border-top-style: dashed;
    border-top-width: 1px;
}

.currentLease-ef7c011.expired-ef7c011 * {
    color: rgba(169, 68, 66, 0.7);
}

.currentLease-ef7c011.overstay-ef7c011 * {
    color: #590c6b;
}

.tenant-ef7c011 {
    white-space: nowrap;
    overflow: hidden;
}

.tenant-ef7c011 a,
.lease-ef7c011 a {
    text-decoration: none;
}

.tenant-ef7c011 a:hover,
.lease-ef7c011 a:hover {
    text-decoration: underline;
}

.rates-ef7c011 {
    display: block;
}

.potentialLease-ef7c011 {
    font-style: italic;
    opacity: 0.85;
}

/* Status colors matching Java PropertyOverviewPanel.css */

.statusVacant-ef7c011 {
    background-color: #fff3cd;
    --border-color: #ffeeba;
}

.statusVacant-ef7c011:hover {
    --border-color: var(--bs-yellow);
}

.statusVacant-ef7c011 * {
    color: #856404;
}

.statusUnderOffer-ef7c011 {
    background-color: #fff3cd;
    --border-color: #c6c8ca;
}

.statusUnderOffer-ef7c011:hover {
    --border-color: var(--bs-gray);
}

.statusUnderOffer-ef7c011 * {
    color: #1b1e21;
}

.statusBooked-ef7c011 {
    --border-color: #c6c8ca;
    background: #d6d8d9 repeating-linear-gradient(135deg, transparent, transparent 5px, rgba(212, 237, 218, .6) 5px, rgba(212, 237, 218, .6) 10px);
}

.statusBooked-ef7c011:hover {
    --border-color: rgb(195, 233, 204);
}

.statusBooked-ef7c011 * {
    color: #1b1e21;
}

.statusLeased-ef7c011 {
    border-color: #bce8f1;
    --border-color: #d9edf7;
}

.statusLeased-ef7c011:hover {
    --border-color: var(--bs-success);
}

.statusOccupied-ef7c011 {
    background-color: #d4edda;
    --border-color: #c3e6cb;
}

.statusOccupied-ef7c011:hover {
    --border-color: var(--bs-success);
}

.statusOccupied-ef7c011 * {
    color: #155724;
}

.statusOverstay-ef7c011 {
    background-color: #fae6ff;
    --border-color: #d4b6db;
    background-image: url("data:image/svg+xml,%3Csvg width='15' height='15' viewBox='0 0 15 15' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='%23d4b6db' fill-opacity='0.4' fill-rule='evenodd'%3E%3Crect x='5' y='5' width='5' height='5'/%3E%3C/g%3E%3C/svg%3E");
}

.statusOverstay-ef7c011:hover {
    --border-color: purple;
}

.statusOverstay-ef7c011 * {
    color: #590c6b;
}

.statusCommonArea-ef7c011 .unit-ef7c011 {
    background-color: #fefefe;
    --border-color: #fdfdfe;
}

.statusCommonArea-ef7c011 * {
    color: #818182;
}

.statusNotOwned-ef7c011 {
    color: #818182 !important;
    background-color: #fefefe !important;
    --border-color: #fdfdfe !important;
    background: repeating-linear-gradient(
        -45deg,
        rgba(0, 0, 0, 0.05),
        rgba(0, 0, 0, 0.05) 10px,
        rgba(0, 0, 0, 0.1) 10px,
        rgba(0, 0, 0, 0.1) 20px
    );
}


.notes-cell-8eaf65c {
    white-space: pre-wrap;
    word-break: break-word;
}


.gallery-5ce1818 {
    padding: var(--space-4);
    overflow-y: auto;
}

.noImages-5ce1818 {
    width: 100%;
    text-align: center;
    padding: var(--space-12);
}


/* Matches Java PropertyOverviewPanel.css container */

.propertyOverview-b4a3c24 {
    border: solid #ccc 1px;
    background: #f1f1f1;
    padding-right: 15px;
    padding-left: 15px;
    margin-bottom: 15px;
}

.tab-content .propertyOverview-b4a3c24 {
    border-top: 0;
}

.propertyOccupancy-b4a3c24 {
    font-size: 1.5rem;
}

.headerBar-b4a3c24 {
    padding-top: var(--space-3);
    padding-bottom: var(--space-2);
}

.btnShowNotOwned-b4a3c24 {
    background: repeating-linear-gradient(
        -45deg,
        rgba(255, 193, 7, 0.6),
        rgba(255, 193, 7, 0.6) 10px,
        rgba(255, 193, 7, 1) 10px,
        rgba(255, 193, 7, 1) 20px
    );
}

.btnHideNotOwned-b4a3c24 {
    background: repeating-linear-gradient(
        -45deg,
        rgba(90, 98, 104, 0.8),
        rgba(90, 98, 104, 0.8) 10px,
        rgba(90, 98, 104, 1) 10px,
        rgba(90, 98, 104, 1) 20px
    );
    color: white;
}


.propertyRatesOverview-82deedc {
    border: solid #ccc 1px;
    background: #f1f1f1;
    padding: 15px;
    margin-bottom: 15px;
    border-radius: var(--radius-sm);
}

.headerBar-82deedc {
    margin-bottom: var(--space-4);
}

.propertyTitle-82deedc {
    font-weight: 600;
    min-height: 1.5rem;
    font-size: 2rem;
    gap: 0.35rem;
}

.propertyTitleLink-82deedc {
    text-decoration: none;
}

.propertyTitleLink-82deedc:hover {
    text-decoration: underline;
}

.propertyTitleIcon-82deedc {
    width: 4rem;
    height: 4rem;
    min-width: 4rem;
}

.headerRight-82deedc {
    margin-left: auto;
}

.occupancySummary-82deedc {
    font-size: 1.1rem;
    font-weight: 600;
}

.occupancySummary-82deedc .badge {
    font-size: 0.95rem;
    padding: 0.45rem 0.65rem;
}

.btnShowNotOwned-82deedc {
    background: repeating-linear-gradient(
        -45deg,
        rgba(255, 193, 7, 0.6),
        rgba(255, 193, 7, 0.6) 10px,
        rgba(255, 193, 7, 1) 10px,
        rgba(255, 193, 7, 1) 20px
    );
}

.btnHideNotOwned-82deedc {
    background: repeating-linear-gradient(
        -45deg,
        rgba(90, 98, 104, 0.8),
        rgba(90, 98, 104, 0.8) 10px,
        rgba(90, 98, 104, 1) 10px,
        rgba(90, 98, 104, 1) 20px
    );
    color: white;
}

.units-82deedc {
    display: grid;
    grid-template-columns: repeat(24, minmax(0, 1fr));
    grid-auto-flow: dense;
    grid-gap: 5px;
    padding: 10px 0;
    align-items: stretch;
}

.unit-82deedc {
    display: flex;
    flex-direction: column;
    flex-grow: 1;
    overflow: hidden;
    border: solid 1px #dee2e6;
    border-radius: 5px;
    padding: 0.45rem 0.5rem;
    font-size: 0.9rem;
    transition: background-color var(--transition-base), border-color var(--transition-base);
}

.unit-82deedc:hover {
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.15);
}

.unitTitle-82deedc {
    font-weight: 600;
    margin-bottom: 0.2rem;
    font-size: 0.98rem;
}

.unitName-82deedc {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    flex: 1;
}

.variationBadges-82deedc {
    display: flex;
    gap: var(--space-1);
    flex-shrink: 0;
}

.variationBadges-82deedc .badge {
    font-size: 0.72rem !important;
}

.rates-82deedc {
    cursor: pointer;
    padding: 0.2rem 0;
    border-radius: 3px;
}

.rates-82deedc:hover {
    background-color: rgba(0, 0, 0, 0.05);
}

.ratesLine-82deedc {
    white-space: nowrap;
    font-size: 0.85rem;
    line-height: 1.25;
}

.ratesLine-82deedc .annual-82deedc {
    color: #6c757d;
    font-size: 0.8rem;
}

.leases-82deedc {
    margin-top: auto;
    font-size: 0.82rem;
}

.currentLease-82deedc {
    padding: 0.25rem 0.35rem;
    border-radius: 3px;
    margin-top: 0.2rem;
    background: linear-gradient(
        90deg,
        rgba(0, 0, 0, 0.08) 0%,
        rgba(0, 0, 0, 0.08) var(--completion, 0%),
        transparent calc(var(--completion, 0%) + 0.01%),
        transparent 100%
    );
}

.potentialLease-82deedc {
    font-style: italic;
    opacity: 0.85;
    background: rgba(0, 0, 0, 0.03);
}

.tenantName-82deedc {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-size: 0.88rem;
    font-weight: 500;
}

.leaseRates-82deedc {
    color: #6c757d;
    white-space: nowrap;
    font-size: 0.8rem;
}

.notOwned-82deedc {
    color: #818182 !important;
    background: repeating-linear-gradient(
        -45deg,
        rgba(0, 0, 0, 0.03),
        rgba(0, 0, 0, 0.03) 10px,
        rgba(0, 0, 0, 0.07) 10px,
        rgba(0, 0, 0, 0.07) 20px
    ) !important;
    border-color: #ccc !important;
}

.floorStats-82deedc {
    margin-left: auto;
    font-size: 1rem;
}

.ownershipDate-82deedc {
    font-size: 0.78rem;
    font-weight: 600;
    color: #6c757d;
}

.variationBadge-82deedc {
    font-size: 0.6rem;
}


.dropZone-e4c7cf7 {
    flex-grow: 1;
    width: 100%;
    max-height: 150px;
    /* ast-grep-ignore prefer-dropzone-utility */
    border: 3px dashed var(--bs-secondary-border-subtle);
    border-radius: var(--radius-2xl);
    background-color: var(--bs-secondary-bg-subtle);
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    padding: var(--space-4);
}


.listItem-5720af7 {
    transition:
        transform var(--transition-base),
        box-shadow var(--transition-base),
        opacity var(--transition-base),
        background-color var(--transition-base);

    .grabIcon-5720af7 {
        cursor: grab;
    }
}

.dragging-5720af7 {
    opacity: 0.5;
    transform: scale(1.02);
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
    z-index: 1;
}

.dragOver-5720af7 {
    background-color: var(--bs-primary-bg-subtle) !important;
    border-color: var(--bs-primary-border-subtle) !important;
}


.listItem-126ef1a {
    transition:
        opacity var(--transition-base),
        background-color var(--transition-base);
}

.dragging-126ef1a {
    opacity: 0.4;
}

.dragging-126ef1a > * {
    background-color: var(--bs-secondary-bg) !important;
}

.dragOver-126ef1a > * {
    background-color: var(--bs-primary-bg-subtle) !important;
}

.dragHandleCell-126ef1a {
    width: 1px;
}

.dragHandleIcon-126ef1a {
    cursor: grab;
}


.bankCurrencyFill-ed18a4d > div {
    display: block !important;
    width: 100%;
}


.formSelects-40387aa {
    position: relative;
    z-index: 3;
}

.willBeRenewedSelect-40387aa {
    max-width: 11rem;
}

.unitRow-40387aa input.form-control {
    flex: 0 0 10rem;
}

.unitRow-40387aa .input-group-text {
    flex: 0 0 auto;
    min-width: 6rem;
    justify-content: center;
}

:root {
    --unit-area-width: 9rem;
}

.unitArea-40387aa {
    min-width: var(--unit-area-width) !important;
}

/* Matches the width of two .unitArea spans minus the
   1px border that Bootstrap's input-group collapses between them. */
.unitAreaDouble-40387aa {
    min-width: calc(2 * var(--unit-area-width) - 1px) !important;
}


.donutChart-47cecb8 {
    overflow: visible;
}

.segment-47cecb8 {
    transition: stroke-width var(--transition-fast);
    cursor: pointer;
}

.legendColor-47cecb8 {
    width: 12px;
    height: 12px;
}

.legendItem-47cecb8 {
    cursor: pointer;
    transition: font-weight var(--transition-fast);
}


@keyframes chargeableWarningPulse {
    0%,
    100% {
        box-shadow: 0 0 0 0 rgba(var(--bs-warning-rgb), 0.55);
    }
    50% {
        box-shadow: 0 0 0 0.6rem rgba(var(--bs-warning-rgb), 0);
    }
}

.chargeableWarning-87bdf66 {
    border-left: 0.375rem solid var(--bs-warning);
    animation: chargeableWarningPulse 2.4s ease-in-out infinite;
}

.chargeableWarningIcon-87bdf66 {
    font-size: 1.75rem;
    color: var(--bs-warning-text-emphasis);
    line-height: 1;
}


.colSelector-ccd9cc8 {
    width: 220px;
}

.colPeriod-ccd9cc8 {
    width: 140px;
}

.colCount-ccd9cc8 {
    width: 100px;
}

.colArea-ccd9cc8 {
    width: 120px;
}

.colRevenue-ccd9cc8 {
    width: 140px;
}


.colName-e3698c7 {
    width: 180px;
}

.colPeriod-e3698c7 {
    width: 140px;
}

.colCount-e3698c7 {
    width: 100px;
}

.colArea-e3698c7 {
    width: 120px;
}

.colRevenue-e3698c7 {
    width: 140px;
}


.table-ffd8392 {
    table-layout: fixed;
}

.colIsRenewal-ffd8392 {
    width: 3%;
}

.colTenant-ffd8392 {
    width: 15%;
}

.colProperty-ffd8392 {
    width: 14%;
}

.colArea-ffd8392 {
    width: 5%;
}

.colTotalRents-ffd8392 {
    width: 11%;
}

.colDuration-ffd8392 {
    width: 8%;
}

.colEndDate-ffd8392 {
    width: 7%;
}

.colExpectedCheckout-ffd8392 {
    width: 9%;
}

.colBreakOption-ffd8392 {
    width: 7%;
}

.colRelationshipManager-ffd8392 {
    width: 9%;
}

.colWillRenew-ffd8392 {
    width: 6%;
}


.propertyMultiselect-451219e {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(15rem, 1fr));
    grid-gap: 1rem;
    align-items: start;

    .disabledInput-451219e {
        .input-group-text {
            background-color: var(--bs-secondary-bg);
        }
    }
}


.propertySvgIcon-38e17d9 {
    display: inline-block;
    vertical-align: middle;
    max-width: 100px;
    max-height: 45px;
}


.propertyCard-57e4be8 {
    min-width: 400px;
    border-radius: 12px;
    overflow: visible;
    border: 1px solid rgba(0, 0, 0, 0.1);
    background: #ffffff;
    transition: box-shadow var(--transition-base);
    transform: translateY(-20px);
    margin-top: -10px;
    position: relative;

    &:hover {
        box-shadow: var(--shadow-lg);
    }

    &::after {
        content: "";
        position: absolute;
        bottom: -10px;
        left: 50%;
        transform: translateX(-50%);
        width: 0;
        height: 0;
        border-left: 10px solid transparent;
        border-right: 10px solid transparent;
        border-top: 10px solid #ffffff;
        filter: drop-shadow(0 2px 2px rgba(0, 0, 0, 0.1));
    }

    .closeButton-57e4be8 {
        position: absolute;
        top: 0.75rem;
        right: 0.75rem;
        z-index: 10;
        background: rgba(255, 255, 255, 0.95);
        border-radius: 50%;
        width: 32px;
        height: 32px;
        padding: 0;
        display: flex;
        align-items: center;
        justify-content: center;
        box-shadow: var(--shadow-sm);
        opacity: 1;
        transition:
            opacity var(--transition-base),
            background var(--transition-base),
            box-shadow var(--transition-base);
        border: 1px solid rgba(0, 0, 0, 0.1);

        &::before {
            content: "";
            width: 14px;
            height: 14px;
            background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath fill='%23333' d='M.293.293a1 1 0 0 1 1.414 0L8 6.586 14.293.293a1 1 0 1 1 1.414 1.414L9.414 8l6.293 6.293a1 1 0 0 1-1.414 1.414L8 9.414l-6.293 6.293a1 1 0 0 1-1.414-1.414L6.586 8 .293 1.707a1 1 0 0 1 0-1.414z'/%3E%3C/svg%3E");
            background-repeat: no-repeat;
            background-position: center;
            background-size: contain;
        }

        &:hover {
            background: rgba(255, 255, 255, 1);
            box-shadow: 0 3px 6px rgba(0, 0, 0, 0.15);
        }
    }

    .propertyCardBody-57e4be8 {
        padding: var(--space-5);

        .propertyTitle-57e4be8 {
            font-weight: 600;
            color: #1e293b;
            font-size: 1.125rem;
            margin: 0;
        }

        .propertyFields-57e4be8 {
            .iconWrapper-57e4be8 {
                width: 32px;
                height: 32px;
                border-radius: 6px;
                background: #f1f5f9;
                display: flex;
                align-items: center;
                justify-content: center;
                flex-shrink: 0;
                margin-bottom: var(--space-2);

                svg {
                    width: 16px;
                    height: 16px;
                    color: #475569;
                }
            }

            .fieldLabel-57e4be8 {
                font-size: 0.6875rem;
                color: #94a3b8;
                text-transform: uppercase;
                font-weight: 600;
                letter-spacing: 0.05em;
                margin-bottom: var(--space-1);
            }

            .fieldValue-57e4be8 {
                font-size: 0.875rem;
                color: #1e293b;
                font-weight: 600;
                word-break: break-word;
            }
        }
    }
}


.map-d137639 {
    min-height: 300px;
    flex: 1 1 auto;
}


.receivablesTrends-125cb14 {
    position: relative;
    width: 100%;

    svg.svg-125cb14 {
        display: block;
        width: 100%;
        min-height: 300px;
        height: 50vh;
        max-height: 500px;

        text {
            fill: var(--bs-body-color);
            stroke-width: 0;
        }

        .axis-125cb14 {
            shape-rendering: crispEdges;

            line {
                stroke: var(--bs-border-color);
                stroke-width: 2;
                stroke-dasharray: 4 2;
            }
            text {
                font-size: 12px;
            }

            .xTick-125cb14 {
                text {
                    text-anchor: end;
                    dominant-baseline: hanging;
                }
            }

            .yTick-125cb14 {
                text {
                    text-anchor: end;
                    dominant-baseline: central;
                }
            }
        }

        .bars-125cb14 {
            cursor: pointer;

            rect {
                opacity: 0.85;
            }

            &:hover rect {
                opacity: 1;
            }
        }
    }

    .legend-125cb14 {
        margin-top: var(--space-2);
        font-size: 0.8rem;

        .legendItem-125cb14 {
            gap: 0.35rem;
        }

        .legendColor-125cb14 {
            display: inline-block;
            width: 12px;
            height: 12px;
            border-radius: 2px;
        }
    }

    .tooltip-125cb14 {
        position: absolute;
        pointer-events: none;
        z-index: 1000;
        min-width: 220px;
        font-size: 0.875rem;
    }

    .tooltipColor-125cb14 {
        display: inline-block;
        width: 10px;
        height: 10px;
        margin-right: var(--space-1);
        border-radius: 2px;
    }
}


.recoveryTrends-26f36ce {
    position: relative;
    width: 100%;

    svg.svg-26f36ce {
        display: block;
        width: 100%;
        min-height: 300px;
        height: 50vh;
        max-height: 500px;

        text {
            fill: var(--bs-body-color);
            stroke-width: 0;
        }

        .axis-26f36ce {
            shape-rendering: crispEdges;

            line {
                stroke: var(--bs-border-color);
                stroke-width: 2;
                stroke-dasharray: 4 2;
            }
            text {
                font-size: 12px;
            }

            .xTick-26f36ce {
                text {
                    text-anchor: end;
                    dominant-baseline: hanging;
                }
            }

            .yTick-26f36ce {
                text {
                    text-anchor: end;
                    dominant-baseline: central;
                }
            }
        }

        .totalLine-26f36ce {
            stroke: var(--bs-primary);
            stroke-width: 2.5;
        }

        .totalDot-26f36ce {
            fill: var(--bs-primary);
            stroke: var(--bs-body-bg);
            stroke-width: 2;
            cursor: pointer;

            &:hover {
                r: 6;
            }
        }

        .areaFill-26f36ce {
            opacity: 0.15;
        }
    }

    .legend-26f36ce {
        margin-top: var(--space-2);
        font-size: 0.875rem;

        .legendLine-26f36ce {
            display: inline-block;
            width: 24px;
            height: 3px;
            background-color: var(--bs-primary);
            border-radius: 2px;
        }
    }

    .tooltip-26f36ce {
        position: absolute;
        pointer-events: none;
        z-index: 1000;
        min-width: 200px;
        font-size: 0.875rem;
    }

    .tooltipColor-26f36ce {
        display: inline-block;
        width: 10px;
        height: 10px;
        margin-right: var(--space-1);
        border-radius: 2px;
    }
}


.units-98b0ab3 {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(25rem, 1fr));
    gap: var(--space-2);
}


.colCompanyIcon-2e92821 {
    width: 10%;
}


.dropZone-c19a60d {
    flex-grow: 1;
    width: 100%;
    max-height: 150px;
    /* ast-grep-ignore prefer-dropzone-utility */
    border: 3px dashed var(--bs-secondary-border-subtle);
    border-radius: var(--radius-2xl);
    background-color: var(--bs-secondary-bg-subtle);
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    padding: var(--space-4);
}


.dropZone-fb2d752 {
    flex-grow: 1;
    width: 100%;
    /* ast-grep-ignore prefer-dropzone-utility */
    border: 3px dashed var(--bs-secondary-border-subtle);
    border-radius: var(--radius-2xl);
    background-color: var(--bs-secondary-bg-subtle);
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    padding: var(--space-4);
}


.sparklineChart-504ac70 {
    display: inline-block;
    vertical-align: middle;
}


/* Areas panel — matches `AreasPanel` in details-view.jsx */

.plp-panel-fa0aa53 {
    background: var(--surface);
    border: 1px solid var(--border);
    border-radius: 14px;
    padding: var(--space-5);
    font-family: var(--sans);
}

.plp-heading-fa0aa53 {
    margin: 0;
    font-size: 13px;
    font-weight: 600;
    color: var(--text);
}

.plp-tabRow-fa0aa53 {
    gap: 6px;
    margin-top: var(--space-3);
}

.plp-tabBtn-fa0aa53 {
    padding: 6px 12px;
    border-radius: 7px;
    font-size: 11.5px;
    background: var(--surface-2);
    color: var(--text-dim);
    border: none;
    cursor: pointer;
    font-weight: 500;
    font-family: var(--sans);
    transition: background 0.15s ease, color 0.15s ease;
}

.plp-tabBtn-fa0aa53:hover {
    color: var(--text);
}

.plp-tabActive-fa0aa53 {
    background: var(--accent);
    color: #fff;
}

.plp-rows-fa0aa53 {
    margin-top: 18px;
    gap: 14px;
}

.plp-row-fa0aa53 {
    padding-bottom: 10px;
    border-bottom: 1px dashed var(--border);
}

.plp-rowLabel-fa0aa53 {
    color: var(--text-dim);
    font-size: 12.5px;
}

.plp-rowValue-fa0aa53 {
    font-family: var(--mono);
    font-size: 14px;
    color: var(--text);
}


/* Documents & Images panel — matches `DocumentsPanel` in details-view.jsx, plus editable-mode controls. */

.plp-panel-1b6a195 {
    background: var(--surface);
    border: 1px solid var(--border);
    border-radius: 14px;
    padding: var(--space-5);
    font-family: var(--sans);
}

.plp-titleGroup-1b6a195 {
    gap: 10px;
}

.plp-titleIcon-1b6a195 {
    color: var(--accent);
    flex-shrink: 0;
}

.plp-heading-1b6a195 {
    margin: 0;
    font-size: 13px;
    font-weight: 600;
    letter-spacing: 0.02em;
    color: var(--text);
}

.plp-dataRoomChip-1b6a195 {
    font-family: var(--mono);
    font-size: 10.5px;
    color: var(--text-mute);
    background: var(--surface-2);
    padding: 3px 8px;
    border-radius: 5px;
    border: 1px solid var(--border);
    letter-spacing: 0.04em;
    text-transform: uppercase;
}

.plp-tabRow-1b6a195 {
    gap: 6px;
}

.plp-tabBtn-1b6a195 {
    padding: 6px 12px;
    border-radius: 7px;
    font-size: 11.5px;
    background: var(--surface-2);
    color: var(--text-dim);
    border: none;
    cursor: pointer;
    font-weight: 500;
    font-family: var(--sans);
    gap: 6px;
    transition: background 0.15s ease, color 0.15s ease;
}

.plp-tabBtn-1b6a195:hover {
    color: var(--text);
}

.plp-tabActive-1b6a195 {
    background: var(--accent);
    color: #fff;
}

.plp-tabCount-1b6a195 {
    opacity: 0.7;
    font-family: var(--mono);
}

/* --- Documents tab --- */

.plp-documentsList-1b6a195 {
    margin-top: 14px;
    animation: fadeInPanel 0.25s ease both;
}

.plp-docRow-1b6a195 {
    display: grid;
    grid-template-columns: 44px 1fr auto auto auto;
    align-items: center;
    gap: 14px;
    padding: 12px 14px;
    border-radius: 10px;
    background: transparent;
    border: 1px solid transparent;
    transition: background 0.15s ease, border-color 0.15s ease;
    cursor: pointer;
    text-decoration: none;
    color: inherit;
}

.plp-docRow-1b6a195:hover {
    background: var(--surface-2);
    border-color: var(--border-2);
}

.plp-kindBadge-1b6a195 {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 44px;
    height: 22px;
    border-radius: 5px;
    font-family: var(--mono);
    font-size: 10px;
    font-weight: 600;
    letter-spacing: 0.04em;
    flex-shrink: 0;
}

.plp-kindPdf-1b6a195 {
    background: rgba(239, 90, 107, 0.14);
    color: #ff8a94;
}

.plp-kindXlsx-1b6a195 {
    background: rgba(53, 211, 153, 0.14);
    color: #4fe0ad;
}

.plp-kindDocx-1b6a195 {
    background: rgba(29, 155, 240, 0.14);
    color: #4fb7ff;
}

.plp-kindDefault-1b6a195 {
    background: var(--surface-2);
    color: var(--text-dim);
}

.plp-docInfo-1b6a195 {
    min-width: 0;
}

.plp-docName-1b6a195 {
    font-size: 13px;
    color: var(--text);
    font-weight: 500;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.plp-docMeta-1b6a195 {
    font-size: 11px;
    color: var(--text-mute);
    margin-top: 2px;
    font-family: var(--mono);
}

.plp-docIconBtn-1b6a195 {
    width: 30px;
    height: 30px;
    border-radius: 8px;
    background: var(--surface);
    border: 1px solid var(--border);
    color: var(--text-dim);
    cursor: pointer;
    display: grid;
    place-items: center;
    text-decoration: none;
    transition: color 0.15s ease, background 0.15s ease;
}

.plp-docIconBtn-1b6a195:hover {
    color: var(--text);
    background: var(--surface-2);
}

.plp-docRemoveBtn-1b6a195:hover {
    color: #fff;
    background: #ff5a6b;
    border-color: #ff5a6b;
}

.plp-addBtn-1b6a195 {
    margin-top: 10px;
    align-self: flex-start;
    gap: 6px;
    padding: 7px 12px;
    border-radius: 8px;
    background: var(--surface-2);
    border: 1px solid var(--border-2);
    color: var(--text);
    font-size: 12px;
    font-family: var(--sans);
    cursor: pointer;
    transition: background 0.15s ease;
}

.plp-addBtn-1b6a195:hover {
    background: var(--surface-3);
}

/* --- Images tab --- */

.plp-imagesGrid-1b6a195 {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 10px;
    margin-top: 14px;
    animation: fadeInPanel 0.25s ease both;
}

.plp-imageTile-1b6a195 {
    position: relative;
    aspect-ratio: 4 / 3;
    border-radius: 10px;
    overflow: hidden;
    border: 1px solid var(--border);
    padding: 0;
    background: var(--surface-2);
    cursor: pointer;
    display: block;
    transition: border-color 0.15s ease, transform 0.15s ease;
}

.plp-imageTile-1b6a195:hover {
    border-color: var(--border-2);
    transform: translateY(-1px);
}

.plp-imageTile-1b6a195 img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

.plp-imageOverlay-1b6a195 {
    position: absolute;
    inset: 0;
    background: linear-gradient(to top, rgba(10, 18, 32, 0.85) 0%, rgba(10, 18, 32, 0) 45%);
    padding: 10px;
}

.plp-imageLabel-1b6a195 {
    font-size: 11px;
    color: #fff;
    font-weight: 500;
    text-align: left;
}

.plp-imagesEmpty-1b6a195 {
    grid-column: 1 / -1;
    padding: 30px;
    text-align: center;
    color: var(--text-mute);
    font-size: 12px;
}

/* --- Lightbox --- */

.plp-lightboxBackdrop-1b6a195 {
    position: fixed;
    inset: 0;
    background: rgba(5, 10, 20, 0.88);
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
    z-index: 200;
    display: grid;
    place-items: center;
    padding: var(--space-10);
    animation: fadeInBackdrop 0.25s ease both;
}

.plp-lightboxFrame-1b6a195 {
    position: relative;
    max-width: 90vw;
    max-height: 86vh;
}

.plp-lightboxImg-1b6a195 {
    max-width: 90vw;
    max-height: 86vh;
    display: block;
    border-radius: 12px;
    box-shadow: 0 30px 80px rgba(0, 0, 0, 0.6);
}

.plp-lightboxNav-1b6a195 {
    position: absolute;
    bottom: -40px;
    left: 0;
    right: 0;
    gap: 18px;
    color: var(--text-dim);
    font-family: var(--mono);
    font-size: 11px;
}

.plp-lightboxBtn-1b6a195 {
    width: 36px;
    height: 36px;
    border-radius: 10px;
    background: rgba(17, 29, 51, 0.9);
    border: 1px solid var(--border-2);
    color: var(--text);
    cursor: pointer;
    display: grid;
    place-items: center;
    transition: background 0.15s ease;
}

.plp-lightboxBtn-1b6a195:hover {
    background: var(--surface-3, #1a2c4e);
}

.plp-lightboxClose-1b6a195 {
    position: absolute;
    top: 24px;
    right: 24px;
}

/* --- Selector modal --- */

.plp-modalBackdrop-1b6a195 {
    position: fixed;
    inset: 0;
    background: rgba(5, 10, 20, 0.72);
    backdrop-filter: blur(6px);
    -webkit-backdrop-filter: blur(6px);
    z-index: 1200;
}

.plp-modal-1b6a195 {
    position: fixed;
    inset: 0;
    z-index: 1210;
    display: grid;
    place-items: center;
    padding: var(--space-6);
}

.plp-modalDialog-1b6a195 {
    background: var(--surface);
    border: 1px solid var(--border-2);
    border-radius: 14px;
    width: min(640px, 100%);
    max-height: 84vh;
    box-shadow: 0 30px 80px rgba(0, 0, 0, 0.6);
    font-family: var(--sans);
}

.plp-modalHeader-1b6a195 {
    padding: 14px 18px;
    border-bottom: 1px solid var(--border);
}

.plp-modalTitle-1b6a195 {
    margin: 0;
    font-size: 14px;
    font-weight: 600;
    color: var(--text);
}

.plp-modalClose-1b6a195 {
    width: 28px;
    height: 28px;
    border-radius: 8px;
    background: transparent;
    border: 1px solid var(--border);
    color: var(--text-dim);
    display: grid;
    place-items: center;
    cursor: pointer;
    padding: 0;
    transition: color 0.15s ease, background 0.15s ease;
}

.plp-modalClose-1b6a195:hover {
    background: var(--surface-2);
    color: var(--text);
}

.plp-modalBody-1b6a195 {
    padding: var(--space-4);
    overflow-y: auto;
    flex: 1;
}

.plp-modalFooter-1b6a195 {
    padding: 12px 18px;
    border-top: 1px solid var(--border);
}

.plp-modalDoneBtn-1b6a195 {
    padding: var(--space-2) var(--space-4);
    border-radius: 8px;
    background: var(--accent);
    color: #fff;
    border: none;
    font-size: 12.5px;
    cursor: pointer;
    font-family: var(--sans);
    transition: filter 0.15s ease;
}

.plp-modalDoneBtn-1b6a195:hover {
    filter: brightness(1.05);
}

.plp-modalListItem-1b6a195 {
    display: grid;
    grid-template-columns: 44px 1fr auto;
    gap: 14px;
    align-items: center;
    padding: 10px 12px;
    border-radius: 10px;
    background: transparent;
    border: 1px solid var(--border);
    cursor: pointer;
    text-align: left;
    color: inherit;
    font-family: inherit;
    transition: background 0.15s ease, border-color 0.15s ease;
}

.plp-modalListItem-1b6a195:hover {
    background: var(--surface-2);
    border-color: var(--border-2);
}

.plp-modalListItemSelected-1b6a195 {
    background: rgba(29, 155, 240, 0.08);
    border-color: var(--accent);
}

.plp-modalListInfo-1b6a195 {
    min-width: 0;
}

.plp-modalListName-1b6a195 {
    font-size: 13px;
    color: var(--text);
    font-weight: 500;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.plp-modalListMeta-1b6a195 {
    font-size: 11px;
    color: var(--text-mute);
    font-family: var(--mono);
}

.plp-modalCheck-1b6a195 {
    width: 24px;
    height: 24px;
    border-radius: 50%;
    background: var(--accent);
    color: #fff;
    display: grid;
    place-items: center;
}

.plp-emptyState-1b6a195 {
    text-align: center;
    padding: var(--space-10) var(--space-5);
    color: var(--text-mute);
    font-size: 13px;
}

.plp-emptyStateHint-1b6a195 {
    font-size: 11.5px;
    color: var(--text-mute);
    margin-top: 6px;
}

@keyframes fadeInPanel {
    from {
        opacity: 0;
    }
    to {
        opacity: 1;
    }
}

@keyframes fadeInBackdrop {
    from {
        opacity: 0;
    }
    to {
        opacity: 1;
    }
}


/* Details gallery — matches `Gallery` in details-view.jsx, plus editable-mode controls. */

.plp-gallery-b07b515 {
    display: block;
}

.plp-main-b07b515 {
    position: relative;
    aspect-ratio: 4 / 3;
    border-radius: 14px;
    overflow: hidden;
    background: var(--surface);
}

.plp-mainImg-b07b515 {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

.plp-mainEmpty-b07b515 {
    width: 100%;
    height: 100%;
    background: linear-gradient(135deg, var(--surface-2), var(--surface-3));
}

.plp-badge-b07b515 {
    position: absolute;
    top: 16px;
    left: 16px;
    padding: 6px 12px;
    border-radius: 999px;
    font-size: 11px;
    font-weight: 600;
    background: rgba(29, 155, 240, 0.9);
    color: #fff;
    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);
    font-family: var(--sans);
}

.plp-coverChip-b07b515 {
    position: absolute;
    bottom: 12px;
    left: 16px;
    color: #fff;
    font-size: 11px;
    background: rgba(10, 18, 32, 0.7);
    padding: 4px 10px;
    border-radius: 6px;
    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);
    font-family: var(--sans);
}

.plp-dots-b07b515 {
    position: absolute;
    bottom: 12px;
    right: 16px;
}

.plp-dot-b07b515 {
    width: 8px;
    height: 8px;
    border-radius: 50%;
    border: none;
    background: rgba(255, 255, 255, 0.4);
    cursor: pointer;
    padding: 0;
    transition: background 0.15s ease;
}

.plp-dotActive-b07b515 {
    background: #fff;
}

/* ---- Editable-mode controls ---- */

.plp-editStrip-b07b515 {
    margin-top: var(--space-3);
    padding: var(--space-3);
    border-radius: 12px;
    background: var(--surface);
    border: 1px solid var(--border);
    gap: 10px;
}

.plp-editTile-b07b515 {
    position: relative;
    width: 96px;
    height: 64px;
    border-radius: 8px;
    overflow: hidden;
    border: 1px solid var(--border-2);
    background: var(--surface-2);
}

.plp-editTile-b07b515 img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

.plp-editRemove-b07b515 {
    position: absolute;
    top: 4px;
    right: 4px;
    width: 22px;
    height: 22px;
    border-radius: 50%;
    border: none;
    background: rgba(10, 18, 32, 0.82);
    color: #fff;
    display: grid;
    place-items: center;
    cursor: pointer;
    padding: 0;
    transition: background 0.15s ease;
}

.plp-editRemove-b07b515:hover {
    background: #ff5a6b;
}

.plp-editCoverTag-b07b515 {
    position: absolute;
    bottom: 4px;
    left: 4px;
    padding: 2px 6px;
    border-radius: var(--radius-sm);
    background: rgba(10, 18, 32, 0.72);
    color: #fff;
    font-size: 9.5px;
    font-family: var(--sans);
    letter-spacing: 0.04em;
}

.plp-editAddBtn-b07b515 {
    align-self: flex-start;
    gap: 6px;
    padding: 7px 12px;
    border-radius: 8px;
    background: var(--surface-2);
    border: 1px solid var(--border-2);
    color: var(--text);
    font-size: 12px;
    font-family: var(--sans);
    cursor: pointer;
    transition: background 0.15s ease;
}

.plp-editAddBtn-b07b515:hover {
    background: var(--surface-3);
}

/* ---- Selector modal ---- */

.plp-modalBackdrop-b07b515 {
    position: fixed;
    inset: 0;
    background: rgba(5, 10, 20, 0.72);
    backdrop-filter: blur(6px);
    -webkit-backdrop-filter: blur(6px);
    z-index: 1200;
}

.plp-modal-b07b515 {
    position: fixed;
    inset: 0;
    z-index: 1210;
    display: grid;
    place-items: center;
    padding: var(--space-6);
}

.plp-modalDialog-b07b515 {
    background: var(--surface);
    border: 1px solid var(--border-2);
    border-radius: 14px;
    width: min(780px, 100%);
    max-height: 84vh;
    box-shadow: 0 30px 80px rgba(0, 0, 0, 0.6);
    font-family: var(--sans);
}

.plp-modalHeader-b07b515 {
    padding: 14px 18px;
    border-bottom: 1px solid var(--border);
}

.plp-modalTitle-b07b515 {
    margin: 0;
    font-size: 14px;
    font-weight: 600;
    color: var(--text);
}

.plp-modalClose-b07b515 {
    width: 28px;
    height: 28px;
    border-radius: 8px;
    background: transparent;
    border: 1px solid var(--border);
    color: var(--text-dim);
    display: grid;
    place-items: center;
    cursor: pointer;
    padding: 0;
    transition: color 0.15s ease, background 0.15s ease;
}

.plp-modalClose-b07b515:hover {
    background: var(--surface-2);
    color: var(--text);
}

.plp-modalBody-b07b515 {
    padding: var(--space-4);
    overflow-y: auto;
    flex: 1;
}

.plp-modalFooter-b07b515 {
    padding: 12px 18px;
    border-top: 1px solid var(--border);
}

.plp-modalDoneBtn-b07b515 {
    padding: var(--space-2) var(--space-4);
    border-radius: 8px;
    background: var(--accent);
    color: #fff;
    border: none;
    font-size: 12.5px;
    cursor: pointer;
    font-family: var(--sans);
    transition: background 0.15s ease;
}

.plp-modalDoneBtn-b07b515:hover {
    filter: brightness(1.05);
}

.plp-modalGrid-b07b515 {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(140px, 1fr));
    gap: 10px;
}

.plp-modalItem-b07b515 {
    position: relative;
    aspect-ratio: 4 / 3;
    border-radius: 10px;
    overflow: hidden;
    border: 2px solid transparent;
    background: var(--surface-2);
    cursor: pointer;
    padding: 0;
    display: block;
    transition: border-color 0.15s ease, transform 0.15s ease;
}

.plp-modalItem-b07b515:hover {
    transform: translateY(-1px);
}

.plp-modalItemSelected-b07b515 {
    border-color: var(--accent);
}

.plp-modalItem-b07b515 img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

.plp-modalCheck-b07b515 {
    position: absolute;
    top: 6px;
    right: 6px;
    width: 24px;
    height: 24px;
    border-radius: 50%;
    background: var(--accent);
    color: #fff;
    display: grid;
    place-items: center;
}

.plp-emptyState-b07b515 {
    text-align: center;
    padding: var(--space-10) var(--space-5);
    color: var(--text-mute);
    font-size: 13px;
}

.plp-emptyStateHint-b07b515 {
    font-size: 11.5px;
    color: var(--text-mute);
    margin-top: 6px;
}


/* Location panel — matches `LocationPanel` in details-view.jsx */

.plp-panel-1611cf0 {
    background: var(--surface);
    border: 1px solid var(--border);
    border-radius: 14px;
    padding: var(--space-5);
    gap: 14px;
    font-family: var(--sans);
}

.plp-heading-1611cf0 {
    margin: 0;
    font-size: 13px;
    font-weight: 600;
    color: var(--text);
}

.plp-pinIcon-1611cf0 {
    color: var(--accent);
    flex-shrink: 0;
}

.plp-mapFrame-1611cf0 {
    aspect-ratio: 4 / 3;
    border-radius: 12px;
    overflow: hidden;
    border: 1px solid var(--border);
}

.plp-mapContainer-1611cf0 {
    width: 100%;
    height: 100%;
    display: block;
}

.plp-addressBlock-1611cf0 {
    gap: 6px;
}

.plp-addressRow-1611cf0 .plp-pinIcon-1611cf0 {
    margin-top: 2px;
    width: 12px;
    height: 12px;
}

.plp-addressText-1611cf0 {
    font-size: 12.5px;
    color: var(--text);
}

.plp-coords-1611cf0 {
    font-family: var(--mono);
    font-size: 11px;
    color: var(--text-mute);
    margin-left: var(--space-5);
}

.plp-mapsLink-1611cf0 {
    padding: 10px;
    background: var(--surface-2);
    border: 1px solid var(--border);
    border-radius: 10px;
    color: var(--text-dim);
    font-size: 12px;
    text-decoration: none;
    transition: background 0.15s ease, color 0.15s ease;
}

.plp-mapsLink-1611cf0:hover {
    background: var(--surface-3);
    color: var(--text);
}


/* Asset manager card — matches `OwnerCard` in details-view.jsx */

.plp-card-82d52c7 {
    background: var(--surface);
    border: 1px solid var(--border);
    border-radius: 14px;
    padding: var(--space-4);
    gap: 14px;
    font-family: var(--sans);
}

.plp-avatar-82d52c7 {
    width: 40px;
    height: 40px;
    border-radius: 50%;
    background: linear-gradient(135deg, var(--accent), #0d7cc7);
    display: grid;
    place-items: center;
    font-weight: 600;
    color: #fff;
    font-size: 14px;
    font-family: var(--sans);
    flex-shrink: 0;
}

.plp-body-82d52c7 {
    flex: 1;
}

.plp-label-82d52c7 {
    color: var(--text-mute);
    font-size: 10.5px;
    letter-spacing: 0.08em;
}

.plp-name-82d52c7 {
    font-size: 13.5px;
    font-weight: 500;
    color: var(--text);
}

.plp-viewBtn-82d52c7 {
    padding: 8px 14px;
    background: transparent;
    color: var(--text-dim);
    border: 1px solid var(--border);
    border-radius: 8px;
    font-size: 12px;
    cursor: pointer;
    font-family: var(--sans);
    transition: background 0.15s ease, color 0.15s ease;
}

.plp-viewBtn-82d52c7:hover {
    background: var(--surface-2);
    color: var(--text);
}


/* Property Details card — matches `PropertyDetailsCard` in details-view.jsx */

.plp-card-e1b1097 {
    background: var(--surface);
    border: 1px solid var(--border);
    border-radius: 14px;
    padding: var(--space-5);
    font-family: var(--sans);
}

.plp-heading-e1b1097 {
    margin: 0;
    font-size: 13px;
    font-weight: 600;
    color: var(--text);
    letter-spacing: 0.02em;
}

.plp-pairGrid-e1b1097 {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: var(--space-5);
    margin-top: var(--space-4);
}

.plp-pairLabel-e1b1097 {
    color: var(--text-mute);
    font-size: 10.5px;
    letter-spacing: 0.08em;
}

.plp-pairValue-e1b1097 {
    color: var(--text);
    font-size: 13.5px;
    font-weight: 500;
    margin-top: var(--space-1);
}

.plp-chipGrid-e1b1097 {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: var(--space-3);
    margin-top: var(--space-5);
}

.plp-chip-e1b1097 {
    background: var(--surface);
    border: 1px solid var(--border);
    border-radius: 12px;
    padding: 14px 16px;
    min-height: 76px;
}

.plp-chipAccent-e1b1097,
.plp-chipGood-e1b1097,
.plp-chipGold-e1b1097 {
    /* ast-grep-ignore prefer-bootstrap-flex-utility */
    display: flex;
    align-items: center;
    gap: var(--space-2);
    font-size: 12px;
    font-weight: 500;
}

.plp-chipAccent-e1b1097 {
    color: var(--accent);
}

.plp-chipGood-e1b1097 {
    color: var(--good);
}

.plp-chipGold-e1b1097 {
    color: var(--gold);
}

.plp-chipLabel-e1b1097 {
    color: var(--text-dim);
    font-weight: 500;
}

.plp-chipValue-e1b1097 {
    font-size: 18px;
    font-weight: 600;
    color: var(--text);
}

.plp-classPair-e1b1097 {
    background: var(--surface);
    border: 1px solid var(--border);
    border-radius: 12px;
    padding: 14px 16px;
    min-height: 76px;
}

.plp-classLabel-e1b1097 {
    color: var(--text-mute);
    font-size: 12px;
    font-weight: 500;
}

.plp-classValue-e1b1097 {
    font-size: 18px;
    font-weight: 600;
    color: var(--text);
}

@media (max-width: 720px) {
    .plp-pairGrid-e1b1097 {
        grid-template-columns: repeat(2, 1fr);
    }

    .plp-chipGrid-e1b1097 {
        grid-template-columns: repeat(2, 1fr);
    }
}


/* Property details body — content-only, no page chrome. */

/* Design tokens scoped to the preview body so the component works in any
   binary (the_exchange ships them globally too, this is the ERP-friendly
   fallback). */
.plp-body-1bc5648 {
    --bg: #0a1220;
    --bg-2: #0f1a2d;
    --surface: #111d33;
    --surface-2: #152440;
    --surface-3: #1a2c4e;
    --border: #1f3560;
    --border-2: #2a4679;
    --text: #e8eef7;
    --text-dim: #8a9bb8;
    --text-mute: #5f7090;
    --accent: #1d9bf0;
    --accent-2: #3fb0ff;
    --accent-soft: rgba(29, 155, 240, 0.12);
    --gold: #c9a86b;
    --good: #35d399;
    --serif: 'Playfair Display', Georgia, serif;
    --sans: 'Inter', system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
    --mono: 'JetBrains Mono', ui-monospace, 'SF Mono', Consolas, monospace;

    max-width: 1280px;
    width: 100%;
    margin: 0 auto;
    color: var(--text);
    font-family: var(--sans);
}

.plp-eyebrowRow-1bc5648 {
    gap: 10px;
    margin-bottom: 10px;
}

.plp-categoryChip-1bc5648 {
    padding: 4px 10px;
    background: var(--accent-soft);
    color: var(--accent-2);
    border: 1px solid var(--border-2);
    border-radius: 6px;
    font-size: 10.5px;
    letter-spacing: 0.08em;
    font-weight: 500;
}

.plp-ticker-1bc5648 {
    font-family: var(--mono);
    font-size: 11px;
    color: var(--text-mute);
}

.plp-title-1bc5648 {
    font-family: var(--serif);
    font-size: 44px;
    font-weight: 500;
    margin: 0;
    letter-spacing: -0.015em;
    line-height: 1.1;
    color: var(--text);
}

.plp-addressRow-1bc5648 {
    margin-top: 10px;
    color: var(--text-dim);
    font-size: 13px;
}

.plp-addressPin-1bc5648 {
    gap: 6px;
}

.plp-pin-1bc5648 {
    color: var(--accent);
    flex-shrink: 0;
}

.plp-grid-1bc5648 {
    display: grid;
    grid-template-columns: 1fr 360px;
    gap: var(--space-5);
    margin-top: var(--space-6);
}

.plp-sideColumn-1bc5648 {
    position: sticky;
    top: 80px;
    align-self: start;
}

@media (max-width: 960px) {
    .plp-grid-1bc5648 {
        grid-template-columns: 1fr;
    }

    .plp-title-1bc5648 {
        font-size: 32px;
    }
}


.propertyListingEditForm-87ce09e {
    /* Hide number input spinners/arrows for inputs in this form */
    input[type="number"]::-webkit-outer-spin-button,
    input[type="number"]::-webkit-inner-spin-button {
        -webkit-appearance: none;
        margin: 0;
    }

    input[type="number"] {
        appearance: textfield;
        -moz-appearance: textfield;
    }

    input[type="range"] {
        height: calc(
            1.5em + 0.75rem + calc(var(--bs-border-width) * 2)
        ) !important;
        padding: 0.375rem 0.75rem;
        display: flex;
        align-items: center;
        box-sizing: border-box;
    }

    /* Input group width constraint for areas */
    .inputGroupConstrained-87ce09e {
        max-width: 20ex;
        flex-shrink: 0;
    }

    .map-87ce09e {
        width: 100%;
        min-height: 500px;
        flex: 1 1 auto;
        height: 100%;
    }
}

/* Cover image / drop-zone footprint: fills the card width at a landscape
   4:3 ratio, so the height stays bounded (width × 3/4) instead of the photo
   rendering at its natural — often oversized — height. */
.coverAspect-87ce09e {
    width: 100%;
    aspect-ratio: 4 / 3;
}


.portfolioEditForm-78e877b {
    .filesUpload-78e877b {
        width: 100%;
        height: 120px;

        .dropZone-78e877b {
            width: 100%;
            height: 100%;
            /* ast-grep-ignore prefer-dropzone-utility */
            border: 3px dashed var(--bs-secondary-border-subtle);
            border-radius: var(--radius-2xl);
            background-color: var(--bs-secondary-bg-subtle);

            .instructions-78e877b {

                p {
                    text-align: center;
                    margin: 0;
                }
            }

            &:hover {
                background-color: var(--bs-primary-bg-subtle);
                border-color: var(--bs-primary-border-subtle);
            }
        }
    }
}


.headerGrid-edb7f8d {
    grid-template-columns: minmax(0, 1fr) auto;
}


.gallery-f6e3c39 {
    padding: var(--space-4);
    overflow-y: auto;
}

.noImages-f6e3c39 {
    width: 100%;
    text-align: center;
    padding: var(--space-12);
}


/* Input group width constraint for areas */
.inputGroupConstrained-da0914a {
    max-width: 300px;
    flex-shrink: 0;
}


.portfolioMapView-f048474 {
    .portfolioMap-f048474 {
        width: 100%;
        min-height: 300px;
        flex: 1 1 auto;
        height: 100%;
    }
}


.portfolioInlineMultiselect-46da413 {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(15rem, 1fr));
    grid-gap: 1rem;
    align-items: start;
}

/* Applied to both the selected portfolio chips and the dropdown items so the
   sizing keeps working after the dropdown portals out of the wrapper. */
.coverImage-46da413 {
    width: 32px;
    object-fit: cover;
}


.previewWrapper-9f2aad7 {
    background: #0a1220;
    min-height: calc(100vh - 180px);
    margin: var(--space-3);
}


.hoverPopup-ba15f1a {
    position: relative;
    padding: 0;
    overflow: hidden;
    max-width: 150px;
    border: var(--bs-border-width) solid var(--bs-border-color);
    border-radius: var(--bs-border-radius);
    background-color: var(--bs-body-bg);
    z-index: 1000;
    pointer-events: none;

    .hoverPopupImage-ba15f1a {
        width: 150px;
        height: 100px;
        overflow: hidden;
        border-radius: var(--bs-border-radius);

        img {
            width: 100%;
            height: 100%;
            object-fit: cover;
        }
    }
}


.propertyCard-a15be2b {
    min-width: 400px;
    border-radius: 12px;
    overflow: visible;
    border: 1px solid rgba(0, 0, 0, 0.1);
    background: #ffffff;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
    transition: box-shadow var(--transition-base);
    transform: translateY(-20px);
    margin-top: -10px;
    position: relative;

    &:hover {
        box-shadow: var(--shadow-lg);
    }

    &::after {
        content: "";
        position: absolute;
        bottom: -10px;
        left: 50%;
        transform: translateX(-50%);
        width: 0;
        height: 0;
        border-left: 10px solid transparent;
        border-right: 10px solid transparent;
        border-top: 10px solid #ffffff;
        filter: drop-shadow(0 2px 2px rgba(0, 0, 0, 0.1));
    }

    .statusBadge-a15be2b {
        position: absolute;
        top: 0.75rem;
        left: 0.75rem;
        z-index: 10;
        background: rgba(255, 255, 255, 0.95);
        backdrop-filter: blur(8px);
        color: #1e293b;
        padding: var(--space-2);
        border-radius: 8px;
        box-shadow: 0 2px 8px rgba(0, 0, 0, 0.15);
        display: flex;
        align-items: center;
        justify-content: center;
        transition: all var(--transition-base);
        border: 1px solid rgba(0, 0, 0, 0.08);

        svg {
            width: 20px;
            height: 20px;
        }

        &:hover {
            background: rgba(255, 255, 255, 1);
            box-shadow: 0 4px 12px rgba(0, 0, 0, 0.2);
            transform: scale(1.05);
        }
    }

    .closeButton-a15be2b {
        position: absolute;
        top: 0.75rem;
        right: 0.75rem;
        z-index: 10;
        background: rgba(255, 255, 255, 0.95);
        border-radius: 50%;
        width: 32px;
        height: 32px;
        padding: 0;
        display: flex;
        align-items: center;
        justify-content: center;
        box-shadow: var(--shadow-sm);
        opacity: 1;
        transition:
            opacity var(--transition-base),
            background var(--transition-base),
            box-shadow var(--transition-base);
        border: 1px solid rgba(0, 0, 0, 0.1);

        &::before {
            content: "";
            width: 14px;
            height: 14px;
            background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath fill='%23333' d='M.293.293a1 1 0 0 1 1.414 0L8 6.586 14.293.293a1 1 0 1 1 1.414 1.414L9.414 8l6.293 6.293a1 1 0 0 1-1.414 1.414L8 9.414l-6.293 6.293a1 1 0 0 1-1.414-1.414L6.586 8 .293 1.707a1 1 0 0 1 0-1.414z'/%3E%3C/svg%3E");
            background-repeat: no-repeat;
            background-position: center;
            background-size: contain;
        }

        &:hover {
            background: rgba(255, 255, 255, 1);
            box-shadow: 0 3px 6px rgba(0, 0, 0, 0.15);
        }
    }

    .propertyCardImage-a15be2b {
        position: relative;
        overflow: hidden;
        height: 200px;
        display: flex;
        align-items: center;
        justify-content: center;
        border-radius: 12px 12px 0 0;

        img {
            width: 100%;
            height: 100%;
            object-fit: cover;
        }
    }

    .propertyCardBody-a15be2b {
        padding: var(--space-5);

        .propertyTitle-a15be2b {
            font-weight: bold;
            color: #1e293b;
            font-size: 1.125rem;
            margin: 0;
        }

        .propertyFields-a15be2b {
            .iconWrapper-a15be2b {
                width: 32px;
                height: 32px;
                border-radius: 6px;
                background: #f1f5f9;
                display: flex;
                align-items: center;
                justify-content: center;
                flex-shrink: 0;
                margin-bottom: var(--space-2);

                svg {
                    width: 16px;
                    height: 16px;
                    color: #475569;
                }
            }

            .fieldLabel-a15be2b {
                font-size: 0.6875rem;
                color: #94a3b8;
                text-transform: uppercase;
                font-weight: bold;
                letter-spacing: 0.05em;
                margin-bottom: var(--space-1);
            }

            .fieldValue-a15be2b {
                font-size: 0.875rem;
                color: #1e293b;
                font-weight: bold;
                white-space: nowrap;
            }
        }
    }
}


.notesCell-e29d3b7 {
    white-space: pre-wrap;
    word-break: break-word;
}


.progressBar-c5877ce {
    height: 20px;
}

.progressFill-c5877ce {
    width: 0%;
}


.propertyMapView-80083c4 {
    display: flex;
    flex-direction: column;
    flex: 1 1 auto;
    overflow: hidden;

    .map-80083c4 {
        width: 100%;
        flex: 1 1 auto;
        min-height: 300px;
    }
}


/* Constrains the company icon inside the list-page company dropdown so the
 * row height matches the standard `CompanySelect` look. The shared
 * `.companySvgIcon` rule (in mantiq_erp_common) only caps height at 45px,
 * which inflates the SingleSelect rows when the icon is large. We pass this
 * scoped class to <CompanyIcon class=…/> to override it locally. */
.companyDropdownIcon-5bab95b {
    width: 1.5rem;
    height: 1.5rem;
    max-height: 1.5rem;
    object-fit: contain;
    margin-inline-end: var(--space-3);
    vertical-align: middle;
}


.detailedEntriesContainer-b8ff8b3 {
    .card {
        transition: box-shadow var(--transition-fast);

        &:hover {
            box-shadow: 0 0.125rem 0.25rem rgba(0, 0, 0, 0.075);
        }

        .card-body {
            h1,
            h2,
            h3,
            h4,
            h5,
            h6 {
                margin-top: var(--space-4);

                &:first-child {
                    margin-top: 0;
                }
            }

            /* Ensure images in description are responsive */
            img {
                max-width: 100%;
                height: auto;
            }
        }
    }
}


.activeCompany-fc6606c {
    font-weight: bold;
    --bs-table-active-bg: rgba(var(--bs-primary-rgb), 0.15) !important;

    a {
        text-decoration: none;
        color: var(--bs-primary);
        font-weight: bold;
    }
}


.tableFixedLayout-c842494 {
  table-layout: fixed;
  width: 100%;
}

.w15-c842494 {
  width: 15%;
}

.w85-c842494 {
  width: 85%;
}


@media print {
    .riskTable-405119c tbody tr td,
    .riskTable-405119c tbody tr th {
        background-color: inherit !important;
        color-adjust: exact;
        -webkit-print-color-adjust: exact;
        print-color-adjust: exact;
    }
}


.filterSearch-8222d60 {
    max-width: 300px;
}


.categoryHeader-a80dd28 {
    cursor: pointer;
}


.badgeMinWidth-1145667 {
    min-width: 2em;
}


.descriptionColumn-a829d38 {
    min-width: 15vw;
}


.tagsInput-2809f87 {
    min-height: calc(1.5em + 0.75rem + 2px);
}

.tagChip-2809f87 {
    cursor: default;
}

/* Make the range slider inherit form-control height so it lines up in input-groups. */
.rangeInput-2809f87 {
    height: auto;
    min-height: calc(1.5em + 0.75rem + 2px);
    padding: 0 var(--space-3);
    background-color: var(--bs-form-control-bg, transparent);
}


/* Matches Java Deal.PICTURE_THUMB_WIDTH / PICTURE_THUMB_HEIGHT. */
.pictureCell-6281855 {
    width: 128px;
    min-width: 128px;
    height: 96px;
    background-color: rgba(var(--bs-secondary-rgb), 0.1);
}

.pictureCell-6281855 img {
    width: 128px;
    height: 96px;
    object-fit: cover;
}


.ticketBoard-942dedc {
    --min-column-width: 350px;

    .ticketsContainer-942dedc {
        column-count: auto;
        column-width: var(--min-column-width);
        column-gap: var(--space-4);
        padding: var(--space-2) 0;
    }
}

/* Kanban board layout */
.kanbanBoard-942dedc {
    padding: var(--space-2) 0;
}

.kanbanColumn-942dedc {
    flex: 1;
    display: flex;
    flex-direction: column;
    background: var(--bs-secondary-bg);
    border-radius: var(--radius-md);
    padding: var(--space-4);
    min-height: 400px;
    min-width: 0; /* Allow shrinking below content size */
}

.kanbanHeader-942dedc {
    margin-bottom: var(--space-4);
    padding-bottom: var(--space-2);
    border-bottom: 1px solid var(--bs-border-color);
}

/* Make masonry container work inside kanban columns */
.kanbanColumn-942dedc .ticketsContainer-942dedc {
    column-width: 280px;
}

.filterWidth-942dedc {
    width: 200px;
}

/* Responsive adjustments */
@media (max-width: 768px) {
    .ticketBoard-942dedc {
        --min-column-width: 100%;

        .ticketsContainer-942dedc {
            column-count: 1;
        }
    }
}


.ticketCard-6043731 {
    break-inside: avoid-column;
    margin-bottom: var(--space-4);
    transition: transform var(--transition-fast), box-shadow var(--transition-fast);

    &:hover {
        transform: translateY(-2px);
        box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.15) !important;
    }

    a {
        text-decoration: none;
        color: inherit;
    }
}

.cardHeader-6043731 {
    margin-bottom: var(--space-2);
}

.ticketNumber-6043731 {
    font-family: var(--bs-font-monospace);
}

.ticketTitle-6043731 {
    font-weight: 500;
    margin-bottom: var(--space-2);
    line-height: 1.3;
    /* Limit to 2 lines */
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.ticketMeta-6043731 {
    font-size: 0.8125rem;
    color: var(--bs-secondary-color);
}

.imageGrid-6043731 {
    margin-top: var(--space-3);
    overflow: hidden;
}

.imageThumbnail-6043731 {
    width: 48px;
    height: 48px;
    border-radius: var(--radius-sm);
    flex-shrink: 0;
}

.imageMore-6043731 {
    width: 48px;
    height: 48px;
    border-radius: var(--radius-sm);
    background-color: var(--bs-secondary-bg);
    color: var(--bs-secondary-color);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 0.75rem;
    font-weight: 600;
    flex-shrink: 0;
}


.ticketCommentDropzone-e268fbf {
    border: 2px dashed var(--bs-secondary-border-subtle);
    background-color: var(--bs-secondary-bg-subtle);
    border-radius: var(--radius-md);
    padding: var(--space-6);
    text-align: center;
    transition: all 0.2s ease-in-out;
    cursor: pointer;
    margin-top: var(--space-3);
}

.ticketCommentDropzone-e268fbf:hover {
    border-color: var(--bs-primary);
    background-color: var(--bs-primary-bg-subtle);
}

.dropzoneIcon-e268fbf {
    font-size: 2rem;
    margin-bottom: var(--space-2);
    color: var(--bs-secondary);
    display: block;
}

.dropzoneText-e268fbf {
    color: var(--bs-secondary);
    font-size: 0.9rem;
}


.headerGrid-eda7f5a {
    grid-template-columns: minmax(0, 1fr) auto;
}

.ticketThumbnail-eda7f5a {
    width: 64px;
    height: 64px;
}


.ticketImageContainer-d193f30 {
    img {
        image-orientation: from-image;
        transition: transform 0.2s ease-in-out;
        cursor: pointer;

        &:hover {
            transform: scale(1.08);
            z-index: 10;
            position: relative;
        }
    }

    .ticketImage-d193f30 {
        object-fit: cover;
    }
}

.lightbox-d193f30 {
    /* Default to hidden */
    display: none;

    /* Overlay entire screen */
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 2000;

    /* Padding around image */
    padding: var(--space-4);

    /* Translucent background */
    background: rgba(0, 0, 0, 0.9);

    /* Show when targeted via URL hash */
    &:target {
        display: block;
    }

    .lightboxImage-d193f30 {
        width: 100%;
        height: 100%;
        object-fit: contain;
    }
}


.squareImage-b07c211 {
    aspect-ratio: 1;
    object-fit: cover;
}


.projectSelector-c27ef13 {
    cursor: pointer;

    .form-control.form-select {
        padding: 0;
    }

    button.selectorButton-c27ef13 {
        position: relative;
        width: 100%;
        padding: 0.375rem 2rem 0.375rem 0.75rem;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
        text-align: left;
        border: none;
        background: transparent;

       
    }
}

.companyIcon-c27ef13 {
    width: 1.5rem;
    height: 1.5rem;
    flex-shrink: 0;
}

.projectNode-c27ef13 {
    padding: 0.125rem 0;

    &:hover {
        background-color: var(--bs-secondary-bg);
        border-radius: var(--bs-border-radius-sm);
    }
}

.projectNodeClickable-c27ef13 {
    cursor: pointer;
    padding-inline: var(--space-2);
    border-radius: var(--bs-border-radius-sm);
}

.projectNodeSelected-c27ef13 {
    background-color: var(--bs-primary-bg-subtle);
    color: var(--bs-primary-text-emphasis);

    &:hover {
        background-color: var(--bs-primary-bg-subtle);
    }
}


.matrix-77a6be4 {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 1px;
    background-color: var(--bs-border-color-translucent);
    border-top: 1px solid var(--bs-border-color-translucent);
}

.matrixCell-77a6be4 {
    padding: 0.9rem 1rem;
    background-color: var(--bs-body-bg);
    color: inherit;
    text-decoration: none;
    transition: background-color var(--transition-fast);

    &:hover {
        background-color: var(--bs-tertiary-bg);
    }
}

.matrixBadge-77a6be4 {
    min-width: 2.5rem;
    padding: 0.35rem 0.6rem;
    border-radius: 999px;
    font-size: 1.1rem;
    font-weight: 700;
    text-align: center;
}

.matrixLabel-77a6be4 {
    font-size: 0.9rem;
    font-weight: 500;
}


.chartContainer-f7ac5c1 {
    width: 100%;
    height: 300px;
    max-height: 300px;
    padding-bottom: 4.75rem;
    overflow: clip;

    .chart-f7ac5c1 {
        display: flex;
        height: 100%;
        position: relative;
        padding-left: var(--space-12);

        .yAxis-f7ac5c1 {
            position: absolute;
            left: 0;
            top: 0;
            bottom: 0;
            width: 50px;
            display: flex;
            flex-direction: column;
            justify-content: space-between;
            align-items: flex-end;
            padding-right: 10px;
        }

        .yLabel-f7ac5c1 {
        }

        .bars-f7ac5c1 {
            flex: 1;
            display: flex;
            align-items: flex-end;
            gap: var(--space-1);
        }

        .barWrapper-f7ac5c1 {
            flex: 1;
            display: flex;
            flex-direction: row;
            align-items: end;
            justify-content: center;
            position: relative;
            height: 100%;

            .bar-f7ac5c1 {
                width: 100%;
                height: 0%;
                max-width: 10vw;
                background-color: var(--bs-primary);
                transition: all var(--transition-slow);
                min-height: 2px;
                border-radius: var(--bs-border-radius) var(--bs-border-radius) 0
                    0;
            }

            .bar-f7ac5c1.selected-f7ac5c1 {
                background-color: #084298;
            }

            .barValue-f7ac5c1 {
                display: none;
            }

            .barLabel-f7ac5c1 {
                position: absolute;
                transform: rotate(-45deg);
                white-space: nowrap;
                bottom: -3.5rem;
                left: 50%;
                margin-inline-start: -4rem;
                transform-origin: center;
                color: var(--bs-secondary);
            }

            .barLabel-f7ac5c1.hideLabel-f7ac5c1 {
                display: none;
            }

            .barLabel-f7ac5c1.isMonday-f7ac5c1 {
                color: var(--bs-body-color);
                font-weight: bold;
            }

            &:hover {
                font-weight: bold;
                z-index: 1;

                .bar-f7ac5c1 {
                    background-color: var(--bs-primary-bg-subtle);
                    border: solid var(--bs-primary-border-subtle)
                        var(--bs-border-width);
                }

                .barValue-f7ac5c1,
                .barLabel-f7ac5c1 {
                    position: absolute;
                    display: block;
                    left: auto;
                    right: 0;
                    transform: translateX(100%);
                    z-index: 2;
                    white-space: nowrap;
                    padding: var(--space-1);
                    background-color: var(--bs-secondary-bg-subtle);
                    border: solid var(--bs-secondary-border-subtle)
                        var(--bs-border-width);
                    border-radius: var(--bs-border-radius);
                }

                .barLabel-f7ac5c1.hideLabel-f7ac5c1 {
                    display: block;
                    color: var(--bs-body-color);
                }

                .barLabel-f7ac5c1.isMonday-f7ac5c1 {
                    font-weight: 700;
                }

                .barValue-f7ac5c1 {
                    top: 0px;
                }

                .barLabel-f7ac5c1 {
                    bottom: 2rem;
                }
            }

            &.secondHalf-f7ac5c1:hover {
                .barValue-f7ac5c1,
                .barLabel-f7ac5c1 {
                    transform: none;
                    margin-right: 100%;
                }
            }
        }
    }
}


.form-control:has(button.dropdownToggle-818a512) {
    padding: 0;
}

button.dropdownToggle-818a512 {
    position: relative;
    padding-inline-end: var(--space-8);
    max-width: 100%;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    text-align: left;
    color: var(--bs-body-color);
    border: none;

    &::after {
        position: absolute;
        inset-inline-end: 0.75rem;
        top: 50%;
        transform: translateY(-50%);
    }

    &:focus {
        border-color: #86b7fe;
        outline: 0;
        box-shadow: 0 0 0 0.25rem rgba(13, 110, 253, 0.25);
    }
}

.menu-818a512 {
    max-height: 70vh;
    overflow-y: auto;
    overflow-x: hidden;
}


.meetingPage-a16a99f {
    flex-grow: 1;
    display: flex;

    &,
    div:has(> &) {
        background-color: black !important;
        color: var(--bs-light);
    }
}


/* Flash animation for connection status changes */
@keyframes web_rtc_flash_connection {
    from,
    50%,
    to {
        opacity: 1;
    }

    25%,
    75% {
        opacity: 0;
    }
}

.flashConnection-b78eaa8 {
    animation-name: web_rtc_flash_connection;
    animation-duration: 1s;
    animation-fill-mode: both;
}

@keyframes web_rtc_badge_update {
    0% {
        transform: scale(1);
        box-shadow: 0 0 0 0 rgba(var(--bs-primary-rgb), 0.7);
    }
    30% {
        transform: scale(1.3);
        box-shadow: 0 0 0 4px rgba(var(--bs-primary-rgb), 0);
    }
    50% {
        transform: scale(0.95);
    }
    70% {
        transform: scale(1.05);
    }
    100% {
        transform: scale(1);
        box-shadow: 0 0 0 0 rgba(var(--bs-primary-rgb), 0);
    }
}

.badgeUpdating-b78eaa8 {
    animation: web_rtc_badge_update 0.6s ease-out;
}

.participant-b78eaa8 {
    color: var(--bs-danger);

    .showWhenConnected-b78eaa8 {
        display: none !important;
    }

    .showWhenDisconnected-b78eaa8 {
        display: inline-block !important;
    }

    &.connected-b78eaa8 {
        color: var(--bs-success);

        .showWhenConnected-b78eaa8 {
            display: inline-block !important;
        }

        .showWhenDisconnected-b78eaa8 {
            display: none !important;
        }
    }
}


.thRecipientType-e23b3a5 {
    width: 10rem;
}

.thActions-e23b3a5 {
    width: 3rem;
}


.widthBoundedInput-7bfd89f {
    min-width: 5rem;
    max-width: 5rem;
}


.maxWidthInput-f8f9d3d {
    max-width: 5rem;
}


/* Allows the domain link to be clickable without triggering the stretched link. */
.domainCell-7dd6ddb a {
    position: relative;
    z-index: 2;
}


.idDocumentInputGroup-f9f0ff1 .form-select.is-invalid {
    --bs-form-select-bg-icon: none;
    padding-right: 2.25rem;
    background-image: var(--bs-form-select-bg-img);
    background-position: right 0.75rem center;
    background-size: 16px 12px;
}

.idDocumentTypeSelect-f9f0ff1 {
    flex-grow: 0;
    min-width: 11rem;
}

.validationHidden-f9f0ff1 .is-invalid,
.validationHidden-f9f0ff1 .is-valid {
    border-color: var(--bs-border-color) !important;
}

.validationHidden-f9f0ff1 .form-control.is-invalid,
.validationHidden-f9f0ff1 .form-control.is-valid {
    background-image: none !important;
    padding-right: var(--space-3) !important;
}

.validationHidden-f9f0ff1 .form-select.is-invalid,
.validationHidden-f9f0ff1 .form-select.is-valid {
    --bs-form-select-bg-icon: none;
    padding-right: 2.25rem !important;
}

.validationHidden-f9f0ff1 .is-invalid:focus,
.validationHidden-f9f0ff1 .is-valid:focus {
    border-color: var(--bs-primary) !important;
    box-shadow: 0 0 0 0.25rem rgba(var(--bs-primary-rgb), 0.25) !important;
}

.validationHidden-f9f0ff1 .invalid-feedback,
.validationHidden-f9f0ff1 .valid-feedback {
    display: none !important;
}


.idNumberDecorator-1a31c04 {
    display: contents;
}

.idNumberDecorator-1a31c04 > .form-control {
    position: relative;
    flex: 1 1 auto;
    width: 1%;
    min-width: 0;
    margin-left: -1px;
    border-top-left-radius: 0;
    border-bottom-left-radius: 0;
}

.validationHidden-1a31c04 .is-invalid,
.validationHidden-1a31c04 .is-valid {
    border-color: var(--bs-border-color) !important;
}

.validationHidden-1a31c04 .form-control.is-invalid,
.validationHidden-1a31c04 .form-control.is-valid {
    background-image: none !important;
    padding-right: var(--space-3) !important;
}

.validationHidden-1a31c04 .form-select.is-invalid,
.validationHidden-1a31c04 .form-select.is-valid {
    --bs-form-select-bg-icon: none;
    padding-right: 2.25rem !important;
}

.validationHidden-1a31c04 .is-invalid:focus,
.validationHidden-1a31c04 .is-valid:focus {
    border-color: var(--bs-primary) !important;
    box-shadow: 0 0 0 0.25rem rgba(var(--bs-primary-rgb), 0.25) !important;
}

.validationHidden-1a31c04 .invalid-feedback,
.validationHidden-1a31c04 .valid-feedback {
    display: none !important;
}


.progressColumn-9058d98 {
    min-width: 7.5rem;
}

.sizeProgress-9058d98 {
    height: 1.25rem;
}

.progressLarge-9058d98 {
    height: 25px;
}

.progressFill-9058d98 {
    width: 0%;
}


.dropZone-4a7b0e1 {
    flex-grow: 1;
    width: 100%;
    /* ast-grep-ignore prefer-dropzone-utility */
    border: 3px dashed var(--bs-secondary-border-subtle);
    border-radius: var(--radius-2xl);
    background-color: var(--bs-secondary-bg-subtle);
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;

    .instructions-4a7b0e1 {
        height: 100%;
        display: flex;
        flex-direction: column;
        justify-content: center;
        align-items: center;

        p {
            text-align: center;
        }
    }
}

.dropZone-4a7b0e1:hover {
    background-color: var(--bs-primary-bg-subtle);
    border-color: var(--bs-primary-border-subtle);
}


.progressFill-c80b966 {
    width: 0%;
}


.chartContainer-4b2f3be {
    width: 100%;
    height: 100%;
    max-height: 500px;
    padding-bottom: 4.75rem;
    overflow: clip;

    .chart-4b2f3be {
        display: flex;
        height: 100%;
        position: relative;
        padding-left: var(--space-12);

        .yAxis-4b2f3be {
            position: absolute;
            left: 0;
            top: 0;
            bottom: 0;
            width: 50px;
            display: flex;
            flex-direction: column;
            justify-content: space-between;
            align-items: flex-end;
            padding-right: 10px;
        }

        .yLabel-4b2f3be {
        }

        .bars-4b2f3be {
            flex: 1;
            display: flex;
            align-items: flex-end;
            gap: var(--space-1);
        }

        .barWrapper-4b2f3be {
            flex: 1;
            display: flex;
            flex-direction: row;
            align-items: end;
            justify-content: center;
            position: relative;
            height: 100%;

            .bar-4b2f3be {
                width: 100%;
                height: 0%;
                max-width: 10vw;
                background-color: var(--bs-danger);
                transition: all var(--transition-slow);
                min-height: 2px;
                border-radius: var(--bs-border-radius) var(--bs-border-radius) 0
                    0;
            }

            .bar-4b2f3be.selected-4b2f3be {
                background-color: #991b1b;
            }

            .barValue-4b2f3be {
                display: none;
            }

            .barLabel-4b2f3be {
                position: absolute;
                transform: rotate(-45deg);
                white-space: nowrap;
                bottom: -3.5rem;
                left: 50%;
                margin-inline-start: -4rem;
                transform-origin: center;
                color: var(--bs-secondary);
            }

            .barLabel-4b2f3be.hideLabel-4b2f3be {
                display: none;
            }

            .barLabel-4b2f3be.isMonday-4b2f3be {
                color: var(--bs-body-color);
                font-weight: bold;
            }

            &:hover {
                font-weight: bold;
                z-index: 1;

                .bar-4b2f3be {
                    background-color: var(--bs-danger-bg-subtle);
                    border: solid var(--bs-danger-border-subtle)
                        var(--bs-border-width);
                }

                .barValue-4b2f3be,
                .barLabel-4b2f3be {
                    position: absolute;
                    display: block;
                    left: auto;
                    right: 0;
                    transform: translateX(100%);
                    z-index: 2;
                    white-space: nowrap;
                    padding: var(--space-1);
                    background-color: var(--bs-secondary-bg-subtle);
                    border: solid var(--bs-secondary-border-subtle)
                        var(--bs-border-width);
                    border-radius: var(--bs-border-radius);
                }

                .barLabel-4b2f3be.hideLabel-4b2f3be {
                    display: block;
                    color: var(--bs-body-color);
                }

                .barLabel-4b2f3be.isMonday-4b2f3be {
                    font-weight: 700;
                }

                .barValue-4b2f3be {
                    top: 0px;
                }

                .barLabel-4b2f3be {
                    bottom: 2rem;
                }
            }

            &.secondHalf-4b2f3be:hover {
                .barValue-4b2f3be,
                .barLabel-4b2f3be {
                    transform: none;
                    margin-right: 100%;
                }
            }
        }
    }
}


.chartContainer-8e4fdb1 {
    height: 500px;
}


.chart-5b4359d {
    height: 200px;
}

.userSearchField-5b4359d {
    min-width: 10ex;
}

.exceptionMessage-5b4359d {
    max-width: 75%;
    overflow: hidden;
    text-overflow: ellipsis;
}


.expandRows-5f093bd {
    .query-5f093bd {
        white-space: pre;
    }
}

.compactRows-5f093bd {
    .query-5f093bd {
        max-height: 1.5em;
        display: block;
        overflow: hidden;
        text-overflow: ellipsis;
    }
}


.expandRows-afdf18f {
    .query-afdf18f {
        white-space: pre;
    }
}

.compactRows-afdf18f {
    .query-afdf18f {
        max-height: 1.5em;
        display: block;
        overflow: hidden;
        text-overflow: ellipsis;
    }
}


.expandRows-384e3d4 {
    .query-384e3d4 {
        white-space: pre;
    }
}

.compactRows-384e3d4 {
    .query-384e3d4 {
        max-height: 1.5em;
        display: block;
        overflow: hidden;
        text-overflow: ellipsis;
    }
}


.filterControl-a1f8ace {
    flex: 1 1 240px;
}


.mapWrapper-4764bcd {
    height: calc(100vh - 250px);
    min-height: 400px;
}


.legendMarker-d2a8cbe {
    width: 12px;
    height: 12px;
}

.progressTrack-d2a8cbe,
.progressFill-d2a8cbe {
    width: 0%;
}


.metadataTable-d89ec58 {
    th {
        white-space: nowrap;
        font-weight: 600;
        width: 200px;
        vertical-align: top;
    }

    td {
        width: 100%;
        word-break: break-word;
    }
}

.userMessage-d89ec58 {

    .messageContent-d89ec58 {
        max-width: 70%;
        padding: var(--space-3) var(--space-4);
        word-wrap: break-word;
        white-space: pre-wrap;
        background-color: #007bff;
        color: white;
        border-radius: var(--radius-2xl) var(--radius-2xl) var(--radius-sm) var(--radius-2xl);
    }
}

.assistantMessage-d89ec58 {

    .messageContent-d89ec58 {
        max-width: 70%;
        padding: var(--space-3) var(--space-4);
        word-wrap: break-word;
        white-space: pre-wrap;
        background-color: #f8f9fa;
        color: #333;
        border: 1px solid #e9ecef;
        border-radius: var(--radius-2xl) var(--radius-2xl) var(--radius-2xl) var(--radius-sm);
    }
}


table.bugDetails-a980ddb {
    th {
        white-space: nowrap;
    }

    td {
        width: 100%;
    }
}

.stackTrace-a980ddb {
    font-family: monospace;
    margin-bottom: 0;
}

.copyIcon-a980ddb {
    position: fixed;
    padding-inline-start: var(--space-2);
    margin-top: var(--space-1);
    opacity: 0;
    transition: opacity 0.3s ease-in-out;

    a:hover & {
        opacity: 1;
    }
}


.securityEvent-eb197a2 {
    table.eventDetails-eb197a2 {
        th {
            white-space: nowrap;
            font-weight: 600;
            width: 200px;
            vertical-align: top;
        }

        td {
            width: 100%;
            word-break: break-word;
        }
    }

    .errorMessage-eb197a2 {
        font-family: monospace;
        margin-bottom: 0;
        font-size: 0.9rem;
        color: var(--bs-danger);
        background-color: var(--bs-danger-bg-subtle);
        padding: var(--space-4);
        border-radius: 0.375rem;
        border-left: 3px solid var(--bs-danger);
    }

    .headers-eb197a2 {
        font-family: monospace;
        margin-bottom: 0;
        font-size: 0.85rem;
        background-color: var(--bs-secondary-bg);
        padding: var(--space-4);
        border-radius: 0.375rem;
        max-height: 400px;
        overflow-y: auto;
        line-height: 1.6;
    }

    .simpleLog-eb197a2 {
        font-family: monospace;
        margin-bottom: 0;
        font-size: 0.9rem;
        background-color: var(--bs-info-bg-subtle);
        padding: var(--space-4);
        border-radius: 0.375rem;
        border-left: 3px solid var(--bs-info);
        white-space: pre-wrap;
        word-wrap: break-word;
    }

    .copyIcon-eb197a2 {
        position: fixed;
        padding-inline-start: var(--space-2);
        margin-top: var(--space-1);
        opacity: 0;
        transition: opacity 0.3s ease-in-out;

        a:hover & {
            opacity: 1;
        }
    }
}


.featuresLayout-af7b57d {
    min-height: 100%;

    .sidebar-af7b57d {
        min-width: 25rem;
        position: sticky;
        top: 53.14px;
        height: calc(100vh - 53.14px);
        overflow-y: auto;

        .sidebarHeader-af7b57d {
            position: sticky;
            top: 0;
            z-index: 1;
        }
    }
}


.strengthBar-3e4a31a {
    height: 0.5rem;
}

.strengthFill-3e4a31a {
    width: 0%;
}

.passwordConditions-3e4a31a {
    li {
        color: var(--bs-secondary);

        .iconChecked-3e4a31a,
        .iconUnchecked-3e4a31a {
            margin-right: var(--space-1);
        }

        .iconChecked-3e4a31a {
            display: none;
        }

        &.conditionChecked-3e4a31a {
            color: var(--bs-success);

            .iconChecked-3e4a31a {
                display: inline-block;
            }

            .iconUnchecked-3e4a31a {
                display: none;
            }
        }
    }
}


.assistsAvatar-1379e07 {
    width: 2.25em;
    height: 2.25em;
    border-radius: var(--radius-sm);
    overflow: hidden;
    flex-shrink: 0;

    img {
        object-fit: cover;
        width: 100%;
        height: 100%;
    }
}


.grid-1119a1d {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
    gap: var(--space-4);

    .themeBox,
    .themeCard-1119a1d {
        min-height: 400px;
        position: relative;
        transition: all var(--transition-slow);
    }
}

.previewFrame-1119a1d {
    border: 0;
    flex: 1 1 auto;
    width: 100%;
    min-height: 320px;
    display: block;
}

/* Each grid cell stacks the preview card on top and the Select button below.
 * The button is intentionally outside `.themeBox#theme-X` so per-theme CSS
 * variables don't cascade into it — uniform appearance across all 16 cards. */
.themeAction-1119a1d {
    padding: var(--space-1) 0;
}


/*
 * Cap the per-mailbox sub-card to a reading width so the card border
 * doesn't run far past the actual content on wide screens. 46rem
 * (~720px) comfortably fits the Users-with-access table (avatar + name
 * + 3 permission columns + remove button) plus the grant-access row
 * with the user picker.
 */
.mailboxCard-7df02c2 {
    max-width: 46rem;
}


.signature-preview-94ee3ec {
    height: 150px;
    width: 100%;
    object-fit: contain;
}


.tooltipHolder-a8c09d4 {
    color: silver;
}

.isolatedScope-a8c09d4 {
    isolation: isolate;
}

.accesses-a8c09d4 table {
    --bs-table-bg: transparent;
}

.accesses-a8c09d4 .table-hover > tbody > tr:hover {
    --bs-table-hover-color: var(--bs-dark);
    --bs-table-hover-bg: yellow;
}

.accesses-a8c09d4 .table-hover td {
    position: relative;
}

.accesses-a8c09d4 .table-hover td:hover::after {
    position: absolute;
    color: var(--bs-table-hover-color);
    background-color: var(--bs-table-hover-bg);
    left: 0;
    top: -5000px;
    height: 10000px;
    width: 100%;
    z-index: -1;
}

.accesses-a8c09d4 tr.hasARole-a8c09d4 input {
    font-size: 150%;
}

.accesses-a8c09d4 tr.hasNoRole-a8c09d4 th {
    font-weight: normal;
    color: var(--bs-gray);
}


.detailLink-c1dea08 {
    min-width: 0;
}

.detailContent-c1dea08 {
    min-width: 0;
}

.panel-c1dea08 {
    animation: panel-open 180ms ease-out;
    overflow: hidden;
}

@keyframes panel-open {
    from {
        opacity: 0;
        transform: translateY(-4px);
        max-height: 0;
    }
    to {
        opacity: 1;
        transform: translateY(0);
        max-height: 50rem;
    }
}


.iconBadge-80dfb26 {
    width: 3.5rem;
    height: 3.5rem;
}


.table-a530308 {
    .completed-a530308 {
        display: none;
    }

    tr {
        vertical-align: middle;
        &.table-success {
            .progress {
                display: none;
            }

            .completed-a530308 {
                display: block;
            }
        }

        td {
            &:has(.progress) {
                min-width: 40%;
                vertical-align: middle;
            }
        }

        .progress {
            min-height: 1rem;
        }
    }
}