/* /Components/Components/ActivityJournal.razor.rz.scp.css */
.activity-journal[b-jqpopzovc9] {
    display: flex;
    flex-direction: column;
    gap: 12px;
    padding: 8px 0;
}

.activity-entry[b-jqpopzovc9] {
    border-left: 3px solid #0d6efd;
    padding-left: 12px;
    padding-top: 4px;
    padding-bottom: 4px;
}

.activity-header[b-jqpopzovc9] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 4px;
    font-size: 0.875rem;
}

.activity-timestamp[b-jqpopzovc9] {
    color: var(--bs-secondary-color, #6c757d);
    font-weight: 500;
}

.activity-user[b-jqpopzovc9] {
    color: #495057;
    font-size: 0.813rem;
    background-color: #e9ecef;
    padding: 2px 8px;
    border-radius: 3px;
}

.activity-body[b-jqpopzovc9] {
    color: var(--bs-body-color);
    line-height: 1.4;
}
/* /Components/Components/ApprovalGroup.razor.rz.scp.css */
.approval-info-container[b-us2o4xdrqi] {
    display: flex;
    gap: 2rem;
    padding: 0.5rem 0;
    flex-wrap: wrap;
}

.approval-section[b-us2o4xdrqi] {
    flex: 1;
    min-width: 250px;
}

.approval-label[b-us2o4xdrqi] {
    font-weight: 600;
    font-size: 0.875rem;
    color: var(--bs-body-color);
    opacity: 0.85;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    margin-bottom: 0.5rem;
}

.approval-details[b-us2o4xdrqi] {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
}

.approval-user[b-us2o4xdrqi] {
    font-weight: 500;
    font-size: 0.9375rem;
    color: var(--bs-body-color);
    margin-bottom: 0.25rem;
}

.approval-time[b-us2o4xdrqi] {
    display: flex;
    align-items: baseline;
    font-size: 0.8125rem;
}

.time-label[b-us2o4xdrqi] {
    font-weight: 500;
    color: var(--bs-body-color);
    opacity: 0.7;
    min-width: 45px;
    margin-right: 0.5rem;
}

.time-value[b-us2o4xdrqi] {
    color: var(--bs-body-color);
}

.approval-status-pending[b-us2o4xdrqi] {
    font-size: 0.9375rem;
    color: var(--bs-body-color);
    opacity: 0.7;
    font-style: italic;
}

.approval-divider[b-us2o4xdrqi] {
    width: 1px;
    background-color: var(--bs-border-color);
    margin: 0 0.5rem;
}

@media (max-width: 767px) {
    .approval-info-container[b-us2o4xdrqi] {
        flex-direction: column;
        gap: 1.5rem;
    }

    .approval-divider[b-us2o4xdrqi] {
        display: none;
    }

    .approval-section[b-us2o4xdrqi] {
        min-width: 100%;
    }
}
/* /Components/Components/BulkOrderAllocation.razor.rz.scp.css */
[b-nlvegxkof2] td.validation-error-cell {
    background-color: rgba(var(--bs-danger-rgb), 0.15) !important;
    outline: 1px solid var(--bs-danger) !important;
    outline-offset: -1px;
}
/* /Components/Components/CreateProductWizard.razor.rz.scp.css */
/* CSS for CreateProductWizard component */

/* Height knob for the wizard grids. Change the value below to resize all
   wizard grids at once, or override it on a single wrapper inline, e.g.:
   <div class="wizard-grid-container" style="--wizard-grid-height: 250px">
   The actual height is applied to each grid root by the global ".wizard-grid"
   rule in site.css (the grids live inside a teleported DxPopup, so a scoped
   ::deep rule cannot reach them). */
.wizard-grid-container[b-24d87z5aqd] {
    --wizard-grid-height: 300px;
}
/* /Components/Components/EmailViewer.razor.rz.scp.css */
.email-viewer[b-lfs4nojj55] {
    border: 1px solid var(--bs-border-color);
    border-radius: 0.375rem;
    overflow: hidden;
    background-color: var(--bs-body-bg);
    display: flex;
    flex-direction: column;
    position: relative;
}

.email-header[b-lfs4nojj55] {
    padding: 1rem;
    background-color: var(--bs-light);
    border-bottom: 1px solid var(--bs-border-color);
    flex-shrink: 0;
}

.email-field[b-lfs4nojj55] {
    display: flex;
    margin-bottom: 0.5rem;
    line-height: 1.5;
}

.email-field:last-child[b-lfs4nojj55] {
    margin-bottom: 0;
}

.email-label[b-lfs4nojj55] {
    font-weight: 600;
    min-width: 100px;
}

.email-value[b-lfs4nojj55] {
    flex: 1;
    word-break: break-word;
}

.email-body[b-lfs4nojj55] {
    flex: 1;
    overflow: auto;
    background-color: var(--bs-body-bg);
    min-height: 0;
}

.email-html-frame[b-lfs4nojj55] {
    width: 100%;
    height: 100%;
    min-height: 250px;
    border: none;
    background-color: #ffffff;
}

.email-text-body[b-lfs4nojj55] {
    padding: 1rem;
    white-space: pre-wrap;
    font-family: Arial, sans-serif;
    line-height: 1.6;
    color: var(--bs-body-color);
}

.email-viewer-resize-handle[b-lfs4nojj55] {
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    height: 8px;
    background: transparent;
    cursor: ns-resize;
    z-index: 10;
}

.email-viewer-resize-handle:hover[b-lfs4nojj55] {
    background: var(--bs-primary);
    opacity: 0.5;
}

.email-viewer-resize-handle:active[b-lfs4nojj55] {
    background: var(--bs-primary);
    opacity: 0.7;
}

/* Light theme support */
[data-bs-theme="light"] .email-header[b-lfs4nojj55] {
    background-color: #f8f9fa;
}

[data-bs-theme="light"] .email-label[b-lfs4nojj55] {
    color: #2c3e50 !important;
}

[data-bs-theme="light"] .email-value[b-lfs4nojj55] {
    color: #1a1a1a !important;
}

/* Dark mode specific adjustments */
@media (prefers-color-scheme: dark) {
    .email-header[b-lfs4nojj55] {
        background-color: rgba(255, 255, 255, 0.05);
    }
    
    .email-label[b-lfs4nojj55] {
        color: var(--bs-gray-400);
    }
    
    .email-value[b-lfs4nojj55] {
        color: var(--bs-gray-200);
    }
    
    .email-html-frame[b-lfs4nojj55] {
        border: 1px solid var(--bs-border-color);
        filter: brightness(0.9) contrast(1.1);
    }
}

/* DevExpress dark theme support */
[data-bs-theme="dark"] .email-header[b-lfs4nojj55] {
    background-color: rgba(255, 255, 255, 0.05);
}

[data-bs-theme="dark"] .email-label[b-lfs4nojj55] {
    color: var(--bs-gray-400) !important;
}

[data-bs-theme="dark"] .email-value[b-lfs4nojj55] {
    color: var(--bs-gray-200) !important;
}

[data-bs-theme="dark"] .email-html-frame[b-lfs4nojj55] {
    border: 1px solid var(--bs-border-color);
    filter: brightness(0.9) contrast(1.1);
}
/* /Components/Components/GeneralLogViewer.razor.rz.scp.css */
.general-log-html-content[b-gp4ctcje4e] {
    background-color: var(--bs-body-bg);
    color: var(--bs-body-color);
    min-height: 100px;
    padding: 0.75rem;
    overflow-wrap: break-word;
    word-wrap: break-word;
}

    .general-log-html-content p:last-child[b-gp4ctcje4e] {
        margin-bottom: 0;
    }

    .general-log-html-content table[b-gp4ctcje4e] {
        width: 100%;
        margin-bottom: 1rem;
        color: var(--bs-body-color);
        border-collapse: collapse;
    }

        .general-log-html-content table th[b-gp4ctcje4e],
        .general-log-html-content table td[b-gp4ctcje4e] {
            padding: 0.5rem;
            border: 1px solid var(--bs-border-color);
        }

        .general-log-html-content table th[b-gp4ctcje4e] {
            font-weight: bold;
            background-color: var(--bs-secondary-bg);
        }

    .general-log-html-content ul[b-gp4ctcje4e],
    .general-log-html-content ol[b-gp4ctcje4e] {
        padding-left: 2rem;
    }

    .general-log-html-content a[b-gp4ctcje4e] {
        color: var(--bs-link-color);
        text-decoration: underline;
    }

        .general-log-html-content a:hover[b-gp4ctcje4e] {
            color: var(--bs-link-hover-color);
        }
/* /Components/Components/HelpFlyout.razor.rz.scp.css */
.help-icon-container[b-v6hc0q865g] {
    display: inline-flex;
    align-items: center;
    margin-left: 0.5rem;
    margin-right: 0.25rem;
    cursor: pointer;
}

.help-icon[b-v6hc0q865g] {
    color: var(--bs-info, #0d6efd);
    opacity: 0.7;
    font-size: 0.875rem;
    transition: opacity 0.2s ease;
}

    .help-icon:hover[b-v6hc0q865g] {
        opacity: 1;
    }

.help-content[b-v6hc0q865g] {
    padding: 1rem;
    line-height: 1.6;
}

    .help-content ul[b-v6hc0q865g] {
        margin: 0.5rem 0;
        padding-left: 1.5rem;
    }

    .help-content code[b-v6hc0q865g] {
        background-color: rgba(0, 0, 0, 0.05);
        padding: 0.125rem 0.25rem;
        border-radius: 0.25rem;
        font-family: 'Courier New', monospace;
        font-size: 0.875em;
    }

    .help-content strong[b-v6hc0q865g] {
        font-weight: 600;
    }

    .help-content li[b-v6hc0q865g] {
        margin-bottom: 0.25rem;
    }
/* /Components/Components/Kanban/KanbanBoard.razor.rz.scp.css */
/*
    -------------------------------------------------
    Kanban board
    Theme is driven by the .kanban-light / .kanban-dark
    variable sets applied by the component.
    -------------------------------------------------
*/
.kanban-board[b-6iu5t622li] {
    --kb-min-column-width: 260px;
    --kb-card-accent-width: 4px;
    --kb-gap: 0.625rem;
    --kb-radius: 0.5rem;
    --kb-card-radius: 0.375rem;
    display: flex;
    flex-direction: column;
    min-height: 0;
    width: 100%;
    border-radius: var(--kb-radius);
    background-color: var(--kb-board-bg);
    color: var(--kb-text);
    border: 1px solid var(--kb-border);
    overflow: hidden;
    font-size: 0.875rem;
}

.kanban-light[b-6iu5t622li] {
    --kb-board-bg: #f2f3f5;
    --kb-border: rgba(9, 30, 66, 0.14);
    --kb-header-bg: #e7e9ee;
    --kb-cell-bg: #eceef2;
    --kb-cell-alt-bg: #e6e8ee;
    --kb-lane-header-bg: #dfe2e9;
    --kb-card-bg: #ffffff;
    --kb-card-border: rgba(9, 30, 66, 0.14);
    --kb-text: #172b4d;
    --kb-muted: #5e6c84;
    --kb-count-bg: rgba(9, 30, 66, 0.09);
    --kb-shadow: 0 1px 2px rgba(9, 30, 66, 0.16);
    --kb-shadow-hover: 0 4px 10px rgba(9, 30, 66, 0.22);
    --kb-accent: #6b778c;
    --kb-valid: 13, 110, 253;
    --kb-invalid: 220, 53, 69;
    --kb-scroll-thumb: rgba(9, 30, 66, 0.25);
}

.kanban-dark[b-6iu5t622li] {
    --kb-board-bg: #1e1e22;
    --kb-border: rgba(255, 255, 255, 0.12);
    --kb-header-bg: #26262c;
    --kb-cell-bg: #232329;
    --kb-cell-alt-bg: #26262d;
    --kb-lane-header-bg: #2b2a31;
    --kb-card-bg: #2f2f37;
    --kb-card-border: rgba(255, 255, 255, 0.12);
    --kb-text: rgba(255, 255, 255, 0.92);
    --kb-muted: rgba(255, 255, 255, 0.6);
    --kb-count-bg: rgba(255, 255, 255, 0.12);
    --kb-shadow: 0 1px 2px rgba(0, 0, 0, 0.5);
    --kb-shadow-hover: 0 6px 14px rgba(0, 0, 0, 0.6);
    --kb-accent: #8a8a99;
    --kb-valid: 132, 176, 255;
    --kb-invalid: 255, 107, 107;
    --kb-scroll-thumb: rgba(255, 255, 255, 0.22);
}

/*
    -------------------------------------------------
    Scroll surface
    -------------------------------------------------
*/
.kanban-scroll[b-6iu5t622li] {
    flex: 1 1 auto;
    min-height: 0;
    overflow: auto;
}

.kanban-canvas[b-6iu5t622li] {
    display: inline-flex;
    flex-direction: column;
    min-width: 100%;
}

.kanban-scroll[b-6iu5t622li]::-webkit-scrollbar {
    width: 10px;
    height: 10px;
}

.kanban-scroll[b-6iu5t622li]::-webkit-scrollbar-thumb {
    background: var(--kb-scroll-thumb);
    border-radius: 6px;
}

.kanban-scroll[b-6iu5t622li]::-webkit-scrollbar-track {
    background: transparent;
}

/*
    -------------------------------------------------
    Column headers
    -------------------------------------------------
*/
.kanban-header-row[b-6iu5t622li] {
    display: flex;
    flex-direction: row;
    align-items: stretch;
    gap: var(--kb-gap);
    padding: var(--kb-gap) var(--kb-gap) calc(var(--kb-gap) / 2) var(--kb-gap);
    position: sticky;
    top: 0;
    z-index: 3;
    background-color: var(--kb-board-bg);
    border-bottom: 1px solid var(--kb-border);
}

/*
    Columns share the available width and only start scrolling once they would drop below their
    minimum. A fixed board ColumnWidth (or a per column Width) sets --kb-col-grow to 0 so those
    columns keep their exact width instead.
*/
.kanban-column-header[b-6iu5t622li] {
    flex: var(--kb-col-grow, 1) 0 var(--kb-col-width, var(--kb-min-column-width));
    min-width: var(--kb-col-width, var(--kb-min-column-width));
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.5rem 0.625rem;
    background-color: var(--kb-header-bg);
    border: 1px solid var(--kb-border);
    border-radius: var(--kb-card-radius);
    font-weight: 600;
    letter-spacing: 0.01em;
}

.kanban-accent[b-6iu5t622li] {
    flex: 0 0 auto;
    width: 4px;
    align-self: stretch;
    min-height: 1rem;
    border-radius: 2px;
    background-color: var(--kb-accent);
}

.kanban-column-icon[b-6iu5t622li],
.kanban-lane-icon[b-6iu5t622li] {
    color: var(--kb-muted);
}

.kanban-column-caption[b-6iu5t622li],
.kanban-lane-caption[b-6iu5t622li] {
    flex: 1 1 auto;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

/* The header is full width, so keep the count beside the caption rather than at the far edge. */
.kanban-lane-caption[b-6iu5t622li] {
    flex: 0 1 auto;
}

.kanban-count[b-6iu5t622li] {
    flex: 0 0 auto;
    min-width: 1.5rem;
    padding: 0.0625rem 0.4rem;
    border-radius: 0.75rem;
    background-color: var(--kb-count-bg);
    color: var(--kb-muted);
    font-size: 0.75rem;
    font-weight: 600;
    text-align: center;
}

.kanban-count-over[b-6iu5t622li] {
    background-color: rgba(var(--kb-invalid), 0.22);
    color: rgb(var(--kb-invalid));
}

/*
    -------------------------------------------------
    Swim lanes
    -------------------------------------------------
*/
.kanban-lane[b-6iu5t622li] {
    display: flex;
    flex-direction: column;
    border-bottom: 1px solid var(--kb-border);
}

    .kanban-lane:last-child[b-6iu5t622li] {
        border-bottom: none;
    }

/* The lane header spans the full board width so it reads as a band, not a floating pill. */
.kanban-lane-header[b-6iu5t622li] {
    display: flex;
    align-items: center;
    margin: var(--kb-gap) var(--kb-gap) 0 var(--kb-gap);
    padding: 0.375rem 0.625rem;
    border: 1px solid var(--kb-border);
    border-radius: var(--kb-card-radius);
    background-color: var(--kb-lane-header-bg);
    font-weight: 600;
    user-select: none;
}

/* Keeps the caption visible while the board is scrolled horizontally. */
.kanban-lane-header-content[b-6iu5t622li] {
    position: sticky;
    left: 0.625rem;
    display: flex;
    align-items: center;
    gap: 0.5rem;
    max-width: 100%;
}

.kanban-lane-header-clickable[b-6iu5t622li] {
    cursor: pointer;
}

    .kanban-lane-header-clickable:hover[b-6iu5t622li] {
        border-color: rgba(var(--kb-valid), 0.55);
    }

.kanban-lane-chevron[b-6iu5t622li] {
    color: var(--kb-muted);
    width: 0.75rem;
}

.kanban-lane-row[b-6iu5t622li] {
    display: flex;
    flex-direction: row;
    align-items: stretch;
    gap: var(--kb-gap);
    padding: calc(var(--kb-gap) / 2) var(--kb-gap) var(--kb-gap) var(--kb-gap);
}

/*
    -------------------------------------------------
    Cells (the drop targets)
    -------------------------------------------------
*/
.kanban-cell[b-6iu5t622li] {
    position: relative;
    flex: var(--kb-col-grow, 1) 0 var(--kb-col-width, var(--kb-min-column-width));
    min-width: var(--kb-col-width, var(--kb-min-column-width));
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
    min-height: 5.5rem;
    padding: 0.5rem;
    border: 1px solid transparent;
    border-radius: var(--kb-card-radius);
    background-color: var(--kb-cell-bg);
    transition: background-color 0.12s ease, border-color 0.12s ease, box-shadow 0.12s ease;
}

/* Highlight of the whole target area, never a thin insertion line. */
.kanban-cell[b-6iu5t622li]::after {
    content: "";
    position: absolute;
    inset: 0;
    border-radius: var(--kb-card-radius);
    pointer-events: none;
    opacity: 0;
    transition: opacity 0.12s ease;
}

.kanban-cell-droppable[b-6iu5t622li] {
    border-style: dashed;
    border-color: rgba(var(--kb-valid), 0.4);
    background-color: var(--kb-cell-alt-bg);
}

.kanban-cell-blocked[b-6iu5t622li] {
    opacity: 0.45;
}

.kanban-cell-source[b-6iu5t622li] {
    border-style: dashed;
    border-color: var(--kb-border);
}

.kanban-cell-drop-valid[b-6iu5t622li] {
    border-style: solid;
    border-color: rgba(var(--kb-valid), 0.95);
    background-color: rgba(var(--kb-valid), 0.16);
    box-shadow: 0 0 0 3px rgba(var(--kb-valid), 0.22);
}

    .kanban-cell-drop-valid[b-6iu5t622li]::after {
        opacity: 1;
        background-color: rgba(var(--kb-valid), 0.1);
    }

.kanban-cell-drop-invalid[b-6iu5t622li] {
    opacity: 1;
    cursor: not-allowed;
    border-style: solid;
    border-color: rgba(var(--kb-invalid), 0.9);
    background-color: rgba(var(--kb-invalid), 0.16);
    box-shadow: 0 0 0 3px rgba(var(--kb-invalid), 0.2);
}

    .kanban-cell-drop-invalid[b-6iu5t622li]::after {
        opacity: 1;
        background-color: rgba(var(--kb-invalid), 0.1);
    }

.kanban-cell-empty[b-6iu5t622li] {
    flex: 1 1 auto;
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 3.5rem;
    color: var(--kb-muted);
    font-size: 0.75rem;
    font-style: italic;
    opacity: 0.65;
    pointer-events: none;
    text-align: center;
}

/*
    -------------------------------------------------
    Cards
    -------------------------------------------------
*/
.kanban-card[b-6iu5t622li] {
    position: relative;
    padding: 0.625rem 0.75rem;
    border: 1px solid var(--kb-card-border);
    border-left: var(--kb-card-accent-width) solid var(--kb-card-accent, var(--kb-card-border));
    border-radius: var(--kb-card-radius);
    background-color: var(--kb-card-bg);
    box-shadow: var(--kb-shadow);
    transition: box-shadow 0.12s ease, transform 0.12s ease, border-color 0.12s ease, opacity 0.12s ease;
}

.kanban-card-draggable[b-6iu5t622li] {
    cursor: grab;
}

    .kanban-card-draggable:active[b-6iu5t622li] {
        cursor: grabbing;
    }

.kanban-card:hover[b-6iu5t622li] {
    box-shadow: var(--kb-shadow-hover);
    border-color: rgba(var(--kb-valid), 0.6);
    /* Re-assert the accent: the shorthand above would otherwise recolour the left border too. */
    border-left-color: var(--kb-card-accent, rgba(var(--kb-valid), 0.6));
}

.kanban-card-dragging[b-6iu5t622li] {
    opacity: 0.35;
    transform: scale(0.98);
}

/* While a drag is in progress the other cards must not swallow dragenter/dragleave. */
.kanban-board-dragging .kanban-card:not(.kanban-card-dragging)[b-6iu5t622li] {
    pointer-events: none;
}

.kanban-card-fallback[b-6iu5t622li] {
    font-weight: 600;
}

/*
    -------------------------------------------------
    Card flyout icon
    -------------------------------------------------
*/
.kanban-card-has-info[b-6iu5t622li] {
    padding-right: 1.85rem;
}

.kanban-card-info[b-6iu5t622li] {
    position: absolute;
    top: 0.3rem;
    right: 0.3rem;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 1.375rem;
    height: 1.375rem;
    padding: 0;
    border: none;
    border-radius: 50%;
    background-color: transparent;
    color: var(--kb-muted);
    font-size: 0.8125rem;
    line-height: 1;
    cursor: pointer;
    opacity: 0.55;
    transition: opacity 0.12s ease, background-color 0.12s ease, color 0.12s ease;
}

    .kanban-card-info:hover[b-6iu5t622li],
    .kanban-card-info:focus-visible[b-6iu5t622li] {
        opacity: 1;
        color: rgb(var(--kb-valid));
        background-color: var(--kb-count-bg);
        outline: none;
    }

/* HoverOnIcon has nothing to click, so the cursor should not promise otherwise. */
.kanban-card-info-hover[b-6iu5t622li] {
    cursor: help;
}

/*
    -------------------------------------------------
    Helper classes available to card templates
    -------------------------------------------------
*/
.kanban-card[b-6iu5t622li]  .kb-card-title {
    font-weight: 600;
    line-height: 1.25;
    margin-bottom: 0.25rem;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.kanban-card[b-6iu5t622li]  .kb-card-subtitle {
    color: var(--kb-muted);
    font-size: 0.8125rem;
    line-height: 1.25;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.kanban-card[b-6iu5t622li]  .kb-card-footer {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.5rem;
    margin-top: 0.5rem;
    color: var(--kb-muted);
    font-size: 0.75rem;
}

.kanban-card[b-6iu5t622li]  .kb-card-chip {
    display: inline-flex;
    align-items: center;
    gap: 0.25rem;
    padding: 0.0625rem 0.4rem;
    border-radius: 0.75rem;
    background-color: var(--kb-count-bg);
    color: var(--kb-muted);
    font-size: 0.6875rem;
    font-weight: 600;
    white-space: nowrap;
}

/* Hyperlinks in card templates stay quiet until they are hovered. */
.kanban-card[b-6iu5t622li]  a {
    text-decoration: none;
}

    .kanban-card[b-6iu5t622li]  a:hover,
    .kanban-card[b-6iu5t622li]  a:focus-visible {
        text-decoration: underline;
    }

/*
    -------------------------------------------------
    Empty board / notices / flyout
    -------------------------------------------------
*/
.kanban-empty-board[b-6iu5t622li] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
    padding: 3rem 1rem;
    color: var(--kb-muted);
    font-style: italic;
}

    .kanban-empty-board i[b-6iu5t622li] {
        font-size: 1.75rem;
        opacity: 0.6;
    }

.kanban-note[b-6iu5t622li] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.375rem 0.75rem;
    border-top: 1px solid var(--kb-border);
    color: rgb(var(--kb-invalid));
    font-size: 0.75rem;
}

.kanban-card-flyout-body[b-6iu5t622li] {
    padding: 0.75rem 1rem;
    line-height: 1.5;
}

/*
    -------------------------------------------------
    Responsive
    -------------------------------------------------
*/
@media (max-width: 768px) {
    .kanban-board[b-6iu5t622li] {
        --kb-min-column-width: 220px;
        --kb-gap: 0.5rem;
    }
}
/* /Components/Components/PaperworkPopup.razor.rz.scp.css */
.email-paperwork-popup .toolbar-section[b-fvm8vufwed] {
    /* Remove hardcoded background-color, let theme handle it */
}

.email-paperwork-popup .documents-section[b-fvm8vufwed],
.email-paperwork-popup .email-details-section[b-fvm8vufwed],
.email-paperwork-popup .body-section[b-fvm8vufwed] {
    /* Remove hardcoded background colors */
}

.email-paperwork-popup .body-section[b-fvm8vufwed] {
    display: flex;
    flex-direction: column;
    padding: 1.5rem !important;
}

.email-paperwork-popup .documents-section[b-fvm8vufwed] {
    padding: 1.5rem !important;
}

.email-paperwork-popup .email-details-section[b-fvm8vufwed] {
    padding: 1.5rem !important;
}

.email-paperwork-popup .toolbar-section[b-fvm8vufwed] {
    padding: 1rem 1.5rem !important;
}

.email-paperwork-popup .attachments-grid[b-fvm8vufwed] {
    max-height: 300px;
}

.email-paperwork-popup .copies-spin[b-fvm8vufwed] {
    max-width: 80px;
}

.email-paperwork-popup .photo-quality-combo[b-fvm8vufwed] {
    min-width: 150px;
}

/* Add spacing between section headers and content */
.email-paperwork-popup h6[b-fvm8vufwed] {
    margin-bottom: 1rem;
}

/* Optional: Add subtle borders for section separation that work in both themes */
.email-paperwork-popup .toolbar-section[b-fvm8vufwed],
.email-paperwork-popup .documents-section[b-fvm8vufwed],
.email-paperwork-popup .email-details-section[b-fvm8vufwed] {
    border-color: var(--bs-border-color) !important;
}

/* Add some spacing for the action buttons in the grid */
.email-paperwork-popup .attachments-grid .dxbs-button[b-fvm8vufwed] {
    margin: 0 0.125rem;
}

/* Ensure form layout items have proper spacing */
.email-paperwork-popup .dxbl-form-layout-item[b-fvm8vufwed] {
    margin-bottom: 0.75rem;
}
.attachments-grid .dxbl-grid-table tbody tr td[b-fvm8vufwed] {
    padding: 12px 8px !important;
    height: 50px;
}

.attachments-grid .dxbl-grid-table tbody tr[b-fvm8vufwed] {
    height: 50px;
}

.attachments-grid i[b-fvm8vufwed] {
    font-size: 1.25rem;
}
/* /Components/Components/Stepper/Stepper.razor.rz.scp.css */
.stepper[b-8wfj0of5nt] {
    --stepper-size: 2.25rem;
    --stepper-line: 2px;
    --stepper-gap: 0.25rem;
    --stepper-line-color: #ced4da;
    display: flex;
    width: 100%;
}

.stepper-horizontal[b-8wfj0of5nt] {
    flex-direction: row;
    align-items: flex-start;
}

.stepper-vertical[b-8wfj0of5nt] {
    flex-direction: column;
}

.stepper-step[b-8wfj0of5nt] {
    position: relative;
    display: flex;
    cursor: default;
}

.stepper-horizontal .stepper-step[b-8wfj0of5nt] {
    flex: 1 1 0;
    flex-direction: column;
    align-items: center;
    text-align: center;
}

.stepper-vertical .stepper-step[b-8wfj0of5nt] {
    flex-direction: row;
    align-items: stretch;
    min-height: calc(var(--stepper-size) * 2);
}

.stepper-vertical .stepper-step:last-child[b-8wfj0of5nt] {
    min-height: auto;
}

.stepper-step.clickable[b-8wfj0of5nt] {
    cursor: pointer;
}

.stepper-step.clickable:hover .stepper-circle[b-8wfj0of5nt] {
    box-shadow: 0 0 0 4px rgba(0, 0, 0, 0.1);
}

.stepper-indicator[b-8wfj0of5nt] {
    display: flex;
    flex-direction: column;
    align-items: center;
    flex-shrink: 0;
}

.stepper-circle[b-8wfj0of5nt] {
    width: var(--stepper-size);
    height: var(--stepper-size);
    border-radius: 50%;
    border: var(--stepper-line) solid var(--step-color);
    background-color: var(--step-color);
    color: var(--step-icon-color);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: calc(var(--stepper-size) * 0.45);
    position: relative;
    z-index: 1;
    transition: box-shadow 0.15s ease-in-out, background-color 0.2s ease-in-out var(--step-delay, 0ms), color 0.2s ease-in-out var(--step-delay, 0ms), opacity 0.2s ease-in-out var(--step-delay, 0ms);
}

.stepper-step.pending .stepper-circle[b-8wfj0of5nt] {
    background-color: transparent;
    color: var(--step-color);
    opacity: 0.6;
}

.stepper-step.active .stepper-circle[b-8wfj0of5nt] {
    box-shadow: 0 0 0 4px color-mix(in srgb, var(--step-color) 35%, transparent);
}

.stepper-connector[b-8wfj0of5nt] {
    background-color: var(--stepper-line-color);
    overflow: hidden;
    border-radius: var(--stepper-line);
}

.stepper-connector-fill[b-8wfj0of5nt] {
    background-color: var(--bs-primary, #0d6efd);
    transition-property: width, height;
    transition-duration: 250ms;
    transition-timing-function: linear;
}

.stepper-connector-h .stepper-connector-fill[b-8wfj0of5nt] {
    height: 100%;
    width: 0;
}

.stepper-connector-v .stepper-connector-fill[b-8wfj0of5nt] {
    width: 100%;
    height: 0;
}

.stepper-connector-h.completed .stepper-connector-fill[b-8wfj0of5nt] {
    width: 100%;
}

.stepper-connector-v.completed .stepper-connector-fill[b-8wfj0of5nt] {
    height: 100%;
}

.stepper-connector-h[b-8wfj0of5nt] {
    position: absolute;
    height: var(--stepper-line);
    top: calc(var(--stepper-size) / 2 - var(--stepper-line) / 2);
    left: calc(-50% + var(--stepper-size) / 2 + var(--stepper-gap));
    right: calc(50% + var(--stepper-size) / 2 + var(--stepper-gap));
}

.stepper-connector-v[b-8wfj0of5nt] {
    flex: 1 1 auto;
    width: var(--stepper-line);
    margin: var(--stepper-gap) 0;
    min-height: 1rem;
}

.stepper-label[b-8wfj0of5nt] {
    font-size: 0.875rem;
}

.stepper-horizontal .stepper-label[b-8wfj0of5nt] {
    margin-top: 0.5rem;
    padding: 0 0.25rem;
}

.stepper-vertical .stepper-label[b-8wfj0of5nt] {
    margin-left: 0.75rem;
    padding-top: calc(var(--stepper-size) / 2 - 0.65em);
}

.stepper-step.active .stepper-label[b-8wfj0of5nt] {
    font-weight: 600;
}

.stepper-step.pending .stepper-label[b-8wfj0of5nt] {
    opacity: 0.7;
}
/* /Components/Components/StoreEnvironmentBanner.razor.rz.scp.css */
.store-env-banner[b-pfmzgm1197] {
    display: flex;
    align-items: center;
    margin-bottom: 1.25rem;
    padding: 0.6rem 1rem;
    border-radius: 0.5rem;
    background-color: #fff3cd;
    border: 1px solid #ffc107;
    color: #664d03;
    font-size: 0.9rem;
}
/* /Components/Components/TrackingInfoGroup.razor.rz.scp.css */
.tracking-info-container[b-crpufvve9r] {
    display: flex;
    gap: 2rem;
    padding: 0.5rem 0;
    flex-wrap: wrap;
}

.tracking-section[b-crpufvve9r] {
    flex: 1;
    min-width: 250px;
}

.tracking-label[b-crpufvve9r] {
    font-weight: 600;
    font-size: 0.875rem;
    color: var(--bs-body-color);
    opacity: 0.85;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    margin-bottom: 0.5rem;
}

.tracking-details[b-crpufvve9r] {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
}

.tracking-user[b-crpufvve9r] {
    font-weight: 500;
    font-size: 0.9375rem;
    color: var(--bs-body-color);
    margin-bottom: 0.25rem;
}

.tracking-time[b-crpufvve9r] {
    display: flex;
    align-items: baseline;
    font-size: 0.8125rem;
}

.time-label[b-crpufvve9r] {
    font-weight: 500;
    color: var(--bs-body-color);
    opacity: 0.7;
    min-width: 45px;
    margin-right: 0.5rem;
}

.time-value[b-crpufvve9r] {
    color: var(--bs-body-color);
}

.tracking-divider[b-crpufvve9r] {
    width: 1px;
    background-color: var(--bs-border-color);
    margin: 0 0.5rem;
}

@media (max-width: 767px) {
    .tracking-info-container[b-crpufvve9r] {
        flex-direction: column;
        gap: 1.5rem;
    }

    .tracking-divider[b-crpufvve9r] {
        display: none;
    }

    .tracking-section[b-crpufvve9r] {
        min-width: 100%;
    }
}
/* /Components/Dashboard/AuthenticatedDashboard.razor.rz.scp.css */
.authenticated-dashboard[b-zlehkywtnn] {
    padding: 2rem;
}

.dashboard-header[b-zlehkywtnn] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 2rem;
}

.dashboard-greeting h2[b-zlehkywtnn] {
    font-size: 2rem;
    font-weight: 600;
    margin-bottom: 0.25rem;
}

.dashboard-greeting p[b-zlehkywtnn] {
    color: var(--bs-secondary-color);
    margin: 0;
}

.dashboard-header-actions[b-zlehkywtnn] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.dashboard-edit-hint[b-zlehkywtnn] {
    display: flex;
    align-items: center;
    background: var(--bs-tertiary-bg);
    color: var(--bs-body-color);
    border: 1px dashed var(--bs-border-color);
    border-radius: 0.5rem;
    padding: 0.75rem 1rem;
    margin-bottom: 1.5rem;
}

.authenticated-dashboard[b-zlehkywtnn]  .dashboard-widget-container {
    min-width: 0;
}

.dashboard-widget[b-zlehkywtnn] {
    min-width: 0;
    background: var(--bs-body-bg);
    border: 1px solid var(--bs-border-color);
    border-radius: 0.5rem;
    height: 100%;
    display: flex;
    flex-direction: column;
    position: relative;
}

.dashboard-widget.edit-mode[b-zlehkywtnn] {
    border-style: dashed;
    border-color: var(--bs-primary);
}

.dashboard-widget.edit-mode .widget-header[b-zlehkywtnn] {
    cursor: move;
    background: var(--bs-tertiary-bg);
    color: var(--bs-body-color);
    border-bottom: 1px solid var(--bs-border-color);
    border-top-left-radius: 0.5rem;
    border-top-right-radius: 0.5rem;
}

.dashboard-widget.edit-mode .widget-body[b-zlehkywtnn] {
    pointer-events: none;
    opacity: 0.6;
}

.dashboard-widget.dragging[b-zlehkywtnn] {
    opacity: 0.4;
}

/* Half-widget drop zones, only active while a drag is in progress */
.widget-drop-zone[b-zlehkywtnn] {
    position: absolute;
    pointer-events: none;
    z-index: 3;
}

.dragging-active .widget-drop-zone[b-zlehkywtnn] {
    pointer-events: auto;
}

.dashboard-widget.dragging .widget-drop-zone[b-zlehkywtnn] {
    pointer-events: none;
}

.zone-start-h[b-zlehkywtnn],
.zone-end-h[b-zlehkywtnn] {
    top: -0.75rem;
    bottom: -0.75rem;
    width: calc(50% + 0.75rem);
}

.zone-start-h[b-zlehkywtnn] {
    left: -0.75rem;
}

.zone-end-h[b-zlehkywtnn] {
    right: -0.75rem;
}

.zone-start-v[b-zlehkywtnn],
.zone-end-v[b-zlehkywtnn] {
    left: -0.75rem;
    right: -0.75rem;
    height: calc(50% + 0.75rem);
}

.zone-start-v[b-zlehkywtnn] {
    top: -0.75rem;
}

.zone-end-v[b-zlehkywtnn] {
    bottom: -0.75rem;
}

/* Drop indicator line showing where the dragged widget will be placed */
.dashboard-widget.drop-left[b-zlehkywtnn]::after,
.dashboard-widget.drop-right[b-zlehkywtnn]::after,
.dashboard-widget.drop-top[b-zlehkywtnn]::after,
.dashboard-widget.drop-bottom[b-zlehkywtnn]::after {
    content: "";
    position: absolute;
    background: var(--bs-primary);
    border-radius: 2px;
    box-shadow: 0 0 0 1px var(--bs-body-bg);
    pointer-events: none;
    z-index: 2;
}

.dashboard-widget.drop-left[b-zlehkywtnn]::after,
.dashboard-widget.drop-right[b-zlehkywtnn]::after {
    top: -0.25rem;
    bottom: -0.25rem;
    width: 4px;
}

.dashboard-widget.drop-left[b-zlehkywtnn]::after {
    left: -0.75rem;
}

.dashboard-widget.drop-right[b-zlehkywtnn]::after {
    right: -0.75rem;
}

.dashboard-widget.drop-top[b-zlehkywtnn]::after,
.dashboard-widget.drop-bottom[b-zlehkywtnn]::after {
    left: -0.25rem;
    right: -0.25rem;
    height: 4px;
}

.dashboard-widget.drop-top[b-zlehkywtnn]::after {
    top: -0.75rem;
}

.dashboard-widget.drop-bottom[b-zlehkywtnn]::after {
    bottom: -0.75rem;
}

.widget-drag-handle[b-zlehkywtnn] {
    color: var(--bs-body-color);
    opacity: 0.6;
}

.widget-size-label[b-zlehkywtnn] {
    font-size: 0.75rem;
    font-weight: 400;
    color: var(--bs-secondary-color);
    margin-right: 0.25rem;
    white-space: nowrap;
}

.widget-close-button[b-zlehkywtnn] {
    color: var(--bs-danger);
}

.widget-header[b-zlehkywtnn] {
    padding: 1rem;
    font-weight: 600;
    font-size: 1.1rem;
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.widget-header-title[b-zlehkywtnn] {
    display: flex;
    align-items: center;
}

.widget-body[b-zlehkywtnn] {
    padding: 1rem;
    flex: 1;
    overflow: auto;
}

.widget-header-actions[b-zlehkywtnn] {
    display: flex;
    align-items: center;
    gap: 0.25rem;
}

/* Widget refresh button styles */
.widget-refresh-button[b-zlehkywtnn] {
    opacity: 0.5;
    transition: opacity 0.2s ease, transform 0.2s ease;
    flex-shrink: 0;
    margin-left: 0.5rem;
}

.widget-refresh-button:hover[b-zlehkywtnn] {
    opacity: 1;
}

.widget-refresh-button:active[b-zlehkywtnn] {
    transform: rotate(180deg);
}

/* Skeleton placeholders shown while the screen size / user layout is resolving */
.dashboard-skeleton[b-zlehkywtnn] {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(320px, 1fr));
    gap: 1.5rem;
}

.dashboard-skeleton-card[b-zlehkywtnn] {
    background: var(--bs-body-bg);
    border: 1px solid var(--bs-border-color);
    border-radius: 0.5rem;
    padding: 1rem;
    min-height: 180px;
    display: flex;
    flex-direction: column;
}

.skeleton-header[b-zlehkywtnn] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin-bottom: 1.25rem;
}

.skeleton-icon[b-zlehkywtnn] {
    width: 1.25rem;
    height: 1.25rem;
    border-radius: 0.25rem;
}

.skeleton-title[b-zlehkywtnn] {
    width: 40%;
    height: 1.1rem;
    border-radius: 0.25rem;
}

.skeleton-body[b-zlehkywtnn] {
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
    flex: 1;
}

.skeleton-line[b-zlehkywtnn] {
    width: 100%;
    height: 0.9rem;
    border-radius: 0.25rem;
}

.skeleton-line.short[b-zlehkywtnn] {
    width: 60%;
}
/* /Components/Dashboard/UnauthenticatedWelcome.razor.rz.scp.css */
[b-a5u3301iqe] .merc-content {
    padding: 0 !important;
}

.unauthenticated-welcome[b-a5u3301iqe] {
    padding: 3rem 1.5rem;
}

.welcome-container[b-a5u3301iqe] {
    max-width: 1200px;
    width: 100%;
    margin: 0 auto;
}

.welcome-hero[b-a5u3301iqe] {
    text-align: center;
    margin-bottom: 3rem;
}

.welcome-icon[b-a5u3301iqe] {
    font-size: 4rem;
    color: #b794f6;
    margin-bottom: 1rem;
    filter: drop-shadow(0 2px 4px rgba(0, 0, 0, 0.1));
}

.welcome-heading[b-a5u3301iqe] {
    font-size: 2.5rem;
    font-weight: 700;
    margin-bottom: 0.75rem;
    color: var(--bs-body-color);
}

.welcome-subheading[b-a5u3301iqe] {
    font-size: 1.25rem;
    color: var(--bs-body-color);
    margin-bottom: 1rem;
}

.welcome-description[b-a5u3301iqe] {
    font-size: 1rem;
    color: var(--bs-body-color);
    opacity: 0.9;
    max-width: 600px;
    margin: 0 auto 1.5rem;
    line-height: 1.6;
}

.welcome-cta[b-a5u3301iqe] {
    font-size: 1rem;
    padding: 0.75rem 2rem;
}

.welcome-features[b-a5u3301iqe] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
    gap: 1.5rem;
}

.feature-card[b-a5u3301iqe] {
    background: var(--bs-body-bg);
    border: 1px solid var(--bs-border-color);
    border-radius: 0.75rem;
    padding: 1.5rem;
    text-align: center;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
    transition: transform 0.3s ease, box-shadow 0.3s ease, border-color 0.3s ease;
    text-decoration: none;
    color: inherit;
    display: block;
}

.feature-card:hover[b-a5u3301iqe] {
    transform: translateY(-5px);
    box-shadow: 0 4px 16px rgba(0, 0, 0, 0.12);
    border-color: rgba(183, 148, 246, 0.5);
    opacity: 0.85;
}

.feature-icon[b-a5u3301iqe] {
    font-size: 2.5rem;
    color: #b794f6;
    margin-bottom: 0.75rem;
    filter: drop-shadow(0 2px 4px rgba(0, 0, 0, 0.1));
}

.feature-card h3[b-a5u3301iqe] {
    font-size: 1.2rem;
    font-weight: 600;
    margin-bottom: 0.75rem;
    color: var(--bs-body-color);
}

.feature-card p[b-a5u3301iqe] {
    color: var(--bs-body-color);
    opacity: 0.85;
    margin: 0;
    line-height: 1.5;
    font-size: 0.95rem;
}

/* Responsive adjustments */
@media (max-width: 768px) {
    .unauthenticated-welcome[b-a5u3301iqe] {
        padding: 2rem 1rem;
    }

    .welcome-hero[b-a5u3301iqe] {
        margin-bottom: 2rem;
    }

    .welcome-icon[b-a5u3301iqe] {
        font-size: 3rem;
    }

    .welcome-heading[b-a5u3301iqe] {
        font-size: 2rem;
    }

    .welcome-subheading[b-a5u3301iqe] {
        font-size: 1.1rem;
    }

    .welcome-features[b-a5u3301iqe] {
        grid-template-columns: 1fr;
        gap: 1rem;
    }

    .feature-card[b-a5u3301iqe] {
        padding: 1.25rem;
    }
}
/* /Components/Dashboard/Widgets/QuickActionWidget.razor.rz.scp.css */
.quick-actions[b-ww6h1l9c9m] {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(120px, 1fr));
    gap: 1rem;
}

.quick-action-card[b-ww6h1l9c9m] {
    position: relative;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 1.5rem;
    border: 1px solid var(--bs-border-color);
    border-radius: 0.5rem;
    text-decoration: none;
    color: var(--bs-body-color);
    transition: all 0.3s ease;
}

    .quick-action-card:hover[b-ww6h1l9c9m] {
        background: var(--bs-primary-bg-subtle);
        border-color: var(--bs-primary);
        color: var(--bs-primary-text-emphasis);
        transform: translateY(-2px);
    }

    .quick-action-card i[b-ww6h1l9c9m] {
        font-size: 2rem;
        margin-bottom: 0.5rem;
    }

.quick-action-card[draggable="true"][b-ww6h1l9c9m] {
    cursor: grab;
}

.quick-action-card.dragging[b-ww6h1l9c9m] {
    opacity: 0.4;
}

.quick-action-card.drop-before[b-ww6h1l9c9m]::before,
.quick-action-card.drop-after[b-ww6h1l9c9m]::after {
    content: '';
    position: absolute;
    top: 0;
    bottom: 0;
    width: 3px;
    background: var(--bs-primary);
    border-radius: 2px;
}

.quick-action-card.drop-before[b-ww6h1l9c9m]::before {
    left: calc(-0.5rem - 1px);
    transform: translateX(-50%);
}

.quick-action-card.drop-after[b-ww6h1l9c9m]::after {
    right: calc(-0.5rem - 1px);
    transform: translateX(50%);
}

.is-dragging .quick-action-card:not(.quick-action-remove-zone):hover[b-ww6h1l9c9m] {
    background: transparent;
    border-color: var(--bs-border-color);
    color: var(--bs-body-color);
    transform: none;
}

.is-dragging .quick-action-card > *[b-ww6h1l9c9m] {
    pointer-events: none;
}

.quick-action-remove-zone[b-ww6h1l9c9m] {
    border-style: dashed !important;
    border-color: var(--bs-danger) !important;
    color: var(--bs-danger);
    opacity: 0.7;
}

    .quick-action-remove-zone > *[b-ww6h1l9c9m] {
        pointer-events: none;
    }

    .quick-action-remove-zone.drag-over[b-ww6h1l9c9m] {
        opacity: 1;
        background: var(--bs-danger-bg-subtle);
        transform: scale(1.05);
    }
/* /Components/Editors/CommentManager.razor.rz.scp.css */
.threaded-comments-container[b-ar656gt2ed] {
    padding-top: 1.0rem;
    width: 100%;
}

.comments-header[b-ar656gt2ed] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    border-bottom: 1px solid var(--bs-border-color);
    padding-bottom: 0.75rem;
}

.comments-list[b-ar656gt2ed] {
    margin-top: 1rem;
}

.add-comment-placeholder[b-ar656gt2ed] {
    cursor: pointer;
    transition: opacity 0.2s ease-in-out;
}

.add-comment-placeholder:hover[b-ar656gt2ed] {
    opacity: 0.8;
}

.comment-placeholder-content[b-ar656gt2ed] {
    background-color: var(--bs-body-bg);
    border: 1px solid var(--bs-border-color);
    border-radius: 0.5rem;
    padding: 0.75rem 1rem;
    color: var(--bs-secondary-color);
    transition: border-color 0.2s ease-in-out;
}

.add-comment-placeholder:hover .comment-placeholder-content[b-ar656gt2ed] {
    border-color: var(--bs-primary);
}

.new-comment-editor[b-ar656gt2ed] {
    margin-bottom: 1rem;
}

[b-ar656gt2ed] .comment-thread {
    margin-bottom: 1rem;
    display: grid !important;
    grid-template-columns: 50px 1fr !important;
    grid-template-rows: auto !important;
    gap: 0.75rem;
    align-items: start;
}

[b-ar656gt2ed] .comment-reply {
    margin-top: 0.75rem;
    margin-bottom: 0;
}

[b-ar656gt2ed] .comment-avatar-column {
    grid-column: 1;
    grid-row: 1;
    display: flex;
    justify-content: center;
    padding-top: 0.25rem;
}

[b-ar656gt2ed] .comment-avatar-column img {
    width: 40px;
    height: 40px;
    border-radius: 50%;
    object-fit: cover;
    display: block;
}

[b-ar656gt2ed] .comment-content-column {
    grid-column: 2;
    grid-row: 1;
    min-width: 0;
}

[b-ar656gt2ed] .comment-content {
    background-color: var(--bs-body-bg);
    border: 1px solid var(--bs-border-color);
    border-radius: 0.5rem;
    padding: 0.75rem 1rem;
}

[b-ar656gt2ed] .comment-header {
    display: flex;
    flex-direction: column;
    gap: 0.125rem;
}

[b-ar656gt2ed] .comment-author {
    font-weight: 700 !important;
    font-size: 1.125rem !important;
    line-height: 1.4;
    color: var(--bs-body-color) !important;
}

[b-ar656gt2ed] .comment-metadata {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

[b-ar656gt2ed] .comment-date {
    font-size: 0.8125rem !important;
    color: var(--bs-secondary-color) !important;
    opacity: 0.85;
}

[b-ar656gt2ed] .comment-edited {
    font-size: 0.75rem !important;
    color: var(--bs-secondary-color) !important;
    font-style: italic;
    opacity: 0.75;
}

[b-ar656gt2ed] .comment-text {
    color: var(--bs-body-color);
    line-height: 1.5;
}

[b-ar656gt2ed] .comment-text .dx-mention {
    background-color: var(--bs-primary);
    color: var(--bs-white);
    padding: 2px 6px;
    border-radius: 4px;
    font-weight: 600;
}

[b-ar656gt2ed] .comment-editor {
    width: 100%;
}

[b-ar656gt2ed] .comment-actions {
    display: flex;
    gap: 0.5rem;
    flex-wrap: wrap;
}

[b-ar656gt2ed] .comment-action-link {
    font-size: 0.875rem;
    text-decoration: none;
    color: var(--bs-link-color);
    display: inline-flex;
    align-items: center;
    gap: 0.25rem;
    transition: color 0.15s ease-in-out;
}

[b-ar656gt2ed] .comment-action-link:hover {
    color: var(--bs-link-hover-color);
}

[b-ar656gt2ed] .comment-action-link.text-danger:hover {
    color: var(--bs-danger) !important;
}

[b-ar656gt2ed] .comment-replies {
    margin-top: 0.75rem;
}

@media (max-width: 768px) {
    [b-ar656gt2ed] .comment-thread {
        grid-template-columns: 40px 1fr !important;
    }

    [b-ar656gt2ed] .comment-avatar-column img {
        width: 32px;
        height: 32px;
    }

    [b-ar656gt2ed] .comment-author {
        font-size: 1rem !important;
    }

    [b-ar656gt2ed] .comment-date {
        font-size: 0.75rem !important;
    }
}

/* Mention highlight */
[b-ar656gt2ed] .comment-highlight {
    animation: comment-highlight-fade-b-ar656gt2ed 3s ease-out;
    border-radius: 8px;
}

@keyframes comment-highlight-fade-b-ar656gt2ed {
    0%   { background-color: rgba(0, 120, 212, 0.15); }
    70%  { background-color: rgba(0, 120, 212, 0.15); }
    100% { background-color: transparent; }
}
/* /Components/Editors/DiffEditor.razor.rz.scp.css */
.diff-editor-container[b-mmevrl46gm] {
    border: 1px solid var(--bs-border-color);
    border-radius: 4px;
    overflow: hidden;
    background-color: var(--bs-body-bg);
    display: flex;
    flex-direction: column;
}

/* Must use ::deep — this div is rendered by BlazorMonaco, not this component */
.diff-editor-container[b-mmevrl46gm]  .monaco-editor-container {
    width: 100%;
    height: 100% !important;
    flex: 1;
    min-height: 0;
}

.diff-editor-container[b-mmevrl46gm]  .monaco-editor {
    height: 100% !important;
}

.diff-editor-container[b-mmevrl46gm]  .monaco-diff-editor {
    height: 100% !important;
}
/* /Components/Editors/DocumentDetailsPopup.razor.rz.scp.css */
.document-details-container[b-zzk54yenrs] {
    padding: 20px;
}

.document-header[b-zzk54yenrs] {
    display: flex;
    align-items: center;
    gap: 20px;
    padding-bottom: 20px;
    border-bottom: 1px solid #dee2e6;
}

.document-icon-large[b-zzk54yenrs] {
    font-size: 64px;
    color: #6c757d;
}

    .document-icon-large .fa-file-pdf[b-zzk54yenrs] {
        color: #dc3545;
    }

    .document-icon-large .fa-file-word[b-zzk54yenrs] {
        color: #0d6efd;
    }

    .document-icon-large .fa-file-excel[b-zzk54yenrs] {
        color: #198754;
    }

    .document-icon-large .fa-file-powerpoint[b-zzk54yenrs] {
        color: #fd7e14;
    }

    .document-icon-large .fa-file-image[b-zzk54yenrs] {
        color: #6f42c1;
    }

    .document-icon-large .fa-file-zipper[b-zzk54yenrs] {
        color: #ffc107;
    }

.document-header-info h5[b-zzk54yenrs] {
    margin: 0;
    font-weight: 600;
}

.document-actions-section[b-zzk54yenrs] {
    padding-top: 20px;
    border-top: 1px solid #dee2e6;
}

.version-history-section[b-zzk54yenrs] {
    padding-top: 20px;
    border-top: 1px solid #dee2e6;
}

    .version-history-section h6[b-zzk54yenrs] {
        font-weight: 600;
        margin-bottom: 10px;
    }

[b-zzk54yenrs] .document-details-zone-hover {
    border: 1.5px dashed rgba(125,22,225,1) !important;
}

[b-zzk54yenrs] #documentDetailsDropZone::after {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: rgba(123, 22, 224, 0.25);
    z-index: 9999;
    pointer-events: none;
    opacity: 0;
    transition: opacity 0.1s ease;
}

/* Show overlay with full pointer-events when drag is active */
[b-zzk54yenrs] #documentDetailsDropZone.document-details-zone-hover::after {
    opacity: 1;
    pointer-events: all;
}
/* /Components/Editors/DocumentManager.razor.rz.scp.css */
.upload-validation-text[b-oio03rjcx4] {
    flex-direction: column;
    align-items: flex-end;
    font-size: 12px;
}

.empty-state[b-oio03rjcx4] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 60px 40px;
    color: #6c757d;
    text-align: center;
}

    .empty-state i[b-oio03rjcx4] {
        color: #adb5bd;
    }

.empty-state[b-oio03rjcx4] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 60px 40px;
    color: #6c757d;
    text-align: center;
}

[b-oio03rjcx4] .document-row {
    cursor: pointer !important;
}

    [b-oio03rjcx4] .document-row:hover {
        background-color: rgba(var(--bs-body-color-rgb), 0.05) !important;
    }

        [b-oio03rjcx4] .document-row:hover > td {
            background-color: transparent !important;
        }

    /* Target the actual row cells to ensure cursor applies everywhere */
    [b-oio03rjcx4] .document-row > td {
        cursor: pointer !important;
    }

/* Also target DevExpress specific grid row classes */
[b-oio03rjcx4] .document-grid .dxbs-grid-table tbody tr {
    cursor: pointer !important;
}

.document-icon[b-oio03rjcx4] {
    font-size: 28px;
    color: #6c757d;
    text-align: center;
    display: flex;
    align-items: center;
    justify-content: center;
    height: 100%;
}

    .document-icon .fa-file-pdf[b-oio03rjcx4] {
        color: #dc3545;
    }

    .document-icon .fa-file-word[b-oio03rjcx4] {
        color: #0d6efd;
    }

    .document-icon .fa-file-excel[b-oio03rjcx4] {
        color: #198754;
    }

    .document-icon .fa-file-powerpoint[b-oio03rjcx4] {
        color: #fd7e14;
    }

    .document-icon .fa-file-image[b-oio03rjcx4] {
        color: #6f42c1;
    }

    .document-icon .fa-file-zipper[b-oio03rjcx4] {
        color: #ffc107;
    }

.document-name-cell[b-oio03rjcx4] {
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.document-name[b-oio03rjcx4] {
    font-weight: 600;
    font-size: 14px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.document-filename[b-oio03rjcx4] {
    font-size: 12px;
    font-style: italic;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.document-actions[b-oio03rjcx4] {
    display: flex;
    gap: 8px;
    align-items: center;
    justify-content: center;
    font-size: 18px;
}

    .document-actions a[b-oio03rjcx4] {
        cursor: pointer;
        transition: opacity 0.2s;
    }

        .document-actions a:hover[b-oio03rjcx4] {
            opacity: 0.7;
        }

.hidden-file-input[b-oio03rjcx4] {
    display: none;
}

.badge[b-oio03rjcx4] {
    font-size: 14px;
    padding: 4px 8px;
}

[b-oio03rjcx4] .custom-drop-zone-hover {
    border: 1.5px dashed rgba(125,22,225,1) !important;
}

[b-oio03rjcx4] #overviewDemoDropZone::after {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: rgba(123, 22, 224, 0.25);
    z-index: 9999;
    pointer-events: none;
    opacity: 0;
    transition: opacity 0.1s ease;
}

/* Show overlay with full pointer-events when drag is active */
[b-oio03rjcx4] #overviewDemoDropZone.custom-drop-zone-hover::after {
    opacity: 1;
    pointer-events: all;
}
/* /Components/Editors/FileInput.razor.rz.scp.css */
#dropzone-external[b-0502ptwxo8] {
    height: 350px;
    background-color: rgba(183, 183, 183, 0.1);
    border-width: 2px;
    border-style: dashed;
    padding: 10px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
}

    #dropzone-external > *[b-0502ptwxo8] {
        pointer-events: none;
    }

    #dropzone-external.dropzone-hover[b-0502ptwxo8] {
        border-style: solid;
    }

#dropzone-image[b-0502ptwxo8] {
    max-width: 100%;
    max-height: 100%;
}

#dropzone-text > span[b-0502ptwxo8] {
    font-weight: 100;
    opacity: 0.5;
}

.upload-progress[b-0502ptwxo8] {
    display: flex;
    margin-top: 10px;
}

.image-input-flex-box[b-0502ptwxo8] {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
}
/* /Components/Editors/GlobalSearchBox.razor.rz.scp.css */
.merc-global-search[b-xombm401pb] {
    position: relative;
    width: 100%;
    max-width: 700px;
}

.merc-global-search[b-xombm401pb]  .global-search-input {
    width: 100%;
}

.search-results-dropdown[b-xombm401pb] {
    position: absolute;
    top: calc(100% + 0.5rem);
    left: 50%;
    transform: translateX(-50%);
    width: 700px;
    max-width: 90vw;
    background: var(--bs-body-bg);
    border: 1px solid var(--bs-border-color);
    border-radius: 0.375rem;
    box-shadow: 0 0.5rem 1.5rem rgba(0, 0, 0, 0.25);
    max-height: 600px;
    overflow: hidden;
    z-index: 1060;
    display: flex;
    flex-direction: column;
}

.search-results-container[b-xombm401pb] {
    overflow-y: auto;
    flex: 1;
}

.search-loading[b-xombm401pb] {
    padding: 1.5rem;
    text-align: center;
    color: var(--bs-secondary);
}

.search-group[b-xombm401pb] {
    border-bottom: 1px solid var(--bs-border-color);
}

.search-group:last-child[b-xombm401pb] {
    border-bottom: none;
}

.search-group-header[b-xombm401pb] {
    padding: 0.625rem 1rem;
    background-color: var(--bs-tertiary-bg);
    font-weight: 600;
    font-size: 0.8125rem;
    color: var(--bs-emphasis-color);
    text-transform: uppercase;
    letter-spacing: 0.025em;
    display: flex;
    justify-content: space-between;
    align-items: center;
    position: sticky;
    top: 0;
    z-index: 1;
}

.search-group-count[b-xombm401pb] {
    font-weight: 400;
    color: var(--bs-secondary);
    font-size: 0.75rem;
}

.search-group-items[b-xombm401pb] {
    display: flex;
    flex-direction: column;
}

.search-result-item[b-xombm401pb] {
    padding: 0.875rem 1rem;
    color: var(--bs-body-color);
    text-decoration: none;
    border-bottom: 1px solid var(--bs-border-color-translucent);
    transition: all 0.15s ease-in-out;
    cursor: pointer;
    display: block;
    position: relative;
}

.search-result-item:last-child[b-xombm401pb] {
    border-bottom: none;
}

.search-result-item:hover[b-xombm401pb],
.search-result-item:focus[b-xombm401pb],
.search-result-item.selected[b-xombm401pb] {
    background-color: var(--bs-primary-bg-subtle);
    color: var(--bs-body-color);
    outline: none;
}

.search-result-item.selected[b-xombm401pb]::before {
    content: '';
    position: absolute;
    left: 0;
    top: 0;
    bottom: 0;
    width: 3px;
    background-color: var(--bs-primary);
}

.search-result-content[b-xombm401pb] {
    display: -webkit-box;
    -webkit-line-clamp: 5;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
    line-height: 1.5;
}

.search-result-item[b-xombm401pb]  mark {
    background-color: var(--bs-warning);
    color: var(--bs-dark);
    padding: 0.125rem 0.25rem;
    border-radius: 0.125rem;
    font-weight: 600;
}

/* Dark mode specific improvements */
@media (prefers-color-scheme: dark) {
    .search-result-item[b-xombm401pb]  mark {
        background-color: #ffc107;
        color: #000;
    }

    .search-result-item:hover[b-xombm401pb],
    .search-result-item:focus[b-xombm401pb],
    .search-result-item.selected[b-xombm401pb] {
        background-color: rgba(var(--bs-primary-rgb), 0.15);
    }
}

/* Light mode specific */
@media (prefers-color-scheme: light) {
    .search-result-item[b-xombm401pb]  mark {
        background-color: #fff59d;
        color: #000;
    }
}

.search-footer[b-xombm401pb] {
    padding: 0.75rem 1rem;
    text-align: center;
    background-color: var(--bs-tertiary-bg);
    color: var(--bs-primary-emphasis);
    border-top: 1px solid var(--bs-border-color);
    flex-shrink: 0;
}

.search-view-all[b-xombm401pb] {
    color: var(--bs-primary);
    text-decoration: none;
    font-weight: 600;
    display: inline-flex;
    align-items: center;
    transition: color 0.15s ease-in-out;
}

.search-view-all:hover[b-xombm401pb] {
    color: var(--bs-primary-emphasis);
    text-decoration: underline;
}

.search-no-results[b-xombm401pb] {
    padding: 1.5rem 1rem;
    text-align: center;
    display: flex;
    align-items: center;
    justify-content: center;
}
/* /Components/Editors/HtmlContentEditor.razor.rz.scp.css */
.html-content-editor[b-i1gsf7mr8z] {
    /*border: 1px solid var(--bs-border-color);
    border-radius: 4px;*/
    padding: 0px;
}

/*    .html-content-editor.editing {
        border-color: var(--bs-primary);
        background-color: var(--bs-light);
    }
*/
.html-content-display[b-i1gsf7mr8z] {
    min-height: 36px;
    cursor: pointer;
    transition: background-color 0.2s;
}

/*    .html-content-display:hover {
        background-color: var(--bs-gray-100);
    }
*/
.html-content-editor.viewing .html-content-display[b-i1gsf7mr8z] {
    padding: 0px;
}

.editor-actions[b-i1gsf7mr8z] {
    display: flex;
    gap: 8px;
}

[b-i1gsf7mr8z] .html-content-display .dx-mention {
    /* Custom styling for mentions in display mode */
    background-color: var(--bs-primary);
    color: var(--bs-white);
    padding: 2px 6px;
    border-radius: 4px;
    font-weight: 600;
    border: 1px solid rgba(var(--bs-primary-rgb), 0.3);
}
/* /Components/Editors/LabelDesignerChatPanel.razor.rz.scp.css */
/* ── Shared base ─────────────────────────────────────── */
.chat-panel[b-kw875psvj9] {
    width: 420px;
    background: var(--bs-body-bg);
    border-left: 1px solid var(--bs-border-color);
    display: flex;
    flex-direction: column;
}

/* ── Floating / unpinned ─────────────────────────────── */
.chat-panel:not(.pinned)[b-kw875psvj9] {
    position: fixed;
    top: 0;
    bottom: 0;
    right: -420px;
    z-index: 1050;
    box-shadow: -4px 0 12px rgba(0, 0, 0, 0.15);
    transition: right 0.3s ease;
}
.chat-panel:not(.pinned).open[b-kw875psvj9] {
    right: 0;
}

/* ── Pinned: fixed to viewport, completely escapes parent padding ── */
.chat-panel.pinned[b-kw875psvj9] {
    position: fixed;
    top: var(--merc-header-height, 60px);
    right: 0;
    bottom: 0;
    height: auto;
    flex-shrink: 0;
    display: none;
    z-index: 90;
    box-shadow: -2px 0 8px rgba(0, 0, 0, 0.12);
    transition: none;
}
.chat-panel.pinned.open[b-kw875psvj9] {
    display: flex;
}

/* ── Header ──────────────────────────────────────────── */
.chat-panel-header[b-kw875psvj9] {
    display: flex;
    align-items: center;
    padding: 12px 16px;
    border-bottom: 1px solid var(--bs-border-color);
    font-weight: 600;
    font-size: 1rem;
    flex-shrink: 0;
    width: 100%;                            /* fill panel width */
    box-sizing: border-box;
}

/* ── Header icon buttons (pin / close) ───────────────── */
.chat-header-btn[b-kw875psvj9] {
    background: transparent;
    border: 0;
    padding: 0;
    color: var(--bs-body-color);
    opacity: 0.5;
    line-height: 1;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 24px;
    height: 24px;
    border-radius: 4px;
    transition: opacity 0.15s ease, background-color 0.15s ease;
}
.chat-header-btn:hover[b-kw875psvj9] {
    opacity: 1;
    background: var(--bs-secondary-bg);
}

/* ── Body wrapper (drop zone) ────────────────────────── */
.chat-panel-body[b-kw875psvj9] {
    flex: 1;
    display: flex;
    flex-direction: column;
    min-height: 0;
    position: relative;
    width: 100%;
    box-sizing: border-box;
}

/* ── Messages ────────────────────────────────────────── */
.chat-panel-messages[b-kw875psvj9] {
    flex: 1;
    overflow-y: auto;
    padding: 12px;
    display: flex;
    flex-direction: column;
    gap: 12px;
}
.chat-message[b-kw875psvj9] {
    display: flex;
    gap: 8px;
}
.chat-message-icon[b-kw875psvj9] {
    flex-shrink: 0;
    width: 28px;
    height: 28px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 0.85rem;
}
.chat-message.user .chat-message-icon[b-kw875psvj9] {
    background: var(--bs-primary-bg-subtle);
    color: var(--bs-primary);
}
.chat-message.assistant .chat-message-icon[b-kw875psvj9] {
    background: var(--bs-success-bg-subtle);
    color: var(--bs-success);
}
.chat-message-content[b-kw875psvj9] {
    flex: 1;
    min-width: 0;
}
.chat-message-text[b-kw875psvj9] {
    font-size: 0.9rem;
    line-height: 1.5;
    word-wrap: break-word;
}
.chat-actions[b-kw875psvj9] {
    margin-top: 8px;
    display: flex;
    gap: 6px;
}

/* ── Animated "Thinking..." indicator ────────────────── */
.chat-thinking[b-kw875psvj9]::after {
    content: '';
    display: inline-block;
    width: 1.2em;       /* reserve space so the line doesn't shift */
    text-align: left;
    animation: chat-thinking-dots-b-kw875psvj9 1.2s steps(4, end) infinite;
}
@keyframes chat-thinking-dots-b-kw875psvj9 {
    0%   { content: ''; }
    25%  { content: '.'; }
    50%  { content: '..'; }
    75%  { content: '...'; }
    100% { content: ''; }
}

/* ── Input area ──────────────────────────────────────── */
.chat-panel-input[b-kw875psvj9] {
    position: relative;
    padding: 16px 12px 12px;
    border-top: 1px solid var(--bs-border-color);
    display: flex;
    flex-direction: column;
    gap: 8px;
    align-items: stretch;
    flex-shrink: 0;
    width: 100%;                            /* fill panel width */
    box-sizing: border-box;
}
.chat-input-row[b-kw875psvj9] {
    display: flex;
    gap: 8px;
    align-items: stretch;
    flex: 1;
    min-height: 0;
}

/* ── Pending attachments strip ───────────────────────── */
.chat-attachments-strip[b-kw875psvj9] {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    flex-shrink: 0;
}
.chat-attachment-thumb[b-kw875psvj9] {
    position: relative;
    width: 56px;
    height: 56px;
    border-radius: 6px;
    overflow: hidden;
    border: 1px solid var(--bs-border-color);
    background: var(--bs-secondary-bg);
}
.chat-attachment-thumb img[b-kw875psvj9] {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}
.chat-attachment-remove[b-kw875psvj9] {
    position: absolute;
    top: 2px;
    right: 2px;
    width: 18px;
    height: 18px;
    border-radius: 50%;
    border: 0;
    background: rgba(0, 0, 0, 0.6);
    color: #fff;
    font-size: 10px;
    line-height: 1;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    padding: 0;
}
.chat-attachment-remove:hover[b-kw875psvj9] {
    background: rgba(0, 0, 0, 0.85);
}

/* ── Inline attachments on sent messages ─────────────── */
.chat-message-attachments[b-kw875psvj9] {
    margin-top: 6px;
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
}
.chat-message-attachments img[b-kw875psvj9] {
    max-width: 160px;
    max-height: 160px;
    border-radius: 6px;
    border: 1px solid var(--bs-border-color);
    object-fit: cover;
}

/* ── Drop overlay ────────────────────────────────────── */
.chat-drop-overlay[b-kw875psvj9] {
    position: absolute;
    inset: 0;
    display: none;
    align-items: center;
    justify-content: center;
    background: rgba(13, 110, 253, 0.08);
    border: 2px dashed var(--bs-primary);
    border-radius: 4px;
    pointer-events: none;
    z-index: 20;
}
.chat-drop-overlay-text[b-kw875psvj9] {
    text-align: center;
    color: var(--bs-primary);
    font-weight: 600;
    background: var(--bs-body-bg);
    padding: 12px 20px;
    border-radius: 8px;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
}
.chat-panel-body.chat-drop-zone-dragover .chat-drop-overlay[b-kw875psvj9] {
    display: flex;
}

/* ── Top-edge vertical resize handle ────────────────── */
.chat-input-resize-handle[b-kw875psvj9] {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 8px;
    cursor: ns-resize;
    background: linear-gradient(to bottom, transparent 0%, var(--bs-border-color) 50%, transparent 100%);
    opacity: 0.3;
    transition: opacity 0.2s ease;
    z-index: 10;
}
.chat-input-resize-handle:hover[b-kw875psvj9] {
    opacity: 0.7;
    background: linear-gradient(to bottom, transparent 0%, var(--bs-primary) 50%, transparent 100%);
}
.chat-input-resize-handle[b-kw875psvj9]::before {
    content: '';
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    width: 30px;
    height: 3px;
    background: var(--bs-border-color);
    border-radius: 2px;
}
.chat-input-resize-handle:hover[b-kw875psvj9]::before {
    background: var(--bs-primary);
}

/* ── Memo fills the resized input area ───────────────── */
.chat-input-memo[b-kw875psvj9] {
    flex: 1;
    min-width: 0;
}
.chat-panel-input[b-kw875psvj9]  textarea {
    width: 100%;
    resize: none;
    box-sizing: border-box;
}
.chat-send-btn[b-kw875psvj9] {
    flex-shrink: 0;
    align-self: flex-end;
}

/* ── Left-edge horizontal resize handle ──────────────── */
.chat-panel-resize-handle[b-kw875psvj9] {
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    width: 8px;
    cursor: ew-resize;
    background: linear-gradient(to right, transparent 0%, var(--bs-border-color) 50%, transparent 100%);
    opacity: 0.3;
    transition: opacity 0.2s ease;
    z-index: 10;
}
.chat-panel-resize-handle:hover[b-kw875psvj9] {
    opacity: 0.7;
    background: linear-gradient(to right, transparent 0%, var(--bs-primary) 50%, transparent 100%);
}
.chat-panel-resize-handle[b-kw875psvj9]::before {
    content: '';
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 3px;
    height: 30px;
    background: var(--bs-border-color);
    border-radius: 2px;
}
.chat-panel-resize-handle:hover[b-kw875psvj9]::before {
    background: var(--bs-primary);
}
/* /Components/Editors/PhotoManager.razor.rz.scp.css */
.photo-manager[b-9noy7u17p1] {
    width: 100%;
}

.photo-drop-zone[b-9noy7u17p1] {
    min-height: 200px;
    border: 2px dashed transparent;
    border-radius: 0.5rem;
    transition: all 0.3s ease;
}

.photo-drop-zone.drag-over[b-9noy7u17p1] {
    border-color: var(--bs-primary);
    background-color: rgba(var(--bs-primary-rgb), 0.05);
}

.empty-state[b-9noy7u17p1] {
    text-align: center;
    padding: 4rem 2rem;
    border: 2px dashed var(--bs-border-color);
    border-radius: 0.5rem;
    background-color: var(--bs-body-bg);
    color: var(--bs-body-color);
    transition: all 0.3s ease;
}

.photo-gallery[b-9noy7u17p1] {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(250px, 1fr));
    gap: 1.5rem;
    padding: 0.5rem;
}

.photo-card[b-9noy7u17p1] {
    background: var(--bs-body-bg);
    border: 1px solid var(--bs-border-color);
    border-radius: 0.5rem;
    box-shadow: 0 2px 8px rgba(0,0,0,0.1);
    overflow: hidden;
    transition: transform 0.2s ease, box-shadow 0.2s ease;
}

    .photo-card:hover[b-9noy7u17p1] {
        transform: translateY(-4px);
        box-shadow: 0 4px 16px rgba(0,0,0,0.2);
    }

.photo-card-image[b-9noy7u17p1] {
    position: relative;
    width: 100%;
    padding-top: 75%;
    background-color: var(--bs-secondary-bg);
    cursor: pointer;
    overflow: hidden;
}

    .photo-card-image img[b-9noy7u17p1] {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        object-fit: cover;
    }

.photo-card-overlay[b-9noy7u17p1] {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0,0,0,0.5);
    display: flex;
    align-items: center;
    justify-content: center;
    opacity: 0;
    transition: opacity 0.2s ease;
    color: white;
    font-size: 2rem;
}

.photo-card-image:hover .photo-card-overlay[b-9noy7u17p1] {
    opacity: 1;
}

.photo-card-content[b-9noy7u17p1] {
    padding: 1rem;
}

.photo-card-caption-container[b-9noy7u17p1] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin-bottom: 0.5rem;
}

.photo-card-caption[b-9noy7u17p1] {
    font-weight: 500;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    color: var(--bs-body-color);
    flex: 1;
    min-width: 0;
}

.caption-edit-icon[b-9noy7u17p1] {
    background: none;
    border: none;
    color: var(--bs-secondary-color);
    cursor: pointer;
    padding: 0.25rem;
    border-radius: 0.25rem;
    transition: color 0.2s ease, background-color 0.2s ease;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 0.875rem;
    flex-shrink: 0;
    line-height: 1;
}

    .caption-edit-icon:hover[b-9noy7u17p1] {
        color: var(--bs-primary);
        background-color: var(--bs-secondary-bg);
    }

    .caption-edit-icon:active[b-9noy7u17p1] {
        background-color: var(--bs-tertiary-bg);
    }

.photo-card-meta[b-9noy7u17p1] {
    display: flex;
    justify-content: space-between;
    gap: 0.5rem;
}

.photo-card-actions[b-9noy7u17p1] {
    display: flex;
    gap: 0.25rem;
    padding: 0.5rem;
    background-color: var(--bs-secondary-bg);
    border-top: 1px solid var(--bs-border-color);
}

.photo-carousel-container[b-9noy7u17p1] {
    display: flex;
    flex-direction: column;
    gap: 1.5rem;
    height: 100%;
}

.carousel-main[b-9noy7u17p1] {
    background: var(--bs-body-bg);
    border: 1px solid var(--bs-border-color);
    border-radius: 0.5rem;
    padding: 1.5rem;
    box-shadow: 0 2px 8px rgba(0,0,0,0.1);
    display: flex;
    flex-direction: column;
}

.carousel-image-container[b-9noy7u17p1] {
    position: relative;
    width: 100%;
    height: clamp(300px, 60vh, 800px);
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: #000;
    border-radius: 0.5rem;
    overflow: hidden;
}

/* Responsive breakpoints for carousel */
@media (max-width: 768px) {
    .carousel-image-container[b-9noy7u17p1] {
        height: clamp(250px, 50vh, 600px);
    }
}

@media (min-width: 1920px) {
    .carousel-image-container[b-9noy7u17p1] {
        height: clamp(400px, 70vh, 1000px);
    }
}

.carousel-info[b-9noy7u17p1] {
    margin-top: 1rem;
    padding-top: 1rem;
    border-top: 1px solid var(--bs-border-color);
    flex-shrink: 0;
}

.carousel-caption-container[b-9noy7u17p1] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin-bottom: 0.5rem;
}

    .carousel-caption-container h5[b-9noy7u17p1] {
        margin-bottom: 0;
        color: var(--bs-body-color);
        flex: 1;
        min-width: 0;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

.carousel-meta[b-9noy7u17p1] {
    display: flex;
    flex-wrap: wrap;
    gap: 1rem;
    color: var(--bs-secondary-color);
    font-size: 0.875rem;
}

.carousel-actions[b-9noy7u17p1] {
    flex-shrink: 0;
}

.carousel-thumbnails[b-9noy7u17p1] {
    display: flex;
    gap: 0.5rem;
    overflow-x: auto;
    padding: 0.5rem;
    background: var(--bs-body-bg);
    border: 1px solid var(--bs-border-color);
    border-radius: 0.5rem;
    box-shadow: 0 2px 8px rgba(0,0,0,0.1);
    scrollbar-width: thin;
}

.carousel-thumbnails[b-9noy7u17p1]::-webkit-scrollbar {
    height: 8px;
}

.carousel-thumbnails[b-9noy7u17p1]::-webkit-scrollbar-track {
    background: var(--bs-secondary-bg);
    border-radius: 0.25rem;
}

.carousel-thumbnails[b-9noy7u17p1]::-webkit-scrollbar-thumb {
    background: var(--bs-border-color);
    border-radius: 0.25rem;
}

.carousel-thumbnails[b-9noy7u17p1]::-webkit-scrollbar-thumb:hover {
    background: var(--bs-secondary-color);
}

.carousel-thumbnail[b-9noy7u17p1] {
    flex-shrink: 0;
    width: clamp(60px, 10vw, 100px);
    height: clamp(60px, 10vw, 100px);
    border-radius: 0.25rem;
    overflow: hidden;
    cursor: pointer;
    border: 2px solid transparent;
    transition: border-color 0.2s ease;
}

    .carousel-thumbnail:hover[b-9noy7u17p1] {
        border-color: var(--bs-border-color);
    }

    .carousel-thumbnail.active[b-9noy7u17p1] {
        border-color: var(--bs-primary);
    }

    .carousel-thumbnail img[b-9noy7u17p1] {
        width: 100%;
        height: 100%;
        object-fit: cover;
    }

/* Responsive layout for carousel actions */
@media (max-width: 576px) {
    .carousel-meta[b-9noy7u17p1] {
        gap: 0.5rem;
        font-size: 0.8rem;
    }
    
    .carousel-actions[b-9noy7u17p1] {
        display: flex;
        flex-direction: column;
        gap: 0.5rem;
    }
    
    .carousel-actions .dxbl-btn[b-9noy7u17p1] {
        width: 100%;
    }
}
/* /Components/Editors/SyntaxEditor.razor.rz.scp.css */
.syntax-editor-container[b-ag32rdj7nc] {
    border: 1px solid var(--bs-border-color);
    border-radius: 4px;
    overflow: hidden;
    background-color: var(--bs-body-bg);
    display: flex;
    flex-direction: column;
    position: relative;
}

.syntax-editor-container.resizable[b-ag32rdj7nc] {
    resize: vertical;
    overflow: auto;
    min-height: 150px;
}

.syntax-editor-monaco[b-ag32rdj7nc] {
    width: 100%;
    height: 100%;
    flex: 1;
}

/* Resize handle */
.syntax-editor-resize-handle[b-ag32rdj7nc] {
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    height: 12px;
    cursor: ns-resize;
    background: linear-gradient(to bottom, transparent 0%, var(--bs-border-color) 50%, transparent 100%);
    opacity: 0.3;
    transition: opacity 0.2s ease;
    z-index: 10;
}

.syntax-editor-resize-handle:hover[b-ag32rdj7nc] {
    opacity: 0.6;
    background: linear-gradient(to bottom, transparent 0%, var(--bs-primary) 50%, transparent 100%);
}

.syntax-editor-resize-handle[b-ag32rdj7nc]::before {
    content: '';
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    width: 30px;
    height: 3px;
    background: var(--bs-border-color);
    border-radius: 2px;
}

.syntax-editor-resize-handle:hover[b-ag32rdj7nc]::before {
    background: var(--bs-primary);
}

/* Ensure the editor wrapper takes full height */
.syntax-editor-container[b-ag32rdj7nc]  .monaco-editor-container {
    height: 100% !important;
}

/* Override Monaco editor colors to match app theme in dark mode */
@media (prefers-color-scheme: dark) {
    .syntax-editor-container[b-ag32rdj7nc]  .monaco-editor {
        height: 100% !important;
    }
}

/* Light mode overrides */
.syntax-editor-container[b-ag32rdj7nc]  .monaco-editor.vs {
    background-color: #ffffff;
    height: 100% !important;
}

.syntax-editor-container[b-ag32rdj7nc]  .monaco-editor.vs .margin {
    background-color: #f3f3f3;
}

/* Dark mode overrides */
.syntax-editor-container[b-ag32rdj7nc]  .monaco-editor.vs-dark {
    background-color: #1e1e1e;
    height: 100% !important;
}

.syntax-editor-container[b-ag32rdj7nc]  .monaco-editor.vs-dark .margin {
    background-color: #252526;
}
/* /Components/Layout/CookieConsentBanner.razor.rz.scp.css */
.merc-cookie-banner[b-xmn3hbhznl] {
    position: fixed;
    z-index: 1100;
    left: 1rem;
    right: 1rem;
    bottom: 1rem;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: 1rem 1.25rem;
    border: 1px solid var(--bs-border-color);
    border-radius: 0.5rem;
    background: var(--bs-body-bg);
    color: var(--bs-body-color);
    box-shadow: 0 0.5rem 1.5rem rgba(0, 0, 0, 0.25);
}

.merc-cookie-banner-text[b-xmn3hbhznl] {
    flex: 1 1 320px;
    min-width: 260px;
    font-size: 0.9rem;
}

.merc-cookie-banner-actions[b-xmn3hbhznl] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
}

@media (max-width: 700px) {
    .merc-cookie-banner[b-xmn3hbhznl] {
        flex-direction: column;
        align-items: stretch;
    }
}
/* /Components/Layout/HeaderBar.razor.rz.scp.css */
.about-body[b-20dmjg4442] {
    display: flex;
    flex-direction: column;
    gap: 1rem;
    align-items: center;
    text-align: center;
}

.about-logos[b-20dmjg4442] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 1.5rem;
    flex-wrap: wrap;
}

.about-logo-mercury[b-20dmjg4442] {
    height: 48px;
}

.about-logo-boranic-card[b-20dmjg4442] {
    display: flex;
    align-items: center;
    padding: 0.5rem 1rem;
    background: #fff;
    border-radius: 10px;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.25);
}

.about-logo-boranic[b-20dmjg4442] {
    height: 36px;
}
.about-blurb[b-20dmjg4442] {
    margin: 0;
    color: var(--bs-body-color);
    opacity: 0.8;
    line-height: 1.5;
}

.about-details[b-20dmjg4442] {
    display: grid;
    grid-template-columns: auto auto;
    gap: 0.25rem 1rem;
    margin: 0;
    padding: 0.75rem 1.25rem;
    color: var(--bs-body-color);
    background: var(--bs-tertiary-bg, rgba(128, 128, 128, 0.15));
    border: 1px solid var(--bs-border-color, rgba(128, 128, 128, 0.3));
    border-radius: 8px;
}

    .about-details dt[b-20dmjg4442] {
        font-weight: 600;
        text-align: right;
    }

    .about-details dd[b-20dmjg4442] {
        margin: 0;
        text-align: left;
    }

.about-terms[b-20dmjg4442] {
    align-self: flex-start;
    font-size: 0.6rem;
}
/* /Components/Layout/MainLayout.razor.rz.scp.css */
.page[b-1bpnhepo67] {
    height: 100%;
    font-family: var(--bs-font-sans-serif);
}

[b-1bpnhepo67] .icon {
    -webkit-mask-repeat: no-repeat;
    mask-repeat: no-repeat;
    width: 1rem;
    height: 1rem;
    background-repeat: no-repeat;
    background-color: var(--dxbl-btn-color);
}

[b-1bpnhepo67] .icon-back {
    -webkit-mask-image: url("images/back.svg");
    mask-image: url("images/back.svg");
}
[b-1bpnhepo67] .icon-log-in {
    -webkit-mask-image: url("images/account/log-in.svg");
    mask-image: url("images/account/log-in.svg");
}

[b-1bpnhepo67] .icon-log-out {
    -webkit-mask-image: url("images/account/log-out.svg");
    mask-image: url("images/account/log-out.svg");
}

[b-1bpnhepo67] .icon-user {
    -webkit-mask-image: url("images/account/user.svg");
    mask-image: url("images/account/user.svg");
}

[b-1bpnhepo67] .icon-list {
    -webkit-mask-image: url("images/list.svg");
    mask-image: url("images/list.svg");
    mask-size: 30px 30px;
    -webkit-mask-size: 30px 30px;
}

[b-1bpnhepo67] .menu-button {
    padding: 0;
}
[b-1bpnhepo67] .menu-button .icon {
    width: 35px !important;
    height: 27px !important;
    position: relative;
    top: -1px;
}

[b-1bpnhepo67] .content {
    overflow: auto;
    display: flex;
    flex-direction: column;
}

[b-1bpnhepo67] . {
    overflow: auto;
    display: flex;
    flex-direction: column;
}

[b-1bpnhepo67] .menu-button:hover .icon {
    background-color: var(--dxbl-btn-hover-color);
}

@media (max-width: 1200px) {
    .merc-content[b-1bpnhepo67] {
        padding: 2rem 1.5rem;
    }
}

@media (max-width: 768px) {
    [b-1bpnhepo67] .layout-sidebar {
        grid-area: header / header / header / header !important;
    }
    .merc-content[b-1bpnhepo67] {
        padding: 2rem 1rem; 
    }
}

@media (max-width: 500px) {
    [b-1bpnhepo67] .menu-button .dxbl-btn-caption {
        display: none;
    }
}
/* /Components/Layout/MarketingLayout.razor.rz.scp.css */
.mk-shell[b-pukxto4j66] {
    /* site.css sets overflow: hidden on html/body for the app, so the marketing shell scrolls itself */
    height: 100vh;
    overflow-y: auto;
    scroll-behavior: smooth;
    background-color: #0a0a0a;
    color: #ededed;
    font-family: "Inter", "Segoe UI", system-ui, -apple-system, sans-serif;
}

.mk-header[b-pukxto4j66] {
    position: sticky;
    top: 0;
    z-index: 10;
    background: rgba(10, 10, 10, .8);
    backdrop-filter: blur(8px);
    border-bottom: 1px solid rgba(255, 255, 255, .06);
}

.mk-header-inner[b-pukxto4j66] {
    max-width: 1100px;
    margin: 0 auto;
    padding: .9rem 1.5rem;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.mk-brand[b-pukxto4j66] {
    display: inline-flex;
    align-items: center;
    gap: .5rem;
    font-weight: 600;
    font-size: 1rem;
    color: #fff;
    text-decoration: none;
}

.mk-nav[b-pukxto4j66] {
    display: flex;
    align-items: center;
    gap: 1.5rem;
}

.mk-nav a[b-pukxto4j66] {
    color: #a1a1a1;
    font-size: .875rem;
    text-decoration: none;
    transition: color .15s ease;
}

.mk-nav a:hover[b-pukxto4j66] {
    color: #fff;
}

.mk-nav a.mk-nav-cta[b-pukxto4j66] {
    color: #0a0a0a;
    background: #ededed;
    padding: .35rem .8rem;
    border-radius: .4rem;
    font-weight: 500;
}

.mk-nav a.mk-nav-cta:hover[b-pukxto4j66] {
    background: #fff;
    color: #0a0a0a;
}

@media (max-width: 640px) {
    .mk-nav a:not(.mk-nav-cta)[b-pukxto4j66] {
        display: none;
    }
}
/* /Components/Layout/NavMenu.razor.rz.scp.css */
#sidebar[b-60jaz10h4y] {
    min-width: 15rem;
    max-width: 15rem;
    box-shadow: 0px 2px 8px 0px rgba(0, 0, 0, 0.16);
    transition: transform 0.1s ease-out;
    height: 100%;
    max-height: 100%;
    /* background: rgb(70, 67, 74); */
}

[b-60jaz10h4y] .sidebar-header {
    padding: 2rem 1rem;
}

.logo[b-60jaz10h4y] {
    text-align: center;
}

[b-60jaz10h4y] .menu-button-container {
    display: none;
    align-self: center;
}

.menu-button[b-60jaz10h4y] {
    padding: 0.375rem;
    width: 1.875rem;
    height: 1.875rem;
    background-image: url("images/menu.svg");
    background-position: center;
    background-repeat: no-repeat;
    cursor: pointer;
}

[b-60jaz10h4y] .menu {
    background-color: inherit;
}

    [b-60jaz10h4y] .menu .dxbl-menu-item-list {
        gap: 0.5rem;
    }

[b-60jaz10h4y] .menu-item {
    color: var(--bs-white);
}

[b-60jaz10h4y] .icon {
    width: 1rem;
    height: 1rem;
    background-position: center;
    background-repeat: no-repeat;
    margin-left: 0.5rem;
}

[b-60jaz10h4y] .docs-icon {
    mask-image: url("images/doc.svg");
    -webkit-mask-image: url("images/doc.svg");
    -webkit-mask-repeat: no-repeat;
    mask-repeat: no-repeat;
    background-color: var(--dxbl-btn-color);
}

[b-60jaz10h4y] .demos-icon {
    mask-image: url("images/demos.svg");
    -webkit-mask-image: url("images/demos.svg");
    -webkit-mask-repeat: no-repeat;
    mask-repeat: no-repeat;
    background-color: var(--dxbl-btn-color);
}

[b-60jaz10h4y] .footer-button:hover .demos-icon {
    background-color: var(--dxbl-btn-hover-color);
}

[b-60jaz10h4y] .footer-button:hover .docs-icon {
    background-color: var(--dxbl-btn-hover-color);
}

[b-60jaz10h4y] .footer {
    text-align: center;
    gap: 0.5rem;
    padding-bottom: 1.5rem;
}

#sidebar.expanded[b-60jaz10h4y]  .layout-item {
    display: block;
}

#sidebar.expanded[b-60jaz10h4y]  .footer {
    display: block;
}

@media (max-width: 768px) {
    #sidebar[b-60jaz10h4y] {
        min-width: inherit;
        max-width: inherit;
    }

        #sidebar.expanded[b-60jaz10h4y] {
            position: fixed;
            width: 100%;
            z-index: 3;
        }

            #sidebar.expanded[b-60jaz10h4y]  .sidebar-header {
                border-bottom: 1px solid var(--bs-white);
            }

            #sidebar.expanded .menu-button[b-60jaz10h4y] {
                background-image: url("images/close.svg");
            }

        #sidebar:not(.expanded)[b-60jaz10h4y]  .dxbl-gridlayout-root {
            gap: unset !important;
        }

    .logo[b-60jaz10h4y] {
        text-align: inherit;
    }

    [b-60jaz10h4y] .menu-button-container {
        display: block;
    }

    [b-60jaz10h4y] .layout-item {
        display: none;
    }

    [b-60jaz10h4y] .footer {
        display: none;
    }
}

/* Force TreeView to use full width */
.merc-sidebar[b-60jaz10h4y]  .dxbl-tree-view {
    width: 100% !important;
}

/* Icon sizing - category icons larger than nav item icons */
.merc-sidebar .p-2 > span > i[b-60jaz10h4y] {
    font-size: 1.375rem;
}

.merc-sidebar .p-1 i[b-60jaz10h4y] {
    font-size: 1rem;
}

.merc-sidemenu[b-60jaz10h4y] {
    margin: 0 0 5rem 0;
    padding: 0;

    ul, li {
        list-style: none;
        margin: 0;
        padding: 0;
    }

        li.merc-sidemenu-section[b-60jaz10h4y] {
            margin: 10px 0;

            &:first-of-type {
                margin-top: 0px;
            }

            div.merc-sidemenu-header[b-60jaz10h4y] {
                font-size: 110%;
                font-weight: 500;
                padding: 0.25rem 0.35rem;
                margin: 5px 0;
                display: flex;
                align-items: center;
                justify-content: space-between;
                border-radius: 5px;
                cursor: pointer;

                .fa-light {
                    margin-right: 8px;
                    font-size: 20px;
                    position: relative;
                }

                .merc-sidemenu-header-title[b-60jaz10h4y] {
                    padding: 0 0 0 0;
                    margin: 1px 0 0 0;
                    text-align: left;
                }

                .merc-sidemenu-header-toggle[b-60jaz10h4y] {
                    font-size: 13px;
                    color: rgba(255,255,255,0.3);
                }

                &.active[b-60jaz10h4y] {
                    background: rgba(255,255,255,0.1);
                }

                &:hover[b-60jaz10h4y] {
                    background: rgba(255,255,255,0.2) !important;

                    .merc-sidemenu-header-toggle {
                        color: rgba(255,255,255,0.9);
                    }
                }
            }

            ul[b-60jaz10h4y] {
                border-left: 1px dotted rgba(255,255,255,0.2);
                margin: 0 0 0 15px;
                padding: 0 0 0 10px;

                li {
                    margin: 2px 0;
                    padding: 0;
                    display: block;

                    a {
                        text-decoration: none;
                        margin: 0 0 0 0;
                        padding: 4px 8px;
                        display: block;
                        border-radius: 5px;

                        &:hover {
                            background: rgba(255,255,255,0.2) !important;
                        }
                    }

                    &.active[b-60jaz10h4y] {
                        a {
                            background: rgba(255,255,255,0.8);
                            color: #222;
                            /* font-weight: bold; */
                            &:hover {
                                background: rgba(255,255,255,0.8) !important;
                            }
                        }
                    }
                }
            }
        }
}
/* /Components/Pages/Autocomplete.razor.rz.scp.css */
.autocomplete[b-hi40ltxvsj] {
  position: relative;
}
.autocomplete .options[b-hi40ltxvsj] {
    position: absolute;
    top: 40px;
    left: 0;
    width: 100%;
    padding: 0;
    z-index: 10;
    border: 1px solid #615f63;
    border-radius: 0.1875rem;
    box-shadow: 0 30px 25px 8px rgba(0, 0, 0, 0.1);
}
.autocomplete .option[b-hi40ltxvsj] {
    display: block;
    padding: 0.25rem;
    background: var(--bs-body-bg);
    border: 0px solid #615f63;
}
.autocomplete .option .option-text[b-hi40ltxvsj] {
  padding: 0.25rem 0.5rem;
  cursor: context-menu;
}

.autocomplete .option:hover[b-hi40ltxvsj] {
  cursor: auto;
}
.autocomplete .option.disabled[b-hi40ltxvsj] {
  background-color: lightgrey;
  cursor: not-allowed;
}
.autocomplete .option.disabled:hover[b-hi40ltxvsj] {
  background: lightgrey;
  color: var(--bs-body);
}
/* /Components/Pages/Common/SearchResultsPage.razor.rz.scp.css */
.search-results-page[b-3kken4t2se] {
    max-width: 1200px;
    margin: 0 auto;
    padding: 2rem;
}

.search-box-container[b-3kken4t2se] {
    max-width: 600px;
}

.search-input[b-3kken4t2se] {
    width: 100%;
}

.results-summary[b-3kken4t2se] {
    padding: 0.5rem 0;
}

.list-group-item mark[b-3kken4t2se] {
    background-color: var(--bs-warning);
    color: var(--bs-dark);
    padding: 0.125rem 0.25rem;
    border-radius: 0.125rem;
    font-weight: 600;
}

@media (prefers-color-scheme: dark) {
    .list-group-item mark[b-3kken4t2se] {
        background-color: #ffc107;
        color: #000;
    }
}

@media (prefers-color-scheme: light) {
    .list-group-item mark[b-3kken4t2se] {
        background-color: #fff59d;
        color: #000;
    }
}
/* /Components/Pages/Dashboard.razor.rz.scp.css */
/* Remove padding from merc-content when showing unauthenticated welcome */
:global(.merc-content:has(.unauthenticated-welcome))[b-d3wxvh78p8] {
    padding: 0 !important;
}
/* /Components/Pages/DocumentPreview.razor.rz.scp.css */
.document-preview-page .pdf-viewer[b-o6pctxkh97] {
    margin: 0 !important;
    padding: 0 !important;
}

.document-preview-page .dxbl-pdf-viewer[b-o6pctxkh97] {
    margin: 0 !important;
    padding: 0 !important;
}

.document-preview-page .dxbl-pdf-viewer-container[b-o6pctxkh97] {
    margin: 0 !important;
    padding: 0 !important;
}
/* /Components/Pages/Label/LabelFormatEditPage.razor.rz.scp.css */
/* Designer container — fills available viewport below form fields */
.designer-container[b-1aef62kyjm] {
    height: max(600px, calc(100vh - 420px));
    position: relative;
}

.designer-resize-handle[b-1aef62kyjm] {
    position: absolute;
    bottom: -4px;
    left: 0;
    right: 0;
    height: 8px;
    background: transparent;
    cursor: ns-resize;
    z-index: 10;
}

.designer-resize-handle:hover[b-1aef62kyjm] {
    background: var(--bs-primary);
    opacity: 0.5;
}

.designer-resize-handle:active[b-1aef62kyjm] {
    background: var(--bs-primary);
    opacity: 0.7;
}

[b-1aef62kyjm] .designer-splitter {
    height: 100%;
    border: 1px solid var(--bs-card-border-color, var(--bs-border-color));
    border-radius: 0.375rem;
    overflow: hidden;
}

.designer-panel[b-1aef62kyjm] {
    display: flex;
    flex-direction: column;
    height: 100%;
    overflow: hidden;
}

.designer-panel-header[b-1aef62kyjm] {
    display: flex;
    align-items: center;
    padding: 0.5rem 0.75rem;
    font-weight: 600;
    font-size: 0.85rem;
    color: var(--bs-body-color);
    background: var(--bs-tertiary-bg);
    border-bottom: 1px solid var(--bs-border-color);
    flex-shrink: 0;
    user-select: none;
}

.designer-panel-body[b-1aef62kyjm] {
    flex: 1;
    min-height: 0;
    overflow: hidden;
}

.designer-panel-body.preview-body[b-1aef62kyjm] {
    overflow: auto;
    padding: 0.75rem;
}

.designer-panel-placeholder[b-1aef62kyjm] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 0.75rem;
    height: 100%;
    color: var(--bs-secondary-color);
    padding: 2rem;
}

.designer-panel-placeholder i[b-1aef62kyjm] {
    font-size: 2.5rem;
}

.designer-panel-placeholder span[b-1aef62kyjm] {
    font-size: 0.85rem;
    text-align: center;
}

.preview-note[b-1aef62kyjm] {
    font-size: 0.8rem;
    color: var(--bs-secondary-color);
    margin-bottom: 0.75rem;
    font-style: italic;
}

.preview-image[b-1aef62kyjm] {
    max-width: 100%;
    height: auto;
    border: 1px solid var(--bs-border-color);
    border-radius: 0.25rem;
}

/* Main page content — restores padding stripped from merc-content, scrolls independently */
.chat-page-content[b-1aef62kyjm] {
    padding: 2rem 3rem;
    overflow-y: auto;
    height: 100%;
    box-sizing: border-box;
}

/* ── Pinnable chat layout ─────────────────────────────── */
.page-layout[b-1aef62kyjm] {
    display: flex;
    align-items: flex-start;
}
.page-main-area[b-1aef62kyjm] {
    flex: 1;
    min-width: 0;
}
/* Push content left so nothing renders under the fixed panel */
.page-layout.chat-pinned-open .page-main-area[b-1aef62kyjm] {
    margin-right: 420px;
}
/* /Components/Pages/Label/LabelFormatVersionListPage.razor.rz.scp.css */
.version-history-container[b-m98zuzuntu] {
    display: flex;
    flex-direction: column;
    height: calc(100vh - 60px);
    padding: 0.5rem;
}

/* Grid section fills available space when not comparing */
.grid-section[b-m98zuzuntu] {
    flex: 1;
    min-height: 200px;
    overflow: hidden;
}

/* Wrapper uses CSS Grid so the DxSplitter child receives a definite size
   from the grid cell — unlike flex, grid items with stretch get a concrete
   height that height:100% on children can resolve against. */
.splitter-wrapper[b-m98zuzuntu] {
    flex: 1;
    min-height: 0;
    display: grid;
}

/* DxSplitter fills the grid cell */
[b-m98zuzuntu] .version-splitter {
    height: 100%;
    min-height: 0;
    border: 1px solid var(--bs-border-color);
    border-radius: 0.375rem;
}

/* Grid inside splitter pane */
.grid-pane[b-m98zuzuntu] {
    height: 100%;
    overflow: hidden;
}

/* Comparison section fills its splitter pane */
.comparison-section[b-m98zuzuntu] {
    height: 100%;
    display: flex;
    flex-direction: column;
    overflow: hidden;
}

.comparison-toolbar[b-m98zuzuntu] {
    display: flex;
    align-items: center;
    padding: 0.5rem 0.75rem;
    background: var(--bs-tertiary-bg);
    border-bottom: 1px solid var(--bs-border-color);
    font-size: 0.9rem;
    flex-shrink: 0;
    user-select: none;
}

.comparison-title[b-m98zuzuntu] {
    display: flex;
    align-items: center;
    gap: 0.25rem;
}

.comparison-loading[b-m98zuzuntu] {
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 3rem;
    color: var(--bs-secondary-color);
}

/* Diff panel — uses CSS Grid so the DiffEditor child receives a definite
   size from the grid cell, avoiding height:100% resolution issues */
.diff-panel[b-m98zuzuntu] {
    flex: 1;
    min-height: 0;
    display: grid;
    overflow: hidden;
}

/* Preview comparison capped at 40% of the comparison pane */
.preview-comparison[b-m98zuzuntu] {
    flex-shrink: 0;
    max-height: 40%;
    overflow: auto;
    border-top: 1px solid var(--bs-border-color);
}

.preview-comparison-header[b-m98zuzuntu] {
    padding: 0.5rem 0.75rem;
    font-weight: 600;
    font-size: 0.85rem;
    background: var(--bs-tertiary-bg);
    border-bottom: 1px solid var(--bs-border-color);
    user-select: none;
    position: sticky;
    top: 0;
    z-index: 1;
}

.preview-comparison-body[b-m98zuzuntu] {
    display: flex;
    gap: 0;
    padding: 1rem;
}

.preview-side[b-m98zuzuntu] {
    flex: 1;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.5rem;
    min-width: 0;
}

.preview-side-label[b-m98zuzuntu] {
    font-weight: 600;
    font-size: 0.85rem;
    color: var(--bs-body-color);
}

.preview-divider[b-m98zuzuntu] {
    width: 1px;
    background: var(--bs-border-color);
    margin: 0 0.5rem;
    align-self: stretch;
}

.preview-img[b-m98zuzuntu] {
    max-width: 100%;
    height: auto;
    border: 1px solid var(--bs-border-color);
    border-radius: 0.25rem;
}

.preview-unavailable[b-m98zuzuntu] {
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 2rem;
    color: var(--bs-secondary-color);
    font-size: 0.85rem;
    font-style: italic;
}

/* Grid row styling — italics only for drafts, no colour change (readable in dark mode) */
[b-m98zuzuntu] .draft-version-row {
    font-style: italic;
}

[b-m98zuzuntu] .published-version-row {
    /* default styling */
}
/* /Components/Pages/Label/PrintLabelPage.razor.rz.scp.css */
.section-label[b-cdd30k3buq] {
    font-size: 1rem;
    font-weight: 600;
    color: var(--bs-body-color);
}

.label-type-cards[b-cdd30k3buq] {
    display: flex;
    flex-wrap: wrap;
    gap: 1rem;
}

.label-type-card[b-cdd30k3buq] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 1.5rem 2rem;
    border: 2px solid var(--bs-border-color);
    border-radius: 0.75rem;
    cursor: pointer;
    transition: all 0.2s ease;
    min-width: 140px;
    background: var(--bs-body-bg);
    user-select: none;
}

    .label-type-card:hover[b-cdd30k3buq] {
        border-color: var(--bs-primary);
        background: var(--bs-primary-bg-subtle);
        transform: translateY(-2px);
        box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
    }

    .label-type-card.selected[b-cdd30k3buq] {
        border-color: var(--bs-primary);
        background: var(--bs-primary-bg-subtle);
        color: var(--bs-primary);
        box-shadow: 0 0 0 1px var(--bs-primary);
    }

    .label-type-card i[b-cdd30k3buq] {
        font-size: 2.5rem;
        margin-bottom: 0.75rem;
    }

    .label-type-card span[b-cdd30k3buq] {
        font-weight: 600;
        font-size: 0.9rem;
        text-align: center;
    }

.empty-state[b-cdd30k3buq] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 1rem;
    padding: 3rem;
    color: var(--bs-secondary-color);
}

    .empty-state i[b-cdd30k3buq] {
        font-size: 3rem;
    }
/* /Components/Pages/ListPage.razor.rz.scp.css */
.list-container[b-89fa3n01mb] {
    height: calc(100vh - var(--merc-header-height));
    margin: -2rem -3rem;
    display: flex;
    flex-direction: column;
    overflow: hidden;
    padding: 2rem 3rem;
}

.list-content[b-89fa3n01mb] {
    flex: 1;
    min-height: 0;
    display: flex;
    flex-direction: column;
}

/* DxLoadingPanel renders its own root element from DevExpress.Blazor's markup,
   not from this component's markup, so the CssClass="list-loading-panel"
   passed into it never receives this component's scope attribute. A plain
   (non-deep) selector can't match it - ::deep is required to reach it. */
[b-89fa3n01mb] .list-loading-panel {
    flex: 1;
    min-height: 0;
    display: flex;
    flex-direction: column;
}

.toolbar-combobox[b-89fa3n01mb] {
    width: 200px;
}

.filter-description[b-89fa3n01mb] {
    cursor: pointer;
}

.filter-description:hover[b-89fa3n01mb] {
    text-decoration: underline;
}

/* The toolbar card becomes the positioning context so the filter panel can
   overlay the content below it instead of pushing the page down. While the
   panel is open the card is lifted above the shading backdrop so its toolbar
   and filter description stay highlighted. */
.card:has(> .filter-inline-panel)[b-89fa3n01mb] {
    position: relative;
    z-index: 1030;
}

/* Semi-transparent full-viewport layer that shades the rest of the page and
   dismisses the filter panel when the user clicks anywhere outside of it. */
.filter-backdrop[b-89fa3n01mb] {
    position: fixed;
    inset: 0;
    z-index: 1020;
    background-color: rgba(0, 0, 0, 0.3);
}

.filter-inline-panel[b-89fa3n01mb] {
    position: absolute;
    top: 100%;
    left: 0;
    right: 0;
    z-index: 1030;
    padding: 0.75rem;
    border: 1px solid var(--bs-border-color, #dee2e6);
    border-radius: 0 0 var(--bs-card-border-radius, 0.375rem) var(--bs-card-border-radius, 0.375rem);
    background-color: var(--bs-card-bg, #fff);
    box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.15);
    animation: filter-inline-unfold-b-89fa3n01mb 0.2s ease-out;
    overflow: hidden;
}

@keyframes filter-inline-unfold-b-89fa3n01mb {
    from {
        opacity: 0;
        max-height: 0;
    }

    to {
        opacity: 1;
        max-height: 1000px;
    }
}

[b-89fa3n01mb] .dxbl-loading-panel-target-content {
    flex: 1;
    min-height: 0;
    display: flex;
    flex-direction: column;
}

/* The Grid sizes its own virtual scrolling viewport at runtime, so its
   internal .dxbl-grid element must not be forced to a height. Instead the
   Grid's own root element (CssClass="list-grid") is made a flex child of the
   constrained .list-content column: flex:1 gives it the remaining space and
   min-height:0 lets it shrink below its content so the grid scrolls instead
   of overflowing the page. */
[b-89fa3n01mb] .list-grid {
    flex: 1;
    min-height: 0;
}
/* /Components/Pages/Marketing/AppPreview.razor.rz.scp.css */
.window[b-unp1rv5tv8] {
    --w-bg: #1b1b1b;
    --w-panel: #232323;
    --w-border: #333;
    --w-text: #e6e6e6;
    --w-muted: #9a9a9a;
    border: 1px solid rgba(255, 255, 255, .08);
    border-radius: .9rem;
    background: var(--w-bg);
    overflow: hidden;
    box-shadow: 0 40px 80px -30px rgba(0, 0, 0, .8);
    color: var(--w-text);
    font-size: .72rem;
    text-align: left;
}

.window-bar[b-unp1rv5tv8] {
    position: relative;
    display: flex;
    align-items: center;
    gap: .45rem;
    padding: .65rem .9rem;
    background: #141414;
    border-bottom: 1px solid rgba(255, 255, 255, .06);
}

.dot[b-unp1rv5tv8] {
    width: 12px;
    height: 12px;
    border-radius: 50%;
}

.dot-close[b-unp1rv5tv8] {
    background: #ff5f57;
}

.dot-min[b-unp1rv5tv8] {
    background: #febc2e;
}

.dot-max[b-unp1rv5tv8] {
    background: #28c840;
}

.window-url[b-unp1rv5tv8] {
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    padding: .2rem .8rem;
    border-radius: .4rem;
    background: #1f1f1f;
    color: #7a7a7a;
    font-family: ui-monospace, Consolas, monospace;
    font-size: .72rem;
}

/* App chrome */
.app-top[b-unp1rv5tv8] {
    display: flex;
    align-items: center;
    gap: .9rem;
    padding: .45rem .8rem;
    background: #2b2b2b;
    border-bottom: 1px solid var(--w-border);
}

.app-burger[b-unp1rv5tv8] {
    color: var(--w-muted);
    font-size: .9rem;
}

.app-logo[b-unp1rv5tv8] {
    display: inline-flex;
    align-items: center;
    gap: .4rem;
    font-weight: 700;
    font-size: .95rem;
    color: #fff;
}

.app-logo-mark[b-unp1rv5tv8] {
    display: grid;
    place-items: center;
    width: 20px;
    height: 20px;
    border-radius: 4px;
    font-size: .7rem;
    background: linear-gradient(135deg, #6d4dff, #2f7bff);
}

.app-search[b-unp1rv5tv8] {
    flex: 0 1 320px;
    margin: 0 auto;
    padding: .25rem .6rem;
    border: 1px solid #444;
    border-radius: .3rem;
    background: #1b1b1b;
    color: var(--w-muted);
}

.app-avatar[b-unp1rv5tv8] {
    width: 20px;
    height: 20px;
    border-radius: 50%;
    background: #4a4a4a;
}

.app-body[b-unp1rv5tv8] {
    display: grid;
    grid-template-columns: 180px 1fr;
    height: 470px;
}

.app-side[b-unp1rv5tv8] {
    padding: .6rem;
    border-right: 1px solid var(--w-border);
    overflow: hidden;
}

.app-filter[b-unp1rv5tv8] {
    padding: .25rem .5rem;
    margin-bottom: .6rem;
    border: 1px solid #444;
    border-radius: .3rem;
    color: #777;
    font-size: .62rem;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.nav-group[b-unp1rv5tv8] {
    display: flex;
    align-items: center;
    gap: .45rem;
    margin-top: .55rem;
    font-weight: 700;
    color: #fff;
}

.nav-chevron[b-unp1rv5tv8] {
    margin-left: auto;
    font-size: .6rem;
    color: var(--w-muted);
}

.nav-item[b-unp1rv5tv8] {
    padding: .18rem 0 .18rem 1.35rem;
    color: #cfcfcf;
}

.nav-item.active[b-unp1rv5tv8] {
    color: #fff;
    background: #333;
    border-radius: .25rem;
}

.app-main[b-unp1rv5tv8] {
    padding: .8rem 1rem;
    display: flex;
    flex-direction: column;
    gap: .6rem;
    overflow: hidden;
}

.page-title[b-unp1rv5tv8] {
    display: flex;
    align-items: center;
    gap: .5rem;
    font-size: 1rem;
    font-weight: 600;
    color: #fff;
}

.toolbar[b-unp1rv5tv8] {
    display: flex;
    flex-wrap: wrap;
    gap: .25rem;
    padding: .3rem;
    border: 1px solid var(--w-border);
    border-radius: .3rem;
}

.tb-btn[b-unp1rv5tv8] {
    display: inline-flex;
    align-items: center;
    gap: .3rem;
    padding: .2rem .45rem;
    border: 1px solid #444;
    border-radius: .25rem;
    color: var(--w-text);
    white-space: nowrap;
}

.tb-btn.disabled[b-unp1rv5tv8] {
    color: #666;
}

.tb-spacer[b-unp1rv5tv8] {
    flex: 1;
}

.card[b-unp1rv5tv8] {
    border: 1px solid var(--w-border);
    border-radius: .3rem;
    background: var(--w-panel);
}

.card-head[b-unp1rv5tv8] {
    display: flex;
    align-items: center;
    gap: .5rem;
    padding: .45rem .6rem;
    font-weight: 600;
    border-bottom: 1px solid var(--w-border);
}

.form-grid[b-unp1rv5tv8] {
    display: grid;
    grid-template-columns: 80px 1fr 90px 1fr;
    gap: .35rem .6rem;
    align-items: center;
    padding: .6rem;
}

.f-label[b-unp1rv5tv8] {
    color: #cfcfcf;
}

.f-input[b-unp1rv5tv8] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: .2rem .45rem;
    border: 1px solid #4a4a4a;
    border-radius: .25rem;
    background: #1b1b1b;
    white-space: nowrap;
    overflow: hidden;
}

.f-input i[b-unp1rv5tv8] {
    color: var(--w-muted);
    font-size: .6rem;
}

.f-check[b-unp1rv5tv8] {
    color: #3b82f6;
    font-size: .85rem;
}

.draft-banner[b-unp1rv5tv8] {
    display: flex;
    align-items: center;
    gap: .5rem;
    padding: .55rem .7rem;
    border-radius: .3rem;
    background: #fbd5c0;
    color: #3a2418;
    font-weight: 600;
}

.editors[b-unp1rv5tv8] {
    flex: 1;
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: .6rem;
    min-height: 0;
}

.editor[b-unp1rv5tv8] {
    display: flex;
    flex-direction: column;
    border: 1px solid var(--w-border);
    border-radius: .3rem;
    overflow: hidden;
}

.editor-head[b-unp1rv5tv8] {
    display: flex;
    align-items: center;
    gap: .45rem;
    padding: .4rem .6rem;
    background: var(--w-panel);
    font-weight: 600;
    border-bottom: 1px solid var(--w-border);
}

.code[b-unp1rv5tv8] {
    flex: 1;
    padding: .35rem 0;
    background: #1e1e1e;
    font-family: ui-monospace, Consolas, monospace;
    font-size: .64rem;
    line-height: 1.55;
    overflow: hidden;
}

.code-line[b-unp1rv5tv8] {
    white-space: nowrap;
    color: #d4d4d4;
}

.ln[b-unp1rv5tv8] {
    display: inline-block;
    width: 2rem;
    padding-right: .6rem;
    text-align: right;
    color: #6e7681;
}

.code[b-unp1rv5tv8]  .t {
    color: #569cd6;
}

.code[b-unp1rv5tv8]  .a {
    color: #9cdcfe;
}

.code[b-unp1rv5tv8]  .s {
    color: #ce9178;
}

.code[b-unp1rv5tv8]  .c {
    color: #6a9955;
}

/* Tabs */
.tabs[b-unp1rv5tv8] {
    display: flex;
    justify-content: center;
    gap: .25rem;
    width: fit-content;
    margin: 0 auto 1.5rem;
    padding: .3rem;
    border: 1px solid rgba(255, 255, 255, .12);
    border-radius: 999px;
    background: #181818;
}

.tab[b-unp1rv5tv8] {
    position: relative;
    isolation: isolate;
    overflow: hidden;
    display: inline-flex;
    align-items: center;
    gap: .45rem;
    padding: .4rem .9rem;
    border: 0;
    border-radius: 999px;
    background: transparent;
    font: inherit;
    font-size: .85rem;
    color: #a1a1a1;
    cursor: pointer;
    transition: color .15s ease, background-color .15s ease;
}

.tab:hover[b-unp1rv5tv8] {
    color: #fff;
}

.tab.active[b-unp1rv5tv8] {
    background: #222;
    color: #fff;
    box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .14);
}

/* Gradient that sweeps across the active tab over the 15s cycle (keep in sync with cycleMs in marketing-preview.js) */
.tab.active[b-unp1rv5tv8]::before {
    content: "";
    position: absolute;
    inset: 0;
    z-index: -1;
    background: linear-gradient(90deg, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, .16) 85%, rgba(255, 255, 255, .28) 100%);
    transform: translateX(-100%);
    animation: tab-progress-b-unp1rv5tv8 15s linear forwards;
}

@keyframes tab-progress-b-unp1rv5tv8 {
    to {
        transform: translateX(0);
    }
}

/* Screens */
.screen[b-unp1rv5tv8] {
    display: none;
}

.screen.active[b-unp1rv5tv8] {
    display: grid;
    animation: screen-in-b-unp1rv5tv8 .4s ease;
}

@keyframes screen-in-b-unp1rv5tv8 {
    from {
        opacity: 0;
        transform: translateY(6px);
    }

    to {
        opacity: 1;
        transform: none;
    }
}

/* Customer orders */
.toolbar-flat[b-unp1rv5tv8] {
    border: 0;
    border-bottom: 1px solid var(--w-border);
    border-radius: 0;
}

.filter-text[b-unp1rv5tv8] {
    padding: .45rem .6rem;
    font-family: ui-monospace, Consolas, monospace;
    font-size: .62rem;
    color: #cfcfcf;
}

.fk[b-unp1rv5tv8] {
    color: #9cdcfe;
}

.fv[b-unp1rv5tv8] {
    color: #ce9178;
}

.fo[b-unp1rv5tv8] {
    color: #c586c0;
}

.grid[b-unp1rv5tv8] {
    flex: 1;
    border: 1px solid var(--w-border);
    border-radius: .3rem;
    overflow: hidden;
}

.grid-row[b-unp1rv5tv8] {
    display: grid;
    grid-template-columns: .8fr .8fr .9fr .9fr .9fr 1.8fr .6fr;
    gap: .5rem;
    padding: .42rem .6rem;
    border-bottom: 1px solid var(--w-border);
    white-space: nowrap;
}

.grid-row span[b-unp1rv5tv8] {
    overflow: hidden;
    text-overflow: ellipsis;
}

.grid-head[b-unp1rv5tv8] {
    font-weight: 600;
    color: #fff;
}

.grid-head span[b-unp1rv5tv8] {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.grid-head i[b-unp1rv5tv8] {
    font-size: .6rem;
    color: var(--w-muted);
}

.grid-row.selected[b-unp1rv5tv8] {
    background: #1f5fbf;
    color: #fff;
}

.link[b-unp1rv5tv8] {
    text-decoration: underline;
}

@media (max-width: 900px) {
    .grid-row[b-unp1rv5tv8] {
        grid-template-columns: 1fr 1fr 2fr 1fr;
    }

    .grid-row span:nth-child(2)[b-unp1rv5tv8], .grid-row span:nth-child(3)[b-unp1rv5tv8], .grid-row span:nth-child(5)[b-unp1rv5tv8] {
        display: none;
    }
}

@media (max-width: 900px) {
    .app-body[b-unp1rv5tv8] {
        grid-template-columns: 1fr;
    }

    .app-side[b-unp1rv5tv8], .app-search[b-unp1rv5tv8] {
        display: none;
    }

    .form-grid[b-unp1rv5tv8] {
        grid-template-columns: 80px 1fr;
    }

    .editors[b-unp1rv5tv8] {
        grid-template-columns: 1fr;
    }
}
/* /Components/Pages/Marketing/Landing.razor.rz.scp.css */
.landing[b-lhuerf6vpf] {
    --bg: #0a0a0a;
    --panel: #181818;
    --panel-2: #212121;
    --border: rgba(255, 255, 255, .12);
    --text: #ededed;
    --muted: #a1a1a1;
    --subtle: #6b6b6b;
    color: var(--text);
    background-color: var(--bg);
    background-image: radial-gradient(rgba(255, 255, 255, .07) 1px, transparent 1px);
    background-size: 22px 22px;
}

/* Hero */
.hero[b-lhuerf6vpf] {
    max-width: 1100px;
    margin: 0 auto;
    padding: 6rem 1.5rem 3rem;
    text-align: center;
}

.hero-title[b-lhuerf6vpf] {
    font-weight: 700;
    font-size: clamp(2.5rem, 6vw, 4.25rem);
    line-height: 1.05;
    letter-spacing: -.02em;
    color: #fff;
    margin: 0;
}

.hero-title-line[b-lhuerf6vpf] {
    display: block;
    white-space: nowrap;
}

.hero-title-muted[b-lhuerf6vpf] {
    display: block;
    color: var(--muted);
}

.hero-subtitle[b-lhuerf6vpf] {
    max-width: 520px;
    margin: 1.75rem auto 2.25rem;
    font-size: 1.05rem;
    line-height: 1.6;
    color: var(--muted);
}

.hero-actions[b-lhuerf6vpf] {
    display: flex;
    justify-content: center;
    gap: .75rem;
    flex-wrap: wrap;
}

.btn-primary-light[b-lhuerf6vpf], .btn-outline-dark[b-lhuerf6vpf] {
    display: inline-flex;
    align-items: center;
    gap: .5rem;
    padding: .65rem 1.15rem;
    border-radius: .5rem;
    font-size: .925rem;
    font-weight: 500;
    text-decoration: none;
    transition: background-color .15s ease, border-color .15s ease, color .15s ease;
}

.btn-primary-light[b-lhuerf6vpf] {
    background: #ededed;
    color: #0a0a0a;
}

.btn-primary-light:hover[b-lhuerf6vpf] {
    background: #fff;
    color: #0a0a0a;
}

.btn-outline-dark[b-lhuerf6vpf] {
    border: 1px solid var(--border);
    color: var(--text);
    background: rgba(255, 255, 255, .06);
}

.btn-outline-dark:hover[b-lhuerf6vpf] {
    border-color: rgba(255, 255, 255, .2);
    color: #fff;
}

/* Product preview */
.preview[b-lhuerf6vpf] {
    max-width: 1100px;
    margin: 0 auto;
    padding: 1rem 1.5rem 5rem;
}

/* Sections */
.section[b-lhuerf6vpf] {
    max-width: 1040px;
    margin: 0 auto;
    padding: 5rem 1.5rem;
    border-top: 1px solid var(--border);
}

.section-title[b-lhuerf6vpf], .cta-title[b-lhuerf6vpf] {
    font-weight: 700;
    font-size: clamp(1.9rem, 4vw, 2.6rem);
    letter-spacing: -.01em;
    text-align: center;
    color: #fff;
    margin: 0 0 .75rem;
}

.section-subtitle[b-lhuerf6vpf] {
    text-align: center;
    color: var(--muted);
    margin: 0 0 3rem;
}

.feature-grid[b-lhuerf6vpf] {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    border: 1px solid var(--border);
    border-radius: .9rem;
    overflow: hidden;
    background: var(--border);
    gap: 1px;
}

.feature[b-lhuerf6vpf] {
    padding: 1.75rem;
    background: var(--panel);
    transition: background-color .2s ease;
}

.feature:hover[b-lhuerf6vpf] {
    background: var(--panel-2);
}

.feature-icon[b-lhuerf6vpf] {
    font-size: 1.25rem;
    color: #fff;
}

.feature h3[b-lhuerf6vpf], .step h3[b-lhuerf6vpf] {
    margin: 1rem 0 .4rem;
    font-size: 1rem;
    font-weight: 600;
    color: #fff;
}

.feature p[b-lhuerf6vpf], .step p[b-lhuerf6vpf] {
    margin: 0;
    font-size: .9rem;
    line-height: 1.55;
    color: var(--muted);
}

.step-grid[b-lhuerf6vpf] {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 2rem;
    margin-top: 1rem;
}

.step-number[b-lhuerf6vpf] {
    font-family: ui-monospace, Consolas, monospace;
    font-size: .8rem;
    color: var(--subtle);
}

/* CTA + footer */
.cta[b-lhuerf6vpf] {
    padding: 6rem 1.5rem;
    text-align: center;
    border-top: 1px solid var(--border);
}

.cta .section-subtitle[b-lhuerf6vpf] {
    margin-bottom: 2rem;
}

.footer[b-lhuerf6vpf] {
    max-width: 1040px;
    margin: 0 auto;
    padding: 2rem 1.5rem;
    display: flex;
    justify-content: space-between;
    border-top: 1px solid var(--border);
    font-size: .85rem;
    color: var(--subtle);
}

.footer a[b-lhuerf6vpf] {
    color: var(--muted);
    text-decoration: none;
}

.footer a:hover[b-lhuerf6vpf] {
    color: #fff;
}

@media (max-width: 900px) {
    .feature-grid[b-lhuerf6vpf] {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 600px) {
    .hero-title-line[b-lhuerf6vpf] {
        white-space: normal;
    }
    .feature-grid[b-lhuerf6vpf], .step-grid[b-lhuerf6vpf] {
        grid-template-columns: 1fr;
    }
}
/* /Components/Pages/MasterData/ProductListPage.razor.rz.scp.css */
.quick-actions[b-ndgdm9tk38] {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(120px, 1fr));
    gap: 1rem;
}

.quick-action-card[b-ndgdm9tk38] {
    position: relative;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 1.5rem;
    border: 1px solid var(--bs-border-color);
    border-radius: 0.5rem;
    text-decoration: none;
    color: var(--bs-body-color);
    transition: all 0.3s ease;
    cursor: pointer;
}

    .quick-action-card:hover[b-ndgdm9tk38] {
        background: var(--bs-primary-bg-subtle);
        border-color: var(--bs-primary);
        color: var(--bs-primary-text-emphasis);
        transform: translateY(-2px);
    }

    .quick-action-card i[b-ndgdm9tk38] {
        font-size: 2rem;
        margin-bottom: 0.5rem;
    }
/* /Components/Pages/Order/OrderAllocationPage.razor.rz.scp.css */
[b-jx49mi5pzf] .allocation-pane {
    height: 100%;
    overflow: hidden;
    display: flex;
    flex-direction: column;
}

[b-jx49mi5pzf] .allocation-grid {
    flex: 1;
    min-height: 0;
}

.allocation-container[b-jx49mi5pzf] {
    height: calc(100vh - var(--merc-header-height));
    margin: -2rem -3rem;
    display: flex;
    flex-direction: column;
    overflow: hidden;
    padding: 2rem 3rem;
}

.allocation-content[b-jx49mi5pzf] {
    flex: 1;
    min-height: 0;
    display: flex;
    flex-direction: column;
}

[b-jx49mi5pzf] .allocation-level-underallocated > td {
    background-color: peru;
}

[b-jx49mi5pzf] .allocation-level-fullyallocated > td {
    background-color: seagreen;
}

[b-jx49mi5pzf] .allocation-level-overallocated > td {
    background-color: tomato;
}

[b-jx49mi5pzf] .allocation-level-cancelled > td {
    text-decoration: line-through;
}
/* /Components/Pages/Order/OrderEditPage.razor.rz.scp.css */
.allocation-info-list[b-1kxqpt9311] {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

.allocation-info-item[b-1kxqpt9311] {
    padding: 0.5rem 0.75rem;
    background-color: transparent;
    border-left: 3px solid #dee2e6;
    font-size: 0.875rem;
    line-height: 1.6;
}

.allocation-info-item:hover[b-1kxqpt9311] {
    background-color: rgba(0, 0, 0, 0.02);
    border-left-color: #0d6efd;
    transition: all 0.15s ease-in-out;
}

.allocation-info-item strong[b-1kxqpt9311] {
    color: #6c757d;
    font-weight: 600;
    font-size: 0.8125rem;
}

.allocation-info-item .grid-link[b-1kxqpt9311] {
    color: #0d6efd;
    text-decoration: none;
    font-weight: 500;
}

.allocation-info-item .grid-link:hover[b-1kxqpt9311] {
    text-decoration: underline;
}

.allocation-info-item span[b-1kxqpt9311] {
    color: #212529;
}
/* /Components/Pages/Order/OrderStagingImportPage.razor.rz.scp.css */
.upload-validation-text[b-68ry0sr5kq] {
    flex-direction: column;
    align-items: flex-end;
    font-size: 12px;
}

.upload-container[b-68ry0sr5kq] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    width: 100%;
    max-width: 600px;
    margin: 3rem auto;
    padding: 3rem 2rem;
    background-color: rgba(var(--bs-body-bg-rgb), 0.02);
    border: 2px dashed var(--bs-border-color);
    border-radius: 12px;
    transition: all 0.3s ease;
}

.upload-container:hover[b-68ry0sr5kq] {
    border-color: var(--bs-emphasis-color);
    background-color: rgba(var(--bs-body-bg-rgb), 0.05);
}

.upload-container > div:first-child[b-68ry0sr5kq] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    width: 100%;
    margin-bottom: 1.5rem;
}

.drop-file-icon[b-68ry0sr5kq] {
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 1rem;
}

.drop-file-icon i[b-68ry0sr5kq] {
    font-size: 64px;
    color: var(--bs-secondary-color);
}

.drop-file-label[b-68ry0sr5kq] {
    font-weight: 500;
    font-size: 1rem;
    color: var(--bs-secondary-color);
    text-align: center;
}

.log-output-container[b-68ry0sr5kq] {
    width: calc(100% - 4rem);
    max-width: 1400px;
    margin: 2rem auto;
    border: 1px solid var(--bs-border-color);
    border-radius: 8px;
    background-color: var(--bs-body-bg);
    overflow: hidden;
}

.log-header[b-68ry0sr5kq] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 0.75rem 1.5rem;
    background-color: var(--bs-tertiary-bg);
    border-bottom: 1px solid var(--bs-border-color);
}

.log-title[b-68ry0sr5kq] {
    font-weight: 600;
    font-size: 0.95rem;
    color: var(--bs-secondary-color);
}

.log-content[b-68ry0sr5kq] {
    padding: 1.5rem;
    max-height: 400px;
    overflow-y: auto;
    background-color: var(--bs-body-bg);
}

.log-content pre[b-68ry0sr5kq] {
    margin: 0;
    font-family: 'Consolas', 'Monaco', 'Courier New', monospace;
    font-size: 0.875rem;
    line-height: 1.6;
    color: var(--bs-body-color);
    white-space: pre-wrap;
    word-wrap: break-word;
}
/* /Components/Pages/Security/MockPage.razor.rz.scp.css */
.mock-page-container[b-jnnciuha4k] {
    max-width: 1200px;
    margin: 0 auto;
    padding: 2rem;
    display: flex;
    flex-direction: column;
    height: calc(100vh - 4rem);
    overflow: hidden;
}

.header-section[b-jnnciuha4k] {
    margin-bottom: 2rem;
    flex-shrink: 0;
}

.page-title[b-jnnciuha4k] {
    font-weight: 600;
    color: #2c3e50;
    margin-bottom: 0.5rem;
    display: flex;
    align-items: center;
}

.card[b-jnnciuha4k] {
    border: none;
    border-radius: 0.5rem;
    background-color: #ffffff;
    flex-shrink: 0;
}

    .card:has(.log-pane)[b-jnnciuha4k] {
        flex: 1;
        display: flex;
        flex-direction: column;
        min-height: 0;
        overflow: hidden;
    }

        .card:has(.log-pane) .card-body[b-jnnciuha4k] {
            flex: 1;
            display: flex;
            flex-direction: column;
            min-height: 0;
            overflow: hidden;
        }

.card-header[b-jnnciuha4k] {
    border-top-left-radius: 0.5rem;
    border-top-right-radius: 0.5rem;
    border-bottom: 1px solid #dee2e6;
    background-color: #f8f9fa;
    flex-shrink: 0;
}

    .card-header h5[b-jnnciuha4k] {
        color: #212529;
    }

.input-group-container[b-jnnciuha4k] {
    display: flex;
    gap: 0.75rem;
    align-items: start;
}

.mock-level-select[b-jnnciuha4k] {
    min-width: 200px;
}

.create-button-wrapper[b-jnnciuha4k] {
    min-width: 240px;
    flex-shrink: 0;
}

.create-button[b-jnnciuha4k] {
    font-weight: 500;
}

.log-pane[b-jnnciuha4k] {
    flex: 1;
    min-height: 0;
    overflow-y: auto;
    overflow-x: hidden;
    background-color: #1e1e1e;
    font-family: 'Consolas', 'Monaco', 'Courier New', monospace;
}

.log-messages[b-jnnciuha4k] {
    padding: 1rem;
}

.log-entry[b-jnnciuha4k] {
    padding: 0.5rem;
    margin-bottom: 0.25rem;
    border-radius: 0.25rem;
    display: flex;
    align-items: flex-start;
    gap: 0.5rem;
    transition: background-color 0.2s;
}

    .log-entry:hover[b-jnnciuha4k] {
        background-color: rgba(255, 255, 255, 0.05);
    }

    .log-entry.log-error[b-jnnciuha4k] {
        background-color: rgba(220, 53, 69, 0.15);
        border-left: 3px solid #dc3545;
        color: #ff6b6b;
    }

    .log-entry.log-success[b-jnnciuha4k] {
        background-color: rgba(40, 167, 69, 0.15);
        border-left: 3px solid #28a745;
        color: #51cf66;
    }

    .log-entry.log-info[b-jnnciuha4k] {
        color: #e0e0e0;
    }

.log-icon[b-jnnciuha4k] {
    flex-shrink: 0;
    margin-top: 0.125rem;
}

.log-text[b-jnnciuha4k] {
    word-break: break-word;
    flex-grow: 1;
}

.form-label[b-jnnciuha4k] {
    color: #495057;
    margin-bottom: 0.5rem;
}

/* Dark mode overrides */
@media (prefers-color-scheme: dark) {
    .page-title[b-jnnciuha4k] {
        color: #e9ecef;
    }

    .card[b-jnnciuha4k] {
        background-color: #2b2b2b;
        border: 1px solid #404040;
    }

    .card-header[b-jnnciuha4k] {
        background-color: #333333;
        border-bottom-color: #404040;
    }

        .card-header h5[b-jnnciuha4k] {
            color: #e9ecef;
        }

    .form-label[b-jnnciuha4k] {
        color: #ced4da;
    }

    [b-jnnciuha4k] .text-muted {
        color: #adb5bd !important;
    }

    .log-pane[b-jnnciuha4k] {
        background-color: #1a1a1a;
        border: 1px solid #404040;
    }
}
/* /Components/Pages/Stock/StockUnitListPage.razor.rz.scp.css */
.quick-actions[b-uzjz8myeu5] {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(120px, 1fr));
    gap: 1rem;
}

.quick-action-card[b-uzjz8myeu5] {
    position: relative;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 1.5rem;
    border: 1px solid var(--bs-border-color);
    border-radius: 0.5rem;
    text-decoration: none;
    color: var(--bs-body-color);
    transition: all 0.3s ease;
    cursor: pointer;
}

    .quick-action-card:hover[b-uzjz8myeu5] {
        background: var(--bs-primary-bg-subtle);
        border-color: var(--bs-primary);
        color: var(--bs-primary-text-emphasis);
        transform: translateY(-2px);
    }

    .quick-action-card i[b-uzjz8myeu5] {
        font-size: 2rem;
        margin-bottom: 0.5rem;
    }
/* /Components/Pages/Store/CatalogItemVersionListPage.razor.rz.scp.css */
.version-history-container[b-62euuwd1im] {
    display: flex;
    flex-direction: column;
    height: calc(100vh - 60px);
    padding: 0.5rem;
}

/* Grid section fills available space when not comparing */
.grid-section[b-62euuwd1im] {
    flex: 1;
    min-height: 200px;
    overflow: hidden;
}

/* Wrapper uses CSS Grid so the DxSplitter child receives a definite size
   from the grid cell — unlike flex, grid items with stretch get a concrete
   height that height:100% on children can resolve against. */
.splitter-wrapper[b-62euuwd1im] {
    flex: 1;
    min-height: 0;
    display: grid;
}

/* DxSplitter fills the grid cell */
[b-62euuwd1im] .version-splitter {
    height: 100%;
    min-height: 0;
    border: 1px solid var(--bs-border-color);
    border-radius: 0.375rem;
}

/* Grid inside splitter pane */
.grid-pane[b-62euuwd1im] {
    height: 100%;
    overflow: hidden;
}

/* Comparison section fills its splitter pane */
.comparison-section[b-62euuwd1im] {
    height: 100%;
    display: flex;
    flex-direction: column;
    overflow: hidden;
}

.comparison-toolbar[b-62euuwd1im] {
    display: flex;
    align-items: center;
    padding: 0.5rem 0.75rem;
    background: var(--bs-tertiary-bg);
    border-bottom: 1px solid var(--bs-border-color);
    font-size: 0.9rem;
    flex-shrink: 0;
    user-select: none;
}

.comparison-title[b-62euuwd1im] {
    display: flex;
    align-items: center;
    gap: 0.25rem;
}

.comparison-loading[b-62euuwd1im] {
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 3rem;
    color: var(--bs-secondary-color);
}

/* Diff panel — uses CSS Grid so the DiffEditor child receives a definite
   size from the grid cell, avoiding height:100% resolution issues */
.diff-panel[b-62euuwd1im] {
    flex: 1;
    min-height: 0;
    display: grid;
    overflow: hidden;
}

/* Image comparison capped at 40% of the comparison pane */
.preview-comparison[b-62euuwd1im] {
    flex-shrink: 0;
    max-height: 40%;
    overflow: auto;
    border-top: 1px solid var(--bs-border-color);
}

.preview-comparison-header[b-62euuwd1im] {
    padding: 0.5rem 0.75rem;
    font-weight: 600;
    font-size: 0.85rem;
    background: var(--bs-tertiary-bg);
    border-bottom: 1px solid var(--bs-border-color);
    user-select: none;
    position: sticky;
    top: 0;
    z-index: 1;
}

.preview-comparison-body[b-62euuwd1im] {
    display: flex;
    gap: 0;
    padding: 1rem;
}

.preview-side[b-62euuwd1im] {
    flex: 1;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.5rem;
    min-width: 0;
}

.preview-side-label[b-62euuwd1im] {
    font-weight: 600;
    font-size: 0.85rem;
    color: var(--bs-body-color);
}

.preview-divider[b-62euuwd1im] {
    width: 1px;
    background: var(--bs-border-color);
    margin: 0 0.5rem;
    align-self: stretch;
}

.preview-img[b-62euuwd1im] {
    max-width: 100%;
    height: auto;
    border: 1px solid var(--bs-border-color);
    border-radius: 0.25rem;
}

.preview-unavailable[b-62euuwd1im] {
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 2rem;
    color: var(--bs-secondary-color);
    font-size: 0.85rem;
    font-style: italic;
}

/* Grid row styling — italics only for drafts, no colour change (readable in dark mode) */
[b-62euuwd1im] .draft-version-row {
    font-style: italic;
}

[b-62euuwd1im] .published-version-row {
    /* default styling */
}
/* /Components/Pages/Store/StoreFrontPage.razor.rz.scp.css */
.storefront-container[b-f11spe2cbh] {
    padding: 1rem;
}

.storefront-header[b-f11spe2cbh] {
    margin-bottom: 1.5rem;
}

.storefront-filters[b-f11spe2cbh] {
    display: flex;
    align-items: center;
    gap: 1rem;
    margin-bottom: 1.25rem;
    flex-wrap: nowrap;
}

.storefront-filter-label[b-f11spe2cbh] {
    white-space: nowrap;
    font-weight: 600;
    font-size: 0.85rem;
}

[b-f11spe2cbh] .storefront-filter-combo {
    width: 200px;
    min-width: 200px;
    max-width: 200px;
    flex: 0 0 200px;
}

.storefront-grid[b-f11spe2cbh] {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
    gap: 1.25rem;
}

.storefront-card[b-f11spe2cbh] {
    display: flex;
    flex-direction: column;
    border: 1px solid var(--bs-border-color, #dee2e6);
    border-radius: 0.5rem;
    overflow: hidden;
    cursor: pointer;
    transition: box-shadow 0.2s, transform 0.15s;
    background: var(--bs-body-bg, #fff);
}

    .storefront-card:hover[b-f11spe2cbh] {
        box-shadow: 0 4px 16px rgba(0,0,0,0.12);
        transform: translateY(-2px);
    }

.storefront-card-icon[b-f11spe2cbh] {
    display: flex;
    align-items: center;
    justify-content: center;
    height: 100px;
    background: var(--bs-tertiary-bg, #f0f0f0);
}

.storefront-card-icon-glyph[b-f11spe2cbh] {
    font-size: 2.5rem;
    opacity: 0.7;
}

.storefront-card-body[b-f11spe2cbh] {
    padding: 0.875rem 1rem;
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
    flex: 1;
}

.storefront-card-title[b-f11spe2cbh] {
    font-weight: 600;
    font-size: 1rem;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.storefront-card-entity[b-f11spe2cbh] {
    font-size: 0.8rem;
}

.storefront-card-description[b-f11spe2cbh] {
    font-size: 0.85rem;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    flex: 1;
}

.storefront-card-footer[b-f11spe2cbh] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-top: 0.5rem;
    padding-top: 0.5rem;
    border-top: 1px solid var(--bs-border-color, #dee2e6);
}

.storefront-popup-image[b-f11spe2cbh] {
    max-width: 100%;
    max-height: 200px;
    border-radius: 0.375rem;
    object-fit: contain;
}

.storefront-version-badge[b-f11spe2cbh] {
    background-color: #495057;
    color: #fff;
    font-size: 0.75rem;
    padding: 0.2em 0.55em;
    border-radius: 0.35rem;
    font-weight: 600;
    letter-spacing: 0.02em;
}

.storefront-status-icon[b-f11spe2cbh] {
    font-size: 0.95rem;
    cursor: default;
}

.storefront-acquired-icon[b-f11spe2cbh] {
    color: #198754;
}

.storefront-update-icon[b-f11spe2cbh] {
    color: #fd7e14;
}
/* /Components/Pages/TreeListPage.razor.rz.scp.css */
.list-container[b-ckzcto3l1d] {
    height: calc(100vh - var(--merc-header-height));
    margin: -2rem -3rem;
    display: flex;
    flex-direction: column;
    overflow: hidden;
    padding: 2rem 3rem;
}

.list-content[b-ckzcto3l1d] {
    flex: 1;
    min-height: 0;
    display: flex;
    flex-direction: column;
}

.filter-description[b-ckzcto3l1d] {
    cursor: pointer;
}

.filter-description:hover[b-ckzcto3l1d] {
    text-decoration: underline;
}

/* The toolbar card becomes the positioning context so the filter panel can
   overlay the content below it instead of pushing the page down. While the
   panel is open the card is lifted above the shading backdrop so its toolbar
   and filter description stay highlighted. */
.card:has(> .filter-inline-panel)[b-ckzcto3l1d] {
    position: relative;
    z-index: 1030;
}

/* Semi-transparent full-viewport layer that shades the rest of the page and
   dismisses the filter panel when the user clicks anywhere outside of it. */
.filter-backdrop[b-ckzcto3l1d] {
    position: fixed;
    inset: 0;
    z-index: 1020;
    background-color: rgba(0, 0, 0, 0.3);
}

.filter-inline-panel[b-ckzcto3l1d] {
    position: absolute;
    top: 100%;
    left: 0;
    right: 0;
    z-index: 1030;
    padding: 0.75rem;
    border: 1px solid var(--bs-border-color, #dee2e6);
    border-radius: 0 0 var(--bs-card-border-radius, 0.375rem) var(--bs-card-border-radius, 0.375rem);
    background-color: var(--bs-card-bg, #fff);
    box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.15);
    animation: filter-inline-unfold-b-ckzcto3l1d 0.2s ease-out;
    overflow: hidden;
}

@keyframes filter-inline-unfold-b-ckzcto3l1d {
    from {
        opacity: 0;
        max-height: 0;
    }

    to {
        opacity: 1;
        max-height: 1000px;
    }
}

/* DxLoadingPanel renders its own root element from DevExpress.Blazor's markup,
   not from this component's markup, so the CssClass="list-loading-panel"
   passed into it never receives this component's scope attribute. A plain
   (non-deep) selector can't match it - ::deep is required to reach it. */
[b-ckzcto3l1d] .list-loading-panel {
    flex: 1;
    min-height: 0;
    display: flex;
    flex-direction: column;
}

[b-ckzcto3l1d] .dxbl-loading-panel-target-content {
    flex: 1;
    min-height: 0;
    display: flex;
    flex-direction: column;
}

/* DevExpress Blazor v25.2+ VirtualScrollingEnabled auto-expands the TreeList to
   fit all rows (up to 10,000px) unless a CSS height constraint is defined.
   The TreeList calculates and applies this sizing at runtime (inline), which
   overrides plain CSS rules, so !important is required here to win the
   cascade and keep it inside the flex parent instead of overflowing the page. */
[b-ckzcto3l1d] .dxbl-treelist,
[b-ckzcto3l1d] .dxbl-grid {
    height: 100% !important;
    max-height: 100% !important;
}