/* /Components/DataViewer/DataViewerSettings.razor.rz.scp.css */
.dvs-root[b-0gnqyxkjd7] {
    background: #eee;
    border-radius: 10px;
    padding: 0;
    font-size: 13px;
    color: #222;
    min-width: 240px;
    display: flex;
    flex-direction: column;
    flex: 1 1 auto;
    min-height: 0;
}

.dvs-info-line[b-0gnqyxkjd7] {
    padding: 8px 8px 2px 8px;
    font-size: 13px;
    color: #222;
    font-weight: 600;
    flex-shrink: 0;
}

.dvs-info-row[b-0gnqyxkjd7] {
    display: flex;
    justify-content: space-between;
    padding: 0 8px 8px 8px;
    font-size: 13px;
    color: #222;
    flex-shrink: 0;
}

.dvs-vent-name[b-0gnqyxkjd7] {
    font-weight: 600;
}

.dvs-vent-serial[b-0gnqyxkjd7] {
    font-weight: 600;
}

.dvs-tabs[b-0gnqyxkjd7] {
    display: flex;
    gap: 8px;
    padding: 0 8px;
    background: #eaeaea;
    border-top-left-radius: 10px;
    border-top-right-radius: 10px;
    padding-top: 6px;
    flex-shrink: 0;
}

.dvs-tab[b-0gnqyxkjd7] {
    flex: 1 1 33%;
    background: #f5f5f5;
    border: 0;
    border-top-left-radius: 10px;
    border-top-right-radius: 10px;
    padding: 6px 4px;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    opacity: 0.5;
    transition: opacity 0.15s ease;
    overflow: hidden;
}

    /* The icon PNGs (70x61) draw the glyph in their top part (rows 6-34) and leave the bottom empty:
       the negative bottom margin drops that empty area, keeping the icon size. */
    .dvs-tab img[b-0gnqyxkjd7] {
        height: 56px;
        width: auto;
        display: block;
        margin-bottom: -19px;
    }

    .dvs-tab:hover[b-0gnqyxkjd7] {
        opacity: 0.8;
    }

.dvs-tab-active[b-0gnqyxkjd7] {
    opacity: 1;
    background: #fff;
}

.dvs-empty[b-0gnqyxkjd7] {
    padding: 24px 12px;
    color: #888;
    font-style: italic;
    text-align: center;
}

.dvs-info[b-0gnqyxkjd7] {
    padding: 10px 8px;
    font-size: 13px;
    color: #222;
    line-height: 1.3;
    border-top: 1px solid #ddd;
    margin-top: 8px;
    flex-shrink: 0;
}

.dvs-list[b-0gnqyxkjd7] {
    flex: 1 1 auto;
    min-height: 0;
    overflow-x: hidden;
    overflow-y: auto;
    padding: 4px 6px;
}

.dvs-row[b-0gnqyxkjd7] {
    display: flex;
    justify-content: space-between;
    gap: 8px;
    padding: 5px 6px;
    border-bottom: 1px dashed #ddd;
    flex-shrink: 0;
}

    .dvs-row:nth-child(odd)[b-0gnqyxkjd7] {
        background: rgba(255, 255, 255, 0.5);
    }

.dvs-row-header[b-0gnqyxkjd7] {
    position: sticky;
    top: 0;
    z-index: 1;
    background: #eee;
}

    .dvs-row-header:nth-child(odd)[b-0gnqyxkjd7] {
        background: #eee;
    }

.dvs-row-label[b-0gnqyxkjd7] {
    color: #222;
}

.dvs-row-value[b-0gnqyxkjd7] {
    font-weight: 600;
    color: #222;
    text-align: right;
}
/* /Components/DataViewer/Graph/BreasGraphBars.razor.rz.scp.css */
.breas-graph[b-l71c7chnug] {
    --graph-bars-row-height: 74px;
    --graph-bars-row-header-height: 24px;
    --graph-right-col-base-width: 40px;
    --graph-footer-left-col-width: 40px;
    --graph-footer-right-col-width: var(--graph-right-col-base-width);
    --graph-footer-dates-col-width: 1fr;
    --graph-footer-height: 70px;
    --graph-footer-date-angle: -80deg;
    --graph-footer-font-family: Montserrat, sans-serif;
    --graph-footer-font-size: 13px;
    --graph-footer-tick-height: 6px;
    --graph-footer-tick-width: 1px;
    --graph-footer-tick-color: currentColor;
    --graph-scrubber-height: 36px;
    --graph-scrubber-knob-size: 26px;
    --graph-scrubber-button-size: 24px;
    --graph-scrubber-color: #333;
    --graph-scrubber-button-disabled-color: #ccc;
    --graph-cursor-width: 2px;
    --graph-cursor-hover-bottom: 120px;
    --graph-loader-background: rgba(220, 220, 220, 0.3);
    --graph-loader-blur: 5px;
    --graph-rows-gap: 0;
    
    position: relative;
    display: flex;
    flex-direction: column;
    width: 100%;
    font-family: var(--graph-footer-font-family);
    font-weight: bold;
}

.breas-graph-charts[b-l71c7chnug] {
    display: flex;
    flex-direction: column;
    gap: var(--graph-rows-gap);
}

.breas-graph-scrollbox[b-l71c7chnug] {
    --graph-scroll-dots-width: 22px;
    --graph-scroll-dot-size: 12px;
    --graph-scroll-dot-gap: 10px;
    --graph-scroll-dot-color: #ccc;

    display: flex;
    flex-direction: row;
}

.breas-graph-scrollbox-paged[b-l71c7chnug] {
    --graph-footer-right-col-width: calc(var(--graph-right-col-base-width) - var(--graph-scroll-dots-width));
}

.breas-graph-scrollbox-viewport[b-l71c7chnug] {
    flex: 1 1 auto;
    min-width: 0;
    max-height: calc(var(--graph-scroll-rows) * (var(--graph-bars-row-header-height) + var(--graph-bars-row-height)));
    overflow: hidden;
}

.breas-graph-scrollbox-track[b-l71c7chnug] {
    display: flex;
    flex-direction: column;
    gap: var(--graph-rows-gap);
    transform: translateY(calc(var(--graph-scroll-offset) * -1 * (var(--graph-bars-row-header-height) + var(--graph-bars-row-height))));
    transition: transform 0.3s ease;
}

.breas-graph-scrollbox-dots[b-l71c7chnug] {
    flex: 0 0 var(--graph-scroll-dots-width);
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: var(--graph-scroll-dot-gap);
}

.breas-graph-scrollbox-dot[b-l71c7chnug] {
    width: var(--graph-scroll-dot-size);
    height: var(--graph-scroll-dot-size);
    padding: 0;
    border: none;
    border-radius: 50%;
    background: var(--graph-scroll-dot-color);
    cursor: pointer;
}

.breas-graph-scrollbox-dot-active[b-l71c7chnug] {
    background: var(--graph-scrubber-color);
}

.breas-graph-footer[b-l71c7chnug] {
    display: grid;
    grid-template-columns:
        var(--graph-footer-left-col-width)
        var(--graph-footer-dates-col-width)
        var(--graph-footer-right-col-width);
    height: var(--graph-footer-height);
    font-size: var(--graph-footer-font-size);
}

.breas-graph-footer-year[b-l71c7chnug] {
    writing-mode: vertical-rl;
    transform: rotate(180deg);
    text-align: end;
    padding: 4px 0;
    justify-self: center;
    margin-top: 5px;
}

.breas-graph-footer-dates[b-l71c7chnug] {
    display: flex;
    align-items: stretch;
    overflow: hidden;
}

.breas-graph-footer-date-slot[b-l71c7chnug] {
    flex: 1 1 0;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    min-width: 0;
}

.breas-graph-footer-tick[b-l71c7chnug] {
    width: var(--graph-footer-tick-width);
    height: var(--graph-footer-tick-height);
    background: var(--graph-footer-tick-color);
    flex-shrink: 0;
    align-self: center;
}

.breas-graph-footer-date[b-l71c7chnug] {
    align-self: center;
    writing-mode: vertical-rl;
    transform: rotate(190deg);
    text-align: end;
    padding: 4px 0;
    margin: 3px 12px 0 0;
}

.breas-graph-scrubber[b-l71c7chnug] {
    display: grid;
    grid-template-columns:
        var(--graph-footer-left-col-width)
        var(--graph-footer-dates-col-width)
        var(--graph-footer-right-col-width);
    height: var(--graph-scrubber-height);
    align-items: center;
}

.breas-graph-scrubber-side[b-l71c7chnug] {
    display: flex;
    align-items: center;
    justify-content: center;
}

.breas-graph-scrubber-button[b-l71c7chnug] {
    width: var(--graph-scrubber-button-size);
    height: var(--graph-scrubber-button-size);
    background: var(--graph-scrubber-color);
    color: #fff;
    border: none;
    border-radius: 2px;
    cursor: pointer;
    font-weight: bold;
    font-size: 14px;
    line-height: 1;
    padding: 0;
    display: flex;
    align-items: center;
    justify-content: center;
}

.breas-graph-scrubber-button:disabled[b-l71c7chnug] {
    background: var(--graph-scrubber-button-disabled-color);
    cursor: not-allowed;
}

.breas-graph-scrubber-center[b-l71c7chnug] {
    display: flex;
    align-items: center;
    height: 100%;
}

.breas-graph-scrubber-range[b-l71c7chnug] {
    width: 100%;
    height: var(--graph-scrubber-knob-size);
    background: transparent;
    cursor: pointer;
    margin: 0;
    padding: 0;
    appearance: none;
    -webkit-appearance: none;
}

.breas-graph-scrubber-range[b-l71c7chnug]::-webkit-slider-runnable-track {
    height: 1px;
    background: transparent;
}

.breas-graph-scrubber-range[b-l71c7chnug]::-moz-range-track {
    height: 1px;
    background: transparent;
}

.breas-graph-scrubber-range[b-l71c7chnug]::-webkit-slider-thumb {
    appearance: none;
    -webkit-appearance: none;
    width: var(--graph-scrubber-knob-size);
    height: var(--graph-scrubber-knob-size);
    background: transparent;
    border: none;
    cursor: grab;
    margin-top: calc((1px - var(--graph-scrubber-knob-size)) / 2);
}

.breas-graph-scrubber-range[b-l71c7chnug]::-webkit-slider-thumb:active {
    cursor: grabbing;
}

.breas-graph-scrubber-range[b-l71c7chnug]::-moz-range-thumb {
    width: var(--graph-scrubber-knob-size);
    height: var(--graph-scrubber-knob-size);
    background: transparent;
    border: none;
    cursor: grab;
}

.breas-graph-scrubber-range[b-l71c7chnug]::-moz-range-thumb:active {
    cursor: grabbing;
}

.breas-graph-cursor[b-l71c7chnug] {
    position: absolute;
    top: 0;
    bottom: 0;
    width: 0;
    pointer-events: none;
    z-index: 10;
    left: calc(
        var(--graph-footer-left-col-width)
        + var(--cursor-fraction, 0) * (100% - var(--graph-footer-left-col-width) - var(--graph-footer-right-col-width))
    );
}

.breas-graph-cursor[b-l71c7chnug]::before {
    content: "";
    position: absolute;
    top: 0;
    bottom: calc(var(--graph-scrubber-height) / 2);
    left: calc(var(--graph-cursor-width) / -2);
    width: var(--graph-cursor-width);
    background: var(--graph-scrubber-color);
}

.breas-graph-cursor-knob[b-l71c7chnug] {
    position: absolute;
    bottom: calc((var(--graph-scrubber-height) - var(--graph-scrubber-knob-size)) / 2);
    left: calc(var(--graph-scrubber-knob-size) / -2);
    width: var(--graph-scrubber-knob-size);
    height: var(--graph-scrubber-knob-size);
    border-radius: 50%;
    background: var(--graph-scrubber-color);
}

.breas-graph-cursor-hover[b-l71c7chnug] {
    position: absolute;
    top: 0;
    bottom: var(--graph-cursor-hover-bottom);
    left: -10px;
    width: 20px;
    pointer-events: auto;
    cursor: pointer;
}

.breas-graph-cursor-catch[b-l71c7chnug] {
    position: absolute;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 200px;
    height: 200px;
    pointer-events: auto;
}

.breas-graph-cursor-action[b-l71c7chnug] {
    position: absolute;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 42px;
    height: 42px;
    border-radius: 50%;
    border: 2px solid #888;
    background: #fff;
    color: #222;
    padding: 0;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    box-sizing: border-box;
    pointer-events: auto;
}

.breas-graph-cursor-action:hover[b-l71c7chnug] {
    background: #f4f4f4;
}

.breas-graph-cursor-action svg[b-l71c7chnug] {
    width: 23px;
    height: 23px;
    fill: currentColor;
}

.breas-graph-loader[b-l71c7chnug] {
    position: absolute;
    inset: 0;
    background: var(--graph-loader-background);
    backdrop-filter: blur(var(--graph-loader-blur));
    -webkit-backdrop-filter: blur(var(--graph-loader-blur));
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 20;
}

.breas-graph-loader-content[b-l71c7chnug] {
    display: flex;
    align-items: center;
    justify-content: center;
}
/* /Components/DataViewer/Graph/BreasGraphBarsRow.razor.rz.scp.css */
.breas-graph-bars-row[b-gjspl4ben1] {
    --graph-bars-row-rect-margin: 8px;
    --graph-bars-row-rect-color: var(--graph-scrubber-color);
    --graph-bars-row-rect-border-width: 1px;
    --graph-bars-row-grid-color: #999;
    --graph-bars-row-grid-dot-size: 2px;
    --graph-bars-row-grid-dot-spacing: 10px;
    --graph-bars-row-level-padding: 4px;
    --graph-bars-row-title-font-size: 11px;
    --graph-bars-row-title-font-weight: bold;
    --graph-bars-row-level-font-size: 11px;
    --graph-bars-row-level-font-weight: bold;
    --graph-bars-row-legend-font-size: 11px;
    --graph-bars-row-legend-font-weight: bold;
    --graph-bars-row-legend-square-size: 12px;
    --graph-bars-row-legend-gap: 20px;
    --graph-bars-row-legend-item-gap: 6px;

    display: flex;
    flex-direction: column;
}

.breas-graph-bars-row-header[b-gjspl4ben1] {
    height: var(--graph-bars-row-header-height);
    box-sizing: border-box;
    display: flex;
    align-items: center;
    gap: var(--graph-bars-row-legend-gap);
    padding: 4px var(--graph-footer-right-col-width) 4px 8px;
}

.breas-graph-bars-row-title[b-gjspl4ben1] {
    font-size: var(--graph-bars-row-title-font-size);
    font-weight: var(--graph-bars-row-title-font-weight);
}

.breas-graph-bars-row-legend[b-gjspl4ben1] {
    display: flex;
    align-items: center;
    gap: var(--graph-bars-row-legend-gap);
    font-size: var(--graph-bars-row-legend-font-size);
    font-weight: var(--graph-bars-row-legend-font-weight);
}

.breas-graph-bars-row-legend-item[b-gjspl4ben1] {
    display: flex;
    align-items: center;
    gap: var(--graph-bars-row-legend-item-gap);
}

.breas-graph-bars-row-legend-color[b-gjspl4ben1] {
    width: var(--graph-bars-row-legend-square-size);
    height: var(--graph-bars-row-legend-square-size);
    flex-shrink: 0;
}

.breas-graph-bars-row-content[b-gjspl4ben1] {
    display: grid;
    grid-template-columns:
        var(--graph-footer-left-col-width)
        var(--graph-footer-dates-col-width)
        var(--graph-footer-right-col-width);
    height: var(--graph-bars-row-height);
}

.breas-graph-bars-row-levels[b-gjspl4ben1] {
    position: relative;
    height: calc(100% - 2 * var(--graph-bars-row-rect-margin));
    margin: var(--graph-bars-row-rect-margin) 0;
}

.breas-graph-bars-row-level[b-gjspl4ben1] {
    position: absolute;
    right: var(--graph-bars-row-level-padding);
    transform: translateY(-50%);
    text-align: right;
    white-space: nowrap;
    font-size: var(--graph-bars-row-level-font-size);
    font-weight: var(--graph-bars-row-level-font-weight);
}

.breas-graph-bars-row-rect[b-gjspl4ben1] {
    position: relative;
    box-sizing: border-box;
    height: calc(100% - 2 * var(--graph-bars-row-rect-margin));
    margin: var(--graph-bars-row-rect-margin) 0;
    border: var(--graph-bars-row-rect-border-width) solid var(--graph-bars-row-rect-color);
    overflow: hidden;
}

.breas-graph-bars-row-bar[b-gjspl4ben1] {
    position: absolute;
    bottom: 0;
}

.breas-graph-bars-row-rect-grid[b-gjspl4ben1] {
    position: absolute;
    left: 0;
    right: 0;
    height: var(--graph-bars-row-grid-dot-size);
    background-image: radial-gradient(
        circle,
        var(--graph-bars-row-grid-color) calc(var(--graph-bars-row-grid-dot-size) / 2),
        transparent calc(var(--graph-bars-row-grid-dot-size) / 2 + 0.5px)
    );
    background-size: var(--graph-bars-row-grid-dot-spacing) var(--graph-bars-row-grid-dot-size);
    background-repeat: repeat-x;
    background-position: 0 center;
    transform: translateY(-50%);
}

.breas-graph-bars-row-side[b-gjspl4ben1] {
}

.breas-graph-zoomable[b-gjspl4ben1] {
    cursor: pointer;
}
/* /Components/DataViewer/Graph/BreasGraphLines.razor.rz.scp.css */
.breas-graph[b-ev1b1onfvk] {
    --graph-footer-left-col-width: 70px;
    --graph-footer-right-col-width: 40px;
    --graph-footer-dates-col-width: 1fr;
    --graph-footer-height: 48px;
    --graph-footer-font-family: Montserrat, sans-serif;
    --graph-footer-font-size: 11px;
    --graph-footer-hour-font-size: 10px;
    --graph-footer-tick-height: 6px;
    --graph-footer-tick-width: 1px;
    --graph-footer-tick-color: currentColor;
    --graph-scrubber-height: 36px;
    --graph-scrubber-knob-size: 26px;
    --graph-scrubber-button-size: 24px;
    --graph-scrubber-color: #333;
    --graph-scrubber-button-disabled-color: #ccc;
    --graph-cursor-width: 2px;
    --graph-cursor-hover-bottom: 120px;
    --graph-loader-background: rgba(220, 220, 220, 0.3);
    --graph-loader-blur: 5px;
    --graph-rows-gap: 3px;

    position: relative;
    display: flex;
    flex-direction: column;
    width: 100%;
    font-family: var(--graph-footer-font-family);
    font-weight: bold;
}

.breas-graph-charts[b-ev1b1onfvk] {
    display: flex;
    flex-direction: column;
    gap: var(--graph-rows-gap);
}

.breas-graph-footer[b-ev1b1onfvk] {
    display: grid;
    grid-template-columns:
        var(--graph-footer-left-col-width)
        var(--graph-footer-dates-col-width)
        var(--graph-footer-right-col-width);
    height: var(--graph-footer-height);
    font-size: var(--graph-footer-font-size);
}

.breas-graph-footer-day[b-ev1b1onfvk] {
    writing-mode: vertical-rl;
    transform: rotate(180deg);
    text-align: end;
    padding: 0;
    justify-self: center;
    margin-top: 0;
}

.breas-graph-footer-times[b-ev1b1onfvk] {
    position: relative;
    overflow: hidden;
}

.breas-graph-footer-time-slot[b-ev1b1onfvk] {
    position: absolute;
    top: 0;
    bottom: 0;
    transform: translateX(-50%);
    display: flex;
    flex-direction: column;
    align-items: center;
}

.breas-graph-footer-tick[b-ev1b1onfvk] {
    width: var(--graph-footer-tick-width);
    height: var(--graph-footer-tick-height);
    background: var(--graph-footer-tick-color);
    flex-shrink: 0;
}

.breas-graph-footer-time[b-ev1b1onfvk] {
    padding-top: 4px;
    font-size: var(--graph-footer-hour-font-size);
    white-space: nowrap;
    text-align: center;
}

.breas-graph-scrubber[b-ev1b1onfvk] {
    display: grid;
    grid-template-columns:
        var(--graph-footer-left-col-width)
        var(--graph-footer-dates-col-width)
        var(--graph-footer-right-col-width);
    height: var(--graph-scrubber-height);
    align-items: center;
}

.breas-graph-scrubber-side[b-ev1b1onfvk] {
    display: flex;
    align-items: center;
    justify-content: center;
}

.breas-graph-scrubber-button[b-ev1b1onfvk] {
    width: var(--graph-scrubber-button-size);
    height: var(--graph-scrubber-button-size);
    background: var(--graph-scrubber-color);
    color: #fff;
    border: none;
    border-radius: 2px;
    cursor: pointer;
    font-weight: bold;
    font-size: 14px;
    line-height: 1;
    padding: 0;
    display: flex;
    align-items: center;
    justify-content: center;
}

.breas-graph-scrubber-button:disabled[b-ev1b1onfvk] {
    background: var(--graph-scrubber-button-disabled-color);
    cursor: not-allowed;
}

.breas-graph-scrubber-center[b-ev1b1onfvk] {
    display: flex;
    align-items: center;
    height: 100%;
}

.breas-graph-scrubber-range[b-ev1b1onfvk] {
    width: 100%;
    height: var(--graph-scrubber-knob-size);
    background: transparent;
    cursor: pointer;
    margin: 0;
    padding: 0;
    appearance: none;
    -webkit-appearance: none;
}

.breas-graph-scrubber-range[b-ev1b1onfvk]::-webkit-slider-runnable-track {
    height: 1px;
    background: transparent;
}

.breas-graph-scrubber-range[b-ev1b1onfvk]::-moz-range-track {
    height: 1px;
    background: transparent;
}

.breas-graph-scrubber-range[b-ev1b1onfvk]::-webkit-slider-thumb {
    appearance: none;
    -webkit-appearance: none;
    width: var(--graph-scrubber-knob-size);
    height: var(--graph-scrubber-knob-size);
    background: transparent;
    border: none;
    cursor: grab;
    margin-top: calc((1px - var(--graph-scrubber-knob-size)) / 2);
}

.breas-graph-scrubber-range[b-ev1b1onfvk]::-webkit-slider-thumb:active {
    cursor: grabbing;
}

.breas-graph-scrubber-range[b-ev1b1onfvk]::-moz-range-thumb {
    width: var(--graph-scrubber-knob-size);
    height: var(--graph-scrubber-knob-size);
    background: transparent;
    border: none;
    cursor: grab;
}

.breas-graph-scrubber-range[b-ev1b1onfvk]::-moz-range-thumb:active {
    cursor: grabbing;
}

.breas-graph-cursor[b-ev1b1onfvk] {
    position: absolute;
    top: 0;
    bottom: 0;
    width: 0;
    pointer-events: none;
    z-index: 10;
    left: calc(
        var(--graph-footer-left-col-width)
        + var(--cursor-fraction, 0) * (100% - var(--graph-footer-left-col-width) - var(--graph-footer-right-col-width))
    );
}

.breas-graph-cursor[b-ev1b1onfvk]::before {
    content: "";
    position: absolute;
    top: 0;
    bottom: calc(var(--graph-scrubber-height) / 2);
    left: calc(var(--graph-cursor-width) / -2);
    width: var(--graph-cursor-width);
    background: var(--graph-scrubber-color);
}

.breas-graph-cursor-knob[b-ev1b1onfvk] {
    position: absolute;
    bottom: calc((var(--graph-scrubber-height) - var(--graph-scrubber-knob-size)) / 2);
    left: calc(var(--graph-scrubber-knob-size) / -2);
    width: var(--graph-scrubber-knob-size);
    height: var(--graph-scrubber-knob-size);
    border-radius: 50%;
    background: var(--graph-scrubber-color);
}

.breas-graph-cursor-hover[b-ev1b1onfvk] {
    position: absolute;
    top: 0;
    bottom: var(--graph-cursor-hover-bottom);
    left: -10px;
    width: 20px;
    pointer-events: auto;
    cursor: pointer;
}

.breas-graph-cursor-actions[b-ev1b1onfvk] {
    position: absolute;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 126px;
    height: 126px;
    pointer-events: auto;
}

    .breas-graph-cursor-actions[b-ev1b1onfvk]::before {
        content: "";
        position: absolute;
        left: 50%;
        top: 50%;
        width: 200px;
        height: 200px;
        transform: translate(-50%, -50%);
    }

.breas-graph-cursor-action[b-ev1b1onfvk] {
    position: absolute;
    width: 42px;
    height: 42px;
    border-radius: 50%;
    border: 2px solid #888;
    background: #fff;
    color: #222;
    padding: 0;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    box-sizing: border-box;
}

.breas-graph-cursor-action:hover[b-ev1b1onfvk] {
    background: #f4f4f4;
}

.breas-graph-cursor-action svg[b-ev1b1onfvk] {
    width: 23px;
    height: 23px;
    fill: currentColor;
}

.breas-graph-cursor-action-top[b-ev1b1onfvk] {
    top: 0;
    left: 50%;
    transform: translateX(-50%);
}

.breas-graph-cursor-action-left[b-ev1b1onfvk] {
    top: 50%;
    left: 0;
    transform: translateY(-50%);
}

.breas-graph-cursor-action-right[b-ev1b1onfvk] {
    top: 50%;
    right: 0;
    transform: translateY(-50%);
}

.breas-graph-loader[b-ev1b1onfvk] {
    position: absolute;
    inset: 0;
    background: var(--graph-loader-background);
    backdrop-filter: blur(var(--graph-loader-blur));
    -webkit-backdrop-filter: blur(var(--graph-loader-blur));
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 20;
}

.breas-graph-loader-content[b-ev1b1onfvk] {
    display: flex;
    align-items: center;
    justify-content: center;
}
/* /Components/DataViewer/Graph/BreasGraphLinesRow.razor.rz.scp.css */
.breas-graph-lines-row[b-lcdzx0t7ss] {
    --graph-lines-row-height: 80px;
    --graph-lines-row-rect-margin: 8px;
    --graph-lines-row-rect-color: var(--graph-scrubber-color);
    --graph-lines-row-rect-border-width: 1px;
    --graph-lines-row-grid-color: #999;
    --graph-lines-row-grid-dot-size: 2px;
    --graph-lines-row-grid-dot-spacing: 10px;
    --graph-lines-row-level-padding: 4px;
    --graph-lines-row-title-font-size: 11px;
    --graph-lines-row-title-font-weight: bold;
    --graph-lines-row-level-font-size: 11px;
    --graph-lines-row-level-font-weight: bold;
    --graph-lines-row-legend-font-size: 11px;
    --graph-lines-row-legend-font-weight: bold;
    --graph-lines-row-legend-square-size: 12px;
    --graph-lines-row-legend-gap: 20px;
    --graph-lines-row-legend-item-gap: 6px;
    --graph-lines-row-legend-label-margin: 4px;
    --graph-lines-row-selector-slot-width: 75px;
    --graph-lines-row-selector-width: 65px;
    --graph-lines-row-pencil-size: 2px;

    display: flex;
    flex-direction: column;
}

.breas-graph-lines-row-header[b-lcdzx0t7ss] {
    display: flex;
    align-items: center;
    gap: var(--graph-lines-row-legend-gap);
    padding: 4px var(--graph-footer-right-col-width) 4px 0;
}

.breas-graph-lines-row-title[b-lcdzx0t7ss] {
    width: var(--graph-footer-left-col-width);
    flex-shrink: 0;
    box-sizing: border-box;
    padding-left: 8px;
    font-size: var(--graph-lines-row-title-font-size);
    font-weight: var(--graph-lines-row-title-font-weight);
}

.breas-graph-lines-row-legend[b-lcdzx0t7ss] {
    display: flex;
    align-items: center;
    gap: var(--graph-lines-row-legend-gap);
    font-size: var(--graph-lines-row-legend-font-size);
    font-weight: var(--graph-lines-row-legend-font-weight);
}

.breas-graph-lines-row-header-right[b-lcdzx0t7ss] {
    margin-left: auto;
    display: flex;
    align-items: center;
    gap: var(--graph-lines-row-legend-gap);
}

.breas-graph-lines-row-selector-slot[b-lcdzx0t7ss] {
    width: var(--graph-lines-row-selector-slot-width);
    flex-shrink: 0;
    display: flex;
    align-items: center;
    justify-content: center;
}

.breas-graph-lines-row-selector[b-lcdzx0t7ss] {
    width: var(--graph-lines-row-selector-width);
    font-size: var(--graph-lines-row-legend-font-size);
    font-weight: var(--graph-lines-row-legend-font-weight);
    font-family: inherit;
    padding: 2px 4px;
    border: 1px solid var(--graph-lines-row-rect-color);
    background: #fff;
    cursor: pointer;
    box-sizing: border-box;
}

.breas-graph-lines-row-legend-item[b-lcdzx0t7ss] {
    display: flex;
    align-items: center;
    gap: var(--graph-lines-row-legend-item-gap);
}

.breas-graph-lines-row-legend-color[b-lcdzx0t7ss] {
    width: var(--graph-lines-row-legend-square-size);
    height: var(--graph-lines-row-legend-square-size);
    flex-shrink: 0;
}

.breas-graph-lines-row-legend-label[b-lcdzx0t7ss] {
    margin-left: var(--graph-lines-row-legend-label-margin);
}

.breas-graph-lines-row-content[b-lcdzx0t7ss] {
    display: grid;
    grid-template-columns:
        var(--graph-footer-left-col-width)
        var(--graph-footer-dates-col-width)
        var(--graph-footer-right-col-width);
    height: var(--graph-lines-row-height);
}

.breas-graph-lines-row-levels[b-lcdzx0t7ss] {
    position: relative;
    height: calc(100% - 2 * var(--graph-lines-row-rect-margin));
    margin: var(--graph-lines-row-rect-margin) 0;
}

.breas-graph-lines-row-level[b-lcdzx0t7ss] {
    position: absolute;
    right: var(--graph-lines-row-level-padding);
    transform: translateY(-50%);
    text-align: right;
    white-space: nowrap;
    font-size: var(--graph-lines-row-level-font-size);
    font-weight: var(--graph-lines-row-level-font-weight);
}

.breas-graph-lines-row-rect[b-lcdzx0t7ss] {
    position: relative;
    box-sizing: border-box;
    height: calc(100% - 2 * var(--graph-lines-row-rect-margin));
    margin: var(--graph-lines-row-rect-margin) 0;
    border: var(--graph-lines-row-rect-border-width) solid var(--graph-lines-row-rect-color);
    overflow: hidden;
}

.breas-graph-lines-row-rect-grid[b-lcdzx0t7ss] {
    position: absolute;
    left: 0;
    right: 0;
    height: var(--graph-lines-row-grid-dot-size);
    background-image: radial-gradient(
        circle,
        var(--graph-lines-row-grid-color) calc(var(--graph-lines-row-grid-dot-size) / 2),
        transparent calc(var(--graph-lines-row-grid-dot-size) / 2 + 0.5px)
    );
    background-size: var(--graph-lines-row-grid-dot-spacing) var(--graph-lines-row-grid-dot-size);
    background-repeat: repeat-x;
    background-position: 0 center;
    transform: translateY(-50%);
}

.breas-graph-lines-row-level-right[b-lcdzx0t7ss] {
    right: auto;
    left: var(--graph-lines-row-level-padding);
    text-align: left;
}

.breas-graph-lines-row-svg[b-lcdzx0t7ss] {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    pointer-events: none;
    overflow: visible;
}

.breas-graph-lines-row-line[b-lcdzx0t7ss] {
    fill: none;
    stroke-width: var(--graph-lines-row-pencil-size);
    stroke-linecap: square;
    stroke-linejoin: miter;
    vector-effect: non-scaling-stroke;
}

.breas-graph-zoomable[b-lcdzx0t7ss] {
    cursor: pointer;
}
/* /Components/DataViewer/Graph/BreasGraphRangesRow.razor.rz.scp.css */
.breas-graph-ranges-row[b-74c9erh4y2] {
    --graph-ranges-row-height: 80px;
    --graph-ranges-row-rect-margin: 8px;
    --graph-ranges-row-rect-color: var(--graph-scrubber-color);
    --graph-ranges-row-rect-border-width: 1px;
    --graph-ranges-row-grid-color: #999;
    --graph-ranges-row-grid-dot-size: 2px;
    --graph-ranges-row-grid-dot-spacing: 10px;
    --graph-ranges-row-level-padding: 4px;
    --graph-ranges-row-level-font-size: 11px;
    --graph-ranges-row-level-font-weight: bold;
    --graph-ranges-row-dot-rx: 0.3px;
    --graph-ranges-row-dot-ry: 6px;

    display: flex;
    flex-direction: column;
}

.breas-graph-ranges-row-content[b-74c9erh4y2] {
    display: grid;
    grid-template-columns:
        var(--graph-footer-left-col-width)
        var(--graph-footer-dates-col-width)
        var(--graph-footer-right-col-width);
    height: var(--graph-ranges-row-height);
}

.breas-graph-ranges-row-levels[b-74c9erh4y2] {
    position: relative;
    height: calc(100% - 2 * var(--graph-ranges-row-rect-margin));
    margin: var(--graph-ranges-row-rect-margin) 0;
}

.breas-graph-ranges-row-level[b-74c9erh4y2] {
    position: absolute;
    right: var(--graph-ranges-row-level-padding);
    transform: translateY(-50%);
    text-align: right;
    white-space: nowrap;
    font-size: var(--graph-ranges-row-level-font-size);
    font-weight: var(--graph-ranges-row-level-font-weight);
}

.breas-graph-ranges-row-rect[b-74c9erh4y2] {
    position: relative;
    box-sizing: border-box;
    height: calc(100% - 2 * var(--graph-ranges-row-rect-margin));
    margin: var(--graph-ranges-row-rect-margin) 0;
    border: var(--graph-ranges-row-rect-border-width) solid var(--graph-ranges-row-rect-color);
    overflow: hidden;
}

.breas-graph-ranges-row-rect-grid[b-74c9erh4y2] {
    position: absolute;
    left: 0;
    right: 0;
    height: var(--graph-ranges-row-grid-dot-size);
    background-image: radial-gradient(
        circle,
        var(--graph-ranges-row-grid-color) calc(var(--graph-ranges-row-grid-dot-size) / 2),
        transparent calc(var(--graph-ranges-row-grid-dot-size) / 2 + 0.5px)
    );
    background-size: var(--graph-ranges-row-grid-dot-spacing) var(--graph-ranges-row-grid-dot-size);
    background-repeat: repeat-x;
    background-position: 0 center;
    transform: translateY(-50%);
}

.breas-graph-ranges-row-svg[b-74c9erh4y2] {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    pointer-events: none;
    overflow: visible;
}

.breas-graph-ranges-row-bar[b-74c9erh4y2] {
    pointer-events: auto;
    cursor: pointer;
}

.breas-graph-ranges-row-dot[b-74c9erh4y2] {
    rx: var(--graph-ranges-row-dot-rx);
    ry: var(--graph-ranges-row-dot-ry);
    pointer-events: auto;
    cursor: pointer;
}