/* /Components/Catalog/CharacteristicDialog.razor.rz.scp.css */
/* Інлайн-редактор опцій Select/MultiSelect у діалозі характеристики. */

.chm-opt-list[b-r8vk14do39] {
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.chm-opt-row[b-r8vk14do39] {
    display: flex;
    align-items: center;
    gap: 8px;
}

.chm-opt-code[b-r8vk14do39] {
    max-width: 160px;
}
/* /Components/Catalog/CharacteristicFilterValueInput.razor.rz.scp.css */
.cfv-input[b-f9li3v1uv8] {
    width: 100%;
}

.cfv-color-wrap[b-f9li3v1uv8] {
    display: flex;
    align-items: center;
    gap: 8px;
}

.cfv-color[b-f9li3v1uv8] {
    width: 36px;
    height: 36px;
    padding: 0;
    border: 1px solid var(--hair, #e6e3dc);
    border-radius: 8px;
    background: none;
    cursor: pointer;
    flex: 0 0 auto;
}

.cfv-color-text[b-f9li3v1uv8] {
    flex: 1 1 auto;
}
/* /Components/Catalog/CharacteristicsManager.razor.rz.scp.css */
/* Менеджер характеристик: категорії — розкривні картки (наш дизайн); у тілі картки — характеристики
   категорії. Перестановка — drag-drop (MudDropContainer/MudDropZone) з тонким drag-handle. */

.chm-head[b-ismj42d0ve] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 12px;
}

.chm-head-actions[b-ismj42d0ve] {
    display: inline-flex;
    gap: 8px;
    flex-shrink: 0;
}

/* Список карток категорій (зона drop): тонкі хейр-бордери, м'які кути, без тіні (de-Material). */
.chm-cards[b-ismj42d0ve] {
    display: flex;
    flex-direction: column;
    gap: 8px;
    background: transparent;
}

/* Зона drop усередині контейнера: лише flex-потік, без власного фону/бордера. */
.chm-zone[b-ismj42d0ve] {
    display: flex;
    flex-direction: column;
    gap: 8px;
    background: transparent;
    min-height: 4px;
}

/* Картка категорії — наш аналог expansion-panel: хейр-бордер, м'які кути, без тіні. */
.chm-card[b-ismj42d0ve] {
    border: 1px solid var(--hair);
    border-radius: 12px;
    background: var(--card-2);
    overflow: hidden;
}

.chm-card-orphans[b-ismj42d0ve] {
    margin-top: 8px;
}

/* Заголовок картки категорії: handle + chevron + назва + бейдж + лічильник + (тенантні) дії. */
.chm-cat-head[b-ismj42d0ve] {
    display: flex;
    align-items: center;
    gap: 10px;
    width: 100%;
    min-width: 0;
    padding: 9px 14px;
    cursor: pointer;
    user-select: none;
}

.chm-cat-head .count-pill[b-ismj42d0ve] {
    margin-left: auto;
    flex-shrink: 0;
}

.chm-card-body[b-ismj42d0ve] {
    padding: 4px 14px 12px;
}

/* Тіло картки рендерить вкладений drop-контейнер характеристик — без подвійних відступів. */
.chm-card-body .chm-cards[b-ismj42d0ve],
.chm-card-body .chm-zone[b-ismj42d0ve] {
    gap: 6px;
}

.chm-empty[b-ismj42d0ve] {
    display: block;
    font-size: 12.5px;
    color: var(--text-4);
    padding: 4px 0 8px;
}

.chm-list[b-ismj42d0ve] {
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.chm-item[b-ismj42d0ve] {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 9px 11px;
    border-radius: 11px;
    background: var(--card-2);
    border: 1px solid var(--hair);
}

/* Drag-handle: субтильна афордація. Видимий лише на tenant-рядках; built-in отримує порожній спейсер
   тієї ж ширини для рівного вирівнювання назв. */
.chm-handle[b-ismj42d0ve] {
    color: var(--text-4);
    cursor: grab;
    flex-shrink: 0;
}

.chm-handle:active[b-ismj42d0ve] {
    cursor: grabbing;
}

.chm-handle-empty[b-ismj42d0ve] {
    display: inline-block;
    width: 20px;
    height: 20px;
    flex-shrink: 0;
}

/* Шеврон розкриття картки. */
.chm-chevron[b-ismj42d0ve] {
    color: var(--text-4);
    flex-shrink: 0;
}

.chm-name[b-ismj42d0ve] {
    font-weight: 700;
    font-size: 13.5px;
    color: var(--text);
    min-width: 0;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.chm-type-pill[b-ismj42d0ve] {
    font-size: 0.6875rem;
    color: var(--text-3);
    text-transform: uppercase;
    letter-spacing: 0.03em;
    flex-shrink: 0;
}

.chm-unit[b-ismj42d0ve] {
    font-size: 12px;
    color: var(--text-4);
    flex-shrink: 0;
}

/* Лічильник притискаємо праворуч; дії (якщо є) йдуть одразу за ним без власного auto. */
.chm-item .count-pill[b-ismj42d0ve] {
    margin-left: auto;
    flex-shrink: 0;
}

.chm-actions[b-ismj42d0ve] {
    display: inline-flex;
    gap: 6px;
    flex-shrink: 0;
}

/* ── Drag-drop стани (MudBlazor класи) ── */

/* Перетягуваний елемент: легке притлумлення. */
[b-ismj42d0ve] .mud-drop-item-dragging {
    opacity: 0.55;
}

/* Зона під час перетягування: пунктирний хінт-бордер у нашому акценті. */
[b-ismj42d0ve] .mud-drop-zone-drag-block {
    outline: 1px dashed var(--hair);
    outline-offset: 2px;
    border-radius: 12px;
}

/* Built-in (disabled) елемент: курсор default, без grab-афордації. */
[b-ismj42d0ve] .mud-drop-item-disabled .chm-handle,
[b-ismj42d0ve] .mud-drop-item-disabled {
    cursor: default;
}
/* /Components/Catalog/CharacteristicValueEditor.razor.rz.scp.css */
.cve-row[b-2bdqcmw3oy] {
    display: grid;
    grid-template-columns: minmax(160px, 240px) 1fr;
    gap: 8px 16px;
    align-items: start;
    padding: 10px 0;
    border-bottom: 1px solid var(--hair);
}

.cve-meta[b-2bdqcmw3oy] {
    display: flex;
    flex-direction: column;
    gap: 2px;
    min-width: 0;
    padding-top: 6px;
}

.cve-name[b-2bdqcmw3oy] {
    font-weight: 600;
    font-size: 0.875rem;
    line-height: 1.3;
}

.cve-req[b-2bdqcmw3oy] {
    color: var(--danger, #dc2626);
    margin-left: 2px;
}

.cve-hint[b-2bdqcmw3oy] {
    color: var(--text-3);
    font-size: 0.75rem;
    line-height: 1.3;
}

.cve-input[b-2bdqcmw3oy] {
    min-width: 0;
}

.cve-measure[b-2bdqcmw3oy] {
    display: flex;
    align-items: center;
    gap: 8px;
}

.cve-measure-num[b-2bdqcmw3oy] {
    flex: 1 1 auto;
}

.cve-unit[b-2bdqcmw3oy] {
    color: var(--text-3);
    font-size: 0.8125rem;
    white-space: nowrap;
}

.cve-datetime[b-2bdqcmw3oy] {
    display: flex;
    align-items: center;
    gap: 8px;
}

.cve-dt-date[b-2bdqcmw3oy] {
    flex: 2 1 auto;
}

.cve-dt-time[b-2bdqcmw3oy] {
    flex: 1 1 auto;
}

.cve-color-wrap[b-2bdqcmw3oy] {
    display: flex;
    align-items: center;
    gap: 8px;
}

.cve-color[b-2bdqcmw3oy] {
    width: 44px;
    height: 36px;
    flex: 0 0 auto;
    border: 1px solid var(--hair-strong);
    border-radius: 8px;
    padding: 0;
    cursor: pointer;
    background: transparent;
}

.cve-color-text[b-2bdqcmw3oy] {
    flex: 1 1 auto;
}

.cve-error[b-2bdqcmw3oy] {
    display: block;
    margin-top: 4px;
    color: var(--danger, #dc2626);
    font-size: 0.75rem;
}

.cve-invalid .cve-name[b-2bdqcmw3oy] {
    color: var(--danger, #dc2626);
}
/* /Components/Catalog/ProductCharacteristicsField.razor.rz.scp.css */
.pcf-panel[b-cpn9aj0pfc] {
    width: 320px;
    max-width: 90vw;
    padding: 8px;
}

.pcf-search[b-cpn9aj0pfc] {
    margin-bottom: 6px;
}

.pcf-list[b-cpn9aj0pfc] {
    max-height: 280px;
    overflow-y: auto;
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.pcf-opt[b-cpn9aj0pfc] {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 6px 8px;
    border-radius: 8px;
    cursor: pointer;
}

.pcf-opt:hover[b-cpn9aj0pfc] {
    background: var(--hover, rgba(0, 0, 0, 0.04));
}

.pcf-opt.on[b-cpn9aj0pfc] {
    background: var(--primary-soft, rgba(16, 185, 129, 0.1));
}

.pcf-name[b-cpn9aj0pfc] {
    flex: 1 1 auto;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.pcf-type[b-cpn9aj0pfc] {
    flex: 0 0 auto;
    font-size: 0.6875rem;
    color: var(--text-3);
    text-transform: uppercase;
    letter-spacing: 0.03em;
}

.pcf-empty[b-cpn9aj0pfc] {
    padding: 10px 8px;
    color: var(--text-3);
    font-size: 0.8125rem;
}

.pcf-chips[b-cpn9aj0pfc] {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
}

.pcf-values[b-cpn9aj0pfc] {
    display: flex;
    flex-direction: column;
    /* Багато характеристик (кілька категорій) не повинні розпирати картку діалогу —
       список значень скролиться у власній обмеженій області (як .pcf-list пікера). */
    max-height: clamp(180px, 42vh, 460px);
    overflow-y: auto;
    overflow-x: hidden;
    padding-right: 6px;
}

.pcf-value-row[b-cpn9aj0pfc] {
    display: flex;
    align-items: flex-start;
    gap: 4px;
}

.pcf-value-row[b-cpn9aj0pfc]  .cve-row {
    flex: 1 1 auto;
}

.pcf-value-remove[b-cpn9aj0pfc] {
    margin-top: 14px;
    flex: 0 0 auto;
}

.pcf-free[b-cpn9aj0pfc] {
    margin-top: 12px;
}
/* /Components/Catalog/ProductForm.razor.rz.scp.css */
/* All rules promoted to BGRetail.Back.Admin/wwwroot/css/components.css
   (shared component classes that cross child-component boundaries). */
/* /Components/Catalog/ProductGroupsManager.razor.rz.scp.css */
/* Менеджер груп товарів: список з інлайн-редагуванням + рядок створення. */

.pgm-list[b-2irbg72dj2] {
    display: flex;
    flex-direction: column;
    gap: 6px;
    margin-bottom: 16px;
}

.pgm-item[b-2irbg72dj2] {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 9px 11px;
    border-radius: 11px;
    background: var(--card-2);
    border: 1px solid var(--hair);
}

.pgm-swatch[b-2irbg72dj2] {
    width: 16px;
    height: 16px;
    border-radius: 5px;
    flex-shrink: 0;
    border: 1px solid var(--hair);
}

.pgm-gname[b-2irbg72dj2] {
    font-weight: 700;
    font-size: 13.5px;
    color: var(--text);
    flex: 1;
    min-width: 0;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

/* MudTextField займає всю доступну ширину рядка (відступи/шрифт — від Mud). */
.pgm-name[b-2irbg72dj2] { flex: 1; min-width: 0; }

.pgm-color[b-2irbg72dj2] {
    width: 34px;
    height: 32px;
    padding: 2px;
    border: 1px solid var(--hair);
    border-radius: 8px;
    background: var(--card);
    cursor: pointer;
    flex-shrink: 0;
}

.pgm-actions[b-2irbg72dj2] {
    display: inline-flex;
    gap: 6px;
    flex-shrink: 0;
}

.pgm-new[b-2irbg72dj2] {
    padding-top: 12px;
    border-top: 1px solid var(--hair);
}

.pgm-new-row[b-2irbg72dj2] {
    display: flex;
    align-items: center;
    gap: 8px;
}

.pf-empty[b-2irbg72dj2] {
    font-size: 12.5px;
    color: var(--text-4);
    padding: 4px 0 14px;
}
/* /Components/Security/TwoFactorDisableDialog.razor.rz.scp.css */
/* Діалог відключення 2FA — роздільник «або» між кодом і паролем. */

.sec-or[b-63mg6lqr7j] {
    color: var(--text-4);
    font-weight: 700;
    margin: 10px 0;
}
/* /Components/Security/TwoFactorWizardDialog.razor.rz.scp.css */
/* Майстер 2FA — QR + ручний ключ + запасні коди. Shell-токени з wwwroot/css/theme.css. */

.sec-stepper[b-jbiqsx01gk] {
    margin-top: 4px;
}

/* ---------- Крок 1: QR ---------- */
.sec-qr-row[b-jbiqsx01gk] {
    display: grid;
    grid-template-columns: 160px 1fr;
    gap: 22px;
    align-items: center;
}

@media (max-width: 520px) {
    .sec-qr-row[b-jbiqsx01gk] {
        grid-template-columns: 1fr;
    }
}

.sec-qr[b-jbiqsx01gk] {
    padding: 12px;
    background: #fff;
    border-radius: 14px;
    border: 1px solid var(--hair);
    display: grid;
    place-items: center;
    aspect-ratio: 1;
}

.sec-qr :global(svg)[b-jbiqsx01gk] {
    width: 100%;
    height: 100%;
    display: block;
}

.sec-qr-text[b-jbiqsx01gk] {
    color: var(--text-3);
    line-height: 1.5;
    margin-top: 4px;
}

.sec-qr-manual[b-jbiqsx01gk] {
    margin-top: 14px;
}

.sec-sharedkey[b-jbiqsx01gk] {
    font-size: 14px;
    font-weight: 700;
    letter-spacing: 0.08em;
    padding: 10px 12px;
    margin-top: 6px;
    background: var(--card-2);
    border: 1px solid var(--hair);
    border-radius: 10px;
    word-break: break-all;
}

/* ---------- Крок 2: код ---------- */
.sec-confirm[b-jbiqsx01gk] {
    text-align: center;
    padding: 4px 0;
}

.sec-code-form[b-jbiqsx01gk] {
    max-width: 220px;
    margin: 14px auto 0;
}

.sec-code-field :global(input)[b-jbiqsx01gk] {
    text-align: center;
    font-size: 20px;
    font-weight: 700;
    letter-spacing: 0.3em;
}

/* ---------- Крок 3: запасні коди ---------- */
.codebox-grid[b-jbiqsx01gk] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 8px;
}

.sec-recovery[b-jbiqsx01gk] {
    padding: 9px 12px;
    background: var(--card-2);
    border: 1px solid var(--hair);
    border-radius: 9px;
    font-weight: 600;
    font-size: 13.5px;
    letter-spacing: 0.04em;
    text-align: center;
}

.sec-actions[b-jbiqsx01gk] {
    display: flex;
    gap: 8px;
    margin-top: 10px;
}
/* /Components/Settings/ConfigSettingHistory.razor.rz.scp.css */
.csh-loading[b-tpsm827hm2] {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 20px 4px;
}

.csh-empty[b-tpsm827hm2] {
    margin: 4px 0;
}

.csh-timeline[b-tpsm827hm2] {
    padding: 4px 0;
}

.csh-row[b-tpsm827hm2] {
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.csh-row-head[b-tpsm827hm2] {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 12px;
}

.csh-action[b-tpsm827hm2] {
    font-weight: 600;
    color: var(--text-1);
}

.csh-when[b-tpsm827hm2] {
    font-size: 12px;
    color: var(--text-3);
    white-space: nowrap;
}

.csh-who[b-tpsm827hm2] {
    display: flex;
    align-items: center;
    gap: 4px;
    font-size: 12px;
    color: var(--text-3);
}

.csh-who-icon[b-tpsm827hm2] {
    font-size: 14px;
    color: var(--text-3);
}

.csh-diff[b-tpsm827hm2] {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 6px;
    margin-top: 2px;
}

.csh-old[b-tpsm827hm2],
.csh-new[b-tpsm827hm2] {
    font-family: var(--font-mono, ui-monospace, SFMono-Regular, Menlo, monospace);
    font-size: 12px;
    padding: 1px 8px;
    border-radius: 6px;
    border: 1px solid var(--hair);
    max-width: 320px;
    overflow-wrap: anywhere;
}

.csh-old[b-tpsm827hm2] {
    color: var(--text-3);
    text-decoration: line-through;
    text-decoration-color: var(--text-3);
}

.csh-new[b-tpsm827hm2] {
    color: var(--text-1);
    font-weight: 600;
}

.csh-arrow[b-tpsm827hm2] {
    font-size: 16px;
    color: var(--text-3);
}
/* /Components/Settings/ConfigSettingsEditor.razor.rz.scp.css */
.cfg-group-head-line[b-yxy4f3m7z0] {
    display: flex;
    align-items: center;
    gap: 6px;
    margin: 4px 2px 8px;
}

.cfg-group-head[b-yxy4f3m7z0] {
    display: block;
    color: var(--text-3);
    letter-spacing: .08em;
}

.cfg-group-icon[b-yxy4f3m7z0] {
    color: var(--text-3);
}

.cfg-group-desc[b-yxy4f3m7z0] {
    display: block;
    margin: -4px 2px 10px;
}

.cfg-card[b-yxy4f3m7z0] {
    padding: 2px 0;
}

.cfg-subgroup-head[b-yxy4f3m7z0] {
    padding: 10px 16px 2px;
    font-size: 12px;
    font-weight: 700;
    letter-spacing: .04em;
    text-transform: uppercase;
    color: var(--text-2);
}

.cfg-row[b-yxy4f3m7z0] {
    display: flex;
    align-items: center;
    gap: 16px;
    padding: 12px 16px;
    border-bottom: 1px solid var(--hair);
}

.cfg-row:last-child[b-yxy4f3m7z0] {
    border-bottom: none;
}

.cfg-meta[b-yxy4f3m7z0] {
    flex: 1 1 40%;
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.cfg-title-line[b-yxy4f3m7z0] {
    display: flex;
    align-items: center;
    gap: 8px;
}

.cfg-title[b-yxy4f3m7z0] {
    font-weight: 600;
}

.cfg-desc[b-yxy4f3m7z0] {
    font-size: 12px;
    color: var(--text-3);
}

.cfg-editor[b-yxy4f3m7z0] {
    flex: 1 1 30%;
    min-width: 160px;
    max-width: 280px;
}

.cfg-actions[b-yxy4f3m7z0] {
    flex: 0 0 auto;
    display: flex;
    gap: 8px;
    align-items: center;
}

.cfg-history-btn[b-yxy4f3m7z0] {
    color: var(--text-3);
}

.cfg-history-btn:hover[b-yxy4f3m7z0] {
    color: var(--text-1);
}

@media (max-width: 720px) {
    .cfg-row[b-yxy4f3m7z0] {
        flex-wrap: wrap;
        gap: 10px;
    }

    .cfg-editor[b-yxy4f3m7z0] {
        max-width: none;
        flex-basis: 100%;
    }
}
/* /Components/Shared/DataGrid.razor.rz.scp.css */
/* Корень грида — flex-колонка. При .dg-fit занимает оставшееся место в .page. */
.dg-root[b-1rg36shovo] {
    display: flex;
    flex-direction: column;
    min-height: 0;
}

/* FitViewport: грид занимает остаток высоты; .dg-table-zone прокручивается */
.dg-root.dg-fit[b-1rg36shovo] {
    flex: 1;
    overflow: hidden;
}

.dg-root.dg-fit .dg-table-zone[b-1rg36shovo] {
    flex: 1;
    overflow: auto;
    min-height: 0;
}

/* Sticky-шапка в режиме FitViewport: правило ЖИВЁТ ГЛОБАЛЬНО в css/directory.css
   (.dg-root.dg-fit .dir-grid thead th + .mud-table-container{overflow:visible}), потому что
   scoped ::deep до внутреннего thead MudDataGrid не доезжает (th оставался position:relative). */

/* Зона таблицы без FitViewport — без фиксированной высоты */
.dg-table-zone[b-1rg36shovo] {
    flex: 1;
}

/* ── Заголовок колонки: воронка + сортировка ── */
.dir-grid[b-1rg36shovo]  .th-in {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    width: 100%;
}

.dir-grid[b-1rg36shovo]  .dg-sort-head {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    cursor: pointer;
    user-select: none;
    transition: color .12s;
}

.dir-grid[b-1rg36shovo]  .sortable:hover .dg-sort-head { color: var(--text); }

.dir-grid[b-1rg36shovo]  .dg-sort-head .sort-ind {
    width: 0;
    height: 0;
    border-left: 4px solid transparent;
    border-right: 4px solid transparent;
    opacity: .28;
    border-bottom: 5px solid currentColor;
}

.dir-grid[b-1rg36shovo]  .sort-asc .sort-ind {
    opacity: .95;
    border-bottom: 5px solid var(--acc);
    border-top: 0;
}

.dir-grid[b-1rg36shovo]  .sort-desc .sort-ind {
    opacity: .95;
    border-top: 5px solid var(--acc);
    border-bottom: 0;
}

/* ── Кнопка фильтра ── */
.dir-grid[b-1rg36shovo]  .dg-filter-btn {
    padding: 2px;
    width: 22px;
    height: 22px;
    opacity: .45;
    transition: opacity .12s, color .12s;
}

.dir-grid[b-1rg36shovo]  .dg-filter-btn:hover,
.dir-grid[b-1rg36shovo]  .dg-filter-btn.dg-filter-active {
    opacity: 1;
    color: var(--acc);
}

/* ── Поповер фильтра ──
   ВНИМАНИЕ: стили САМОГО поповера (.dg-filter-pop и его содержимое) живут в ГЛОБАЛЬНОМ
   css/mud-overrides.css, а НЕ здесь — MudPopover телепортирует контент в popover-provider в корень
   страницы, вне DOM-поддерева компонента, поэтому scoped-атрибут b-{hash} до него не доезжает
   (а класс dg-filter-pop — доезжает). Тут оставляем только то, что рендерится внутри таблицы. */

/* ── Прогресс ── */
.dir-grid-progress[b-1rg36shovo] {
    margin: 0;
}

/* ── Пейджер ── */
.grid-pager[b-1rg36shovo] {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 12px;
    margin-top: 14px;
    flex-shrink: 0;
}

.gp-range[b-1rg36shovo] {
    font-size: 12.5px;
    color: var(--text-3);
    font-weight: 600;
    min-width: 92px;
    text-align: center;
}

/* ── Удалённые строки ── */
.dir-grid[b-1rg36shovo]  tr.row-deleted { opacity: .55; }
.dir-grid[b-1rg36shovo]  tr.row-deleted:hover { opacity: .85; }
.dir-grid[b-1rg36shovo]  tr.row-deleted .ci-name { text-decoration: line-through; text-decoration-color: var(--hair-strong); }
/* /Components/Shared/DataGridFilterChips.razor.rz.scp.css */
/* ── Строка чипов фильтров ── */
.dg-chips-row[b-tgjb4swunh] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 6px;
    margin-bottom: 8px;
    flex-shrink: 0;
}

.dg-chips-label[b-tgjb4swunh] {
    font-size: 11px;
    color: var(--text-3);
    white-space: nowrap;
}
/* /Components/Shared/DataGridToolbar.razor.rz.scp.css */
/* ── Тулбар ── */
.dir-toolbar[b-h0g9o3vf4g] {
    margin-bottom: 8px;
    flex-shrink: 0;
}

.dir-search[b-h0g9o3vf4g] {
    max-width: 360px;
}

.dir-count[b-h0g9o3vf4g] {
    margin-left: 12px;
    white-space: nowrap;
}

.dir-count .num[b-h0g9o3vf4g] {
    font-weight: 700;
    color: var(--text);
}
/* /Components/Shared/Donut.razor.rz.scp.css */
.donut-wrap[b-9qb3f8nuo3] { display: flex; flex-direction: column; align-items: center; gap: 16px; }
.donut[b-9qb3f8nuo3] { position: relative; flex-shrink: 0; animation: donutIn-b-9qb3f8nuo3 0.5s cubic-bezier(0.2, 0.85, 0.3, 1) both; }
.donut-svg[b-9qb3f8nuo3] { width: 100%; height: 100%; display: block; overflow: visible; }
.donut-seg[b-9qb3f8nuo3] { transition: stroke-dasharray 0.6s cubic-bezier(0.4, 0, 0.2, 1); }
.donut-center[b-9qb3f8nuo3] { position: absolute; inset: 0; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 1px; }
.dc-val[b-9qb3f8nuo3] { font-family: var(--font-mono); font-size: 26px; font-weight: 700; letter-spacing: -0.04em; line-height: 1; }
.dc-lbl[b-9qb3f8nuo3] { font-size: 10px; font-weight: 800; text-transform: uppercase; letter-spacing: 0.07em; color: var(--text-4); }
.donut-legend[b-9qb3f8nuo3] { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 8px; width: 100%; }
.donut-legend li[b-9qb3f8nuo3] { display: flex; align-items: center; gap: 9px; font-size: 12.5px; }
.lg-sw[b-9qb3f8nuo3] { width: 9px; height: 9px; border-radius: 3px; flex-shrink: 0; }
.lg-t[b-9qb3f8nuo3] { color: var(--text-2); font-weight: 600; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.lg-v[b-9qb3f8nuo3] { margin-left: auto; font-weight: 700; color: var(--text); }
@keyframes donutIn-b-9qb3f8nuo3 { from { opacity: 0; transform: scale(0.9) rotate(-8deg); } }
/* /Components/Shared/EmptyState.razor.rz.scp.css */
/* Refined empty-state — наш warm-ink стиль. Тема-залежний через наші токени
   (--card/--hair/--text/--text-3/--card-2 з theme.css; мають dark-оверрайди). */

.empty-state[b-fni3doc60s] {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    padding: 54px 28px 46px;
    border: 1.5px dashed var(--hair, #e6e3dc);
    border-radius: 18px;
    /* Дуже легке тепле сяйво згори — папір, не плаский Material-фон. */
    background: radial-gradient(120% 86% at 50% -10%,
        color-mix(in srgb, var(--card-2, #efede8) 45%, transparent), transparent 72%);
}

/* Icon-бейдж: м'який підведений квадрат із нашою line-іконкою (приглушений ink-3). */
.es-badge[b-fni3doc60s] {
    width: 58px;
    height: 58px;
    display: grid;
    place-items: center;
    border-radius: 17px;
    background: var(--card, #ffffff);
    border: 1px solid var(--hair, #e6e3dc);
    color: var(--text-3, #8b867a);
    box-shadow: 0 1px 2px rgba(22, 20, 15, .06), inset 0 1px 0 rgba(255, 255, 255, .55);
    margin-bottom: 20px;
}

.es-badge[b-fni3doc60s]  svg {
    width: 26px;
    height: 26px;
    display: block;
}

.es-title[b-fni3doc60s] {
    font-size: 15px;
    font-weight: 700;
    letter-spacing: -0.01em;
    color: var(--text, #16140f);
    line-height: 1.3;
}

.es-desc[b-fni3doc60s] {
    margin: 7px 0 0;
    font-size: 13px;
    line-height: 1.55;
    color: var(--text-3, #8b867a);
    max-width: 360px;
}

.es-action[b-fni3doc60s] {
    margin-top: 22px;
}
/* /Components/Shared/QrGenerator.razor.rz.scp.css */
/* Белый фон обязателен для читаемости QR-сканерами в любой теме. SVG инжектится JS-ом. */
.qr-gen[b-0knwcg56uj] {
    display: inline-grid;
    place-items: center;
    width: 208px;
    height: 208px;
    padding: 10px;
    background: #ffffff;
    border-radius: 14px;
    border: 1px solid var(--hair);
}
/* /Components/Shared/QrScanner.razor.rz.scp.css */
.qr-scanner[b-uhfcgqxj71] {
    display: flex;
    flex-direction: column;
    gap: 10px;
    align-items: center;
}

/* Контейнер заполняется video от html5-qrcode (JS); тут только рамка/скругление. */
.qr-reader[b-uhfcgqxj71] {
    width: 100%;
    max-width: 340px;
    aspect-ratio: 1;
    border-radius: 14px;
    overflow: hidden;
    border: 1px solid var(--hair);
    background: #0b0f0e;
}

.qr-status[b-uhfcgqxj71] {
    font-size: 12.5px;
    text-align: center;
    max-width: 340px;
    line-height: 1.45;
}

.qr-status.err[b-uhfcgqxj71] { color: var(--dang); }
.qr-status.ok[b-uhfcgqxj71] { color: var(--text-3); }
/* /Components/Shared/RateRing.razor.rz.scp.css */
.rring[b-81myzycpm5] { display: flex; flex-direction: column; align-items: center; gap: 10px; text-align: center; }
.rring-dial[b-81myzycpm5] { position: relative; flex-shrink: 0; animation: donutIn-b-81myzycpm5 0.5s cubic-bezier(0.2, 0.85, 0.3, 1) both; }
.rring-dial svg[b-81myzycpm5] { width: 100%; height: 100%; display: block; overflow: visible; }
.rring-arc[b-81myzycpm5] { transition: stroke-dasharray 0.7s cubic-bezier(0.4, 0, 0.2, 1); }
.rring-center[b-81myzycpm5] { position: absolute; inset: 0; display: grid; place-items: center; }
/* Большое число оптически центрируем в кольце; «%» висит справа и не смещает его центр. */
.rring-value[b-81myzycpm5] { position: relative; display: inline-grid; place-items: center; line-height: 1; }
.rring-num[b-81myzycpm5] { font-family: var(--font-mono); font-size: 30px; font-weight: 700; letter-spacing: -0.04em; line-height: 1; }
.rring-pct[b-81myzycpm5] { position: absolute; left: 100%; bottom: 0.2em; margin-left: 2px; font-size: 14px; font-weight: 700; color: var(--text-3); }
.rring-label[b-81myzycpm5] { font-size: 13px; font-weight: 700; color: var(--text); }
.rring-caption[b-81myzycpm5] { font-size: 11.5px; color: var(--text-3); margin-top: -4px; }
@keyframes donutIn-b-81myzycpm5 { from { opacity: 0; transform: scale(0.9); } }
/* /Components/Shared/RegionCreateForm.razor.rz.scp.css */
.fhint[b-dpgho7v1f8] {
    margin-top: 6px;
    font-size: 11.5px;
    line-height: 1.4;
    color: var(--text-3);
}

/* Native multi-select listbox: вибір кількох областей через Shift/Ctrl. */
.reg-multi[b-dpgho7v1f8] {
    height: auto;
    padding: 6px;
    overflow-y: auto;
}

.reg-multi option[b-dpgho7v1f8] {
    padding: 5px 8px;
    border-radius: 7px;
}

.reg-multi option:checked[b-dpgho7v1f8] {
    background: var(--acc-soft) linear-gradient(var(--acc-soft), var(--acc-soft));
    color: var(--acc-text);
    font-weight: 700;
}

/* Чіпи обраних областей під списком. */
.reg-chip-row[b-dpgho7v1f8] {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    margin-top: 10px;
}

.reg-ob-chip[b-dpgho7v1f8] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
}

.reg-ob-x[b-dpgho7v1f8] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 16px;
    height: 16px;
    padding: 0;
    border: none;
    border-radius: 50%;
    background: transparent;
    color: inherit;
    font-size: 14px;
    line-height: 1;
    cursor: pointer;
    opacity: 0.7;
}

.reg-ob-x:hover[b-dpgho7v1f8] {
    opacity: 1;
}
/* /Components/Shared/SalePointMapPicker.razor.rz.scp.css */
/* Пикер точек на карте: поиск, кластерная карта, выбранные чипы. Язык — theme.css токены. */

.sp-picker[b-ciiieuf3lc] {
    display: flex;
    flex-direction: column;
    gap: 10px;
}

/* ── Поиск ── */
.sp-picker-search[b-ciiieuf3lc] {
    position: relative;
    display: flex;
    align-items: center;
}

.sp-picker-ico[b-ciiieuf3lc] {
    position: absolute;
    left: 12px;
    color: var(--text-4);
    pointer-events: none;
}

.sp-picker-input[b-ciiieuf3lc] {
    width: 100%;
    padding: 9px 12px 9px 36px;
    border-radius: 10px;
    background: var(--card-2);
    border: 1px solid var(--hair);
    color: var(--text);
    font-size: 13.5px;
    transition: border-color .14s;
}

.sp-picker-input:focus[b-ciiieuf3lc] {
    outline: none;
    border-color: var(--acc);
}

.sp-picker-spin[b-ciiieuf3lc] {
    position: absolute;
    right: 12px;
    width: 14px;
    height: 14px;
    border: 2px solid var(--hair-strong);
    border-top-color: var(--acc);
    border-radius: 50%;
    animation: sp-spin-b-ciiieuf3lc .7s linear infinite;
}

@keyframes sp-spin-b-ciiieuf3lc { to { transform: rotate(360deg); } }

/* ── Выпадающий список совпадений поиска ── */
.sp-picker-hits[b-ciiieuf3lc] {
    display: flex;
    flex-direction: column;
    max-height: 188px;
    overflow-y: auto;
    border: 1px solid var(--hair);
    border-radius: 11px;
    background: var(--card);
    box-shadow: var(--sh-pop, 0 8px 24px rgba(0, 0, 0, .08));
}

.sp-hit[b-ciiieuf3lc] {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 9px 13px;
    text-align: left;
    background: transparent;
    border: none;
    border-bottom: 1px solid var(--hair);
    color: var(--text-2);
    font-size: 13px;
    cursor: pointer;
    transition: background .1s;
}

.sp-hit:last-child[b-ciiieuf3lc] { border-bottom: none; }
.sp-hit:hover[b-ciiieuf3lc] { background: var(--hover, rgba(127, 127, 127, .05)); }
.sp-hit.on[b-ciiieuf3lc] { color: var(--acc-text); background: var(--acc-soft); }

.sp-hit-name[b-ciiieuf3lc] {
    flex: 1;
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-weight: 600;
}

.sp-hit-tag[b-ciiieuf3lc] {
    font-size: 10.5px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .03em;
    color: var(--text-4);
    border: 1px solid var(--hair-strong);
    border-radius: 6px;
    padding: 1px 6px;
    flex-shrink: 0;
}

.sp-hit-check[b-ciiieuf3lc] {
    color: var(--acc);
    font-weight: 800;
    flex-shrink: 0;
}

/* ── Карта ── */
.sp-picker-map[b-ciiieuf3lc] {
    border-radius: 14px;
    overflow: hidden;
    border: 1px solid var(--hair);
}

.sp-picker-hint[b-ciiieuf3lc] {
    font-size: 12px;
    color: var(--text-3);
    background: var(--warn-soft, var(--card-2));
    border: 1px solid var(--hair);
    border-radius: 9px;
    padding: 7px 11px;
}

/* ── Выбранные ── */
.sp-picker-selhead[b-ciiieuf3lc] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}

.sp-picker-count[b-ciiieuf3lc] {
    font-size: 12.5px;
    color: var(--text-3);
    font-weight: 600;
}

.sp-picker-count strong[b-ciiieuf3lc] { color: var(--acc-text); }

.sp-picker-clear[b-ciiieuf3lc] {
    background: transparent;
    border: none;
    color: var(--dang);
    font-size: 12px;
    font-weight: 700;
    cursor: pointer;
    padding: 2px 4px;
}

.sp-picker-clear:hover[b-ciiieuf3lc] { text-decoration: underline; }

.sp-picker-empty[b-ciiieuf3lc] {
    font-size: 12.5px;
    color: var(--text-4);
    padding: 4px 0;
}

.sp-picker-chips[b-ciiieuf3lc] {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    max-height: 132px;
    overflow-y: auto;
}

/* Чип выбранной точки (раньше жил в форме кассира). */
.sp-chip[b-ciiieuf3lc] {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    padding: 6px 8px 6px 12px;
    border-radius: 10px;
    background: var(--acc-soft);
    border: 1px solid var(--acc);
    font-size: 12.5px;
    font-weight: 700;
    color: var(--acc-text);
    max-width: 100%;
}

.sp-chip-name[b-ciiieuf3lc] {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    max-width: 220px;
}

.sp-chip-x[b-ciiieuf3lc] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 18px;
    height: 18px;
    border-radius: 6px;
    border: none;
    background: transparent;
    color: var(--acc-text);
    font-size: 16px;
    line-height: 1;
    cursor: pointer;
    flex-shrink: 0;
    transition: background .12s;
}

.sp-chip-x:hover[b-ciiieuf3lc] { background: rgba(0, 0, 0, .08); }
/* /Components/Shared/SettingsSection.razor.rz.scp.css */
/* Спільна обгортка-секція для сторінок налаштувань.
   Відтворює cset-card / cset-card-top / cc-title / cset-form з Settings.razor.css
   як власний scoped-стиль, щоб класи діяли і в дочірніх компонентах (MailSettings, SubscriptionCard, …). */

/* ---------- Card ---------- */
.cset-card[b-u6hx32klre] {
    padding: 0;
    overflow: hidden;
    position: relative;
    margin-bottom: 16px;
    background: var(--card);
    border: 1px solid var(--hair);
    border-radius: var(--r-card);
    box-shadow: var(--sh-card);
}

.cset-card[b-u6hx32klre]::before {
    content: "";
    position: absolute;
    inset: 0 0 auto 0;
    height: 3px;
    background: linear-gradient(90deg, var(--acc), var(--c2) 70%, var(--c4));
    opacity: 0.9;
    z-index: 1;
}

/* ---------- Card header ---------- */
.cset-card-top[b-u6hx32klre] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    flex-wrap: wrap;
    padding: 20px 22px 18px;
    border-bottom: 1px solid var(--hair);
}

.cc-title .t[b-u6hx32klre] {
    font: var(--t-h3);
    font-size: 16px;
    letter-spacing: -0.01em;
}

.cc-title .s[b-u6hx32klre] {
    font-size: 12.5px;
    color: var(--text-3);
    margin-top: 3px;
    font-weight: 500;
}

/* ---------- Card body ---------- */
.cset-form[b-u6hx32klre] {
    padding: 18px 22px 22px;
}
/* /Components/Shops/CheckoutDetailPanel.razor.rz.scp.css */
/* All rules promoted to BGRetail.Back.Admin/wwwroot/css/components.css
   (shared component classes that cross child-component boundaries). */
/* /Components/Shops/CheckoutQrOnboard.razor.rz.scp.css */
/* QR-онбординг каси — лише структура (поля/вкладки/кнопки/чипи — з Mud). */
.qro[b-jmut82vd94] {
    display: flex;
    flex-direction: column;
}

/* ── Скан ── */
.qro-scan[b-jmut82vd94] {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.qro-cam-note[b-jmut82vd94] {
    line-height: 1.45;
}

.qro-tester-row[b-jmut82vd94] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px 12px;
    padding-top: 4px;
    border-top: 1px solid var(--hair);
}

.qro-tester[b-jmut82vd94] {
    margin-top: 4px;
}

/* ── Ручне введення (стартова кнопка) ── */
.qro-manual[b-jmut82vd94] {
    display: flex;
    flex-direction: column;
    gap: 12px;
    align-items: flex-start;
    padding-top: 8px;
}

/* ── Форма каси ── */
.qro-scanned[b-jmut82vd94] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px 12px;
    margin-bottom: 14px;
}

/* ── Geo / карта ── */
.qro-geo[b-jmut82vd94] {
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.qro-map[b-jmut82vd94] {
    border-radius: 12px;
    overflow: hidden;
    border: 1px solid var(--hair);
}
/* /Components/Shops/CheckoutQrTester.razor.rz.scp.css */
/* Тестовий генератор QR — прев'ю QR і payload (поля/сітка — з Mud). */
.qr-tester[b-2s4d4zmav6] {
    padding: 14px;
}

.qrt-head[b-2s4d4zmav6] {
    margin-bottom: 8px;
}

.qrt-hint[b-2s4d4zmav6] {
    display: block;
    margin-top: 4px;
    line-height: 1.45;
}

.qrt-out[b-2s4d4zmav6] {
    display: flex;
    flex-wrap: wrap;
    gap: 16px;
    align-items: flex-start;
    margin-top: 14px;
    padding-top: 14px;
    border-top: 1px solid var(--hair);
}

.qrt-qr[b-2s4d4zmav6] {
    flex: 0 0 auto;
    padding: 10px;
    background: #fff;
    border-radius: 12px;
    border: 1px solid var(--hair);
}

.qrt-json[b-2s4d4zmav6] {
    flex: 1 1 200px;
    min-width: 0;
}

.qrt-code[b-2s4d4zmav6] {
    margin: 6px 0 0;
    padding: 10px;
    border-radius: 10px;
    background: var(--card);
    border: 1px solid var(--hair);
    font-family: var(--font-mono, "JetBrains Mono", monospace);
    font-size: 11px;
    line-height: 1.5;
    color: var(--text-2);
    white-space: pre-wrap;
    word-break: break-all;
    max-height: 160px;
    overflow: auto;
}
/* /Components/Shops/PointSettings.razor.rz.scp.css */
/* Налаштування точки — лише структура (стек/шапка/акордеон). Кнопки/чипи/поля/картки — з Mud. */

.ps-root[b-26io753yzt] { display: flex; flex-direction: column; gap: 14px; }

.ps-head[b-26io753yzt] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    flex-wrap: wrap;
}

.ps-head-actions[b-26io753yzt] { display: flex; gap: 8px; flex-wrap: wrap; }

.ps-title[b-26io753yzt] { display: flex; align-items: center; gap: 12px; min-width: 0; }
.ps-title-main[b-26io753yzt] { display: flex; flex-direction: column; gap: 3px; min-width: 0; }
.ps-title-main .ci-name[b-26io753yzt] { font-weight: 700; font-size: 15px; }

/* ── Форма каси ── */
.ps-co-form[b-26io753yzt] { padding: 14px 16px; }

/* ── Список кас (компактні рядки-акордеон) ── */
.ps-list[b-26io753yzt] { display: flex; flex-direction: column; gap: 10px; }

.ps-co[b-26io753yzt] { padding: 12px 14px; }

.ps-co-head[b-26io753yzt] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    flex-wrap: wrap;
}

.ps-co-id[b-26io753yzt] { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.ps-co-num[b-26io753yzt] { font-weight: 700; font-size: 14px; }
.ps-co-actions[b-26io753yzt] { display: flex; gap: 6px; align-items: center; flex-wrap: wrap; }

/* ── Inline-редактор податкових груп (розгорнута каса) ── */
.ps-co-tax[b-26io753yzt] {
    margin-top: 12px;
    padding-top: 12px;
    border-top: 1px solid var(--hair);
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.ps-co-tax-title[b-26io753yzt] { font-weight: 700; color: var(--text-2, var(--text-3)); }

/* ── Порожній стан ── */
.ps-empty[b-26io753yzt] {
    text-align: center;
    padding: 28px 16px;
    display: flex;
    flex-direction: column;
    gap: 4px;
}
/* /Components/Shops/SalePointForm.razor.rz.scp.css */
.fhint[b-fw09xxkars] {
    margin-top: 6px;
    margin-bottom: 8px;
    font-size: 11.5px;
    line-height: 1.4;
    color: var(--text-3);
}

.sp-form-row[b-fw09xxkars] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 14px;
}

/* Підказка про автозаповнення області/регіону за кліком на карті. */
.sp-auto-hint[b-fw09xxkars] {
    display: flex;
    align-items: center;
    gap: 7px;
    margin-top: 8px;
    padding: 7px 10px;
    border-radius: 9px;
    background: var(--acc-soft);
    color: var(--acc-text, var(--acc));
    font-size: 11.5px;
    line-height: 1.35;
}

.sp-auto-hint svg[b-fw09xxkars] { flex: 0 0 auto; }

.sp-map-wrap[b-fw09xxkars] {
    border-radius: 12px;
    overflow: hidden;
    border: 1px solid var(--hair);
}

.sp-geo-row[b-fw09xxkars] {
    display: flex;
    align-items: flex-end;
    gap: 12px;
    margin-top: 10px;
}

.sp-geo-row .field-group[b-fw09xxkars] { flex: 1 1 0; min-width: 0; }

.sp-geo-clear[b-fw09xxkars] { flex: 0 0 auto; margin-bottom: 1px; }

@media (max-width: 560px) {
    .sp-form-row[b-fw09xxkars] { grid-template-columns: 1fr; }
    .sp-geo-row[b-fw09xxkars] { flex-wrap: wrap; }
}
/* /Components/Shops/SalePointPickerMap.razor.rz.scp.css */
/* SalePointPickerMap: карта + список single-select стиль "Нова Пошта" */

.sp-picker[b-uo0a9k58i9] {
    display: flex;
    flex-direction: column;
    gap: var(--sp-3, 12px);
}

.sp-picker-map[b-uo0a9k58i9] {
    border-radius: var(--radius, 8px);
    overflow: hidden;
}

.sp-picker-list[b-uo0a9k58i9] {
    max-height: 200px;
    overflow-y: auto;
    border: 1px solid var(--border, #e2e8f0);
    border-radius: var(--radius, 8px);
}

.sp-picker-item[b-uo0a9k58i9] {
    display: flex;
    align-items: flex-start;
    gap: 8px;
    padding: 8px 12px;
    cursor: pointer;
    transition: background 0.15s;
}

.sp-picker-item:hover[b-uo0a9k58i9] {
    background: var(--hover-bg, rgba(0,0,0,0.04));
}

.sp-picker-item.is-selected[b-uo0a9k58i9] {
    background: var(--accent-bg, rgba(16,185,129,0.08));
}

.sp-picker-item-icon[b-uo0a9k58i9] {
    flex-shrink: 0;
    margin-top: 2px;
}

.sp-picker-item-body[b-uo0a9k58i9] {
    display: flex;
    flex-direction: column;
    min-width: 0;
}

.sp-picker-item-name[b-uo0a9k58i9] {
    font-size: 0.875rem;
    font-weight: 500;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.sp-picker-item-addr[b-uo0a9k58i9] {
    font-size: 0.75rem;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.sp-picker-empty[b-uo0a9k58i9] {
    display: block;
    padding: 12px;
    text-align: center;
}

.sp-picker-none[b-uo0a9k58i9] {
    display: block;
    padding: 4px 0;
}

.sp-picker-selection[b-uo0a9k58i9] {
    margin-top: 4px;
}
/* /Components/Staff/CashierEditForm.razor.rz.scp.css */
/* Форма касира повністю на MudBlazor (MudTabs: Дані/Точки/Права; MudGrid, MudPaper,
   MudToggleGroup, MudChip). Локальних довесків немає — файл лишено навмисно порожнім, щоб
   scoped-css-бандл не посилався на видалені класи. */
/* /Components/Staff/CashierRoleEditForm.razor.rz.scp.css */
/* Форма ролі касира повністю на MudBlazor (MudForm + MudChipSet, згрупований по PermissionGroup
   у MudPaper). Локальних довесків немає — файл лишено навмисно порожнім, щоб scoped-css-бандл
   не посилався на видалені класи. */
/* /Components/Staff/StaffCashiersPanel.razor.rz.scp.css */
/* Панель касирів: розкладка карток ролей. */

.role-grid[b-56gpxn12os] {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
    gap: 14px;
}

.role-card[b-56gpxn12os] {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.role-card-head[b-56gpxn12os] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    flex-wrap: wrap;
}

.role-card-title[b-56gpxn12os] {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
}

.role-perms[b-56gpxn12os] {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
}
/* /Components/Staff/StaffUsersPanel.razor.rz.scp.css */
/* Панель web-користувачів компанії повністю на MudBlazor (MudDataGrid + MudDialog).
   Тулбар, дії в рядках і статус-чипи виражаються Mud-компонентами — локальних довесків немає.
   Файл лишено навмисно порожнім, щоб scoped-css-бандл не посилався на видалені класи. */
/* /Layout/MainLayout.razor.rz.scp.css */
/* Shell layout (.admin, .side, .nav-item, .topbar, .user-chip, .page …) comes from
   the global design system in wwwroot/css/theme.css. Only shell-local tweaks live here. */

.topbar-context[b-nv2gu48qbs] {
    display: flex;
    flex-direction: column;
    gap: 1px;
    min-width: 0;
}

.topbar-eyebrow[b-nv2gu48qbs] {
    font-size: 10.5px;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: var(--text-4);
}

.topbar-title[b-nv2gu48qbs] {
    font-size: 15px;
    font-weight: 800;
    letter-spacing: -0.02em;
    color: var(--text);
    white-space: nowrap;
}

#blazor-error-ui[b-nv2gu48qbs] {
    background: var(--card);
    border-top: 1px solid var(--hair);
    bottom: 0;
    box-shadow: var(--sh-pop, 0 -6px 20px rgba(0, 0, 0, 0.12));
    box-sizing: border-box;
    color: var(--text);
    display: none;
    font-size: 13.5px;
    left: 0;
    padding: 0.7rem 1.25rem;
    position: fixed;
    width: 100%;
    z-index: 1000;
}

    #blazor-error-ui .reload[b-nv2gu48qbs] {
        color: var(--acc);
        font-weight: 600;
        margin-left: 8px;
        text-decoration: none;
    }

    #blazor-error-ui .reload:hover[b-nv2gu48qbs] {
        text-decoration: underline;
    }

    #blazor-error-ui .dismiss[b-nv2gu48qbs] {
        cursor: pointer;
        position: absolute;
        right: 1rem;
        top: 0.55rem;
        color: var(--text-3);
    }
/* /Notifications/ToastHost.razor.rz.scp.css */
/* App-wide стек тостов. Использует семантические токены theme.css/tokens.css; визуально согласован
   с .modal/.drawer/.toast (card-фон, hairline, тёплые тени, акцент по краю). Без MudBlazor. */

.toast-stack[b-kpywl06jdt] {
    position: fixed;
    bottom: 22px;
    right: 22px;
    z-index: 120;
    display: flex;
    flex-direction: column;
    gap: 10px;
    width: min(380px, calc(100vw - 32px));
    pointer-events: none;
}

.toast-card[b-kpywl06jdt] {
    pointer-events: auto;
    position: relative;
    display: grid;
    grid-template-columns: auto 1fr auto;
    align-items: start;
    gap: 11px;
    padding: 13px 12px 13px 15px;
    background: var(--card);
    border: 1px solid var(--hair);
    border-radius: 13px;
    box-shadow: var(--sh-pop);
    color: var(--text);
    animation: toastIn-b-kpywl06jdt .24s cubic-bezier(.2, .85, .3, 1);
}

/* Акцентная полоса слева — цвет по уровню. */
.toast-card[b-kpywl06jdt]::before {
    content: '';
    position: absolute;
    left: 0;
    top: 9px;
    bottom: 9px;
    width: 3px;
    border-radius: 3px;
    background: currentColor;
    opacity: .9;
}

.toast-card.is-success[b-kpywl06jdt] { color: var(--pos); }
.toast-card.is-error[b-kpywl06jdt] { color: var(--dang); }

.toast-icon[b-kpywl06jdt] {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 26px;
    height: 26px;
    border-radius: 8px;
    flex-shrink: 0;
}

.toast-card.is-success .toast-icon[b-kpywl06jdt] { background: var(--pos-soft); color: var(--pos); }
.toast-card.is-error .toast-icon[b-kpywl06jdt] { background: var(--dang-soft); color: var(--dang); }

.toast-body[b-kpywl06jdt] {
    min-width: 0;
    padding-top: 2px;
}

.toast-msg[b-kpywl06jdt] {
    font-size: 13.5px;
    font-weight: 600;
    line-height: 1.4;
    color: var(--text);
    word-break: break-word;
}

.toast-details[b-kpywl06jdt] {
    margin: 7px 0 0;
    padding: 0 0 0 16px;
    list-style: disc;
    display: flex;
    flex-direction: column;
    gap: 3px;
}

.toast-details li[b-kpywl06jdt] {
    font-size: 12.5px;
    line-height: 1.4;
    color: var(--text-2);
    word-break: break-word;
}

.toast-x[b-kpywl06jdt] {
    flex-shrink: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 24px;
    height: 24px;
    border-radius: 7px;
    color: var(--text-3);
    background: transparent;
    border: 0;
    cursor: pointer;
    transition: background .14s, color .14s;
}

.toast-x:hover[b-kpywl06jdt] {
    background: var(--card-2);
    color: var(--text);
}

@keyframes toastIn-b-kpywl06jdt {
    from {
        opacity: 0;
        transform: translateY(10px) scale(.98);
    }
}
/* /Pages/Checkouts.razor.rz.scp.css */
/* Каси: список рендериться через спільний <DataGrid> (MudDataGrid), рядки — кнопкою «Деталь»,
   деталь — у MudDialog. Стилі рядків/видалених кас задає DataGrid.razor.css (.row-deleted),
   решта — глобальні токени directory.css/theme.css. Власних scoped-стилів не лишилось. */
/* /Pages/Home.razor.rz.scp.css */
/* Дашборд super-admin: заголовочная полоса + сетка графиков + плитки действий.
   Глобальные токены (--card, --hair, --acc, --c1..--c6 …) — из wwwroot/css/theme.css. */

.dash[b-udzm7y238z] {
    max-width: 1320px;
    margin: 0 auto;
    padding: 26px 30px 64px;
}

.dash-head[b-udzm7y238z] {
    margin-bottom: 22px;
}

.dash-head .eyebrow[b-udzm7y238z] {
    margin-bottom: 8px;
}

.dash-head h1[b-udzm7y238z] {
    font: var(--t-h1);
    font-size: 30px;
    letter-spacing: -0.03em;
    margin: 0;
}

.dash-head p[b-udzm7y238z] {
    color: var(--text-3);
    font-size: 14px;
    margin: 7px 0 0;
}

/* ---------- Заголовочные карточки ---------- */
.hl-band[b-udzm7y238z] {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 16px;
    margin-bottom: 16px;
}

.hl[b-udzm7y238z] {
    background: var(--card);
    border: 1px solid var(--hair);
    border-radius: var(--r-card);
    box-shadow: var(--sh-card);
    padding: 17px 18px;
    display: flex;
    flex-direction: column;
    gap: 6px;
    min-width: 0;
    animation: revealUp-b-udzm7y238z 0.5s ease both;
}

.hl-top[b-udzm7y238z] {
    display: flex;
    align-items: center;
    gap: 10px;
}

.hl-ic[b-udzm7y238z] {
    width: 34px;
    height: 34px;
    border-radius: 10px;
    display: grid;
    place-items: center;
    flex-shrink: 0;
}

.hl-ic.acc[b-udzm7y238z] { background: var(--acc-soft); color: var(--acc-text); }
.hl-ic.info[b-udzm7y238z] { background: var(--info-soft); color: var(--info); }
.hl-ic.pos[b-udzm7y238z] { background: var(--pos-soft); color: var(--pos); }
.hl-ic.warn[b-udzm7y238z] { background: var(--warn-soft); color: var(--warn); }

.hl-k[b-udzm7y238z] {
    font-size: 12px;
    font-weight: 700;
    color: var(--text-3);
}

.hl-val[b-udzm7y238z] {
    font-family: var(--font-mono);
    font-size: 32px;
    font-weight: 700;
    letter-spacing: -0.04em;
    line-height: 1.04;
    margin-top: 2px;
}

.hl-sub[b-udzm7y238z] {
    font-size: 12px;
    color: var(--text-3);
    font-weight: 500;
}

/* ---------- Сетка графиков ---------- */
.dash-grid[b-udzm7y238z] {
    display: grid;
    grid-template-columns: repeat(12, 1fr);
    gap: 16px;
    margin-bottom: 28px;
}

.col-3[b-udzm7y238z] { grid-column: span 3; }
.col-4[b-udzm7y238z] { grid-column: span 4; }
.col-6[b-udzm7y238z] { grid-column: span 6; }
.col-8[b-udzm7y238z] { grid-column: span 8; }
.col-12[b-udzm7y238z] { grid-column: span 12; }

.chart-card[b-udzm7y238z] {
    display: flex;
    flex-direction: column;
    animation: revealUp-b-udzm7y238z 0.5s ease both;
}

.cc-h[b-udzm7y238z] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 18px;
}

.cc-t[b-udzm7y238z] {
    font: var(--t-h3);
    font-size: 14.5px;
    letter-spacing: -0.01em;
}

.cc-s[b-udzm7y238z] {
    font-size: 11.5px;
    color: var(--text-3);
    margin-top: 2px;
    font-weight: 500;
}

/* пончик прижимаем книзу, чтобы карточки-доноры выровнялись в ряду */
.chart-card .donut-wrap[b-udzm7y238z] {
    margin-top: auto;
}

/* ---------- Легенда столбцов ---------- */
.legend2[b-udzm7y238z] {
    display: flex;
    gap: 14px;
    flex-shrink: 0;
}

.legend2 .li[b-udzm7y238z] {
    display: flex;
    align-items: center;
    gap: 6px;
    font-size: 11.5px;
    font-weight: 600;
    color: var(--text-2);
    white-space: nowrap;
}

.legend2 .sw[b-udzm7y238z] {
    width: 9px;
    height: 9px;
    border-radius: 3px;
}

/* ---------- Сравнительные столбцы ---------- */
.cmp[b-udzm7y238z] {
    display: flex;
    flex-direction: column;
    gap: 16px;
    margin-top: 2px;
}

.cmp-row[b-udzm7y238z] {
    display: grid;
    grid-template-columns: 132px 1fr;
    gap: 16px;
    align-items: center;
}

.cmp-label[b-udzm7y238z] {
    font-size: 12.5px;
    font-weight: 600;
    color: var(--text-2);
}

.cmp-bars[b-udzm7y238z] {
    display: flex;
    flex-direction: column;
    gap: 6px;
    min-width: 0;
}

.cmp-bar[b-udzm7y238z] {
    display: grid;
    grid-template-columns: 1fr 46px;
    gap: 12px;
    align-items: center;
}

.cmp-track[b-udzm7y238z] {
    height: 9px;
    border-radius: 5px;
    background: var(--card-2);
    overflow: hidden;
}

.cmp-fill[b-udzm7y238z] {
    display: block;
    height: 100%;
    border-radius: 5px;
    transform-origin: left;
    animation: growX-b-udzm7y238z 0.7s cubic-bezier(0.3, 1, 0.4, 1) both;
}

.cmp-num[b-udzm7y238z] {
    font-size: 12px;
    font-weight: 700;
    text-align: right;
    color: var(--text-2);
}

/* ---------- Кольца показателей ---------- */
.rings[b-udzm7y238z] {
    display: flex;
    gap: 12px;
    justify-content: space-around;
    align-items: center;
    flex-wrap: wrap;
    margin-top: auto;
    padding-top: 4px;
}

/* ---------- Skeleton ---------- */
.sk[b-udzm7y238z] {
    display: block;
    background: var(--card-2);
    border-radius: 6px;
    animation: skPulse-b-udzm7y238z 1.2s ease-in-out infinite;
}

.sk-donut[b-udzm7y238z] {
    width: 138px;
    height: 138px;
    border-radius: 50%;
    margin: 8px auto 0;
}

/* ---------- Reveal / motion ---------- */
@keyframes revealUp-b-udzm7y238z {
    from { opacity: 0; transform: translateY(8px); }
}

@keyframes growX-b-udzm7y238z {
    from { transform: scaleX(0); }
}

@keyframes skPulse-b-udzm7y238z {
    50% { opacity: 0.45; }
}

.hl:nth-child(2)[b-udzm7y238z] { animation-delay: 0.04s; }
.hl:nth-child(3)[b-udzm7y238z] { animation-delay: 0.08s; }
.hl:nth-child(4)[b-udzm7y238z] { animation-delay: 0.12s; }

.dash-grid > :nth-child(1)[b-udzm7y238z] { animation-delay: 0.05s; }
.dash-grid > :nth-child(2)[b-udzm7y238z] { animation-delay: 0.10s; }
.dash-grid > :nth-child(3)[b-udzm7y238z] { animation-delay: 0.15s; }
.dash-grid > :nth-child(4)[b-udzm7y238z] { animation-delay: 0.20s; }
.dash-grid > :nth-child(5)[b-udzm7y238z] { animation-delay: 0.25s; }
.dash-grid > :nth-child(6)[b-udzm7y238z] { animation-delay: 0.30s; }

/* ---------- Действия ---------- */
.dash-actions[b-udzm7y238z] {
    margin-top: 4px;
}

.stat-group-h[b-udzm7y238z] {
    font-size: 11px;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: var(--text-3);
    margin-bottom: 12px;
}

.home-tiles[b-udzm7y238z] {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(264px, 1fr));
    gap: 16px;
}

.home-tile[b-udzm7y238z] {
    display: flex;
    flex-direction: column;
    gap: 6px;
    text-decoration: none;
    color: inherit;
    transition: border-color 0.14s, transform 0.14s, box-shadow 0.14s;
}

.home-tile:hover[b-udzm7y238z] {
    border-color: var(--hair-strong);
    transform: translateY(-2px);
    box-shadow: var(--sh-card-h);
}

.home-tile-ic[b-udzm7y238z] {
    width: 44px;
    height: 44px;
    border-radius: 12px;
    display: grid;
    place-items: center;
    background: var(--card-2);
    color: var(--acc);
    margin-bottom: 8px;
}

.home-tile-t[b-udzm7y238z] {
    font-size: 15.5px;
    font-weight: 700;
    letter-spacing: -0.01em;
}

.home-tile-s[b-udzm7y238z] {
    font-size: 13px;
    color: var(--text-3);
    line-height: 1.45;
}

/* ---------- Responsive ---------- */
@media (max-width: 1080px) {
    .col-3[b-udzm7y238z] { grid-column: span 6; }
    .col-8[b-udzm7y238z], .col-4[b-udzm7y238z] { grid-column: span 12; }
    .hl-band[b-udzm7y238z] { grid-template-columns: repeat(2, 1fr); }
}

@media (max-width: 560px) {
    .dash[b-udzm7y238z] { padding: 22px 18px 56px; }
    .col-3[b-udzm7y238z], .col-6[b-udzm7y238z] { grid-column: span 12; }
    .hl-band[b-udzm7y238z] { grid-template-columns: 1fr; }
    .cmp-row[b-udzm7y238z] { grid-template-columns: 1fr; gap: 7px; }
}
/* /Pages/MailSettings.razor.rz.scp.css */
/* Настройки почты — centered, balanced settings surface.
   Shell tokens (--card, --hair, --acc, --r-card …) come from wwwroot/css/theme.css.
   Layout + signature chrome are scoped here; form controls render via MudBlazor. */

.mailset[b-yfpigw5vv8] {
    max-width: 880px;
    margin: 0 auto;
    padding: 28px 30px 72px;
}

/* ---------- Header ---------- */
.mailset-head[b-yfpigw5vv8] {
    margin-bottom: 22px;
}

.mailset-head .eyebrow[b-yfpigw5vv8] {
    margin-bottom: 8px;
}

.mailset-head h1[b-yfpigw5vv8] {
    font: var(--t-h1);
    font-size: 30px;
    letter-spacing: -0.03em;
    margin: 0;
}

.mailset-head p[b-yfpigw5vv8] {
    color: var(--text-3);
    font-size: 14px;
    margin: 7px 0 0;
    max-width: 60ch;
    line-height: 1.5;
}

.mailset-empty-card[b-yfpigw5vv8] {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 16px 18px;
    background: var(--card);
    border: 1px solid var(--hair);
    border-radius: var(--r-card);
}

/* ---------- State hero (explicit configured indicator) ---------- */
.mail-hero[b-yfpigw5vv8] {
    display: flex;
    align-items: flex-start;
    gap: 14px;
    padding: 16px 18px;
    margin-bottom: 12px;
    background: var(--card);
    border: 1px solid var(--hair);
    border-radius: var(--r-card);
    box-shadow: var(--sh-card);
    position: relative;
    overflow: hidden;
    animation: heroIn-b-yfpigw5vv8 0.4s cubic-bezier(0.2, 0.85, 0.3, 1) both;
}

/* signature state rail along the left edge */
.mail-hero[b-yfpigw5vv8]::before {
    content: "";
    position: absolute;
    inset: 0 auto 0 0;
    width: 4px;
    background: var(--text-4);
}

.mail-hero.is-active[b-yfpigw5vv8]::before { background: var(--acc); }
.mail-hero.is-paused[b-yfpigw5vv8]::before { background: var(--warn); }
.mail-hero.is-empty[b-yfpigw5vv8]::before { background: var(--c2); }

.mh-icon[b-yfpigw5vv8] {
    width: 44px;
    height: 44px;
    border-radius: 13px;
    display: grid;
    place-items: center;
    flex-shrink: 0;
}

.mail-hero.is-active .mh-icon[b-yfpigw5vv8] { background: var(--acc-soft); color: var(--acc-text); }
.mail-hero.is-paused .mh-icon[b-yfpigw5vv8] { background: var(--warn-soft); color: var(--warn); }
.mail-hero.is-empty .mh-icon[b-yfpigw5vv8] { background: var(--c2s); color: var(--c2); }

.mh-body[b-yfpigw5vv8] {
    min-width: 0;
    flex: 1;
}

.mh-row[b-yfpigw5vv8] {
    display: flex;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
}

.mh-title[b-yfpigw5vv8] {
    font: var(--t-h3);
    font-size: 16.5px;
    letter-spacing: -0.01em;
    margin: 0;
}

.mh-sub[b-yfpigw5vv8] {
    margin: 5px 0 0;
    font-size: 13px;
    color: var(--text-3);
    line-height: 1.5;
}

@keyframes heroIn-b-yfpigw5vv8 {
    from { opacity: 0; transform: translateY(4px); }
}

/* ---------- Status strip (tiles) ---------- */
.status-strip[b-yfpigw5vv8] {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 10px;
    margin-bottom: 16px;
}

.ss-cell[b-yfpigw5vv8] {
    background: var(--card);
    border: 1px solid var(--hair);
    border-radius: 14px;
    box-shadow: var(--sh-card);
    padding: 13px 15px;
    display: flex;
    flex-direction: column;
    gap: 8px;
    min-width: 0;
}

.ss-k[b-yfpigw5vv8] {
    font-size: 10.5px;
    font-weight: 800;
    letter-spacing: 0.07em;
    text-transform: uppercase;
    color: var(--text-4);
}

.ss-v[b-yfpigw5vv8] {
    font-size: 14px;
    font-weight: 700;
    color: var(--text);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

/* ---------- Config card ---------- */
.mailset-card[b-yfpigw5vv8] {
    background: var(--card);
    border: 1px solid var(--hair);
    border-radius: var(--r-card);
    box-shadow: var(--sh-card);
    overflow: hidden;
    position: relative;
}

/* thin signature accent along the top edge */
.mailset-card[b-yfpigw5vv8]::before {
    content: "";
    position: absolute;
    inset: 0 0 auto 0;
    height: 3px;
    background: linear-gradient(90deg, var(--acc), var(--c2) 70%, var(--c4));
    opacity: 0.9;
    z-index: 1;
}

.mc-top[b-yfpigw5vv8] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    flex-wrap: wrap;
    padding: 20px 22px 18px;
    border-bottom: 1px solid var(--hair);
}

.mc-title .t[b-yfpigw5vv8] {
    font: var(--t-h3);
    font-size: 16px;
    letter-spacing: -0.01em;
}

.mc-title .s[b-yfpigw5vv8] {
    font-size: 12.5px;
    color: var(--text-3);
    margin-top: 3px;
    font-weight: 500;
}

.tabseg[b-yfpigw5vv8] {
    flex-shrink: 0;
}

.tabpanel[b-yfpigw5vv8] {
    padding: 20px 22px 22px;
}

.lead-note[b-yfpigw5vv8] {
    font-size: 13px;
    color: var(--text-2);
    line-height: 1.5;
    margin: 0 0 18px;
}

/* ---------- Form scaffolding ---------- */
.toggle-row[b-yfpigw5vv8] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    padding: 13px 15px;
    border-radius: 13px;
    background: var(--card-2);
    border: 1px solid var(--hair);
    margin-bottom: 16px;
}

.mc-actions[b-yfpigw5vv8] {
    display: flex;
    justify-content: flex-end;
    margin-top: 20px;
}

/* ---------- Flow checklist ---------- */
.flow[b-yfpigw5vv8] {
    margin: 18px 0 2px;
    padding: 15px 17px;
    display: flex;
    flex-direction: column;
    gap: 13px;
    background: var(--card-2);
    border: 1px solid var(--hair);
    border-radius: 14px;
}

.flow-step[b-yfpigw5vv8] {
    display: flex;
    align-items: flex-start;
    gap: 11px;
    animation: stepIn-b-yfpigw5vv8 0.26s ease both;
}

.fs-ic[b-yfpigw5vv8] {
    width: 22px;
    height: 22px;
    border-radius: 50%;
    display: grid;
    place-items: center;
    flex-shrink: 0;
    margin-top: 1px;
    border: 1px solid var(--hair-2);
    background: var(--card);
    color: var(--text-4);
    transition: background 0.2s, border-color 0.2s, color 0.2s;
}

.fs-ic .mud-icon-root[b-yfpigw5vv8] {
    font-size: 14px;
}

.fs-spin[b-yfpigw5vv8] {
    width: 13px;
    height: 13px;
}

.fs-body[b-yfpigw5vv8] {
    display: flex;
    flex-direction: column;
    gap: 2px;
    min-width: 0;
}

.fs-t[b-yfpigw5vv8] {
    font-size: 13.5px;
    font-weight: 700;
    color: var(--text-2);
}

.fs-d[b-yfpigw5vv8] {
    font-size: 12px;
    color: var(--text-3);
    line-height: 1.45;
    word-break: break-word;
}

.flow-step.is-idle[b-yfpigw5vv8] {
    opacity: 0.55;
}

.flow-step.is-run .fs-ic[b-yfpigw5vv8] {
    border-color: var(--acc);
    color: var(--acc);
}

.flow-step.is-run .fs-t[b-yfpigw5vv8] {
    color: var(--text);
}

.flow-step.is-ok .fs-ic[b-yfpigw5vv8] {
    background: var(--acc);
    border-color: transparent;
    color: #fff;
}

.flow-step.is-ok .fs-t[b-yfpigw5vv8] {
    color: var(--text);
}

.flow-step.is-fail .fs-ic[b-yfpigw5vv8] {
    background: var(--dang);
    border-color: transparent;
    color: #fff;
}

.flow-step.is-fail .fs-t[b-yfpigw5vv8],
.flow-step.is-fail .fs-d[b-yfpigw5vv8] {
    color: var(--dang);
}

.flow-step.is-skip .fs-ic[b-yfpigw5vv8] {
    color: var(--text-4);
}

.idot[b-yfpigw5vv8] {
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: currentColor;
}

@keyframes stepIn-b-yfpigw5vv8 {
    from {
        opacity: 0;
        transform: translateY(3px);
    }
}

/* ---------- Responsive ---------- */
@media (max-width: 720px) {
    .mailset[b-yfpigw5vv8] {
        padding: 22px 18px 56px;
    }

    .status-strip[b-yfpigw5vv8] {
        grid-template-columns: 1fr 1fr;
    }

    .mc-top[b-yfpigw5vv8] {
        flex-direction: column;
        align-items: stretch;
    }

    .tabseg[b-yfpigw5vv8] {
        display: flex;
    }
}
/* /Pages/Overview.razor.rz.scp.css */
/* Огляд компанії — KPI-сітка. Базові .directory/.card/.btn — з theme.css + directory.css. */

.co-grid[b-amyuenfz3j] {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(190px, 1fr));
    gap: 14px;
    margin-bottom: 18px;
}

.co-card[b-amyuenfz3j] {
    position: relative;
    background: var(--card);
    border: 1px solid var(--hair);
    border-radius: 16px;
    box-shadow: var(--sh-card);
    padding: 18px 18px 16px;
    overflow: hidden;
    animation: coIn-b-amyuenfz3j 0.4s cubic-bezier(0.2, 0.85, 0.3, 1) both;
}

/* акцент-полоса по верхней кромке тоном KPI */
.co-card[b-amyuenfz3j]::before {
    content: "";
    position: absolute;
    inset: 0 0 auto 0;
    height: 3px;
    background: var(--tint, var(--acc));
    opacity: 0.85;
}

.co-ic[b-amyuenfz3j] {
    width: 40px;
    height: 40px;
    border-radius: 11px;
    display: grid;
    place-items: center;
    margin-bottom: 13px;
    color: var(--tint, var(--acc));
    background: color-mix(in oklab, var(--tint, var(--acc)) 14%, transparent);
}

.co-n[b-amyuenfz3j] {
    font-size: 30px;
    font-weight: 800;
    letter-spacing: -0.03em;
    line-height: 1;
}

.co-l[b-amyuenfz3j] {
    margin-top: 5px;
    font-size: 13px;
    font-weight: 700;
    color: var(--text-2);
    display: flex;
    align-items: baseline;
    gap: 7px;
    flex-wrap: wrap;
}

.co-sub[b-amyuenfz3j] {
    font-size: 11.5px;
    font-weight: 600;
    color: var(--text-3);
}

.co-skeleton[b-amyuenfz3j] {
    height: 116px;
    border: none;
    background: linear-gradient(90deg, var(--card-2) 25%, var(--hair) 37%, var(--card-2) 63%);
    background-size: 400% 100%;
    animation: coSk-b-amyuenfz3j 1.3s ease infinite;
}

.co-skeleton[b-amyuenfz3j]::before { display: none; }

/* Hint card */
.co-hint[b-amyuenfz3j] {
    max-width: 560px;
}

.co-hint-t[b-amyuenfz3j] {
    font: var(--t-h3);
    font-size: 15.5px;
}

.co-hint-s[b-amyuenfz3j] {
    font-size: 13px;
    color: var(--text-3);
    line-height: 1.5;
    margin: 4px 0 14px;
}

.co-hint-act[b-amyuenfz3j] {
    display: flex;
    gap: 9px;
    flex-wrap: wrap;
}

@keyframes coIn-b-amyuenfz3j { from { opacity: 0; transform: translateY(5px); } }
@keyframes coSk-b-amyuenfz3j { from { background-position: 100% 50%; } to { background-position: 0 50%; } }

/* ───────── Графіки «Огляду» (12-кол. сітка чарт-карток; .card — з theme.css) ───────── */
.dash-grid[b-amyuenfz3j] {
    display: grid;
    grid-template-columns: repeat(12, 1fr);
    gap: 16px;
    margin-bottom: 22px;
}

.col-4[b-amyuenfz3j] { grid-column: span 4; }
.col-8[b-amyuenfz3j] { grid-column: span 8; }
.col-12[b-amyuenfz3j] { grid-column: span 12; }

.chart-card[b-amyuenfz3j] {
    display: flex;
    flex-direction: column;
    animation: coIn-b-amyuenfz3j 0.5s ease both;
}

.cc-h[b-amyuenfz3j] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 18px;
}

.cc-t[b-amyuenfz3j] { font: var(--t-h3); font-size: 14.5px; letter-spacing: -0.01em; }
.cc-s[b-amyuenfz3j] { font-size: 11.5px; color: var(--text-3); margin-top: 2px; font-weight: 500; }

/* пончик/кільця притискаємо донизу — щоб картки в ряду вирівнялись по низу */
.chart-card[b-amyuenfz3j]  .donut-wrap { margin-top: auto; }

.legend2[b-amyuenfz3j] { display: flex; gap: 14px; flex-shrink: 0; flex-wrap: wrap; }
.legend2 .li[b-amyuenfz3j] { display: flex; align-items: center; gap: 6px; font-size: 11.5px; font-weight: 600; color: var(--text-2); white-space: nowrap; }
.legend2 .sw[b-amyuenfz3j] { width: 9px; height: 9px; border-radius: 3px; }

/* Порівняльні стовпчики (склад мережі) */
.cmp[b-amyuenfz3j] { display: flex; flex-direction: column; gap: 15px; margin-top: 2px; }
.cmp-row[b-amyuenfz3j] { display: grid; grid-template-columns: 132px 1fr; gap: 16px; align-items: center; }
.cmp-label[b-amyuenfz3j] { display: flex; align-items: center; gap: 8px; font-size: 12.5px; font-weight: 600; color: var(--text-2); }
.cmp-dot[b-amyuenfz3j] { width: 9px; height: 9px; border-radius: 3px; flex-shrink: 0; }
.cmp-bar[b-amyuenfz3j] { display: grid; grid-template-columns: 1fr 52px; gap: 12px; align-items: center; }
.cmp-track[b-amyuenfz3j] { height: 9px; border-radius: 5px; background: var(--card-2); overflow: hidden; }
.cmp-fill[b-amyuenfz3j] { display: block; height: 100%; border-radius: 5px; transform-origin: left; animation: growX-b-amyuenfz3j 0.7s cubic-bezier(0.3, 1, 0.4, 1) both; }
.cmp-num[b-amyuenfz3j] { font-size: 12.5px; font-weight: 700; text-align: right; color: var(--text); }

/* Кільця показників */
.rings[b-amyuenfz3j] { display: flex; gap: 12px; justify-content: space-around; align-items: center; flex-wrap: wrap; margin-top: auto; padding-top: 4px; }

@keyframes growX-b-amyuenfz3j { from { transform: scaleX(0); } }

@media (max-width: 880px) {
    .col-4[b-amyuenfz3j], .col-8[b-amyuenfz3j] { grid-column: span 12; }
}
/* /Pages/Products.razor.rz.scp.css */
/* Товари — лише те, що MudBlazor не виражає темою. Палітра/типографіка/кнопки/чипи/грід — з MudTheme. */

.page-head .actions[b-g3p9v9vbg3] {
    display: flex;
    gap: 10px;
    align-items: center;
}

/* ── Стани завантаження / порожньо (Mud-обгортки в нашому ритмі) ── */
.pr-loading[b-g3p9v9vbg3],
.pr-empty[b-g3p9v9vbg3] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 6px;
    padding: 48px 24px;
    text-align: center;
}

.pr-empty-icon[b-g3p9v9vbg3] {
    opacity: .5;
}

/* ── Фільтр-бар за групами (поповер + вибрані чипи) ── */
.pr-filterbar[b-g3p9v9vbg3] {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 8px;
    margin-bottom: 10px;
}

/* Панель поповера фільтра груп. Скоуп досягає її попри teleport (b-hash їде з елементом). */
.pr-gf-panel[b-g3p9v9vbg3] {
    width: 290px;
    padding: 10px 10px 6px;
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.pr-gf-search[b-g3p9v9vbg3] {
    margin: 0;
}

.pr-gf-list[b-g3p9v9vbg3] {
    max-height: 280px;
    overflow-y: auto;
    display: flex;
    flex-direction: column;
    gap: 1px;
    margin: 0 -4px;
    padding: 0 4px;
}

.pr-gf-opt[b-g3p9v9vbg3] {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 5px 8px;
    border-radius: 9px;
    cursor: pointer;
    user-select: none;
    transition: background .12s;
}

.pr-gf-opt:hover[b-g3p9v9vbg3] { background: var(--card-2, #f7f6f3); }
.pr-gf-opt.on[b-g3p9v9vbg3] { background: var(--acc-soft, #eef4f0); }

.pr-gf-swatch[b-g3p9v9vbg3] {
    width: 9px;
    height: 9px;
    border-radius: 3px;
    flex-shrink: 0;
}

.pr-gf-name[b-g3p9v9vbg3] {
    flex: 1;
    min-width: 0;
    font-size: 13px;
    font-weight: 600;
    color: var(--text, #16140f);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.pr-gf-count[b-g3p9v9vbg3] {
    font-size: 11.5px;
    font-weight: 700;
    color: var(--text-4, #8b867a);
}

.pr-gf-empty[b-g3p9v9vbg3] {
    padding: 14px 8px;
    text-align: center;
    font-size: 12.5px;
    color: var(--text-3, #8b867a);
}

.pr-gf-foot[b-g3p9v9vbg3] {
    display: flex;
    justify-content: flex-end;
    border-top: 1px solid var(--hair, #e6e3dc);
    padding-top: 4px;
}

/* ── Фільтр за характеристиками (той самий ритм, що group-filter; крок-1 список / крок-2 ввід) ── */
.pr-cf-type[b-g3p9v9vbg3] {
    flex: 0 0 auto;
    font-size: 10.5px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .03em;
    color: var(--text-4, #8b867a);
}

.pr-cf-step2-head[b-g3p9v9vbg3] {
    display: flex;
    align-items: center;
    gap: 6px;
    padding-bottom: 2px;
}

.pr-cf-step2-name[b-g3p9v9vbg3] {
    flex: 1;
    min-width: 0;
    font-size: 13px;
    font-weight: 600;
    color: var(--text, #16140f);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.pr-cf-foot[b-g3p9v9vbg3] {
    justify-content: space-between;
    align-items: center;
}

/* Дії в рядку грида (edit/delete/restore) — праворуч, щільно. */
.pr-row-actions[b-g3p9v9vbg3] {
    display: flex;
    justify-content: flex-end;
    gap: 2px;
}

/* ── Тулбар: пошук + перемикач видалених + лічильник ── */
.pr-toolbar[b-g3p9v9vbg3] {
    gap: 12px;
    margin-bottom: 10px;
}

.pr-search[b-g3p9v9vbg3] {
    max-width: 360px;
}

.pr-count[b-g3p9v9vbg3] {
    white-space: nowrap;
}

/* Лічильник членів групи всередині фільтр-чипа (Mud не має такого слота). */
.cb-n[b-g3p9v9vbg3] {
    margin-left: 6px;
    font-size: 11px;
    opacity: .7;
}

/* Клітинка «Товар»: вертикальний стек назва/артикул (аватар .ava/.cell-id/.ci-name/.count-pill —
   глобальні з directory.css, тут лише те, чого там немає для цього зрізу). */
.ci-main[b-g3p9v9vbg3] {
    display: flex;
    flex-direction: column;
    line-height: 1.25;
}

.ci-sub[b-g3p9v9vbg3] {
    font-size: 12px;
    opacity: .65;
}

.row-chips[b-g3p9v9vbg3] {
    display: flex;
    flex-wrap: wrap;
    gap: 5px;
    max-width: 240px;
}

.ta-r[b-g3p9v9vbg3] {
    text-align: right;
}

.pr-deleted-badge[b-g3p9v9vbg3] {
    margin-left: 8px;
    vertical-align: middle;
}

/* ── Рядок мягко видаленого товару (клас навішує MudDataGrid.RowClassFunc) ── */
.pr-row-deleted[b-g3p9v9vbg3] {
    opacity: .55;
}

.pr-row-deleted:hover[b-g3p9v9vbg3] {
    opacity: .85;
}

.pr-row-deleted .ci-name[b-g3p9v9vbg3] {
    text-decoration: line-through;
    text-decoration-color: var(--hair-strong);
}

@media (max-width: 640px) {
    .row-chips[b-g3p9v9vbg3] { max-width: 140px; }
    .pr-search[b-g3p9v9vbg3] { max-width: none; }
}
/* /Pages/Regions.razor.rz.scp.css */
/* Регіони — лише те, чого MudTheme/directory.css не виражають. Палітра/типографіка/кнопки/чипи — з Mud. */

.page-head .actions[b-2ww7cd0xcd] {
    display: flex;
    gap: 10px;
    align-items: center;
}

/* Стан завантаження (Mud-обгортка в нашому ритмі). */
.reg-loading[b-2ww7cd0xcd] {
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 48px 24px;
}

.ta-r[b-2ww7cd0xcd] {
    text-align: right;
}

/* Карта на всю ширину зверху (Leaflet будує власний DOM — стилі карти глобальні в map.css). */
.reg-map-card[b-2ww7cd0xcd] {
    padding: 16px 16px 14px;
    margin-bottom: 14px;
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.reg-map-head[b-2ww7cd0xcd] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}

.reg-map-legend[b-2ww7cd0xcd] {
    display: flex;
    gap: 12px;
    font-size: 11.5px;
    color: var(--text-3);
}

.reg-map-legend .lg[b-2ww7cd0xcd] {
    display: inline-flex;
    align-items: center;
    gap: 5px;
}

.lg-dot[b-2ww7cd0xcd] {
    width: 10px;
    height: 10px;
    border-radius: 3px;
    background: var(--card-2);
    border: 1px solid var(--hair-strong);
}

.lg-dot.on[b-2ww7cd0xcd] {
    background: var(--acc);
    border-color: var(--acc);
}

.lg-dot.sel[b-2ww7cd0xcd] {
    background: var(--acc);
    border-color: var(--acc);
    box-shadow: 0 0 0 2px var(--acc-soft);
}

/* Контейнер Leaflet-карти: рамка та скруглення, сама карта (.bg-map) заповнює всю площу. */
.reg-map-wrap[b-2ww7cd0xcd] {
    background: var(--card-2);
    border: 1px solid var(--hair);
    border-radius: 14px;
    overflow: hidden;
}

/* ── Панель вибірки областей під картою: клік по карті збирає чернетку регіону ── */
.reg-pick[b-2ww7cd0xcd] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 10px;
    min-height: 34px;
}

.reg-pick-chips[b-2ww7cd0xcd] {
    flex: 1;
    min-width: 0;
}

.reg-pick-actions[b-2ww7cd0xcd] {
    flex-shrink: 0;
}

/* ── Список: підсвітка обраної області + м'який маркер успадкованого рядка ── */
.reg-row-hl[b-2ww7cd0xcd] {
    background: var(--acc-soft);
}

.reg-row-inh[b-2ww7cd0xcd] {
    background: color-mix(in srgb, var(--card-2) 55%, transparent);
}

.reg-row-inh.reg-row-hl[b-2ww7cd0xcd] {
    background: var(--acc-soft);
}

.ci-sub.reg-inh[b-2ww7cd0xcd] {
    color: var(--text-3);
    font-weight: 600;
}
/* /Pages/Security.razor.rz.scp.css */
/* Профіль і безпека — page-level chrome. Form controls / tabs / dialogs render via MudBlazor;
   shell tokens (--card, --hair, --acc, --r-card …) come from wwwroot/css/theme.css. */

.sec[b-nvsficha97] {
    max-width: 980px;
    margin: 0 auto;
    padding: 28px 30px 72px;
}

.sec-head[b-nvsficha97] {
    margin-bottom: 18px;
}

.sec-head h1[b-nvsficha97] {
    font: var(--t-h1);
    font-size: 30px;
    letter-spacing: -0.03em;
    margin: 0;
}

.sec-sub[b-nvsficha97] {
    color: var(--text-3);
    font-size: 13.5px;
    margin-top: 6px;
}

/* ---------- Cards ---------- */
.sec-card[b-nvsficha97] {
    padding: 18px 20px 20px;
    background: var(--card);
    border: 1px solid var(--hair);
    border-radius: var(--r-card);
    box-shadow: var(--sh-card);
}

.sec-card-h[b-nvsficha97] {
    margin-bottom: 12px;
}

.sec-card-h-row[b-nvsficha97] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    flex-wrap: wrap;
}

.sec-card-h .t[b-nvsficha97] {
    font: var(--t-h3);
    font-size: 16px;
    letter-spacing: -0.01em;
}

.sec-card-h .s[b-nvsficha97] {
    font-size: 12.5px;
    color: var(--text-3);
    margin-top: 3px;
    font-weight: 500;
}

.sec-rows[b-nvsficha97] {
    padding: 0;
}

.sec-row[b-nvsficha97] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 11px 0;
    border-bottom: 1px solid var(--hair);
}

.sec-row:last-child[b-nvsficha97] {
    border-bottom: none;
}

/* ---------- Login address ---------- */
.sec-email[b-nvsficha97] {
    display: flex;
    flex-direction: column;
    gap: 4px;
    padding: 2px 0 6px;
}

.sec-email-addr[b-nvsficha97] {
    font-weight: 700;
    overflow: hidden;
    text-overflow: ellipsis;
}

.sec-email-ok[b-nvsficha97] {
    display: flex;
    align-items: center;
    gap: 5px;
    color: var(--acc-text);
    font-weight: 600;
}

.sec-actions[b-nvsficha97] {
    display: flex;
    gap: 8px;
    justify-content: flex-end;
    margin-top: 12px;
}

.sec-lead[b-nvsficha97] {
    color: var(--text-3);
    line-height: 1.5;
    margin: 4px 0 16px;
}

/* ---------- Responsive ---------- */
@media (max-width: 720px) {
    .sec[b-nvsficha97] {
        padding: 22px 18px 56px;
    }
}
/* /Pages/Settings.razor.rz.scp.css */
/* All rules promoted to BGRetail.Back.Admin/wwwroot/css/components.css
   (shared component classes that cross child-component boundaries). */
/* /Pages/Shops.razor.rz.scp.css */
/* Точки — лише те, чого MudTheme/directory.css не виражають. Палітра/типографіка/кнопки/чипи/грід — з Mud. */

.page-head .actions[b-2h6e0qvu4w] {
    display: flex;
    gap: 10px;
    align-items: center;
}

/* ── Стан завантаження (Mud-обгортка в нашому ритмі; порожній стан — уніфікований <EmptyState>) ── */
.sp-loading[b-2h6e0qvu4w] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 6px;
    padding: 48px 24px;
    text-align: center;
}

/* Клітинка «Точка»: вертикальний стек назва/ID (аватар .ava/.cell-id/.ci-name/.count-pill —
   глобальні з directory.css). */
.ci-main[b-2h6e0qvu4w] {
    display: flex;
    flex-direction: column;
    line-height: 1.25;
}

.ci-sub[b-2h6e0qvu4w] {
    font-size: 12px;
    opacity: .65;
}

.ta-r[b-2h6e0qvu4w] {
    text-align: right;
}

.sp-deleted-badge[b-2h6e0qvu4w] {
    margin-left: 8px;
    vertical-align: middle;
}

/* ── Рядок мягко видаленої точки (клас навішує MudDataGrid.RowClassFunc) ── */
.sp-row-deleted[b-2h6e0qvu4w] {
    opacity: .55;
}

.sp-row-deleted:hover[b-2h6e0qvu4w] {
    opacity: .85;
}

.sp-row-deleted .ci-name[b-2h6e0qvu4w] {
    text-decoration: line-through;
    text-decoration-color: var(--hair-strong);
}

/* ── Карта точок ── */
.sp-map-card[b-2h6e0qvu4w] {
    padding: 14px 16px;
    margin-bottom: 14px;
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.sp-map-head[b-2h6e0qvu4w] {
    display: flex;
    flex-direction: column;
    gap: 2px;
}