@import '_content/Microsoft.FluentUI.AspNetCore.Components/Microsoft.FluentUI.AspNetCore.Components.bundle.scp.css';

/* /Components/AnonymizerContainer.razor.rz.scp.css */
[b-s6h889c8hs] .inputfile-content {
    width: 100%;
    height: calc(100vh-80px);
    text-align: unset !important;
}
.upload-card[b-s6h889c8hs] {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    width: 90%;
    padding: 15px;
    gap: 10px;
}

.drop-box-text[b-s6h889c8hs] {
    z-index: -1;
    text-align: center;
    width: 100%;
}

.fluent-inputfile-container input[type='file'][b-s6h889c8hs] {
    width: 100%;
    height: 100%;
    opacity: 0;
    position: relative;
}

.fluent-inputfile-container .inputfile-content[b-s6h889c8hs] {
    padding: 10px;
    z-index: 0 !important;
    min-height: 100px;
    display: flex;
    align-content: center;
    align-items: center;
    justify-items: center;
}

    .fluent-inputfile-container .inputfile-content .inputfile-progress[b-s6h889c8hs] {
        display: none;
        padding-top: 0px;
        height: 0px;
    }
/* /Components/ChatContainer.razor.rz.scp.css */
.chat-container-wrapper[b-htw1360oze] {
    display: flex;
}

[b-htw1360oze] #user-card {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: space-around;
    min-height: 80px;
    max-width: 50vw;
}

[b-htw1360oze] #user-prompt-textarea {
    width: 90%;
    margin-right: 1rem;
    overflow: hidden;
    /*   border: none;
   resize: none;
   height: 2rem;
   padding: 5px;
   overflow: hidden;
   background: var(--neutral-fill-stealth-rest);
   color: var(--neutral-foreground-rest);*/
}

[b-htw1360oze] .scrollable-container {
    overflow-y: auto;
    margin-bottom: 2rem;
}

[b-htw1360oze] #scrollable-container::-webkit-scrollbar-track {
    background-color: transparent;
}

[b-htw1360oze] #scrollable-container::-webkit-scrollbar {
    background-color: transparent;
    width: 15px;
}

[b-htw1360oze] #scrollable-container::-webkit-scrollbar-thumb {
    border-radius: 20px;
    border: 4px solid transparent;
    background-color: rgba(0,0,0,0.2);
    background-clip: content-box;
}

[b-htw1360oze] .initial-message-display {
    font-size: 1.5rem;
    text-align: center;
    width: 100%;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    height: 70vh;
    white-space: pre-wrap;
}

[b-htw1360oze] .initial-message-icon {
    color: var(--accent-fill-rest);
    margin-bottom: 2rem;
}

.character-counter[b-htw1360oze] {
    padding: 2px 0px;
    border-radius: 2px;
    position: absolute;
    width: -webkit-fill-available;
    text-align: end;
    bottom: 1px;
    right: 18px;
    font-size: 14px;
}

.image-wrapper[b-htw1360oze] {
    position: relative;
    display: inline-block;
}

.main-image[b-htw1360oze] {
    display: block;
    width: 32px;
    height: 32px;
    border-radius: 6px;
    object-fit: cover;
    border-radius: 4px;
    cursor: pointer;
    object-fit: cover;
    margin-top: 8px;
    margin-left: 4px;
}

.circle[b-htw1360oze] {
    position: absolute;
    top: 0px;
    right: -10px;
    background-color: red;
    color: white;
    border-radius: 50%;
    width: 16px;
    height: 16px;
    font-size: 10px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: bold;
    cursor: pointer;
    z-index: 2;
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.2);
}

    .circle:hover[b-htw1360oze] {
        background-color: darkred;
    }

.attachFileOrCollection[b-htw1360oze] {
    padding-left: 2px;
}

.logo-image[b-htw1360oze] {
    display: block;
    height: 18px;
    width: 18px;
    margin-right: 4px;
}
/* /Components/ChatMessage.razor.rz.scp.css */
.chat-message-wrapper[b-dwprk6x6vq] {
   display: flex;
   flex-direction: column;
   width: 100%;
}

[b-dwprk6x6vq] .message-header {
   display: flex;
   flex-direction: row;
   justify-content: space-between;
   align-items: center;
   width: 100%;
}

[b-dwprk6x6vq] .username {
   flex: 0 1 auto;
   margin-right: 1rem;
}

[b-dwprk6x6vq] .timestamp {
   flex: 0 1 auto;
}

[b-dwprk6x6vq] .graytext {
   color: dimgray;
   word-wrap: break-word;
   overflow-wrap: break-word;
}

[b-dwprk6x6vq] .message-content {
   word-wrap: break-word;
   overflow-wrap: break-word;
   white-space: pre-wrap;
}

[b-dwprk6x6vq] .user-generated {
   background-color: var(--neutral-fill-stealth-hover);
}

.attached-image[b-dwprk6x6vq] {
    border-radius: 6px;
    padding-bottom: 4px;
    max-width: 400px;
    max-height: 400px;
    cursor: pointer;
}
/* /Components/ChatSelection.razor.rz.scp.css */
.chat-item[b-zrij3167qe] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    white-space: nowrap;
    overflow: hidden;
    position: relative;
    cursor: pointer;
    padding: 5px;
    border-radius: calc(var(--control-corner-radius) * 1px);
}

.text[b-zrij3167qe] {
    max-width: calc(100% - 0px);
    white-space: nowrap;
    overflow: hidden;
    position: relative;
    text-overflow: ellipsis;
    padding: 0px 3px;
}

    .text.bulk-selected[b-zrij3167qe] {
        border: 1px var(--neutral-fill-inverse-rest) solid;
        border-radius: 5px;
        background: grey;
    }

   .text[b-zrij3167qe]::after {
      content: '';
      position: absolute;
      top: 0;
      right: 0;
      bottom: 0;
      width: 50px;
      pointer-events: none;
   }

.chat-item:hover .text[b-zrij3167qe]::after {
   background: linear-gradient(to right, transparent, var(--neutral-fill-stealth-hover))
}

.chat-item:hover[b-zrij3167qe] {
   background-color: var(--neutral-fill-stealth-hover);
   border-radius: 8px;
}

.icons[b-zrij3167qe] {
    display: flex;
    gap: 10px;
    opacity: 0;
    transition: opacity 0.3s;
    width: auto;
}

.icons-position[b-zrij3167qe] {
   display: flex;
   gap: 10px; 
   width: 100%;
}

.chat-item:hover .icons[b-zrij3167qe] {
   opacity: 1;
}

.icons i[b-zrij3167qe] {
   cursor: pointer;
   color: var(--accent-fill-rest);
   background-color: transparent;
}

   .icons i:hover[b-zrij3167qe] {
      color: var(--accent-fill-hover);
   }

.icons .delete-icon:hover[b-zrij3167qe]{
    color: red;
}
/* /Components/DataGridEx/Columns/ColumnBaseEx.razor.rz.scp.css */
/* Contains the title text and sort indicator, and expands to fill as much of the col width as it can */
.col-title[b-tk6qbja5zh] {
    display: flex; /* So that we can make col-title-text expand as much as possible, and still hide overflow with ellipsis */
    min-width: 0px;
    flex-grow: 1;
    padding: 0;
}

/* If the column is sortable, its title is rendered as a button element for accessibility and to support navigation by tab */
button.col-title[b-tk6qbja5zh] {
    border: none;
    background: none;
    position: relative;
    cursor: pointer;
}

.col-justify-center .col-title[b-tk6qbja5zh] {
    justify-content: center;
}

.col-justify-end .col-title[b-tk6qbja5zh], .col-justify-right .col-title[b-tk6qbja5zh] {
    flex-direction: row-reverse; /* For end-justified cols, the sort indicator should appear before the title text */
}

/* We put the column title text in its own element primarily so that it can use text-overflow: ellipsis */
.col-title-text[b-tk6qbja5zh] {
    text-overflow: ellipsis;
    overflow: hidden;
    white-space: nowrap;
}

/* /Components/DataGridEx/FluentDataGridCellEx.razor.rz.scp.css */
fluent-data-grid-cell[b-5h11zxerah] {
    text-overflow: ellipsis;
}

.multiline-text[b-5h11zxerah] {
    white-space: inherit;
    overflow: auto;
    word-break: break-word;
}

.column-header[b-5h11zxerah] {
    display: flex;
    width: 100%;
    height: 100%;
    align-self: center;
    padding-inline: 0;
    padding-right: 1px;
    padding-left: 1px;
}

    .column-header.col-justify-end[b-5h11zxerah], .column-header.col-justify-right[b-5h11zxerah] {

        padding-right: 1px;
        padding-left: 1px;
        justify-content: end;
    }

    .column-header.col-justify-center[b-5h11zxerah] {

        padding-left: 1px;
        padding-right: 1px;
        justify-content: center;
    }

    .column-header[b-5h11zxerah] >  .keycapture {
        display: flex;
        flex-grow: 1;
    }

    .column-header[b-5h11zxerah] >  .keycapture .col-sort-container {
        display: flex;
        flex-grow: 1;
    }

    .column-header[b-5h11zxerah] >  .keycapture .col-sort-container .col-sort-button {
        flex-grow: 1;
        padding-inline-end: 5px;
    }

        .column-header[b-5h11zxerah] >  .keycapture .col-sort-container .col-sort-button::part(content) {
            overflow: hidden;
            text-overflow: ellipsis;
        }

    .column-header.col-justify-end[b-5h11zxerah]  .col-title-text, .column-header.col-justify-right[b-5h11zxerah]  .col-title-text {
        text-align: end;
    }

    .column-header.col-justify-end[b-5h11zxerah]  .col-sort-button, .column-header.col-justify-right[b-5h11zxerah]  .col-sort-button {
        justify-content: end;
    }

    .column-header.col-justify-center[b-5h11zxerah]  .col-title-text {
        text-align: center;
    }

    .column-header.col-justify-end[b-5h11zxerah]  .col-sort-button, .column-header.col-justify-right[b-5h11zxerah]  .col-sort-button {
        justify-content: end;
        text-align: end;
    }

[b-5h11zxerah] .col-sort-button::part(control) {
    align-items: center;
    justify-content: start;
    overflow: hidden;
    text-overflow: ellipsis;
    width:25px;
}

.col-justify-center[b-5h11zxerah]  .col-sort-button::part(control) {
    justify-content: center;
}

.col-justify-end[b-5h11zxerah]  .col-sort-button::part(control), .col-justify-right[b-5h11zxerah]  .col-sort-button::part(control) {
    justify-content: end;
}

.col-justify-center[b-5h11zxerah] {
    justify-self: center;
}

.col-justify-end[b-5h11zxerah], .col-justify-right[b-5h11zxerah] {
    justify-self:  end;
    padding-inline-end: 20px;
}

.col-cell-align-center[b-5h11zxerah] {
   text-align: center;
}
.col-cell-align-end[b-5h11zxerah], .col-cell-align-right[b-5h11zxerah] {
   text-align: right;
   padding-inline-end: 20px;
}

    .col-justify-end .col-title[b-5h11zxerah], .col-justify-right .col-title[b-5h11zxerah] {
        justify-content: end;
    }

[b-5h11zxerah] .col-title {
    padding: 0 calc((12 + (var(--design-unit) * 2 * var(--density))) * 1px);
    display: flex;
    align-items: center;
}

[b-5h11zxerah] .col-title-text {
    text-overflow: ellipsis;
    overflow: hidden;
    white-space: nowrap;
    font-weight: 600;
}



/* /Components/DataGridEx/FluentDataGridEx.razor.rz.scp.css */
fluent-data-grid[b-ine221qxml] {
    --col-gap: 1rem;
}

[b-ine221qxml] .empty-content-row,
[b-ine221qxml] .loading-content-row {
    width: 100%;
    height: 100% !important ;
    display: flex;
    justify-content: center;
    align-items: center;
}

[b-ine221qxml] .empty-content-cell, 
[b-ine221qxml] .loading-content-cell {

    font-weight: 600;
}

.col-options[b-ine221qxml] {
    position: absolute;
    top: 2.2rem;
    background: var(--neutral-layer-2);
    border: 1px solid var(--neutral-layer-3);
    border-radius: 0.3rem;
    box-shadow: 0 3px 8px 1px var(--neutral-layer-4);
    padding: 1rem;
    z-index: 1;
}

[dir=rtl] .col-options[b-ine221qxml] {
    left: unset;
}

.col-justify-end .col-options[b-ine221qxml], .col-justify-right .col-options[b-ine221qxml] {
    left: unset;
    right: 0.2rem;
}

[dir=rtl] .col-justify-end .col-options[b-ine221qxml], [dir=rtl] .col-justify-right .col-options[b-ine221qxml] {
    right: unset;
    left: 0.2rem;
}

[b-ine221qxml] > fluent-data-grid-row > fluent-data-grid-cell.grid-cell-placeholder:after {
    content: '\2026'; /*horizontal ellipsis*/
    opacity: 0.75;
}

[b-ine221qxml] .col-width-draghandle {
    height: auto;
    width: calc(var(--design-unit) * 1px + 2px);
    right: calc(var(--col-gap)/2 - 0.5rem);
    border-top: none;
    border-left: calc(var(--stroke-width) * 1px) solid var(--neutral-stroke-divider-rest);
    cursor: col-resize;
}

.col-width-draghandle:hover[b-ine221qxml], .col-width-draghandle:active[b-ine221qxml] {
    background: var(--neutral-stroke-divider-rest);
}
/* /Components/DataGridEx/FluentDataGridRowEx.razor.rz.scp.css */
.header[b-hu2hxwbnpk] {
    padding: 0;
    z-index: 3;
}

.sticky-header[b-hu2hxwbnpk] {
    z-index: 3;
}

.hover:not([row-type='header'],[row-type='sticky-header']):hover[b-hu2hxwbnpk] {
    cursor: pointer;
    background-color: var(--datagrid-hover-color, var(--neutral-fill-stealth-hover));
}
/* /Components/DocumentEntityRecognition.razor.rz.scp.css */
[b-0hm8seze2k] .inputfile-content {
   width: 100%;
   height: calc(100vh-80px);
   text-align: unset !important;
}
/* /Components/DocumentTranscription.razor.rz.scp.css */
[b-tcz2pnpby0] .inputfile-content {
   width: 100%;
   height: calc(100vh-80px);
   text-align: unset !important;
}
/* /Components/DocumentTranscriptionTable.razor.rz.scp.css */
.table-scroll-wrapper[b-v0lqbrqdzo] {
    padding: 15px 0px;
}
/* /Components/DocumentTranslation.razor.rz.scp.css */
[b-fmdsx3y9x7] .inputfile-content {
   width: 100%;
   height: calc(100vh-80px);
   text-align: unset !important;
}
/* /Components/DocumentTranslationTable.razor.rz.scp.css */
/* --- Actions column --- */
.actions-cell[b-vqraculdd0] {
    display: flex;
    align-items: center;
    gap: .6rem;
}

/* --- EU READY badge --- */
.eu-ready-badge[b-vqraculdd0] {
    flex: 0 0 auto;
    display: inline-flex;
    align-items: center;
    padding: 1px 7px;
    border-radius: 10px;
    font-size: 10px;
    font-weight: 700;
    letter-spacing: .04em;
    text-transform: uppercase;
    color: #ffffff;
    background: linear-gradient(135deg, #003399, #2557d6);
    white-space: nowrap;
}

/* --- "To" column batch cell --- */
.eu-to-cell[b-vqraculdd0] {
    display: flex;
    align-items: center;
    gap: 8px;
}

.group-icon[b-vqraculdd0] {
    width: 24px;
    height: 24px;
    flex: 0 0 auto;
    border-radius: 4px;
    object-fit: cover;
}

.eu-to-text[b-vqraculdd0] {
    display: flex;
    flex-direction: column;
    line-height: 1.2;
    /* allow the text column to shrink below its content width so the title can ellipsize */
    min-width: 0;
}

.eu-to-title[b-vqraculdd0] {
    font-size: 13px;
    font-weight: 600;
    color: var(--neutral-foreground-rest);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.eu-to-sub[b-vqraculdd0] {
    font-size: 11px;
    color: var(--neutral-foreground-hint);
}

/* --- batch progress cell --- */
.batch-progress[b-vqraculdd0] {
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.batch-progress-top[b-vqraculdd0] {
    display: flex;
    align-items: center;
    gap: 5px;
}

.batch-progress-summary[b-vqraculdd0] {
    font-size: 12px;
    color: var(--neutral-foreground-rest);
}

.batch-progress-percent[b-vqraculdd0] {
    font-size: 12px;
    opacity: .75;
    margin-left: auto;
}

.batch-progress[b-vqraculdd0]  fluent-progress {
    width: 100%;
    --accent-fill-rest: #6366F1;
    --accent-fill-hover: #6366F1;
    --accent-fill-active: #6366F1;
}

.batch-chip-dot[b-vqraculdd0] {
    width: 8px;
    height: 8px;
    border-radius: 50%;
    flex-shrink: 0;
    display: inline-block;
}

/* The grid is `width: fit-content`, so it stays as wide as the sum of its columns
   and the wrapper scrolls horizontally on narrow viewports. Making the wrapper a
   query container lets the expanded detail panel below size itself to the *visible*
   width (100cqw) instead of the full scroll width. */
.table-scroll-wrapper[b-vqraculdd0] {
    container-type: inline-size;
}

/* Each data cell stretches to the row's height, but its content otherwise sits at the top.
   Wrapping a column's content in this full-height box vertically centers it within the row.
   A flex *column* with justify-content:center handles the centering, while the default
   align-items:stretch keeps children full-width (so the progress bar and the truncating
   file-name column behave exactly as before). min-width:0 preserves ellipsis. */
.cell-content[b-vqraculdd0] {
    display: flex;
    flex-direction: column;
    justify-content: center;
    height: 100%;
    min-width: 0;
}

/* --- inline detail row (rendered by the grid component) --- */
.table-scroll-wrapper[b-vqraculdd0]  .row-detail {
    display: block;
    width: 100%;
    height: auto;
    background: transparent;
}

.table-scroll-wrapper[b-vqraculdd0]  .row-detail:hover {
    background: transparent;
}

/* The cell spans every column, so by default it inherits the grid's full (scroll)
   width and never shrinks with the browser. Size it to the wrapper's visible width
   and pin it to the left so it tracks the viewport during horizontal scroll. */
.table-scroll-wrapper[b-vqraculdd0]  .row-detail-cell {
    display: block;
    grid-column: 1 / -1;
    position: sticky;
    left: 0;
    width: 100cqw;
    box-sizing: border-box;
    padding: 2px 12px 8px 12px;
    overflow: visible;
}

/* batch rows are clickable to expand/collapse */
.table-scroll-wrapper[b-vqraculdd0]  .batch-row {
    cursor: pointer;
}

/* only an expanded batch row gets the subtle tint */
.table-scroll-wrapper[b-vqraculdd0]  .batch-row-expanded {
    background: rgba(127, 127, 127, 0.045);
}

/* --- expanded batch detail panel --- */
.eu-batch-detail[b-vqraculdd0] {
    display: flex;
    flex-direction: column;
    gap: 14px;
    padding: 14px 16px 16px 16px;
    background: rgba(127, 127, 127, 0.045);
    border: 1px solid var(--neutral-stroke-divider-rest);
    border-radius: 10px;
}

.eu-batch-head[b-vqraculdd0] {
    display: flex;
    align-items: center;
    gap: 10px 20px;
}

.eu-batch-head-title[b-vqraculdd0] {
    font-size: 14px;
    font-weight: 600;
    color: var(--neutral-foreground-rest);
}

/* the languages grid and the summary card are siblings here; align-items:flex-start
   keeps each at its natural height so the language grid fits its content (rows/columns
   no longer stretch to match the taller summary card) and the summary card stays put
   on the right while the language area scrolls horizontally when there are many
   languages */
.eu-batch-body[b-vqraculdd0] {
    display: flex;
    align-items: flex-start;
    gap: 16px;
}

/* --- languages laid out in columns ---
   Each column is rendered as its own box and filled top-to-bottom before the next
   one starts (the chunking happens in code). Columns are sized to their content and
   separated by a thin vertical divider line. When there are only a few languages the
   columns stay compact (left-aligned, no stretching); when there are many the area
   scrolls horizontally so the summary card and collapse/download buttons stay in place. */
.eu-lang-columns[b-vqraculdd0] {
    flex: 1 1 auto;
    min-width: 0;
    display: flex;
    align-items: flex-start;
    overflow-x: auto;
    padding-bottom: 5px;
}

/* match the app-wide custom scrollbar used on .table-scroll-wrapper */
.eu-lang-columns[b-vqraculdd0]::-webkit-scrollbar-track {
    background-color: transparent;
}

.eu-lang-columns[b-vqraculdd0]::-webkit-scrollbar {
    background-color: transparent;
    height: 15px;
}

.eu-lang-columns[b-vqraculdd0]::-webkit-scrollbar-thumb {
    border-radius: 20px;
    border: 4px solid transparent;
    background-color: rgba(0, 0, 0, 0.2);
    background-clip: content-box;
}

.eu-lang-columns[b-vqraculdd0]::-webkit-scrollbar-thumb:hover {
    cursor: pointer;
    background-color: rgba(0, 0, 0, 0.35);
}

.eu-lang-columns[b-vqraculdd0]::-webkit-scrollbar-thumb:active {
    background-color: rgba(0, 0, 0, 0.5);
}

.eu-lang-column[b-vqraculdd0] {
    flex: 0 0 auto;
    display: flex;
    flex-direction: column;
    padding: 0 20px;
    border-right: 1px solid var(--neutral-stroke-divider-rest);
}

.eu-lang-column:first-child[b-vqraculdd0] {
    padding-left: 0;
}

.eu-lang-column:last-child[b-vqraculdd0] {
    padding-right: 0;
    border-right: none;
}

/* rows sit at their natural height (no vertical stretching) so a batch with only a
   few languages stays compact, with a thin separator line between consecutive rows */
.eu-lang-row[b-vqraculdd0] {
    flex: 0 0 auto;
    min-height: 40px;
    display: flex;
    align-items: center;
    gap: 10px;
}

.eu-lang-row:not(:last-child)[b-vqraculdd0] {
    border-bottom: 1px solid var(--neutral-stroke-divider-rest);
}

.eu-lang-name[b-vqraculdd0] {
    flex: 0 0 auto;
    width: 96px;
    font-size: 13px;
    font-weight: 600;
    color: var(--neutral-foreground-rest);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.eu-lang-status[b-vqraculdd0] {
    flex: 0 0 auto;
    width: 76px;
    font-size: 12px;
    color: var(--neutral-foreground-hint);
    white-space: nowrap;
}

/* actions follow the status directly (not pushed to the column's right edge) */
.eu-lang-actions[b-vqraculdd0] {
    flex: 0 0 auto;
    display: inline-flex;
    align-items: center;
    gap: 8px;
}

/* matches the PreviewIcon wrapper footprint so the download icon lines up whether
   a row shows the live preview control or the disabled placeholder */
.eu-lang-eye-box[b-vqraculdd0] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 20px;
    padding-right: 0.3rem;
}

.eu-lang-icon[b-vqraculdd0] {
    cursor: pointer;
    font-size: 15px;
    color: var(--neutral-foreground-rest);
}

.eu-lang-icon-disabled[b-vqraculdd0] {
    cursor: default;
    opacity: .4;
}

/* --- collapse / download footer --- */
.eu-detail-footer[b-vqraculdd0] {
    display: flex;
    align-items: center;
    gap: 8px;
}

.eu-detail-btn[b-vqraculdd0] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 5px 12px;
    font-size: 12px;
    color: var(--neutral-foreground-rest);
    background: rgba(127, 127, 127, 0.06);
    border: 1px solid var(--neutral-stroke-divider-rest);
    border-radius: 6px;
    cursor: pointer;
}

.eu-detail-btn:hover[b-vqraculdd0] {
    background: rgba(127, 127, 127, 0.12);
}

/* --- summary card (donut chart + legend) --- */
.eu-summary-card[b-vqraculdd0] {
    flex: 0 0 200px;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 14px;
    padding: 16px 14px;
    border: 1px solid var(--neutral-stroke-divider-rest);
    border-radius: 10px;
    background: rgba(127, 127, 127, 0.06);
}

.eu-donut-wrap[b-vqraculdd0] {
    position: relative;
    width: 120px;
    height: 120px;
    display: flex;
    align-items: center;
    justify-content: center;
    /* Custom properties cascade across the component boundary, recoloring the
       FluentProgressRing's determinate arc without needing ::deep. */
    --accent-fill-rest: #6366F1;
    --accent-fill-hover: #6366F1;
    --accent-fill-active: #6366F1;
}

/* The ring's circles live in shadow DOM with a hardcoded 2px stroke (~12.5% of
   the 16-unit viewBox). They expose CSS parts, so ::part() pierces the shadow
   boundary to thin the ring to match the design. */
.eu-donut-wrap[b-vqraculdd0]  fluent-progress-ring::part(determinate),
.eu-donut-wrap[b-vqraculdd0]  fluent-progress-ring::part(background) {
    stroke-width: 1px;
}

/* The component leaves the track circle without a stroke color, so it vanishes
   at 0%. Color it so the ring is always visible as an empty circle. */
.eu-donut-wrap[b-vqraculdd0]  fluent-progress-ring::part(background) {
    stroke: rgba(127, 127, 127, 0.25);
}

.eu-donut-center[b-vqraculdd0] {
    position: absolute;
    inset: 0;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    line-height: 1.15;
}

.eu-donut-count[b-vqraculdd0] {
    font-size: 20px;
    font-weight: 700;
    color: var(--neutral-foreground-rest);
}

.eu-donut-label[b-vqraculdd0] {
    font-size: 11px;
    color: var(--neutral-foreground-hint);
}

.eu-legend[b-vqraculdd0] {
    display: flex;
    flex-direction: column;
    gap: 7px;
    align-self: stretch;
}

.eu-legend-row[b-vqraculdd0] {
    display: flex;
    align-items: center;
    gap: 8px;
}

.eu-legend-text[b-vqraculdd0] {
    font-size: 12px;
    color: var(--neutral-foreground-rest);
}

/* /Components/ExpertGptView.razor.rz.scp.css */
.page-header[b-ff6up36wi6] {
    margin-top: 5px;
    margin-bottom: 12px;
    display: flex;
    justify-content: flex-end;
    align-items: center;
    gap: 10px;
}

.table-scroll-wrapper[b-ff6up36wi6] {
    margin-bottom: 20px;
    padding: 10px;
    box-shadow: 0 5px 10px rgba(0, 0, 0, 0.5);
    border-radius: 5px;
}

    .table-scroll-wrapper[b-ff6up36wi6]  .clickable-title {
        cursor: pointer;
        overflow: hidden;
        text-overflow: ellipsis;
    }

        .table-scroll-wrapper[b-ff6up36wi6]  .clickable-title:hover {
            text-decoration: underline;
        }

.fa-trash-can[b-ff6up36wi6] {
    margin-left: 4px;
}

.status-line[b-ff6up36wi6] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    min-width: 0;
}

    .status-line > span[b-ff6up36wi6] {
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

.info-link[b-ff6up36wi6] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    cursor: pointer;
    color: inherit;
    text-decoration: none;
}

    .info-link:hover[b-ff6up36wi6] {
        color: inherit;
    }

        .info-link:hover .info-link-text[b-ff6up36wi6] {
            text-decoration: underline;
        }
/* /Components/FluentNavLinkEx.razor.rz.scp.css */
[b-u6dff6w5k0] .fluent-nav-link {
    width: 100%;
    color: inherit;
    align-items: center;
    text-decoration: none;
    display: flex;
}

[b-u6dff6w5k0] .fluent-nav-icon {
    
    min-width: 20px;
}

[b-u6dff6w5k0] .fluent-nav-link.disabled {
    color: var(--neutral-fill-secondary-rest) !important;
    cursor: not-allowed ;
    pointer-events: none;
}


[b-u6dff6w5k0] .fluent-nav-link.disabled .fluent-nav-icon {
    fill: var(--neutral-stroke-rest) !important;
}
/* /Components/FluentPersonaEx.razor.rz.scp.css */
.fluent-persona[b-vm1f5707cq] {
    display: flex;
    height: 100%;
    width: fit-content;
    border-radius: 999px;
    align-items: center;
    white-space: nowrap;
    text-overflow: ellipsis;
}

    .fluent-persona .initials[b-vm1f5707cq] {
        display: flex;
        color: var(--fill-color);
        background: var(--accent-stroke-control-active);
        font-weight: 600;
        border-radius: 50%;
        text-align: center;
        align-items: center;
        justify-content: center;
        aspect-ratio: 1/1;
    }

        .fluent-persona .initials img[b-vm1f5707cq] {
            border-radius: 50%;
            aspect-ratio: 1 / 1;
            height: 100%;
            width: 100%;
        }

    .fluent-persona .name[b-vm1f5707cq] {
        margin-left: 16px;
    }

    .fluent-persona .close[b-vm1f5707cq] {
        display: flex;
        text-align: center;
        align-items: center;
        justify-content: center;
        margin: 0px 4px;
    }
/* /Components/InsightForge/Pages/Ingestion.razor.rz.scp.css */
/* /Components/InsightForge/Pages/InsightExport.razor.rz.scp.css */
/* /Components/InsightForge/Pages/InsightGraph.razor.rz.scp.css */
/* /Components/InsightForge/Pages/InsightMap.razor.rz.scp.css */
/* /Components/InsightForge/Pages/InsightSettings.razor.rz.scp.css */
/* /Components/InsightForge/Pages/Reviews.razor.rz.scp.css */
/* /Components/LanguageGroupDetails.razor.rz.scp.css */
.language-group-panel[b-v172hm391h] {
    width: 100%;
    min-width: 0;
    max-width: 100%;
    box-sizing: border-box;
    border: 1px solid var(--neutral-stroke-divider-rest);
    border-radius: 8px;
    padding: 16px 20px;
    background: var(--neutral-layer-1);
}

.language-group-header[b-v172hm391h] {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-bottom: 14px;
}

.language-group-title[b-v172hm391h] {
    font-weight: 600;
    font-size: 14px;
    color: var(--neutral-foreground-rest);
}

.language-group-count[b-v172hm391h] {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    margin-left: auto;
    flex: 0 0 auto;
    font-size: 12px;
    color: var(--neutral-foreground-hint);
}

.language-group-grid[b-v172hm391h] {
    display: grid;
    /* Multiple columns that fit the available width. auto-fill collapses to a
       single column under content-based sizing, so it never widens the dialog. */
    grid-template-columns: repeat(auto-fill, minmax(150px, 1fr));
    /* Fixed row height so exactly two rows can be shown regardless of content. */
    grid-auto-rows: 28px;
    column-gap: 24px;
    row-gap: 10px;
    min-width: 0;
    max-width: 100%;
    /* Show only two rows (2 × 28px row + the 10px gap between them); the rest scrolls. */
    max-height: 66px;
    overflow-y: auto;
    padding-right: 6px;
}

.language-group-grid[b-v172hm391h]::-webkit-scrollbar-track {
    background-color: transparent;
}

.language-group-grid[b-v172hm391h]::-webkit-scrollbar {
    background-color: transparent;
    width: 15px;
}

.language-group-grid[b-v172hm391h]::-webkit-scrollbar-thumb {
    border-radius: 20px;
    border: 4px solid transparent;
    background-color: rgba(0,0,0,0.2);
    background-clip: content-box;
}

.language-group-lang[b-v172hm391h] {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 13px;
    color: var(--neutral-foreground-rest);
}

.language-group-info[b-v172hm391h] {
    display: flex;
    align-items: center;
    gap: 10px;
    width: 100%;
    box-sizing: border-box;
    margin-top: 12px;
    padding: 10px 14px;
    border-radius: 8px;
    background: var(--neutral-layer-2);
    font-size: 13px;
    color: var(--neutral-foreground-hint);
}
/* /Components/Layout/NavMenu.razor.rz.scp.css */
body[b-2topi8d4in] {
}

/* Active item indicator */
[b-2topi8d4in] .fluent-nav-item a.active .positioning-region::before {
    content: "";
    display: block;
    position: absolute;
    right: unset;
    width: 3px;
    height: calc((((var(--base-height-multiplier) + var(--density)) * var(--design-unit) ) - var(--base-height-multiplier)) * 1px);
    background: var(--accent-fill-rest);
    border-radius: calc(var(--control-corner-radius) * 1px);
    margin: calc(var(--design-unit) * 2px) 2px;
    z-index: 5;
}

[b-2topi8d4in] .fluent-appbar-item:not(.popover) a.active::before {
    width: 5px !important;
}
/* /Components/Pages/SystemSettings.razor.rz.scp.css */
[b-udryo1pz5q] fluent-tabs::part(activeIndicator) {
   width: 75%;
}

[b-udryo1pz5q] fluent-tab svg {
   margin-right: .25em;
}
/* /Components/Pages/Transcription.razor.rz.scp.css */
[b-37x900r0sq] fluent-tabs::part(activeIndicator) {
   width: 75%;
}

[b-37x900r0sq] fluent-tab svg {
   margin-right: .25em;
}
/* /Components/Pages/Translation.razor.rz.scp.css */
[b-e582wlpxm5] fluent-tabs::part(activeIndicator) {
   width: 75%;
}

[b-e582wlpxm5] fluent-tab svg {
   margin-right: .25em;
}
/* /Components/PaginationEx/FluentPaginatorEx.razor.rz.scp.css */
.paginator[b-qmbrzqmxzk] {
    /*border-top: 1px solid var(--neutral-stroke-divider-rest);*/
    margin-top: 0.5rem;
    padding: 0.25rem 0;
    align-items: center;
}

.pagination-text[b-qmbrzqmxzk] {
    margin: 0 0.5rem;
}

.paginator-nav[b-qmbrzqmxzk] {
    padding: 0; 
    display: flex;
    margin-inline-start: auto;
    margin-inline-end: 0;
    gap: 0.5rem;
    align-items: center;
    flex: 1;
    text-align: right;
    justify-content: flex-end;
}

    
[dir="rtl"] *[b-qmbrzqmxzk]  fluent-button > svg {
    transform: rotate(180deg);
}

.paginator-content[b-qmbrzqmxzk] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 0.5rem;
}

.summary[b-qmbrzqmxzk] {
    flex: 1;
    text-align: left;
}

.filter-center[b-qmbrzqmxzk] {
    flex: 1;
    text-align: center;
}
/* /Components/Preview/DualDocumentPreview.razor.rz.scp.css */
/* Side-by-side document preview.

   --ddp-split is the left pane's width as a percentage. It is written by the JS module while the
   splitter is dragged and never rendered by Blazor, so a re-render cannot undo a resize. */

.ddp-root[b-luoj3c9gz2] {
    --ddp-split: 50;
    --ddp-splitter-width: 10px;
    --ddp-page-gap: 12px;
    display: flex;
    flex-direction: column;
    width: 100%;
    height: 100%;
    min-height: 0;
    overflow: hidden;
    background: var(--neutral-layer-1);
}

/* In full screen the root is sized by the browser, not by the dialog cell it normally fills, so
   height:100% has nothing to resolve against — pin it to the viewport. The explicit background
   matters too: a full-screened element is painted on black by default, which would show through
   around the pages. Prefixed selectors cannot be grouped — a browser drops the whole rule if it
   does not recognise one selector in the list — so they are written out separately. */
.ddp-root:fullscreen[b-luoj3c9gz2] {
    width: 100vw;
    height: 100vh;
    background: var(--neutral-layer-1);
}

.ddp-root:-webkit-full-screen[b-luoj3c9gz2] {
    width: 100vw;
    height: 100vh;
    background: var(--neutral-layer-1);
}

.ddp-root:-moz-full-screen[b-luoj3c9gz2] {
    width: 100vw;
    height: 100vh;
    background: var(--neutral-layer-1);
}

.ddp-root:-ms-fullscreen[b-luoj3c9gz2] {
    width: 100vw;
    height: 100vh;
    background: var(--neutral-layer-1);
}

/* ── toolbar ─────────────────────────────────────────────────────────────── */

.ddp-toolbar[b-luoj3c9gz2] {
    display: flex;
    align-items: center;
    gap: 8px;
    flex: 0 0 auto;
    padding: 6px 10px;
    border-bottom: 1px solid var(--neutral-stroke-rest);
    background: var(--neutral-layer-2);
}

.ddp-toolbar[b-luoj3c9gz2]  fluent-divider {
    height: 22px;
}

.ddp-toolbar-spacer[b-luoj3c9gz2] {
    flex: 1 1 auto;
}

.ddp-zoom[b-luoj3c9gz2] {
    display: flex;
    align-items: center;
    gap: 2px;
}

.ddp-zoom-value[b-luoj3c9gz2] {
    min-width: 4ch;
    text-align: center;
    font-size: 0.82em;
    font-variant-numeric: tabular-nums;
    color: var(--neutral-foreground-hint);
}

/* ── panes ───────────────────────────────────────────────────────────────── */

.ddp-body[b-luoj3c9gz2] {
    display: flex;
    flex: 1 1 auto;
    min-height: 0;
    min-width: 0;
}

.ddp-pane[b-luoj3c9gz2] {
    display: flex;
    flex-direction: column;
    min-width: 0;
    min-height: 0;
}

.ddp-pane-original[b-luoj3c9gz2] {
    /* Subtracting the splitter keeps the two panes from overflowing the row at 100% total. */
    flex: 0 0 calc(var(--ddp-split) * 1% - var(--ddp-splitter-width) / 2);
}

.ddp-pane-translated[b-luoj3c9gz2] {
    flex: 1 1 auto;
}

/* Collapsed rather than removed: the pane keeps its rendered pages, so showing it again is
   instant instead of a reload. */
.ddp-collapsed .ddp-pane-original[b-luoj3c9gz2],
.ddp-collapsed .ddp-splitter[b-luoj3c9gz2] {
    display: none;
}

.ddp-pane-header[b-luoj3c9gz2] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    flex: 0 0 auto;
    padding: 6px 12px;
    border-bottom: 1px solid var(--neutral-stroke-rest);
    background: var(--neutral-layer-2);
}

.ddp-pane-titles[b-luoj3c9gz2] {
    display: flex;
    flex-direction: column;
    min-width: 0;
}

.ddp-pane-label[b-luoj3c9gz2] {
    font-size: 0.72em;
    font-weight: 600;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    color: var(--accent-fill-rest);
}

.ddp-pane-name[b-luoj3c9gz2] {
    font-size: 0.86em;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    color: var(--neutral-foreground-rest);
}

.ddp-pane-pages[b-luoj3c9gz2] {
    flex: 0 0 auto;
    font-size: 0.78em;
    font-variant-numeric: tabular-nums;
    color: var(--neutral-foreground-hint);
}

.ddp-pane-content[b-luoj3c9gz2] {
    position: relative;
    flex: 1 1 auto;
    min-height: 0;
}

/* ── viewport (owned by the JS module) ───────────────────────────────────── */

.ddp-viewport[b-luoj3c9gz2] {
    position: absolute;
    inset: 0;
    overflow: auto;
    overscroll-behavior: contain;
    background: var(--neutral-layer-3);
}

.ddp-viewport[b-luoj3c9gz2]  .ddp-pages {
    display: flex;
    flex-direction: column;
    align-items: center;
    padding: var(--ddp-page-gap) 0;
}

.ddp-viewport[b-luoj3c9gz2]  .ddp-page {
    position: relative;
    flex: 0 0 auto;
    background: #ffffff;
    box-shadow: 0 1px 4px rgba(0, 0, 0, 0.28);
}

.ddp-viewport[b-luoj3c9gz2]  .ddp-page-canvas {
    display: block;
    /* The bitmap is drawn at the device pixel ratio; CSS scales it back to layout size and, while
       the splitter is moving, stretches it to the new size until a crisp re-render lands. */
    width: 100%;
    height: 100%;
}

/* ── splitter ────────────────────────────────────────────────────────────── */

.ddp-splitter[b-luoj3c9gz2] {
    flex: 0 0 var(--ddp-splitter-width);
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: col-resize;
    background: var(--neutral-layer-2);
    border-left: 1px solid var(--neutral-stroke-rest);
    border-right: 1px solid var(--neutral-stroke-rest);
    touch-action: none;
}

.ddp-splitter:hover[b-luoj3c9gz2],
.ddp-splitter:focus-visible[b-luoj3c9gz2] {
    background: var(--neutral-fill-secondary-hover);
    outline: none;
}

.ddp-splitter:focus-visible .ddp-splitter-grip[b-luoj3c9gz2],
.ddp-splitter:hover .ddp-splitter-grip[b-luoj3c9gz2] {
    background: var(--accent-fill-rest);
}

.ddp-splitter-grip[b-luoj3c9gz2] {
    width: 2px;
    height: 32px;
    border-radius: 1px;
    background: var(--neutral-stroke-strong-rest);
}

/* Suppress hover/selection feedback everywhere while dragging, or the pointer picks up text
   selection and button hover states as it crosses the panes. */
.ddp-dragging[b-luoj3c9gz2] {
    cursor: col-resize;
    user-select: none;
}

.ddp-dragging .ddp-viewport[b-luoj3c9gz2] {
    pointer-events: none;
}

/* ── loading / error overlays ────────────────────────────────────────────── */

.ddp-overlay-host[b-luoj3c9gz2] {
    position: absolute;
    inset: 0;
    pointer-events: none;
}

.ddp-overlay[b-luoj3c9gz2] {
    position: absolute;
    inset: 0;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 10px;
    padding: 24px;
    text-align: center;
    background: var(--neutral-layer-3);
    color: var(--neutral-foreground-hint);
    font-size: 0.86em;
}

.ddp-overlay-error[b-luoj3c9gz2] {
    /* Readable on its own, and the pane beside it stays fully usable. */
    background: var(--neutral-layer-2);
}

.ddp-overlay-title[b-luoj3c9gz2] {
    font-weight: 600;
    color: var(--neutral-foreground-rest);
}

.ddp-overlay-detail[b-luoj3c9gz2] {
    max-width: 42ch;
    line-height: 1.4;
}

/* ── narrow screens ──────────────────────────────────────────────────────── */

@media (max-width: 720px) {
    /* Side by side stops being readable well before this; stack instead and let the splitter go. */
    .ddp-body[b-luoj3c9gz2] {
        flex-direction: column;
    }

    .ddp-pane-original[b-luoj3c9gz2] {
        flex: 0 0 45%;
    }

    .ddp-splitter[b-luoj3c9gz2] {
        display: none;
    }
}
/* /Components/Preview/DualPreviewIcon.razor.rz.scp.css */
/* Matches the single-document PreviewIcon so the two look identical in a row of actions. */

.preview-wrapper[b-atb41d2bf3] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 20px;
    height: 20px;
    padding-right: 0.3rem;
    vertical-align: middle;
}

.preview-icon[b-atb41d2bf3] {
    cursor: pointer;
}

.preview-icon:focus-visible[b-atb41d2bf3] {
    outline: 1px solid var(--accent-fill-rest);
    outline-offset: 2px;
    border-radius: 2px;
}
/* /Components/SupportedLanguagesConfig.razor.rz.scp.css */