/* /Components/Layout/MainLayout.razor.rz.scp.css */
.page[b-sxp7tksyqf] {
	position: relative;
	display: flex;
	flex-direction: column;
}

main[b-sxp7tksyqf] {
	flex: 1;
}

.sidebar[b-sxp7tksyqf] {
	background-color: #133760;
}

.top-row[b-sxp7tksyqf] {
	background-color: #43c8e3;
	border-bottom: 1px solid #e7b2cc;
	justify-content: flex-end;
	height: 3.5rem;
	display: flex;
	align-items: center;
	color: black;
}

	.top-row[b-sxp7tksyqf]  a, .top-row .btn-link[b-sxp7tksyqf] {
		white-space: nowrap;
		margin-left: 1.5rem;
	}

	.top-row a:first-child[b-sxp7tksyqf] {
		overflow: hidden;
		text-overflow: ellipsis;
	}

@media (max-width: 640.98px) {
	.top-row:not(.auth)[b-sxp7tksyqf] {
		display: none;
	}

	.top-row.auth[b-sxp7tksyqf] {
		justify-content: space-between;
	}

	.top-row a[b-sxp7tksyqf], .top-row .btn-link[b-sxp7tksyqf] {
		margin-left: 0;
	}
}

@media (min-width: 992px) {
	.page[b-sxp7tksyqf] {
		flex-direction: row;
	}

	.sidebar[b-sxp7tksyqf] {
		min-width: 220px;
		width: 220px;
		height: 100vh;
		position: sticky;
		top: 0;
	}

	.top-row[b-sxp7tksyqf] {
		position: sticky;
		top: 0;
		z-index: 1;
	}

	.top-row[b-sxp7tksyqf], article[b-sxp7tksyqf] {
		padding-left: 2rem !important;
		padding-right: 1.5rem !important;
	}
}
/* /Components/Layout/NavMenu.razor.rz.scp.css */
.navbar-toggler[b-zu0ld805iq] {
	background-color: rgba(255, 255, 255, 0.1);
}

.top-row[b-zu0ld805iq] {
	height: 3.5rem;
	background-color: rgba(0,0,0,0.4);
}

.navbar-brand[b-zu0ld805iq] {
	font-size: 1.1rem;
}

.oi[b-zu0ld805iq] {
	width: 2rem;
	font-size: 1.1rem;
	vertical-align: text-top;
	top: -2px;
}

.nav-item[b-zu0ld805iq] {
	font-size: 0.9rem;
	padding-bottom: 0.5rem;
}

	.nav-item:first-of-type[b-zu0ld805iq] {
		padding-top: 1rem;
	}

	.nav-item:last-of-type[b-zu0ld805iq] {
		padding-bottom: 1rem;
	}

	.nav-item[b-zu0ld805iq]  a {
		color: #43c8e3;
		border-radius: 4px;
		height: 3rem;
		display: flex;
		align-items: center;
		line-height: 3rem;
	}

		.nav-item[b-zu0ld805iq]  a.active {
			background-color: rgba(255,255,255,0.25);
			color: #43c8e3;
		}

		.nav-item[b-zu0ld805iq]  a:hover {
			background-color: rgba(255,255,255,0.1);
			color: #43c8e3;
		}

.legal-link[b-zu0ld805iq]  a {
	height: 2rem;
	line-height: 2rem;
	font-size: 0.75rem;
	color: rgba(255,255,255,0.45);
}

	.legal-link[b-zu0ld805iq]  a:hover {
		background-color: rgba(255,255,255,0.08);
		color: rgba(255,255,255,0.75);
	}

	.legal-link[b-zu0ld805iq]  a.active {
		background-color: transparent;
		color: rgba(255,255,255,0.45);
	}

@media (min-width: 992px) {
	.navbar-toggler[b-zu0ld805iq] {
		display: none;
	}

	.collapse[b-zu0ld805iq] {
		/* Never collapse the sidebar for wide screens */
		display: block;
	}
}
/* /Components/Layout/ReconnectModal.razor.rz.scp.css */
.components-reconnect-first-attempt-visible[b-lektk5t0pz],
.components-reconnect-repeated-attempt-visible[b-lektk5t0pz],
.components-reconnect-failed-visible[b-lektk5t0pz],
.components-pause-visible[b-lektk5t0pz],
.components-resume-failed-visible[b-lektk5t0pz],
.components-rejoining-animation[b-lektk5t0pz] {
    display: none;
}

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


#components-reconnect-modal[b-lektk5t0pz] {
    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-lektk5t0pz 0.5s both;
    &[open]

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

}

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

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

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

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

    100% {
        opacity: 1;
    }
}

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

    100% {
        opacity: 0;
    }
}

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

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

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

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

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

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

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

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

@keyframes components-rejoining-animation-b-lektk5t0pz {
    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;
    }
}
/* /Components/Pages/Admin/AdminUsers.razor.rz.scp.css */
/* Below Breakpoint.Sm the grid drops its header row and prints every column as a label/value line
   instead. Splitting the old single status cell into three filterable columns therefore costs three
   extra lines per user on a phone - and for a healthy account all three are empty, so they are three
   labels with nothing beside them. Hiding just the empty ones keeps a user's card scannable while the
   chips still show up on the accounts that actually have something to report. The 960px bound is
   MudBlazor's own for .mud-sm-table, which is what Breakpoint.Sm renders. */
@media (max-width: 960px) {
	.admin-users-page[b-odtovbpe3y]  .mud-sm-table .admin-user-status-cell:empty {
		display: none;
	}
}
/* /Components/Pages/Billing/Billing.razor.rz.scp.css */
/* The ledger grid takes the whole viewport below the summary cards. Sizing it by flex rather
   than a calc(100vh - Npx) like the other grids in the app is deliberate here: the cards wrap
   onto a second row on a narrow screen, so their height is not a constant to subtract. */
.billing-page[b-txz31mcyqx] {
	display: flex;
	flex-direction: column;
	height: calc(100vh - var(--mud-appbar-height));
}

.billing-page[b-txz31mcyqx]  .billing-cards {
	flex: 0 0 auto;
}

.billing-page[b-txz31mcyqx]  .billing-grid {
	display: flex;
	flex-direction: column;
	flex: 1 1 auto;
	min-height: 0;
}

/* MudDataGrid stacks its toolbar, scroll container and pager inside its root element. Only the
   scroll container may absorb the leftover height; the other two keep their natural size. */
.billing-page[b-txz31mcyqx]  .billing-grid > * {
	flex: 0 0 auto;
}

.billing-page[b-txz31mcyqx]  .billing-grid > .mud-table-container {
	flex: 1 1 auto;
	min-height: 0;
}
/* /Components/Pages/Inventory/PartOutConsolidate.razor.rz.scp.css */
.shortcut-bar[b-0ix7d0ngtx] {
    position: fixed;
    bottom: 0;
    left: 0;
    right: 0;
    z-index: 10;
    background: var(--mud-palette-surface);
    border-top: 1px solid var(--mud-palette-lines-default);
    padding: 6px 12px;
}

@media (hover: none) and (pointer: coarse) {
    .shortcut-bar[b-0ix7d0ngtx] {
        display: none !important;
    }
}

.kbd-key[b-0ix7d0ngtx] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 26px;
    height: 24px;
    padding: 0 6px;
    border: 1px solid var(--mud-palette-lines-default);
    border-radius: 4px;
    background: var(--mud-palette-background-grey);
    box-shadow: 0 2px 0 rgba(0, 0, 0, .15);
    font-family: monospace;
    font-size: .75rem;
    font-weight: 600;
    line-height: 1;
}
/* /Components/Pages/Legal/LegalDocument.razor.rz.scp.css */
/* Content inside is raw HTML produced by Markdig from Markdown files, not part of this
   component's own render tree — Blazor's CSS isolation only scopes compiled markup, so
   descendant rules need ::deep to reach the injected h1/p/ul/etc. elements. */

.legal-document[b-4hvrpyd0fg]  h1 {
	font-size: 1.9rem;
	font-weight: 600;
	line-height: 1.3;
	margin: 0 0 0.5rem;
}

/* Router's <FocusOnNavigate Selector="h1" /> gives this element tabindex="-1" and calls
   .focus() on every navigation so screen readers announce the new page — it's never reachable
   by sequential Tab navigation, so there's no sighted keyboard user relying on a visible ring
   here. Without this rule the browser draws its default focus rectangle on every page load. */
.legal-document[b-4hvrpyd0fg]  h1:focus {
	outline: none;
}

.legal-document[b-4hvrpyd0fg]  h1 + p {
	color: var(--mud-palette-text-secondary);
	margin-bottom: 2.5rem;
}

.legal-document[b-4hvrpyd0fg]  h2 {
	font-size: 1.35rem;
	font-weight: 600;
	line-height: 1.35;
	margin: 2.5rem 0 1rem;
	padding-top: 1.5rem;
	border-top: 1px solid var(--mud-palette-lines-default);
}

.legal-document[b-4hvrpyd0fg]  h2:first-of-type {
	margin-top: 0;
	padding-top: 0;
	border-top: none;
}

.legal-document[b-4hvrpyd0fg]  h3 {
	font-size: 1.1rem;
	font-weight: 600;
	line-height: 1.4;
	margin: 1.75rem 0 0.75rem;
}

.legal-document[b-4hvrpyd0fg]  p {
	line-height: 1.7;
	margin: 0 0 1rem;
}

.legal-document[b-4hvrpyd0fg]  ul,
.legal-document[b-4hvrpyd0fg]  ol {
	margin: 0 0 1.25rem;
	padding-left: 1.75rem;
}

.legal-document[b-4hvrpyd0fg]  li {
	line-height: 1.7;
	margin-bottom: 0.5rem;
}

.legal-document[b-4hvrpyd0fg]  li > ul,
.legal-document[b-4hvrpyd0fg]  li > ol {
	margin-top: 0.5rem;
	margin-bottom: 0;
}

.legal-document[b-4hvrpyd0fg]  li > p {
	margin-bottom: 0.5rem;
}

.legal-document[b-4hvrpyd0fg]  table {
	width: 100%;
	border-collapse: collapse;
	margin: 0 0 1.5rem;
}

.legal-document[b-4hvrpyd0fg]  th,
.legal-document[b-4hvrpyd0fg]  td {
	border: 1px solid var(--mud-palette-table-lines);
	padding: 0.65rem 0.9rem;
	text-align: left;
	vertical-align: top;
	line-height: 1.5;
}

.legal-document[b-4hvrpyd0fg]  th {
	background-color: var(--mud-palette-background-gray);
	font-weight: 600;
}

.legal-document[b-4hvrpyd0fg]  hr {
	border: none;
	border-top: 1px solid var(--mud-palette-lines-default);
	margin: 2.5rem 0;
}

.legal-document[b-4hvrpyd0fg]  a {
	color: var(--mud-palette-primary);
	text-decoration: underline;
	text-underline-offset: 2px;
}

.legal-document[b-4hvrpyd0fg]  strong {
	font-weight: 600;
}

.legal-document[b-4hvrpyd0fg]  blockquote {
	margin: 0 0 1rem;
	padding: 0.25rem 1rem;
	border-left: 3px solid var(--mud-palette-lines-default);
	color: var(--mud-palette-text-secondary);
}
/* /Components/Pages/Orders/CollectOrders.razor.rz.scp.css */
.same-remarks-wrapper[b-yeljyjdrta] {
    width: 140px;
    flex-shrink: 0;
    align-self: stretch;
}

@media (max-width: 600px) {
    .item-detail-grid[b-yeljyjdrta] {
        grid-template-columns: auto 1fr;
        grid-template-rows: auto auto;
    }

    .item-detail-grid > :nth-child(1)[b-yeljyjdrta] {
        grid-column: 2;
        grid-row: 1;
    }

    .item-detail-grid > :nth-child(2)[b-yeljyjdrta] {
        grid-column: 1;
        grid-row: 1;
    }

    .item-detail-grid > :nth-child(3)[b-yeljyjdrta] {
        grid-column: 1 / -1;
        grid-row: 2;
    }
}

@media (max-width: 960px) {
    .collect-layout[b-yeljyjdrta] {
        flex-direction: column;
    }

    .same-remarks-wrapper[b-yeljyjdrta] {
        width: 100%;
    }

    .same-remarks-items-grid[b-yeljyjdrta] {
        display: flex !important;
        flex-wrap: wrap;
        justify-content: center;
        gap: 8px;
    }
}

.shortcut-bar[b-yeljyjdrta] {
    position: fixed;
    bottom: 0;
    left: 0;
    right: 0;
    z-index: 10;
    background: var(--mud-palette-surface);
    border-top: 1px solid var(--mud-palette-lines-default);
    padding: 6px 12px;
}

@media (hover: none) and (pointer: coarse) {
    .shortcut-bar[b-yeljyjdrta] {
        display: none !important;
    }
}

.kbd-key[b-yeljyjdrta] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 26px;
    height: 24px;
    padding: 0 6px;
    border: 1px solid var(--mud-palette-lines-default);
    border-radius: 4px;
    background: var(--mud-palette-background-grey);
    box-shadow: 0 2px 0 rgba(0, 0, 0, .15);
    font-family: monospace;
    font-size: .75rem;
    font-weight: 600;
    line-height: 1;
}
/* /Components/Pages/Orders/Order.razor.rz.scp.css */
/* Scoping note: Blazor only stamps the scope attribute on plain HTML elements from this file, never
   on MudBlazor component roots - which is why the page's markup is wrapped in the plain
   `div.order-page` and why every class that lands on a Mud component is addressed through `::deep`.
   Classes on plain divs (copyable-row, lifecycle-step, step-dot, order-page itself) match directly. */

/* ---- Copyable identifiers ------------------------------------------------------------------- */

.copyable-row[b-n5pftqvdgb] {
    gap: 4px;
}

/* The copy icon only earns its place next to a value once the pointer is nearby - visible on
   hover/focus so the row reads as plain text the rest of the time, and via :focus-within so it is
   still reachable by keyboard. Shared by the header identifiers, the buyer username and the shipment
   tracking number - every copyable value on the page uses the same row class. */
[b-n5pftqvdgb] .copy-icon-btn {
    opacity: 0;
    transition: opacity 0.15s ease-in-out;
}

.copyable-row:hover[b-n5pftqvdgb]  .copy-icon-btn,
.copyable-row:focus-within[b-n5pftqvdgb]  .copy-icon-btn {
    opacity: 1;
}

/* A touch device has no hover state to reveal the icon with, and no keyboard focus either - without
   this, the copy icons would be permanently invisible (and unusable) on a phone. `(hover: none)`
   targets exactly that: primary input has no hovering capability, regardless of screen size. */
@media (hover: none) {
    [b-n5pftqvdgb] .copy-icon-btn {
        opacity: 1;
    }
}

/* ---- Header --------------------------------------------------------------------------------- */

.order-identity[b-n5pftqvdgb] {
    min-width: 0;
}

.order-badges[b-n5pftqvdgb] {
    gap: 4px;
}

.order-total-block[b-n5pftqvdgb] {
    text-align: right;
}

/* Allegro's own order ids are GUIDs, not short numbers - at the default heading size a full GUID
   wraps across several lines on a phone, pushing everything below it down. Shrinking the title on
   narrow screens keeps the identifier fully visible without dominating the fold; the total moves
   under the identity block instead of competing with it for width. */
@media (max-width: 600px) {
    [b-n5pftqvdgb] .order-title {
        font-size: 1.15rem;
        line-height: 1.3;
        word-break: break-all;
    }

    .order-total-block[b-n5pftqvdgb] {
        text-align: left;
    }
}

/* ---- Lifecycle strip ------------------------------------------------------------------------ */

.lifecycle-strip[b-n5pftqvdgb] {
    display: flex;
    align-items: flex-start;
}

.lifecycle-step[b-n5pftqvdgb] {
    position: relative;
    flex: 1;
    min-width: 72px;
    display: flex;
    flex-direction: column;
    align-items: center;
}

/* Connector line drawn from each step (except the first) back to its predecessor's dot. */
.lifecycle-step:not(:first-child)[b-n5pftqvdgb]::before {
    content: "";
    position: absolute;
    top: 17px;
    left: calc(-50% + 24px);
    width: calc(100% - 48px);
    height: 2px;
    background: var(--mud-palette-lines-default);
}

.lifecycle-step.done:not(:first-child)[b-n5pftqvdgb]::before {
    background: var(--mud-palette-success);
}

.lifecycle-step .step-dot[b-n5pftqvdgb] {
    width: 36px;
    height: 36px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    background: var(--mud-palette-background-gray);
    border: 2px solid var(--mud-palette-lines-default);
    color: var(--mud-palette-text-secondary);
    z-index: 1;
}

/* Done steps swap the domain icon for a check mark, so state is never conveyed by color alone. */
.lifecycle-step.done .step-dot[b-n5pftqvdgb] {
    background: var(--mud-palette-success);
    border-color: var(--mud-palette-success);
    color: var(--mud-palette-success-text);
}

.lifecycle-step.active .step-dot[b-n5pftqvdgb] {
    border-color: var(--mud-palette-info);
    color: var(--mud-palette-info);
}

.lifecycle-step[b-n5pftqvdgb]  .step-label {
    margin-top: 4px;
    color: var(--mud-palette-text-secondary);
}

.lifecycle-step.done[b-n5pftqvdgb]  .step-label,
.lifecycle-step.active[b-n5pftqvdgb]  .step-label {
    color: var(--mud-palette-text-primary);
}

/* ---- Summary cards -------------------------------------------------------------------------- */

/* Cards in a row stretch to the row's tallest card (the MudItem is d-flex) instead of being pinned
   to a hard-coded pixel height, which is what used to make card contents overlap their neighbours
   at narrow widths and larger font sizes. */
[b-n5pftqvdgb] .order-summary-card {
    width: 100%;
}

/* ---- Items grid ----------------------------------------------------------------------------- */

/* A long item list scrolls inside its own container instead of stretching the page; a fraction of
   the viewport rather than a magic `calc(100vh - N)` constant, so alerts/cards growing above the
   grid cannot throw it off. Scoped to this grid only - the old page's unscoped
   `.mud-table-container` rule silently resized every MudTable in the app. */
[b-n5pftqvdgb] .order-items-grid .mud-table-container {
    max-height: min(62vh, 900px);
}

/* Bounded as a share of the viewport instead of a fixed 300px, so long names stay readable without
   one column pushing every other column off a narrow screen. */
[b-n5pftqvdgb] .order-item-name {
    display: block;
    max-width: min(320px, 32vw);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

/* ---- Shipments ------------------------------------------------------------------------------ */

[b-n5pftqvdgb] .tracking-number {
    font-family: monospace;
    word-break: break-all;
}

/* ---- Tabs ------------------------------------------------------------------------------------ */

/* MudTabPanel's BadgeData renders as a MudBadge absolutely positioned over a zero-width anchor
   (.mud-tab-badge), so it never contributes to the tab's own layout width and always pokes past the
   tab's right edge by design - however wide the tab bar happens to be, wherever it's scrolled to.
   Padding on an ancestor can't fix that (the anchor stays zero-width no matter how much room the
   ancestor has), and the tab bar clips overflow for both the rounded corners and horizontal-scroll
   behaviour on narrow screens, so the poking part gets cut off - worst on "Wiadomości", the last tab.
   Forcing the badge back into normal flow makes it count towards the tab's real width instead. */
[b-n5pftqvdgb] .mud-tab-badge {
    position: static !important;
    display: inline-flex !important;
    width: auto !important;
    align-items: center;
}

[b-n5pftqvdgb] .mud-tab-badge .mud-badge {
    position: static !important;
    inset: auto !important;
    margin-left: 4px;
}

/* ---- Messages ------------------------------------------------------------------------------- */

/* A conversation reads as a conversation: buyer on the left, seller on the right, with an accent
   border as a second, color-independent cue for who wrote what. */
[b-n5pftqvdgb] .message-bubble {
    max-width: 75%;
}

[b-n5pftqvdgb] .message-bubble.from-seller {
    margin-left: auto;
    border-right: 3px solid var(--mud-palette-primary);
}

[b-n5pftqvdgb] .message-bubble.from-buyer {
    margin-right: auto;
    border-left: 3px solid var(--mud-palette-lines-default);
}

@media (max-width: 600px) {
    [b-n5pftqvdgb] .message-bubble {
        max-width: 92%;
    }
}

[b-n5pftqvdgb] .message-body {
    white-space: pre-wrap;
}

[b-n5pftqvdgb] .message-body-field textarea {
    resize: vertical;
    min-height: 8rem;
}

/* ---- Invoice -------------------------------------------------------------------------------- */

/* The PDF preview fills the tab instead of a fixed 900x580 box that overflowed small screens. */
.invoice-pdf-preview[b-n5pftqvdgb] {
    width: 100%;
    max-width: 900px;
    height: 70vh;
}
/* /Components/Pages/Settings/MessageTemplatesSettings.razor.rz.scp.css */
[b-msg6s5flvm] .message-body-field textarea {
    resize: vertical;
    min-height: 8rem;
}
/* /Components/Pages/Settings/Settings.razor.rz.scp.css */
/* Breakpoint mirrors MudBlazor's own Sm/Md boundary (960px) so the switch lines up with the rest
   of the app's responsive behaviour. */
.settings-layout[b-agaju0972v] {
	display: flex;
	align-items: flex-start;
	gap: 24px;
}

.settings-nav[b-agaju0972v] {
	flex: 0 0 280px;
}

.settings-content[b-agaju0972v] {
	flex: 1 1 auto;
	min-width: 0;
}

.settings-mobile-nav[b-agaju0972v] {
	display: none;
}

@media (max-width: 959.98px) {
	.settings-layout[b-agaju0972v] {
		flex-direction: column;
		/* flex-start (set for the desktop row so the short nav column doesn't stretch to the tall
		   content column's height) is the cross-axis alignment - which becomes *width* once the
		   layout switches to a column. Left at flex-start here, nav and content would only grow to
		   fit their own content instead of the viewport, and long unbroken text (e.g. a URL in
		   FurgonetkaSettings) would push the real page width past the phone's, moving text out of
		   view rather than wrapping it. */
		align-items: stretch;
	}

	.settings-nav[b-agaju0972v] {
		flex: 1 1 auto;
	}

	.settings-desktop-nav[b-agaju0972v] {
		display: none;
	}

	.settings-mobile-nav[b-agaju0972v] {
		display: block;
	}

	.settings-content[b-agaju0972v] {
		width: 100%;
	}
}
/* /Components/Pages/Tools/Feedbacks.razor.rz.scp.css */
/* MudDataGrid's toolbar is a fixed-height flex row. Once the three filters wrap onto a second line
   on a narrow viewport, that fixed height does not grow with them and the wrapped row renders on top
   of the grid's first data row. Letting the toolbar size to its content is the whole fix. */
.feedbacks-page[b-pkxb4vmrgh]  .mud-table-toolbar {
	height: auto;
	min-height: 64px;
	padding-top: 8px;
	padding-bottom: 8px;
}

.feedbacks-page[b-pkxb4vmrgh]  .feedbacks-filters {
	row-gap: 8px;
}
/* /Components/Shared/AppBarTitle.razor.rz.scp.css */
/* Telling the user which store they are in is the point of this block, so it gets the room it needs
   before the search field does - it is capped rather than shrunk (flex-shrink: 0), which is what a
   viewport-fraction cap got wrong: 45vw truncated an ordinary 15-character name on a phone while the
   brand mark next to it was hidden anyway. The cap is the smaller of half the bar, so a long name
   cannot dominate a wide screen, and whatever leaves 200px for the search field, which is the
   constraint a phone actually hits. min-width: 0 keeps that cap authoritative - a flex item's
   automatic minimum size would otherwise override max-width. */
.appbar-title[b-4m624lne6y] {
	display: flex;
	align-items: baseline;
	gap: 8px;
	flex: 0 0 auto;
	min-width: 0;
	max-width: min(50%, calc(100% - 200px));
}

/* ::deep because MudText renders these elements; Blazor's scope attribute only lands on
   .appbar-title, which this component's own markup emits directly. */
[b-4m624lne6y] .appbar-store-name {
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}

[b-4m624lne6y] .appbar-brand-mark {
	opacity: 0.7;
	white-space: nowrap;
}
/* /Components/Shared/Dialogs/EditItemDialog.razor.rz.scp.css */
/* Below `sm` (600px), the mobile MudSelect above replaces this header (#288 item 4) - MudTabs
   itself is left in place because it still owns which panel is visible, only its own header would
   otherwise duplicate the select and re-introduce the scroll-arrow strip on a narrow viewport. */
@media (max-width: 599.98px) {
	.edit-item-tabs[b-prboeuulb7]  .mud-tabs-tabbar {
		display: none;
	}
}
/* /Components/Shared/Dialogs/PriceGuidePanel.razor.rz.scp.css */
/* MudSimpleTable lets its <table> size to its content. With three columns of prose-ish labels
   ("Ilość (transakcje / oferty)", "Obecnie wystawione") that overflows the dialog on a phone-width
   viewport, and the overflow is clipped rather than scrolled - at 390px the "Obecnie wystawione"
   header and the wider quantity values were cut off mid-word. Fixing the layout makes the three
   columns share whatever width the dialog has and wrap instead of overflowing. */
.priceguide-table-wrapper[b-1853hzsig6]  .priceguide-table table {
	table-layout: fixed;
	width: 100%;
}

/* The label column needs a little more room than the two data columns, but not much - at 390px the
   data columns have to stay wide enough to keep "Sprzedane" and "wystawione" on one line each. */
.priceguide-table-wrapper[b-1853hzsig6]  .priceguide-table th:first-child,
.priceguide-table-wrapper[b-1853hzsig6]  .priceguide-table td:first-child {
	width: 34%;
}

/* At phone width three text columns cannot all hold their words at the default table font: widening
   any one of them only moves the mid-word break to another ("Sprzeda/ne" became "Średni/a"). Shrinking
   the type instead lets every label and header wrap on word boundaries, which is what actually makes
   the comparison readable on a 390px screen. */
@media (max-width: 600px) {
	.priceguide-table-wrapper[b-1853hzsig6]  .priceguide-table th,
	.priceguide-table-wrapper[b-1853hzsig6]  .priceguide-table td {
		font-size: 0.75rem;
		padding-left: 6px;
		padding-right: 6px;
	}
}

/* break-word, not anywhere: `anywhere` also breaks words that would have fitted, which shredded the
   column headers into "Sprzed/ane" and "Obecni/e wystawi/one". This breaks only a token that genuinely
   cannot fit its column, which is what keeps a long quantity from reintroducing the overflow. */
.priceguide-table-wrapper[b-1853hzsig6]  .priceguide-table th,
.priceguide-table-wrapper[b-1853hzsig6]  .priceguide-table td {
	overflow-wrap: break-word;
}
/* /Components/Shared/SearchBar.razor.rz.scp.css */
[b-y6nxa9ycwt] .mud-input {
    color: white;
}

[b-y6nxa9ycwt] input.mud-input-root::placeholder {
    color: rgba(255, 255, 255, 0.7);
}