@import '_content/Barab.Components/Barab.Components.kxuc1qtw3l.bundle.scp.css';
@import '_content/Barab.Core.UI/Barab.Core.UI.m6fojovsj7.bundle.scp.css';
@import '_content/Barab.Geodesy/Barab.Geodesy.zw7zws2k0s.bundle.scp.css';
@import '_content/Barab.MapLibre/Barab.MapLibre.l730lg9lpc.bundle.scp.css';
@import '_content/Barab.Survey/Barab.Survey.h6vp0txxsp.bundle.scp.css';
@import '_content/Barab.Tickets/Barab.Tickets.awmewl4xa4.bundle.scp.css';

/* /Components/Blocks/Children/ChildrenView.razor.rz.scp.css */
.bn-children-panel[b-1r1qiclezq] {
    display: flex;
    flex-direction: column;
    flex: 1 1 auto;
    min-height: 0;
    gap: 0.5rem;
}

.bn-children-panel__toolbar[b-1r1qiclezq] {
    display: flex;
    justify-content: flex-end;
}

.bn-children-panel__empty[b-1r1qiclezq] {
    padding: 2rem;
    text-align: center;
    color: var(--rz-text-secondary-color, #888);
}

.bn-children-panel__grid[b-1r1qiclezq] {
    flex: 1 1 auto;
    min-height: 0;
}

/* FEAT-196 — unpublished branch, the same token as the tree's .bn-entity-tree__label--unpublished.
   a.bn-grid__link is in the selector so it outranks BarabGrid's own link colour (incl. :visited). */
.bn-children-panel a.bn-grid__link.bn-children-panel__name--unpublished[b-1r1qiclezq],
.bn-children-panel a.bn-grid__link.bn-children-panel__name--unpublished:visited[b-1r1qiclezq] {
    color: var(--rz-warning-dark, #b26a00);
    font-style: italic;
}
/* /Components/Blocks/Dashboard/DashboardEditBar.razor.rz.scp.css */
/* Issue #1932 — sticks to the bottom of the scrolling area. Not position:fixed: Radzen's .rz-body (the
   home page's scroller) carries a transform, which makes it the containing block of a fixed element,
   so a fixed bar scrolled away with the tiles. The host renders the bar after the tiles; at zero
   height it takes no room, and the float hangs from its bottom-right corner. The top margin leaves
   room for the float below the last tile, so at the end of the scroll (or on a short dashboard) it
   does not cover that tile's resize handle. An inactive RadzenTabs panel is display:none, so a
   Přehled on a hidden tab hides its bar too. */
.bn-dashboard-editbar[b-irh9i1mymg] {
    position: sticky;
    bottom: 1rem;
    height: 0;
    margin-top: 4rem;
    z-index: 100;
}

.bn-dashboard-editbar__float[b-irh9i1mymg] {
    position: absolute;
    right: 0;
    bottom: 0;
}

/* Radzen's .rz-fab positions itself (absolute, 1.5rem insets); here the float owns the corner, so
   the FAB and the edit bar share one anchor and the icon does not jump when editing starts. */
.bn-dashboard-editbar[b-irh9i1mymg]  .rz-fab {
    position: static;
}

.bn-dashboard-editbar--idle[b-irh9i1mymg] {
    opacity: 0.5;
    transition: opacity 0.15s;
}

.bn-dashboard-editbar--idle:hover[b-irh9i1mymg],
.bn-dashboard-editbar--idle:focus-within[b-irh9i1mymg] {
    opacity: 1;
}
/* /Components/Blocks/Dashboard/DashboardView.razor.rz.scp.css */
.bn-dashboard-grid[bn-dashboard] {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(20rem, 1fr));
    gap: 1rem;
    /* Bento-style packing: a later small card fills a hole left by a wider one, and cards in one
       row share its height so the rows read as even bands. */
    grid-auto-flow: row dense;
    align-items: stretch;
    padding: 1rem 0;
}

[bn-dashboard] .bn-widget {
    border: 1px solid var(--rz-base-200);
    border-radius: var(--rz-border-radius, 4px);
    background: var(--rz-base-background-color, #fff);
    padding: 0.75rem 1rem 1rem;
    display: flex;
    flex-direction: column;
    min-height: 8rem;
}

/* FEAT-184 — tile layout (>= 1200 px). The Radzen tile is the card: Radzen's tile variables give it
   the widget card's border and radius, and the widget below drops its own chrome so it is not drawn
   twice. The tile content keeps Radzen's 0.75rem padding (an inline style with no variable) and
   lets the widget fill it exactly, so only the widget body scrolls (issue #1812). */
.bn-dashboard-tiles[bn-dashboard] {
    --rz-tile-layout-item-border: 1px solid var(--rz-base-200);
    --rz-tile-layout-item-border-radius: var(--rz-border-radius, 4px);
    --rz-tile-layout-item-shadow: none;
    padding: 1rem 0;
}

/* FEAT-184 edit mode — a hidden widget stays on the canvas so it can be shown again, greyed out. */
.bn-dashboard-tiles[bn-dashboard]  .bn-dashboard-tile--hidden { opacity: 0.45; }

.bn-dashboard-tiles[bn-dashboard]  .bn-widget {
    border: none;
    border-radius: 0;
    background: transparent;
    padding: 0;
    height: 100%;
    min-height: 0;   /* the card floor (8rem) would outgrow a one-row tile */
}

/* Issue #1812 — the widget fills the tile exactly and only its body scrolls, so the widget header
   stays put instead of scrolling away inside Radzen's (inline overflow: auto) tile content. */
.bn-dashboard-tiles[bn-dashboard]  .bn-widget__head { flex: 0 0 auto; }
.bn-dashboard-tiles[bn-dashboard]  .bn-widget__body { flex: 1 1 auto; min-height: 0; overflow: auto; }

/* Issue #1812 — in edit mode the Radzen tile header carries the widget name; the widget's own
   header would repeat it. */
.bn-dashboard-tiles--editing[bn-dashboard]  .bn-widget__head { display: none; }

[bn-dashboard] .bn-widget[data-size="Large"] { grid-column: 1 / -1; }
[bn-dashboard] .bn-widget[data-size="Medium"] { grid-column: span 2; }

[bn-dashboard] .bn-widget__head {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin-bottom: 0.5rem;
}

/* Issue #1736 — a widget that opts in (FillsBody) grows its body to the rest of the card, so its
   content can follow the tile height instead of keeping its own fixed one. */
[bn-dashboard] .bn-widget__body--fill {
    flex: 1 1 auto;
    min-height: 0;
    display: flex;
    flex-direction: column;
}

/* The narrow grid gives a card no height of its own, so stretching content needs a floor there;
   in the tile layout the tile decides. */
.bn-dashboard-grid[bn-dashboard]  .bn-widget__body--fill { min-height: 14rem; }

[bn-dashboard] .bn-widget__titles { flex: 1; min-width: 0; }
[bn-dashboard] .bn-widget__title { font-size: 0.95rem; font-weight: 600; margin: 0; }
/* A pinned home tile's origin, on its own line under the title (#1928). */
[bn-dashboard] .bn-widget__origin { display: block; font-size: 0.8rem; }
[bn-dashboard] .bn-widget__skeleton { height: 4rem; background: linear-gradient(90deg,#f0f0f0,#f7f7f7,#f0f0f0); border-radius: 4px; }
[bn-dashboard] .bn-widget__empty { opacity: 0.6; font-size: 0.85rem; }
[bn-dashboard] .bn-widget__error { color: var(--rz-danger, #b00020); font-size: 0.85rem; }
[bn-dashboard] .bn-widget__ok { color: var(--rz-success, #16a34a); font-size: 0.85rem; }

[bn-dashboard] .bn-widget__list {
    list-style: none;
    margin: 0;
    padding: 0;
    font-size: 0.85rem;
}

[bn-dashboard] .bn-widget__list li {
    display: flex;
    align-items: center;
    gap: 0.4rem;
    padding: 0.2rem 0;
    border-bottom: 1px solid var(--rz-base-100);
}

[bn-dashboard] .bn-widget__list li:last-child { border-bottom: none; }

/* A news row: the date in a fixed column on the left, the rest as one block of text that wraps
   as a whole. Without the wrapper every text node becomes its own flex item and shrinks into a
   narrow column of its own (FEAT-175, seen at 1440 px). */
[bn-dashboard] .bn-widget__list li:has(> .bn-widget__when) { align-items: baseline; }
[bn-dashboard] .bn-widget__when { flex: 0 0 auto; white-space: nowrap; opacity: 0.7; font-variant-numeric: tabular-nums; }
[bn-dashboard] .bn-widget__what { flex: 1 1 auto; min-width: 0; overflow-wrap: break-word; }
[bn-dashboard] .bn-widget__what small { opacity: 0.7; }

/* A list row (#1929, "Moje tickety", "Moje notifikace"): a title clamped to two lines over a
   caption line, small actions at the top right. The title reads as text and turns into a link on
   hover only, so a long title is not a block of link colour. */
[bn-dashboard] .bn-widget__row {
    display: flex;
    align-items: flex-start;
    gap: 0.5rem;
    padding: 0.25rem 0;
    border-bottom: 1px solid var(--rz-base-100);
}
[bn-dashboard] .bn-widget__row:last-child { border-bottom: none; }
[bn-dashboard] .bn-widget__row-main { flex: 1 1 auto; min-width: 0; }
[bn-dashboard] .bn-widget__row-title {
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    font-size: 0.875rem;
    color: var(--rz-text-color);
    text-decoration: none;
}
[bn-dashboard] a.bn-widget__row-title:hover { color: var(--rz-primary); text-decoration: underline; }
[bn-dashboard] .bn-widget__row-meta { font-size: 0.75rem; color: var(--rz-text-secondary-color); }

[bn-dashboard] .bn-widget__dot {
    flex: 0 0 auto;
    width: 0.6rem;
    height: 0.6rem;
    border-radius: 50%;
    display: inline-block;
}

[bn-dashboard] .bn-widget__count {
    display: block;
    margin-top: 0.4rem;
    opacity: 0.6;
    font-size: 0.8rem;
}

[bn-dashboard] .bn-widget__measurements {
    display: grid;
    grid-template-columns: 1fr auto;
    gap: 0.15rem 0.75rem;
    margin: 0;
    font-size: 0.85rem;
}

[bn-dashboard] .bn-widget__measurements dt { font-weight: 500; }
[bn-dashboard] .bn-widget__measurements dd { margin: 0; text-align: right; font-variant-numeric: tabular-nums; }
[bn-dashboard] .bn-widget__measurements dd small { opacity: 0.6; }

/* A card per item with one big number (#1686, "Postup ražeb"): as many columns as fit. */
[bn-dashboard] .bn-widget__cards {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(9rem, 1fr));
    gap: 0.5rem;
}

[bn-dashboard] .bn-widget__card {
    display: flex;
    flex-direction: column;
    gap: 0.1rem;
    padding: 0.5rem 0.6rem;
    border: 1px solid var(--rz-base-200);
    border-radius: var(--rz-border-radius, 4px);
    color: inherit;
    text-decoration: none;
}

[bn-dashboard] .bn-widget__card:hover { background: var(--rz-base-50); }
[bn-dashboard] .bn-widget__card-value { font-size: 1.6rem; font-weight: 600; line-height: 1.2; font-variant-numeric: tabular-nums; }
[bn-dashboard] .bn-widget__card-label { font-size: 0.85rem; overflow-wrap: break-word; }
[bn-dashboard] .bn-widget__card-meta { font-size: 0.75rem; opacity: 0.7; }

/* FEAT-203 — the pin ("Přidat na hlavní panel") sits in the tile's top-right corner: the Radzen tile
   item is positioned, the fluid grid item is made so here. The widget header leaves it room. */
.bn-dashboard-pin[bn-dashboard] { position: absolute; top: 0.4rem; right: 0.4rem; z-index: 2; }
.bn-dashboard-grid > .bn-home-tile[bn-dashboard] { position: relative; }
.bn-dashboard-grid > .bn-home-tile[bn-dashboard]  .bn-widget { flex: 1 1 auto; }
[bn-dashboard] .bn-dashboard-tile--pinnable .bn-widget__head { padding-right: 1.75rem; }
/* /Components/Blocks/Map/MapLayerTreeControl.razor.rz.scp.css */
/* No horizontal padding: the sidebar (.bn-map-panel-sidebar) already insets by .5rem, and the
   extra inset here was what left the layer rows sitting further right than the base-map radios
   above them (#127). Vertical padding stays — it separates the tree from the section title. */
.bn-layer-tree[b-e1qtmevr7g] { padding: .5rem 0; overflow: auto; height: 100%; font-size: .875rem; }
.bn-layer-tree ul[b-e1qtmevr7g] { list-style: none; padding-left: 1.2rem; margin: 0; }
/* Selector must outrank `.bn-layer-tree ul` above (class+element beats a bare class), otherwise
   the root list keeps the 1.2rem child indent and every top-level layer row sits ~19px to the
   right of the base-map radios above it (#127). Nested lists still indent normally. */
.bn-layer-tree ul.bn-layer-tree-root[b-e1qtmevr7g] { padding-left: 0; }
.bn-layer-row[b-e1qtmevr7g] { display: flex; align-items: center; gap: .35rem; padding: .15rem 0; }
.bn-twisty[b-e1qtmevr7g] { cursor: pointer; user-select: none; display: inline-block; width: 1rem; transition: transform 120ms; }
.bn-twisty.open[b-e1qtmevr7g] { transform: rotate(90deg); }
.bn-twisty-placeholder[b-e1qtmevr7g] { display: inline-block; width: 1rem; }
.bn-layer-label[b-e1qtmevr7g] { user-select: none; }
/* Type icons in front of the label (Task 5b) — Radzen's default icon size reads oversized next to
   the .875rem row text. */
.bn-layer-icon[b-e1qtmevr7g] { font-size: 1rem; }
.bn-layer-zoomable[b-e1qtmevr7g] { cursor: pointer; border-radius: 3px; padding: 0 .2rem; }
.bn-layer-zoomable:hover[b-e1qtmevr7g] { background: rgba(0, 0, 0, .07); text-decoration: underline; }
.bn-highlighted > .bn-layer-row .bn-layer-label[b-e1qtmevr7g] { font-weight: 600; color: #e94f37; }
/* Radzen's Disabled greys the checkbox but not the label next to it (FEAT-155) — this is the only
   reason this rule exists: without it a disabled underlay row's text still reads as clickable. */
.bn-underlay-disabled[b-e1qtmevr7g] { opacity: .5; }
/* /Components/Blocks/Map/MapView.razor.rz.scp.css */
/* The splitter panes are flex columns (min-height:0) per barab-core-ui.css, so the
   panel fills with flex:1 rather than height:100% — the latter collapses to 0 in a
   min-height:0 flex column and leaves the MapLibre canvas stuck at its 300px fallback. */
.bn-map-panel-master[b-hze9z9jtiu] {
    flex: 1 1 auto;
    min-height: 0;
    width: 100%;
    display: flex;
    flex-direction: column;
}

[b-hze9z9jtiu] .brb-map-container {
    flex: 1 1 auto;
    min-height: 400px;
    width: 100%;
}

/* Minimap (Simplified) — fills the dashboard card it sits in (issue #1736: a fixed 14rem left the
   rest of a taller tile empty, and overflowed the default two-row tile). The card body is a flex
   column (MapWidget.FillsBody), so the minimap grows with flex: 1; its height comes from the tile,
   or from the body's floor in the narrow grid layout (DashboardView.razor.css).
   The wrapper carries the scope attribute that ::deep needs to reach the Map component's
   own container element. */
.bn-map-mini[b-hze9z9jtiu] {
    flex: 1 1 auto;
    min-height: 0;
    width: 100%;
    display: flex;
    flex-direction: column;
}

[b-hze9z9jtiu] .brb-map-mini-container {
    flex: 1 1 auto;
    min-height: 0;
    width: 100%;
    border-radius: var(--rz-border-radius, 4px);
    overflow: hidden;
}

.bn-map-mini-empty[b-hze9z9jtiu] {
    opacity: 0.6;
    font-size: 0.85rem;
}

/* One heading treatment for both halves of the sidebar — the base-map picker and the layer
   tree (#127). Previously only the picker carried a title, and it carried it as an inline
   style, so the two sections read as unrelated controls.
   ::deep is required, not decorative: the title is a RadzenLabel, and scoped CSS never
   decorates a child component's own elements — without it the rule is silently inert
   (verified in the browser: the label rendered at font-weight 400). */
.bn-map-panel-sidebar[b-hze9z9jtiu]  .bn-map-section-title {
    font-weight: 600;
}

.bn-map-panel-sidebar[b-hze9z9jtiu] {
    flex: 1 1 auto;
    min-height: 0;
    width: 100%;
    display: flex;
    flex-direction: column;
    overflow: auto;
    padding: .5rem;
}
/* /Components/Blocks/Reports/Bulk/BulkReportsView.razor.rz.scp.css */
/* #1696 — Reporty | Objekty | Náhled fill the body of BarabTabPanel. .bn-tabpanel is already a flex
   column (flex:1; min-height:0) between the toolbar and the footer, so the row below takes the
   remaining height and each list and the preview scroll inside themselves. */
.bulk-reports__main[b-bhyr8wc7he] {
    display: flex;
    gap: .75rem;
    flex: 1;
    min-height: 0;
    padding: .75rem;
}

.bulk-reports__list[b-bhyr8wc7he] {
    display: flex;
    flex-direction: column;
    min-height: 0;
    border: 1px solid var(--rz-base-300);
    border-radius: var(--rz-border-radius, 4px);
}

.bulk-reports__list--sets[b-bhyr8wc7he] {
    flex: 0 0 16rem;
}

.bulk-reports__list--items[b-bhyr8wc7he] {
    flex: 0 0 20rem;
}

.bulk-reports__list-title[b-bhyr8wc7he] {
    display: flex;
    align-items: center;
    gap: .35rem;
    padding: .5rem .75rem;
    border-bottom: 1px solid var(--rz-base-300);
}

.bulk-reports__list-body[b-bhyr8wc7he] {
    flex: 1;
    min-height: 0;
    overflow-y: auto;
    padding: .25rem .5rem;
}

.bulk-reports__row[b-bhyr8wc7he] {
    display: flex;
    align-items: center;
    gap: .35rem;
    padding: .15rem .25rem;
    border-radius: var(--rz-border-radius, 4px);
    cursor: pointer;
}

.bulk-reports__row:focus-visible[b-bhyr8wc7he] {
    outline: 2px solid var(--rz-primary);
    outline-offset: -2px;
}

.bulk-reports__row:hover[b-bhyr8wc7he] {
    background: var(--rz-base-100);
}

.bulk-reports__row--active[b-bhyr8wc7he],
.bulk-reports__row--active:hover[b-bhyr8wc7he] {
    background: var(--rz-primary-lighter);
}

.bulk-reports__preview[b-bhyr8wc7he] {
    display: flex;
    flex-direction: column;
    flex: 1;
    min-width: 0;
    min-height: 0;
}

.bulk-reports__viewer[b-bhyr8wc7he] {
    flex: 1;
    min-height: 0;
}

.bulk-reports__message[b-bhyr8wc7he] {
    padding: .5rem .75rem;
    color: var(--rz-text-secondary-color);
}

.bulk-reports__status[b-bhyr8wc7he] {
    display: flex;
    flex-direction: column;
    gap: .25rem;
    max-height: 30vh;
    overflow-y: auto;
}

.bulk-reports__download[b-bhyr8wc7he] {
    display: inline-flex;
    align-items: center;
    gap: .35rem;
    text-decoration: none;
}
/* /Components/Blocks/Reports/PresentationSetBrowser.razor.rz.scp.css */
/* FEAT-146 F4 Task 14c-1 — one toolbar above a full-width report. Only what Radzen has no
   parameter for: the combo's width, the option row, and the raw download anchors. */
/* Pavel review (14c-2) — .rz-tabview-panel (barab-core-ui.css) is already `height: 100%;
   display: flex; flex-direction: column;`, and ReportsPanel renders ReportsView straight into it
   with no BarabTabPanel wrapper (its toolbar is this component's own) — so .set-browser is that
   panel's sole flex child and follows the same flex:1;min-height:0 recipe .bn-tabpanel/
   .bn-master-panel use to fill the tab's remaining height, instead of inventing a viewport calc. */
.set-browser[b-sg5ewwa2u0] {
    display: flex;
    flex-direction: column;
    gap: .5rem;
    flex: 1;
    min-height: 0;
}

.set-browser[b-sg5ewwa2u0]  .set-browser__picker {
    /* Nit (14c-1 review) — 20rem clipped a longer set name off the option's closed-value label
       (Radzen's .rz-dropdown-label truncates with an ellipsis once its content overflows). */
    min-width: 26rem;
}

.set-browser__option[b-sg5ewwa2u0] {
    display: inline-flex;
    align-items: center;
    gap: .5rem;
    white-space: nowrap;
}

.set-browser__muted[b-sg5ewwa2u0],
.set-browser__placeholder[b-sg5ewwa2u0],
.set-browser__facts[b-sg5ewwa2u0] {
    color: var(--rz-text-secondary-color);
}

.set-browser__actions[b-sg5ewwa2u0] {
    /* #1717 — pinned to the toolbar's right edge, wrapped or not, so the Stáhnout/cog menus (which
       Radzen anchors to their right edge) always open inward instead of under the tree pane. */
    margin-left: auto;
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: .5rem;
}

.set-browser__placeholder[b-sg5ewwa2u0] {
    padding: 1rem 0;
}

.set-browser__facts[b-sg5ewwa2u0] {
    display: flex;
    flex-wrap: wrap;
    gap: .25rem 1rem;
    font-size: .8rem;
}

.set-browser__preview-error[b-sg5ewwa2u0] {
    padding: .5rem .75rem;
    border: 1px solid var(--rz-base-300);
    border-radius: var(--rz-border-radius, 4px);
    background: var(--rz-base-100);
}

/* FEAT-152 — the viewer fills the tab's remaining height (.set-browser is already a flex column
   with flex:1; min-height:0) and scrolls/zooms inside itself. */
.set-browser__preview[b-sg5ewwa2u0] {
    flex: 1;
    min-height: 0;
}

.set-browser__delegated[b-sg5ewwa2u0] {
    padding: .35rem 0;
    color: var(--rz-text-secondary-color);
}

/* Pavel review — the charts share whatever height .set-browser is actually given (which itself
   now fills the tab, see above) instead of a fixed 420/520px. The area scrolls internally once
   the charts' own min-height no longer all fit, so a small window scrolls rather than squashing
   ECharts down to nothing. */
.set-browser__chart-area[b-sg5ewwa2u0] {
    display: flex;
    flex-direction: column;
    gap: .5rem;
    flex: 1;
    min-height: 0;
    overflow-y: auto;
}

/* #1285 — one combined BarabEChart per set (was one per TimeSeries chart, each with its own
   flex share). PresentationEChartOptionsBuilder's option tree uses percentage grid offsets, so
   the host still needs a resolved pixel height at layout time for BarabEChart's ResizeObserver to
   pick up (same requirement AdvanceChartPanel satisfies for AdvanceChartView, there via a fixed
   height instead of flex-grow). flex-basis 0 lets it fill whatever the chart area has. */
.set-browser__chart[b-sg5ewwa2u0] {
    flex: 1 1 0;
    min-height: 320px;
}

/* #1717 — RadzenProfileMenu is built for the app header (an rz-menu bar in the primary colour,
   its list anchored to its right edge). Here it has to read as a toolbar button — Radzen has no
   parameter for that. */
.set-browser[b-sg5ewwa2u0]  .set-browser__menu {
    background: var(--rz-base-background-color);
    color: var(--rz-text-color);
    border: 1px solid var(--rz-base-300);
    border-radius: var(--rz-border-radius, 4px);
}

.set-browser[b-sg5ewwa2u0]  .set-browser__download {
    background: var(--rz-primary);
    color: var(--rz-on-primary, #fff);
    border-color: var(--rz-primary);
}

.set-browser[b-sg5ewwa2u0]  .set-browser__menu .rz-navigation-menu {
    width: max-content;
}

.set-browser[b-sg5ewwa2u0]  .set-browser__menu .item-text {
    display: inline-flex;
    align-items: center;
    gap: .35rem;
}

/* The header theme paints the toggle chevron white, invisible on the light cog button. */
.set-browser[b-sg5ewwa2u0]  .set-browser__menu .rz-navigation-item-icon-children {
    color: inherit;
}
/* /Components/Entities/EntityTreeView.razor.rz.scp.css */
/* FEAT-038 Task 5.2: visual highlight for nodes the current user can manage in admin mode. */
.bn-entity-tree__label--manageable[b-tu3d0kg70w] {
    font-weight: 600;
    /* -dark, not --rz-primary: the label must stay readable on the grey of the
       selected row too (4.90:1 on #e1e1e1; --rz-primary is 3.77:1 there, #1891). */
    color: var(--rz-primary-dark);
}

.bn-entity-tree__label--manageable[b-tu3d0kg70w]::before {
    content: "● ";
    font-size: 0.7em;
    vertical-align: middle;
}

/* Issue #1732 — ancestor on the way to a readable node: name only, not clickable. */
.bn-entity-tree__label--passthrough[b-tu3d0kg70w] {
    color: var(--rz-text-disabled-color, #9e9e9e);
    font-style: italic;
}

/* FEAT-196 — unpublished branch, visible only to managers; distinct from passthrough grey. */
.bn-entity-tree__label--unpublished[b-tu3d0kg70w] {
    color: var(--rz-warning-dark, #b26a00);
    font-style: italic;
}
/* /Components/Home/HomeDashboard.razor.rz.scp.css */
/* FEAT-203 — shares DashboardView's CSS scope (CssScope in BarabNeo.csproj), so the tile layout,
   fluid grid and widget card rules of DashboardView.razor.css apply here unchanged. Only what the
   home dashboard adds lives here. */

.bn-home-tile[bn-dashboard] { display: flex; flex-direction: column; }
.bn-home-tile__body[bn-dashboard] { display: flex; flex-direction: column; height: 100%; min-height: 0; }

/* The coloured stripe: the project's identity on a pinned tile (colour set inline from code-behind). */
.bn-home-tile__body--project[bn-dashboard] { border-left: 4px solid var(--bn-project-color); padding-left: 0.5rem; }

/* The widget takes the rest of the tile (not 100% of it). */
.bn-dashboard-tiles .bn-home-tile__body[bn-dashboard]  .bn-widget { height: auto; flex: 1 1 auto; min-height: 0; }

/* Fluid grid: the tile wrapper is the grid item, so it carries the widget's span. */
.bn-dashboard-grid > .bn-home-tile[data-size="Large"][bn-dashboard] { grid-column: 1 / -1; }
.bn-dashboard-grid > .bn-home-tile[data-size="Medium"][bn-dashboard] { grid-column: span 2; }
/* /Components/Layout/DesignerLayout.razor.rz.scp.css */
.designer-shell[b-p5o5b7owhl] {
    display: grid;
    grid-template-rows: auto 1fr;
    height: 100vh;
    overflow: hidden;
}

.designer-shell__bar[b-p5o5b7owhl] {
    display: flex;
    align-items: center;
    gap: 1rem;
    padding: 0 1rem;
    height: 3rem;
    border-bottom: 1px solid var(--rz-base-200);
    background: var(--rz-base-background-color);
}

.designer-shell__logo[b-p5o5b7owhl] {
    height: 1.5rem;
}

.designer-shell__title[b-p5o5b7owhl] {
    flex: 1;
    min-width: 0;
}

/* Flex column rather than a bare block: the page's own .designer-host takes flex: 1, which
   resolves against this definite grid row without depending on percentage-height inheritance. */
.designer-shell__body[b-p5o5b7owhl] {
    display: flex;
    flex-direction: column;
    min-height: 0;
    overflow: hidden;
}
/* /Components/Layout/InstanceMarker.razor.rz.scp.css */
.bn-instance-watermark[b-z3nddj8t2f] {
    position: fixed;
    inset: 0;
    z-index: 2000;          /* above content and Radzen dialogs' backdrop, below nothing that needs clicks */
    pointer-events: none;   /* never swallow clicks on maps, charts, grids */
    background-repeat: repeat;
}
/* /Components/Layout/ViewModeToggle.razor.rz.scp.css */
.view-mode-toggle[b-vvp590vjtb] {
    margin: 0 0.75rem;
    display: flex;
    align-items: center;
}
/* /Components/Pages/Admin/PresentationSetEditor.razor.rz.scp.css */
/* FEAT-146 Task 13g — BarabSplitLayout is `flex: 1; min-height: 0` and takes its height from the
   flex chain above it. Inside WorkspaceShell's MainSlot that chain does not reach here, so without
   an explicit height the splitter collapses to nothing. Applied only in the split shape; a set
   edited without a preview entity keeps the page's original single-column flow. */
.set-edit--split[b-ghlhmlgndf] {
    display: flex;
    flex-direction: column;
    min-height: 75vh;
}
/* /Components/Pages/Admin/PresentationSetPreview.razor.rz.scp.css */
/* FEAT-146 Task 13g — the editor's preview pane. */
.set-preview[b-calsb0joax] {
    display: flex;
    flex-direction: column;
    gap: 1rem;
    padding: .5rem .75rem;
    overflow: auto;
    min-height: 0;
    flex: 1;
}

.set-preview__title[b-calsb0joax] {
    margin: 0;
}

.set-preview__chart[b-calsb0joax] {
    display: flex;
    flex-direction: column;
    gap: .15rem;
    padding: .35rem 0;
    border-bottom: 1px solid var(--rz-base-200);
}

.set-preview__chart-head[b-calsb0joax] {
    display: flex;
    align-items: baseline;
    gap: .5rem;
}

.set-preview__serie[b-calsb0joax] {
    display: flex;
    align-items: center;
    gap: .35rem;
    font-size: .85rem;
    padding-left: .5rem;
}

.set-preview__muted[b-calsb0joax] {
    color: var(--rz-text-secondary-color);
    font-size: .8rem;
}

.set-preview__note[b-calsb0joax] {
    padding-top: .5rem;
}

.set-preview__ok[b-calsb0joax] {
    color: var(--rz-success, #28a745);
}

.set-preview__bad[b-calsb0joax] {
    color: var(--rz-danger, #dc3545);
}

.set-preview__actions[b-calsb0joax] {
    display: flex;
    align-items: center;
    gap: .5rem;
    flex-wrap: wrap;
}

.set-preview__actions a[b-calsb0joax] {
    text-decoration: none;
    display: inline-flex;
    align-items: center;
}

/* FEAT-152 — the admin page scrolls as a whole, so the viewer gets a fixed share of the viewport
   instead of growing with the page. */
.set-preview__report[b-calsb0joax] {
    height: 75vh;
}
/* /Components/Pages/Designer/DesignerPage.razor.rz.scp.css */
.designer-host[b-qb0aulbpzr] {
    /* DesignerLayout gives the body a definite height (grid 1fr) and lays it out as a flex
       column, so the canvas takes the remaining viewport without a second scrollbar. */
    flex: 1;
    min-height: 0;
    display: flex;
    flex-direction: column;
}
/* /Components/Pages/Operator/KooInspectionMap.razor.rz.scp.css */
/* FEAT-097 — layout and legend swatches for the KOO import map.
   Plain elements written in this component's own .razor, so no ::deep is needed here. */

/* The tab hands this wrapper its height; the canvas takes whatever the prose and legend leave.
   ::deep for the RadzenStack inside — it is rendered by Radzen and carries no scope attribute. */
.koo-map-tab[b-fls7ppi9ep] {
    display: flex;
    flex-direction: column;
    flex: 1;
    min-height: 0;
}

.koo-map-tab[b-fls7ppi9ep]  > .rz-stack {
    flex: 1;
    min-height: 0;
}

.koo-map-canvas[b-fls7ppi9ep] {
    flex: 1;
    min-height: 320px;
}

.koo-map-swatch[b-fls7ppi9ep] {
    display: inline-block;
    width: 0.85rem;
    height: 0.85rem;
    border-radius: 50%;
    border: 1.5px solid #fff;
    vertical-align: middle;
    margin-right: 0.35rem;
}
/* /Components/Pages/Operator/KooInspectionRows.razor.rz.scp.css */
/* FEAT-097 — row tinting for the KOO wizard's Hodnoty a delty grid.

   ::deep throughout: RadzenDataGrid renders the <tr> elements, so they never carry this
   component's scope attribute. The .koo-inspection-rows wrapper in the .razor is a plain <div>
   precisely so there is a scoped ancestor for these rules to descend from. */

.koo-inspection-rows[b-9xjn48aqgn]  tr.koo-row-unmatched > td {
    /* Nothing will be written for these rows — the same thing the "Nalezen: ne" badge and the
       warning above the tabs say. Three statements of one fact, because this is the mistake that
       costs an operator a re-survey. */
    background-color: var(--rz-warning-lighter);
}

.koo-inspection-rows[b-9xjn48aqgn]  tr.koo-row-excluded > td {
    background-color: var(--rz-danger-lighter);
    /* Stored but rejected: the value is visible, its authority is not. */
    opacity: 0.75;
}

.koo-inspection-rows[b-9xjn48aqgn]  tr.koo-row-calibration > td {
    background-color: var(--rz-info-lighter);
}

/* Coordinates and deltas are read by comparing digits down a column, which proportional figures
   make needlessly hard. */
.koo-inspection-rows[b-9xjn48aqgn]  td {
    font-variant-numeric: tabular-nums;
}
/* /Components/Pages/Operator/KooPreviewCharts.razor.rz.scp.css */
/* FEAT-089/097 — the Grafy step: profile list on the left, quantity tabs and chart filling the
   rest. ::deep is needed for everything RadzenListBox and RadzenTabs render themselves; the
   wrappers written in this component's .razor are the scoped anchors. */

.koo-charts[b-4o6nleyb5z] {
    display: flex;
    flex-direction: column;
    flex: 1;
    min-height: 0;
}

.koo-charts[b-4o6nleyb5z]  > .rz-stack {
    flex: 1;
    min-height: 0;
}

.koo-charts__body[b-4o6nleyb5z] {
    display: flex;
    gap: 1rem;
    flex: 1;
    min-height: 0;
}

.koo-charts__profiles[b-4o6nleyb5z] {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
    /* wide enough for "02-č.e.562-st.388" without truncation, fixed so the chart area does not
       jump when a longer profile name appears */
    flex: 0 0 17rem;
    min-height: 0;
}

.koo-charts__profiles-label[b-4o6nleyb5z] {
    margin: 0;
}

.koo-charts[b-4o6nleyb5z]  .koo-charts__profiles-list {
    flex: 1;
    min-height: 0;
    width: 100%;
}

/* Radzen sizes the listbox's scroll area with an inline max-height; without this the list stops
   short of the column it was given and the empty remainder reads as "no more profiles". */
.koo-charts[b-4o6nleyb5z]  .koo-charts__profiles-list .rz-listbox-list-wrapper {
    max-height: none;
    height: 100%;
}

.koo-charts[b-4o6nleyb5z]  .koo-charts__tabs {
    display: flex;
    flex-direction: column;
    flex: 1;
    min-width: 0;
    min-height: 0;
}

.koo-charts[b-4o6nleyb5z]  .koo-charts__tabs > .rz-tabview-panels {
    flex: 1;
    min-height: 0;
}

/* Non-selected panels are hidden with the plain HTML `hidden` attribute — :not([hidden]) keeps
   `display: flex` from overriding that and showing every quantity at once. */
.koo-charts[b-4o6nleyb5z]  .koo-charts__tabs > .rz-tabview-panels > [role="tabpanel"]:not([hidden]) {
    display: flex;
    flex-direction: column;
    height: 100%;
    min-height: 0;
}

/* BarabEChart is Height="100%", so its box needs a real height to resolve against. */
.koo-charts__canvas[b-4o6nleyb5z] {
    flex: 1;
    min-height: 260px;
}
/* /Components/Pages/Operator/KooSourceFileView.razor.rz.scp.css */
/* FEAT-097 — raw KOO file listing. Every element here is written in this component's own .razor,
   so plain scoped rules are enough — no ::deep needed. */

.koo-source-tab[b-75038mga6c] {
    display: flex;
    flex-direction: column;
    flex: 1;
    min-height: 0;
}

/* ::deep — the RadzenStack inside is rendered by Radzen, so it carries no scope attribute. */
.koo-source-tab[b-75038mga6c]  > .rz-stack {
    flex: 1;
    min-height: 0;
}

/* Fills the tab instead of a fixed 560px window — the listing is the whole point of this tab,
   so the screen it gets is screen the operator does not have to scroll. */
.koo-source[b-75038mga6c] {
    flex: 1;
    min-height: 240px;
    overflow: auto;
    border: 1px solid var(--rz-base-200);
    border-radius: 4px;
    background: var(--rz-base-background-color, #fff);
    font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
    font-size: 0.8125rem;
}

.koo-source-line[b-75038mga6c] {
    display: flex;
    gap: 0.75rem;
    height: 20px;          /* must match Virtualize ItemSize, or the scrollbar drifts */
    line-height: 20px;
    padding: 0 0.5rem;
    white-space: pre;
}

.koo-source-gutter[b-75038mga6c] {
    flex: 0 0 4.5rem;
    text-align: right;
    color: var(--rz-text-tertiary-color, #888);
    user-select: none;      /* copying the listing should yield the file, not the line numbers */
}

.koo-source-text[b-75038mga6c] {
    flex: 1 1 auto;
}

.koo-line-calibration[b-75038mga6c] { background-color: var(--rz-info-lighter); }
.koo-line-excluded[b-75038mga6c]    { background-color: var(--rz-danger-lighter); }
.koo-line-unmatched[b-75038mga6c]   { background-color: var(--rz-warning-lighter); }

/* Not a row at all — blank, comment, or malformed. Muted rather than coloured: nothing happens to
   it, and giving it a warning tint would suggest something did. */
.koo-line-unparsed[b-75038mga6c] { color: var(--rz-text-tertiary-color, #999); font-style: italic; }

.koo-legend[b-75038mga6c] {
    font-size: 0.8125rem;
    padding: 0.1rem 0.5rem;
    border-radius: 3px;
    border: 1px solid var(--rz-base-200);
}
/* /Components/Pages/Operator/KooUploadPage.razor.rz.scp.css */
/* FEAT-097 — let the wizard's checking tabs use the page instead of a 450px box.

   Every selector below hangs off a plain <div> written in KooUploadPage.razor (.koo-wizard,
   .koo-step-fill). That is not a stylistic choice: Blazor stamps the scope attribute only on
   elements authored in this component's own markup, so putting these class names on a
   RadzenStack/RadzenTabs instead would compile to .koo-wizard[b-xxx] against a div Radzen
   renders — no match, no error, layout silently unchanged.

   The height has to be handed down link by link. WorkspaceShell already makes
   .bn-workspace__main a flex column with min-height:0; each element between it and the tab panel
   must repeat flex:1 + min-height:0 or the chain collapses back to content height. */

.koo-wizard[b-bwvp7r3jyr] {
    display: flex;
    flex-direction: column;
    flex: 1;
    min-height: 0;
}

/* the RadzenStack holding the alerts and the stepper */
.koo-wizard[b-bwvp7r3jyr]  > .rz-stack {
    flex: 1;
    min-height: 0;
}

.koo-wizard[b-bwvp7r3jyr]  .rz-steps {
    display: flex;
    flex-direction: column;
    flex: 1;
    min-height: 0;
}

/* Only the step on screen. The others are hidden with the plain HTML `hidden` attribute, so
   :not([hidden]) is the semantic selector — matching on Radzen's own markup details (an empty
   inline style attribute on the visible panel) would break on any Radzen upgrade. Without the
   guard, `display: flex` here would override `hidden` and reveal every step at once. */
.koo-wizard[b-bwvp7r3jyr]  .rz-steps > [role="tabpanel"]:not([hidden]) {
    display: flex;
    flex-direction: column;
    flex: 1;
    min-height: 0;
}

/* the step body: warnings and buttons keep their natural height, the tabs take what is left */
.koo-step-fill[b-bwvp7r3jyr] {
    display: flex;
    flex-direction: column;
    flex: 1;
    min-height: 0;
}

.koo-step-fill[b-bwvp7r3jyr]  > .rz-stack {
    flex: 1;
    min-height: 0;
}

.koo-step-fill[b-bwvp7r3jyr]  .koo-fill-tabs {
    display: flex;
    flex-direction: column;
    flex: 1;
    min-height: 0;
}

.koo-step-fill[b-bwvp7r3jyr]  .koo-fill-tabs > .rz-tabview-panels {
    flex: 1;
    min-height: 0;
}

/* Same `hidden` rule as the steps above, for the tab panels themselves. */
.koo-step-fill[b-bwvp7r3jyr]  .koo-fill-tabs > .rz-tabview-panels > [role="tabpanel"]:not([hidden]) {
    display: flex;
    flex-direction: column;
    height: 100%;
    min-height: 0;
}

/* the single child each tab renders (grid wrapper, map, file listing) */
.koo-step-fill[b-bwvp7r3jyr]  .koo-fill-tabs > .rz-tabview-panels > [role="tabpanel"]:not([hidden]) > * {
    flex: 1;
    min-height: 0;
}
/* /Components/Shared/BarabPicker/BarabPicker.razor.rz.scp.css */
/* Issue #0001 A2-1 — BarabPicker shell styling.
   The list/row/footer rules mirror globals in wwwroot/css/barabneo-shell.css.
   The search row is not mirrored: its base look lives only in
   BarabPickerSearchRow.razor.css (#1144). */

.bn-picker--fixed[b-4doghp1gbg] {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
    min-height: var(--bn-picker-height, 480px);
    max-height: var(--bn-picker-max-height, none);
}

/* Inside the picker the search row is a bordered box rather than the standalone
   underline. The row is rendered by BarabPickerSearchRow, so a plain scoped
   selector never matches it — only ::deep reaches it (#1144). Its base look
   lives in BarabPickerSearchRow.razor.css. */
.bn-picker--fixed[b-4doghp1gbg]  .bn-picker__inputbox {
    padding: 0.25rem 0.5rem;
    border: 1px solid var(--rz-base-200);
    border-radius: 4px;
    background: var(--rz-base-background-color);
}

.bn-picker__list[b-4doghp1gbg] {
    flex: 1 1 auto;
    overflow-y: auto;
    padding: 4px;
}

.bn-picker__list:focus-visible[b-4doghp1gbg] {
    outline: 2px solid var(--rz-primary-light, var(--rz-primary));
    outline-offset: -2px;
}

.bn-picker__row[b-4doghp1gbg] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.35rem 0.5rem;
    cursor: pointer;
    border-radius: 4px;
}

.bn-picker__row:hover[b-4doghp1gbg] {
    background: var(--rz-base-100);
}

.bn-picker__row--active[b-4doghp1gbg] {
    background: var(--bn-orange-soft, var(--rz-base-100));
}

.bn-picker__name[b-4doghp1gbg] {
    flex: 1 1 auto;
}

.bn-picker__code[b-4doghp1gbg] {
    color: var(--rz-text-tertiary-color);
    font-family: var(--bn-mono, monospace);
    font-size: 0.85em;
}

.bn-picker__group[b-4doghp1gbg] {
    color: var(--rz-text-secondary-color);
    font-size: 0.85em;
}

.bn-picker__empty[b-4doghp1gbg] {
    padding: 1rem;
    color: var(--rz-text-tertiary-color);
    text-align: center;
}

.bn-picker__footer[b-4doghp1gbg] {
    display: flex;
    justify-content: flex-end;
    gap: 0.5rem;
    padding-top: 0.5rem;
    border-top: 1px solid var(--rz-base-200);
}
/* /Components/Shared/BarabPicker/BarabPickerSearchRow.razor.rz.scp.css */
/* Single source of truth for the search row's look (#1144). The row is a child
   component, so a parent's scoped .razor.css cannot reach its elements; a parent
   that wants a different look overrides through ::deep (see BarabPicker.razor.css).
   Default look = standalone use (QuickopenDialog, EntityTreeView filter). */

.bn-picker__inputbox[b-xdq8tnpd3g] {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 12px 16px;
    border-bottom: 1px solid var(--rz-base-200);
}

/* The input itself draws no outline (it is borderless inside the row), so the
   row carries the focus ring instead (#1892). Inset, so a dialog or the
   sidebar does not clip it. */
.bn-picker__inputbox:has(.bn-picker__search-input:focus)[b-xdq8tnpd3g] {
    outline: var(--rz-outline-focus);
    outline-offset: -2px;
}

/* RadzenIcon renders its own element without this component's scope attribute. */
.bn-picker__inputbox[b-xdq8tnpd3g]  .rzi {
    font-size: 18px;
    color: var(--rz-text-tertiary-color);
}

.bn-picker__search-input[b-xdq8tnpd3g] {
    flex: 1 1 auto;
    border: 0;
    outline: none;
    background: transparent;
    font-size: 15px;
    color: var(--rz-text-color);
}

.bn-picker__clear[b-xdq8tnpd3g] {
    background: transparent;
    border: 0;
    color: var(--rz-text-tertiary-color);
    cursor: pointer;
    padding: 0 6px;
    border-radius: 50%;
    display: inline-flex;
    align-items: center;
}

.bn-picker__clear:hover[b-xdq8tnpd3g] {
    background: var(--rz-base-100);
}
/* /Components/Shared/Forms/BarabFormActionBar.razor.rz.scp.css */
.bn-form-actions[b-zhgzqol3rk] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.75rem 1rem;
    background: var(--rz-base-background-color, #fff);
    border-top: 1px solid var(--rz-base-200);
}

.bn-form-actions[data-sticky="true"][b-zhgzqol3rk] {
    position: sticky;
    bottom: 0;
    z-index: 1;
}

.bn-form-actions__destructive[b-zhgzqol3rk] {
    display: flex;
    gap: 0.5rem;
}

.bn-form-actions__separator[b-zhgzqol3rk] {
    width: 1px;
    height: 1.75rem;
    background: var(--rz-base-200);
    margin: 0 0.25rem;
}

.bn-form-actions__spacer[b-zhgzqol3rk] {
    flex: 1;
}

.bn-form-actions__dirty-indicator[b-zhgzqol3rk] {
    font-size: 0.875rem;
    color: var(--rz-warning, #f57c00);
    font-style: italic;
}

.bn-form-actions__secondary[b-zhgzqol3rk],
.bn-form-actions__primary[b-zhgzqol3rk] {
    display: flex;
    gap: 0.5rem;
}
/* /Components/Shared/Notifications/NotificationBell.razor.rz.scp.css */
/* Positioning context for the absolutely-positioned dropdown. The dropdown is a sibling
   of .bn-bell (not a child), so it must anchor to this wrapper — otherwise top:100% resolves
   against a full-height layout ancestor and the dropdown drops to the page bottom. */
.bn-bell-wrap[b-blg6q9in5d] {
    position: relative;
    display: inline-flex;
}

.bn-bell[b-blg6q9in5d] {
    position: relative;
    cursor: pointer;
    padding: 0.4rem 0.6rem;
    display: inline-flex;
    align-items: center;
    user-select: none;
    /* Reset native button chrome so the bell looks as it did as a div. */
    background: none;
    border: 0;
    color: inherit;
    font: inherit;
}

.bn-bell__badge[b-blg6q9in5d] {
    position: absolute;
    top: 0.1rem;
    right: 0.1rem;
    background: var(--rz-danger, #d32f2f);
    color: #fff;
    border-radius: 999px;
    font-size: 0.65rem;
    padding: 0 0.3rem;
    min-width: 1.1rem;
    text-align: center;
    line-height: 1.1rem;
}

/* Catches clicks outside the open dropdown (#1753); sits just below it. */
.bn-bell__backdrop[b-blg6q9in5d] {
    position: fixed;
    inset: 0;
    z-index: 999;
}

.bn-bell__dropdown[b-blg6q9in5d] {
    position: absolute;
    top: 100%;
    right: 0;
    width: 22rem;
    max-height: 30rem;
    overflow-y: auto;
    background: var(--rz-base-background-color, #fff);
    border: 1px solid var(--rz-base-200);
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.08);
    z-index: 1000;
    padding: 0.5rem;
}

.bn-bell__head[b-blg6q9in5d] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0.25rem 0.5rem 0.5rem;
    border-bottom: 1px solid var(--rz-base-200);
}

.bn-bell__empty[b-blg6q9in5d] {
    padding: 1rem;
    text-align: center;
    color: var(--rz-text-tertiary-color, #999);
}

.bn-bell__list[b-blg6q9in5d] {
    list-style: none;
    margin: 0;
    padding: 0;
}

.bn-bell__item[b-blg6q9in5d] {
    padding: 0.5rem;
    border-bottom: 1px solid var(--rz-base-100);
}

.bn-bell__item--unread[b-blg6q9in5d] {
    background: var(--rz-info-lighter, #f0f7ff);
}

.bn-bell__item--link[b-blg6q9in5d] {
    cursor: pointer;
}

.bn-bell__item--link:hover[b-blg6q9in5d] {
    background: var(--rz-base-200, #f5f5f5);
}

.bn-bell__subject[b-blg6q9in5d] {
    font-weight: 500;
    margin-bottom: 0.2rem;
}

.bn-bell__when[b-blg6q9in5d] {
    font-size: 0.8em;
    color: var(--rz-text-secondary-color, #666);
}

.bn-bell__foot[b-blg6q9in5d] {
    padding: 0.5rem;
    text-align: center;
    border-top: 1px solid var(--rz-base-200);
}