@import 'ProjectManagement.Client.7lduldvu09.bundle.scp.css';
@import '_content/BlazorMHD.UI/BlazorMHD.UI.agz3gchkqc.bundle.scp.css';

/* /Components/ControlComponents/Organisation/Organisation/OrganisationFormUI.razor.rz.scp.css */
/* Shared, tab-independent content area so the "Ny kund/leverantör" dialog keeps the same
   height on every tab. Only this region scrolls; the tab row above and the modal footer
   below stay fixed. Viewport-based height keeps it stable regardless of a tab's content,
   and the max-height caps it on short screens so the modal never overflows. */
.org-form-content[b-othyz7442e] {
    height: 60vh;
    max-height: calc(100dvh - 17rem);
}

/* Empty, unfocused date input: hide the browser's technical "åååå-mm-dd" mask so the
   Swedish overlay text ("Välj datum") in the markup shows instead. On focus the native
   editing mask reappears and the overlay is hidden. ::deep is needed because the <input>
   is rendered by the InputDate child component and lacks the CSS-isolation attribute. */
.pm-date-wrap[b-othyz7442e]  input[type="date"].pm-date-empty:not(:focus) {
    color: transparent;
}

.pm-date-wrap[b-othyz7442e]  input[type="date"].pm-date-empty:not(:focus)::-webkit-datetime-edit {
    color: transparent;
}

.pm-date-wrap[b-othyz7442e]  input[type="date"].pm-date-empty:focus ~ .pm-date-placeholder {
    display: none;
}
/* /Components/ControlComponents/PriceImport/PriceArticlesTabUI.razor.rz.scp.css */
/* The hotfix after N016: the article list and the chosen article side by side inside the Prisdatabas
   workspace - in the calculation's lower pane as on the full page. The container is the tab itself, so
   the pane's own width decides (the lower pane can be much narrower than the window).
   Package N017: the grid's own tokens - row, zebra, hover and selected stay in that order of strength
   (selected > hover > zebra > normal) in both themes, all quiet so a status colour still reads. */
.price-articles-tab[b-i0p52c63sq] {
    container-type: inline-size;
    container-name: price-articles;
    background: rgb(248 250 252);
    color: rgb(15 23 42);
    --pa-row: rgb(255 255 255);
    --pa-zebra: rgb(248 250 252);
    --pa-hover: rgb(238 242 247);
    --pa-selected: rgb(219 234 254);
    --pa-selected-edge: rgb(37 99 235);
    --pa-muted: rgb(100 116 139);
    --pa-panel: rgb(255 255 255);
    --pa-line: rgb(226 232 240);
}

.dark .price-articles-tab[b-i0p52c63sq] {
    background: rgb(2 6 23);
    color: rgb(241 245 249);
    --pa-row: rgb(2 6 23);
    --pa-zebra: rgb(12 19 36);
    --pa-hover: rgb(30 41 59);
    --pa-selected: rgb(30 58 138 / 0.55);
    --pa-selected-edge: rgb(96 165 250);
    --pa-muted: rgb(148 163 184);
    --pa-panel: rgb(15 23 42);
    --pa-line: rgb(51 65 85);
}

.pa-toolbar[b-i0p52c63sq] {
    border: 1px solid var(--pa-line);
    background: var(--pa-panel);
    padding: 0.5rem;
    box-shadow: 0 1px 2px rgb(15 23 42 / 0.05);
}

.pa-label[b-i0p52c63sq] {
    display: block;
    color: var(--pa-muted);
}

.pa-btn[b-i0p52c63sq] {
    border: 1px solid var(--pa-line);
    border-radius: 0.25rem;
    padding: 0.125rem 0.5rem;
    min-height: 1.75rem;
    font-weight: 600;
    background: transparent;
    color: inherit;
}

.pa-btn:hover:not(:disabled)[b-i0p52c63sq] {
    background: var(--pa-hover);
}

.pa-btn:disabled[b-i0p52c63sq] {
    opacity: 0.4;
}

.pa-btn-primary[b-i0p52c63sq] {
    border-color: rgb(37 99 235);
    background: rgb(37 99 235);
    color: rgb(255 255 255);
}

.pa-kind[b-i0p52c63sq] {
    border: 1px solid var(--pa-line);
    border-radius: 9999px;
    padding: 0.125rem 0.5rem;
    color: var(--pa-muted);
}

.pa-kind-on[b-i0p52c63sq] {
    border-color: rgb(59 130 246);
    background: rgb(239 246 255);
    color: rgb(29 78 216);
}

.dark .pa-kind-on[b-i0p52c63sq] {
    background: rgb(23 37 84 / 0.6);
    color: rgb(147 197 253);
}

/* "Kolumner": a compact menu, not a table above the grid. */
.pa-columns-panel[b-i0p52c63sq] {
    width: 22rem;
    border: 1px solid var(--pa-line);
    border-radius: 0.375rem;
    background: var(--pa-panel);
    padding: 0.25rem;
    box-shadow: 0 10px 25px rgb(15 23 42 / 0.18);
}

.pa-column-label[b-i0p52c63sq],
.pa-column-width[b-i0p52c63sq] {
    height: 1.5rem;
    border: 1px solid transparent;
    border-radius: 0.25rem;
    background: transparent;
    padding: 0 0.25rem;
    color: inherit;
}

.pa-column-label:hover[b-i0p52c63sq],
.pa-column-label:focus[b-i0p52c63sq],
.pa-column-width:hover[b-i0p52c63sq],
.pa-column-width:focus[b-i0p52c63sq] {
    border-color: var(--pa-line);
    outline: none;
}

.pa-icon[b-i0p52c63sq] {
    width: 1.5rem;
    height: 1.5rem;
    border-radius: 0.25rem;
    color: var(--pa-muted);
}

.pa-icon:hover[b-i0p52c63sq] {
    background: var(--pa-hover);
}

/* The grid: ONE scroll host, header and body in one table so they scroll sideways together; the whole
   head (headings + the filter row) sticks as one block, so the filter row never slides under it. The
   columns keep their widths and the grid scrolls instead of squeezing them. */
.pa-scroll[b-i0p52c63sq] {
    --pm-grid-row-bg: var(--pa-row);
}

.pa-table[b-i0p52c63sq] {
    min-width: 0;
}

.pa-table > thead[b-i0p52c63sq] {
    position: sticky;
    top: 0;
    z-index: 3;
}

.pa-table > thead > tr > th[b-i0p52c63sq] {
    position: relative;
    top: auto;
    /* No stacking context per cell: a column's filter popup (fixed, inside its heading) must paint over the
       filter row that follows it; the head as a whole is the layer (z-index 3 above the body). */
    z-index: auto;
    /* The resize handle sits across the cell's end edge; the heading's own text is clipped by .pa-head. */
    overflow: visible;
}

.pa-table > thead > tr > th.pm-sticky-left[b-i0p52c63sq] {
    position: sticky;
    inset-inline-start: 0;
    z-index: 4;
}

.pa-head[b-i0p52c63sq] {
    display: flex;
    align-items: center;
    gap: 0.125rem;
    min-width: 0;
    overflow: hidden;
}

.pa-table > thead > tr > th.pm-num .pa-head[b-i0p52c63sq] {
    justify-content: flex-end;
}

/* A narrow heading shortens its text with an ellipsis - never clipped at the start (a right-aligned one was). */
.pa-head > .pm-sort[b-i0p52c63sq],
.pa-head > .truncate[b-i0p52c63sq] {
    flex: 0 1 auto;
    min-width: 0;
}

.pa-head > :not(.pm-sort):not(.truncate)[b-i0p52c63sq] {
    flex: 0 0 auto;
}

.pa-rownum[b-i0p52c63sq] {
    color: var(--pa-muted);
    font-variant-numeric: tabular-nums;
    text-align: end;
}

.pa-table > tbody > tr > td.pm-sticky-left[b-i0p52c63sq] {
    position: sticky;
    inset-inline-start: 0;
    z-index: 2;
    box-shadow: inset -1px 0 0 var(--pa-line);
}

.pa-row[b-i0p52c63sq] {
    cursor: pointer;
}

.pa-table > tbody > tr.pa-row > td[b-i0p52c63sq] {
    background: var(--pa-row);
}

.pa-table > tbody > tr.pa-row:nth-child(even) > td[b-i0p52c63sq] {
    background: var(--pa-zebra);
}

.pa-table > tbody > tr.pa-row:hover > td[b-i0p52c63sq] {
    background: var(--pa-hover);
}

.pa-table > tbody > tr.pa-row[aria-selected="true"] > td[b-i0p52c63sq] {
    background: var(--pa-selected);
}

.pa-table > tbody > tr.pa-row[aria-selected="true"] > td:first-child[b-i0p52c63sq] {
    box-shadow: inset 3px 0 0 var(--pa-selected-edge), inset -1px 0 0 var(--pa-line);
}

/* The filter row under the headings: what is active (hidden columns too), and "Rensa filter". It stays
   in view when the grid scrolls sideways. */
.pa-filter-row > th[b-i0p52c63sq] {
    text-transform: none;
    letter-spacing: normal;
    font-weight: 400;
    padding: 0.25rem 0.5rem;
    white-space: normal;
}

.pa-filter-chips[b-i0p52c63sq] {
    position: sticky;
    inset-inline-start: 0.5rem;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.25rem;
    max-width: calc(100cqw - 2rem);
}

/* Docked, the lower pane can be short: the workspace scrolls as a whole and the list / article keep a
   usable height instead of being squeezed away under the filters. */
.price-articles-tab[data-docked="true"][b-i0p52c63sq] {
    overflow: auto;
}

.price-articles-tab[data-docked="true"] .price-articles-body[b-i0p52c63sq] {
    min-height: 16rem;
}

.price-articles-detail[b-i0p52c63sq] {
    flex: 0 0 min(46%, 44rem);
    min-width: 20rem;
}

/* Side by side the detail's button closes it; one after the other it leads back to the list. */
.price-articles-detail[b-i0p52c63sq]  .price-item-close-narrow {
    display: none;
}

/* Narrow: the chosen article in front of the list with its "Tillbaka till listan". The list is NOT
   removed from the layout (display:none would lose its scroll position): it stays underneath, hidden. */
@container price-articles (max-width: 56rem) {
    .price-articles-body[data-has-selection="true"] .price-articles-list[b-i0p52c63sq] {
        position: absolute;
        inset: 0;
        visibility: hidden;
    }

    .price-articles-detail[b-i0p52c63sq] {
        flex: 1 1 auto;
        min-width: 0;
    }

    .price-articles-detail[b-i0p52c63sq]  .price-item-close-wide {
        display: none;
    }

    .price-articles-detail[b-i0p52c63sq]  .price-item-close-narrow {
        display: inline;
    }
}

/* Package N021: the "Vy" menu and the grouped column menu. */
.pa-view-panel[b-i0p52c63sq] {
    width: 17rem;
}

.pa-menu-item[b-i0p52c63sq] {
    display: flex;
    width: 100%;
    align-items: center;
    gap: 0.375rem;
    border-radius: 0.25rem;
    padding: 0.25rem 0.5rem;
    text-align: start;
    color: inherit;
    background: transparent;
}

.pa-menu-item:hover:not(:disabled)[b-i0p52c63sq] {
    background: var(--pa-hover);
}

.pa-menu-item:disabled[b-i0p52c63sq] {
    opacity: 0.4;
    cursor: not-allowed;
}

.pa-menu-item-on[b-i0p52c63sq] {
    font-weight: 600;
}

.pa-menu-sep[b-i0p52c63sq] {
    margin: 0.25rem 0;
    border-top: 1px solid var(--pa-line);
}

.pa-menu-heading[b-i0p52c63sq] {
    padding: 0.375rem 0.25rem 0.125rem;
    font-weight: 600;
    text-transform: uppercase;
    color: var(--pa-muted);
}

.pa-btn-danger[b-i0p52c63sq] {
    border-color: rgb(225 29 72);
    background: rgb(225 29 72);
    color: rgb(255 255 255);
}
/* /Components/ControlComponents/Template/TemplateForm.razor.rz.scp.css */
.inputNr[b-b8fucxyt2g] {
    max-width: 300px;
    margin: 2px;
}

.inputColor[b-b8fucxyt2g] {
    /*max-width: 300px;*/
    margin: 2px;
    width: 250px;
}

.inputCheck[b-b8fucxyt2g] {
    /*max-width: 300px;*/
    margin: 2px;
    width: 190px;
}
/* /Components/Layout/MainLayout.razor.rz.scp.css */
#blazor-error-ui[b-rs5yckvzt0] {
    color-scheme: light only;
    background: lightyellow;
    bottom: 0;
    box-shadow: 0 -1px 2px rgba(0, 0, 0, 0.2);
    box-sizing: border-box;
    display: none;
    left: 0;
    padding: 0.6rem 1.25rem 0.7rem 1.25rem;
    position: fixed;
    width: 100%;
    z-index: 1000;
}

    #blazor-error-ui .dismiss[b-rs5yckvzt0] {
        cursor: pointer;
        position: absolute;
        right: 0.75rem;
        top: 0.5rem;
    }
/* /Components/Layout/ReconnectModal.razor.rz.scp.css */
.components-reconnect-first-attempt-visible[b-ee0kytw6uc],
.components-reconnect-repeated-attempt-visible[b-ee0kytw6uc],
.components-reconnect-failed-visible[b-ee0kytw6uc],
.components-pause-visible[b-ee0kytw6uc],
.components-resume-failed-visible[b-ee0kytw6uc],
.components-rejoining-animation[b-ee0kytw6uc] {
    display: none;
}

#components-reconnect-modal.components-reconnect-show .components-reconnect-first-attempt-visible[b-ee0kytw6uc],
#components-reconnect-modal.components-reconnect-show .components-rejoining-animation[b-ee0kytw6uc],
#components-reconnect-modal.components-reconnect-paused .components-pause-visible[b-ee0kytw6uc],
#components-reconnect-modal.components-reconnect-resume-failed .components-resume-failed-visible[b-ee0kytw6uc],
#components-reconnect-modal.components-reconnect-retrying[b-ee0kytw6uc],
#components-reconnect-modal.components-reconnect-retrying .components-reconnect-repeated-attempt-visible[b-ee0kytw6uc],
#components-reconnect-modal.components-reconnect-retrying .components-rejoining-animation[b-ee0kytw6uc],
#components-reconnect-modal.components-reconnect-failed[b-ee0kytw6uc],
#components-reconnect-modal.components-reconnect-failed .components-reconnect-failed-visible[b-ee0kytw6uc] {
    display: block;
}


#components-reconnect-modal[b-ee0kytw6uc] {
    background-color: white;
    width: 20rem;
    margin: 20vh auto;
    padding: 2rem;
    border: 0;
    border-radius: 0.5rem;
    box-shadow: 0 3px 6px 2px rgba(0, 0, 0, 0.3);
    opacity: 0;
    transition: display 0.5s allow-discrete, overlay 0.5s allow-discrete;
    animation: components-reconnect-modal-fadeOutOpacity-b-ee0kytw6uc 0.5s both;
    &[open]

{
    animation: components-reconnect-modal-slideUp-b-ee0kytw6uc 1.5s cubic-bezier(.05, .89, .25, 1.02) 0.3s, components-reconnect-modal-fadeInOpacity-b-ee0kytw6uc 0.5s ease-in-out 0.3s;
    animation-fill-mode: both;
}

}

#components-reconnect-modal[b-ee0kytw6uc]::backdrop {
    background-color: rgba(0, 0, 0, 0.4);
    animation: components-reconnect-modal-fadeInOpacity-b-ee0kytw6uc 0.5s ease-in-out;
    opacity: 1;
}

@keyframes components-reconnect-modal-slideUp-b-ee0kytw6uc {
    0% {
        transform: translateY(30px) scale(0.95);
    }

    100% {
        transform: translateY(0);
    }
}

@keyframes components-reconnect-modal-fadeInOpacity-b-ee0kytw6uc {
    0% {
        opacity: 0;
    }

    100% {
        opacity: 1;
    }
}

@keyframes components-reconnect-modal-fadeOutOpacity-b-ee0kytw6uc {
    0% {
        opacity: 1;
    }

    100% {
        opacity: 0;
    }
}

.components-reconnect-container[b-ee0kytw6uc] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 1rem;
}

#components-reconnect-modal p[b-ee0kytw6uc] {
    margin: 0;
    text-align: center;
}

#components-reconnect-modal button[b-ee0kytw6uc] {
    border: 0;
    background-color: #6b9ed2;
    color: white;
    padding: 4px 24px;
    border-radius: 4px;
}

    #components-reconnect-modal button:hover[b-ee0kytw6uc] {
        background-color: #3b6ea2;
    }

    #components-reconnect-modal button:active[b-ee0kytw6uc] {
        background-color: #6b9ed2;
    }

.components-rejoining-animation[b-ee0kytw6uc] {
    position: relative;
    width: 80px;
    height: 80px;
}

    .components-rejoining-animation div[b-ee0kytw6uc] {
        position: absolute;
        border: 3px solid #0087ff;
        opacity: 1;
        border-radius: 50%;
        animation: components-rejoining-animation-b-ee0kytw6uc 1.5s cubic-bezier(0, 0.2, 0.8, 1) infinite;
    }

        .components-rejoining-animation div:nth-child(2)[b-ee0kytw6uc] {
            animation-delay: -0.5s;
        }

@keyframes components-rejoining-animation-b-ee0kytw6uc {
    0% {
        top: 40px;
        left: 40px;
        width: 0;
        height: 0;
        opacity: 0;
    }

    4.9% {
        top: 40px;
        left: 40px;
        width: 0;
        height: 0;
        opacity: 0;
    }

    5% {
        top: 40px;
        left: 40px;
        width: 0;
        height: 0;
        opacity: 1;
    }

    100% {
        top: 0px;
        left: 0px;
        width: 80px;
        height: 80px;
        opacity: 0;
    }
}