/* /Components/Islands/CarrierDialog.razor.rz.scp.css */
.cd-fields[b-5b5j681zbn] {
    display: flex;
    flex-direction: column;
    gap: 0.9rem;
    padding-top: 0.25rem;
}
/* /Components/Islands/CartIsland.razor.rz.scp.css */
.cart-loading[b-22sq92dve6] {
    display: flex;
    justify-content: center;
    padding: 4rem 1rem;
}

/* ---------- Success ---------- */

.order-done[b-22sq92dve6] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.6rem;
    background: #fff;
    border: 1px solid #e3e4ec;
    border-radius: 10px;
    padding: 3rem 1.5rem;
    text-align: center;
}

    .order-done svg[b-22sq92dve6] {
        width: 64px;
        height: 64px;
        color: #1e7a3c;
    }

    .order-done h2[b-22sq92dve6] {
        margin: 0;
        font-size: 1.3rem;
    }

    .order-done p[b-22sq92dve6] {
        margin: 0 0 1rem;
        color: #6b6e80;
    }

/* ---------- Layout ---------- */

.cart-layout[b-22sq92dve6] {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 340px;
    gap: 1rem;
    align-items: start;
}

.cart-main[b-22sq92dve6] {
    min-width: 0;
}

.cart-side[b-22sq92dve6] {
    position: sticky;
    top: 72px;
}

.cart-actions-row[b-22sq92dve6] {
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 0.5rem;
    margin-bottom: 1rem;
}

.cart-panel[b-22sq92dve6] {
    background: #fff;
    border: 1px solid #e3e4ec;
    border-radius: 10px;
    padding: 1rem 1.2rem;
    margin-bottom: 1rem;
}

.panel-head-row[b-22sq92dve6] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin-bottom: 0.9rem;
}

    .panel-head-row h2[b-22sq92dve6] {
        font-size: 1.02rem;
        font-weight: 600;
        margin: 0;
    }

.cart-empty[b-22sq92dve6] {
    color: #6b6e80;
    padding: 1rem 0.25rem;
}

/* ---------- Cart items ---------- */

.cart-item[b-22sq92dve6] {
    display: grid;
    grid-template-columns: 84px minmax(0, 1fr) 150px 105px auto;
    gap: 0.8rem;
    align-items: center;
    padding: 0.7rem 0;
    border-bottom: 1px solid #eef0f4;
}

.ci-img[b-22sq92dve6] {
    width: 80px;
    height: 80px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: #f7f8fb;
    border-radius: 8px;
    overflow: hidden;
}

    .ci-img img[b-22sq92dve6] {
        max-width: 100%;
        max-height: 100%;
        object-fit: contain;
    }

    .ci-img.img-missing[b-22sq92dve6]::after {
        content: "";
        width: 32px;
        height: 32px;
        opacity: 0.35;
        background-color: #6b6e80;
        -webkit-mask: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M21 19V5c0-1.1-.9-2-2-2H5c-1.1 0-2 .9-2 2v14c0 1.1.9 2 2 2h14c1.1 0 2-.9 2-2zM8.5 13.5l2.5 3.01L14.5 12l4.5 6H5l3.5-4.5z"/></svg>') center / contain no-repeat;
        mask: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M21 19V5c0-1.1-.9-2-2-2H5c-1.1 0-2 .9-2 2v14c0 1.1.9 2 2 2h14c1.1 0 2-.9 2-2zM8.5 13.5l2.5 3.01L14.5 12l4.5 6H5l3.5-4.5z"/></svg>') center / contain no-repeat;
    }

.ci-info[b-22sq92dve6] {
    display: flex;
    flex-direction: column;
    gap: 0.15rem;
    min-width: 0;
}

.ci-name[b-22sq92dve6] {
    font-weight: 600;
    color: var(--brand-light);
}

.ci-spec[b-22sq92dve6] {
    font-size: 0.83rem;
    color: #4a4c59;
    overflow-wrap: anywhere;
}

.ci-price[b-22sq92dve6] {
    display: flex;
    flex-direction: column;
    text-align: right;
}

    .ci-price small[b-22sq92dve6] {
        color: #8a8d9c;
        font-size: 0.72rem;
    }

    .ci-price span[b-22sq92dve6] {
        font-weight: 600;
    }

.cart-qty-limit[b-22sq92dve6] {
    display: flex;
    justify-content: flex-end;
    padding-top: 0.7rem;
    font-size: 0.9rem;
}

.over-limit[b-22sq92dve6] {
    color: #d32f2f;
}

/* ---------- Address ---------- */

.addr-toolbar[b-22sq92dve6] {
    display: flex;
    flex-direction: column;
    gap: 0.4rem;
    margin-bottom: 1rem;
}

.addr-actions[b-22sq92dve6] {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.addr-btns[b-22sq92dve6] {
    display: flex;
    align-items: center;
    gap: 0.4rem;
}

/* 6-column grid; each field carries an explicit span class:
   Company (full) / First+Last (3+3) / Street+Apt (4+2) / City+State+Zip (2+2+2) / Phone+Fax (3+3) / Email (full) */
.addr-grid[b-22sq92dve6] {
    display: grid;
    grid-template-columns: repeat(6, minmax(0, 1fr));
    gap: 0.85rem 0.8rem;
}

.a-full[b-22sq92dve6] {
    grid-column: 1 / -1;
}

.a-wide[b-22sq92dve6] {
    grid-column: span 4;
}

[b-22sq92dve6] .addr-grid > .a-3 {
    grid-column: span 3;
}

[b-22sq92dve6] .addr-grid > .a-2 {
    grid-column: span 2;
}

@media (max-width: 699.98px) {
    .addr-grid[b-22sq92dve6] {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .a-wide[b-22sq92dve6] {
        grid-column: 1 / -1;
    }

    [b-22sq92dve6] .addr-grid > .a-3,
    [b-22sq92dve6] .addr-grid > .a-2 {
        grid-column: span 1;
    }
}

/* ---------- Summary ---------- */

.sum-row[b-22sq92dve6] {
    display: flex;
    justify-content: space-between;
    font-size: 0.92rem;
    margin-bottom: 0.4rem;
}

.sum-total[b-22sq92dve6] {
    font-weight: 700;
}

.cart-submit[b-22sq92dve6] {
    display: flex;
    justify-content: center;
    padding: 0.5rem 0 1rem;
}

    .cart-submit[b-22sq92dve6]  .mud-button-root {
        min-width: 220px;
    }

/* ---------- Mobile ---------- */

@media (max-width: 959.98px) {
    .cart-layout[b-22sq92dve6] {
        grid-template-columns: 1fr;
    }

    .cart-side[b-22sq92dve6] {
        position: static;
    }

    .cart-item[b-22sq92dve6] {
        grid-template-columns: 70px minmax(0, 1fr) auto;
        grid-template-areas:
            "img info del"
            "qty qty price";
        row-gap: 0.4rem;
    }

    .ci-img[b-22sq92dve6] {
        grid-area: img;
        width: 64px;
        height: 64px;
    }

    .ci-info[b-22sq92dve6] {
        grid-area: info;
    }

    .ci-qty[b-22sq92dve6] {
        grid-area: qty;
        max-width: 180px;
    }

    .ci-price[b-22sq92dve6] {
        grid-area: price;
        align-self: center;
    }

    .cart-item[b-22sq92dve6]  .mud-icon-button {
        grid-area: del;
    }
}

/* center the QTY value in cart item rows */
.cart-item[b-22sq92dve6]  input {
    text-align: center;
}
/* /Components/Islands/CatalogBrowser.razor.rz.scp.css */
/* ---------- Toolbar ---------- */

.cat-toolbar[b-4u78szdji4] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.5rem 1rem;
    margin-bottom: 1rem;
}

.cat-search[b-4u78szdji4] {
    flex: 1 1 300px;
    max-width: 560px;
}

.cat-count[b-4u78szdji4] {
    font-size: 0.85rem;
    color: #6b6e80;
    white-space: nowrap;
}

.cart-remaining[b-4u78szdji4] {
    font-size: 0.9rem;
    color: #2b2c33;
    background: #fff4e5;
    border: 1px solid #f3c98b;
    border-radius: 8px;
    padding: 0.4rem 0.8rem;
    white-space: nowrap;
    margin-left: auto;
}

/* ---------- Item cards ---------- */

.cat-list[b-4u78szdji4] {
    min-width: 0;
}

.cat-loading[b-4u78szdji4],
.cat-empty[b-4u78szdji4] {
    display: flex;
    flex-direction: column;
    align-items: center;
    padding: 3rem 1rem;
    color: #6b6e80;
    background: #fff;
    border: 1px solid #e3e4ec;
    border-radius: 10px;
}

.item-card[b-4u78szdji4] {
    display: grid;
    grid-template-columns: 180px minmax(0, 1fr) 185px;
    gap: 1rem;
    align-items: center;
    background: #fff;
    border: 1px solid #e3e4ec;
    border-radius: 10px;
    padding: 0.9rem 1.1rem;
    margin-bottom: 0.9rem;
    transition: box-shadow 0.15s, border-color 0.15s;
}

    .item-card:hover[b-4u78szdji4] {
        border-color: #c9d4ea;
        box-shadow: 0 3px 12px rgba(13, 71, 161, 0.1);
    }

.item-img[b-4u78szdji4] {
    width: 160px;
    height: 160px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: #f7f8fb;
    border-radius: 8px;
    overflow: hidden;
    position: relative;
}

[b-4u78szdji4] .item-gear {
    position: absolute;
    top: 2px;
    right: 2px;
    background: rgba(255, 255, 255, 0.85);
    z-index: 2; /* stay above the img-zoom hover overlay */
}

    .item-img img[b-4u78szdji4] {
        max-width: 100%;
        max-height: 100%;
        object-fit: contain;
    }

    /* graceful placeholder when the product image is missing */
    .item-img.img-missing[b-4u78szdji4]::after {
        content: "";
        width: 56px;
        height: 56px;
        opacity: 0.35;
        background-color: #6b6e80;
        -webkit-mask: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M21 19V5c0-1.1-.9-2-2-2H5c-1.1 0-2 .9-2 2v14c0 1.1.9 2 2 2h14c1.1 0 2-.9 2-2zM8.5 13.5l2.5 3.01L14.5 12l4.5 6H5l3.5-4.5z"/></svg>') center / contain no-repeat;
        mask: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M21 19V5c0-1.1-.9-2-2-2H5c-1.1 0-2 .9-2 2v14c0 1.1.9 2 2 2h14c1.1 0 2-.9 2-2zM8.5 13.5l2.5 3.01L14.5 12l4.5 6H5l3.5-4.5z"/></svg>') center / contain no-repeat;
    }

.item-info[b-4u78szdji4] {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 0.7rem 1rem;
}

.info-cell[b-4u78szdji4] {
    display: flex;
    flex-direction: column;
    gap: 0.1rem;
    min-width: 0;
}

    .info-cell small[b-4u78szdji4] {
        color: #8a8d9c;
        font-size: 0.75rem;
    }

    .info-cell span[b-4u78szdji4] {
        font-weight: 600;
        font-size: 0.92rem;
        overflow-wrap: anywhere;
    }

.info-product[b-4u78szdji4] {
    grid-column: span 2;
}

.item-desc[b-4u78szdji4] {
    font-weight: 400 !important;
    font-size: 0.85rem !important;
    color: #4a4c59;
}

.v-blue[b-4u78szdji4] {
    color: var(--brand-light);
}

.v-green[b-4u78szdji4] {
    color: #028f37;
}

.v-red[b-4u78szdji4] {
    color: #d32f2f;
}

/* ---------- Item actions ---------- */

.item-actions[b-4u78szdji4] {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
    max-width: 180px;
    justify-self: end;
    width: 100%;
}

[b-4u78szdji4] .add-cart-btn {
    white-space: nowrap;
}

/* center the QTY value (old my-Text-Center behavior) */
.item-actions[b-4u78szdji4]  input {
    text-align: center;
}

.cat-pager[b-4u78szdji4] {
    display: flex;
    justify-content: center;
    padding: 1rem 0 0.5rem;
    min-width: 0;
}

    /* 30+ pages render up to 9 buttons - wrap on phones instead of forcing the page wider */
    .cat-pager[b-4u78szdji4]  .mud-pagination {
        flex-wrap: wrap;
        justify-content: center;
    }

/* ---------- Mobile ---------- */

@media (max-width: 959.98px) {
    .cart-remaining[b-4u78szdji4] {
        margin-left: 0;
    }

    .item-card[b-4u78szdji4] {
        grid-template-columns: 120px minmax(0, 1fr);
        grid-template-areas:
            "img info"
            "actions actions";
    }

    .item-img[b-4u78szdji4] {
        grid-area: img;
        width: 110px;
        height: 110px;
    }

    .item-info[b-4u78szdji4] {
        grid-area: info;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 0.5rem 0.75rem;
    }

    .item-actions[b-4u78szdji4] {
        grid-area: actions;
        flex-direction: row;
        align-items: center;
        max-width: none;
        justify-self: stretch;
        flex-wrap: wrap; /* qty + Add to Cart can exceed narrow phones - wrap instead of overflowing */
        min-width: 0;
    }

        .item-actions[b-4u78szdji4]  .mud-input-control {
            max-width: 120px;
        }
}
/* /Components/Islands/CatalogFilterPanel.razor.rz.scp.css */
.filter-panel[b-wy04swh96m] {
    margin: 0.5rem 0.6rem 0.75rem;
    border: 1px solid #e3e4ec;
    border-radius: 10px;
    overflow: hidden;
    background: #fff;
}

.filter-title[b-wy04swh96m] {
    background: var(--brand);
    color: #fff;
    font-size: 0.78rem;
    font-weight: 600;
    letter-spacing: 0.06em;
    text-align: center;
    padding: 0.55rem 0.5rem;
}

.filter-loading[b-wy04swh96m] {
    padding: 0.9rem;
    font-size: 0.85rem;
    color: #9094a6;
}

.filter-group[b-wy04swh96m] {
    border-bottom: 1px solid #eef0f4;
}

    .filter-group summary[b-wy04swh96m] {
        cursor: pointer;
        list-style: none;
        display: flex;
        align-items: center;
        justify-content: space-between;
        padding: 0.55rem 0.8rem;
        font-size: 0.87rem;
        font-weight: 500;
        color: #3a3b45;
        user-select: none;
    }

        .filter-group summary[b-wy04swh96m]::after {
            content: "\203A";
            font-size: 1.05rem;
            color: #9094a6;
            transition: transform 0.15s;
        }

    .filter-group[open] summary[b-wy04swh96m]::after {
        transform: rotate(90deg);
    }

    .filter-group summary:hover[b-wy04swh96m] {
        background: #f5f7fb;
    }

.filter-options[b-wy04swh96m] {
    max-height: 220px;
    overflow-y: auto;
    padding: 0 0.5rem 0.55rem;
}

.filter-option[b-wy04swh96m] {
    display: flex;
    align-items: center;
    gap: 0.45rem;
    padding: 0.26rem 0.3rem;
    font-size: 0.84rem;
    color: #3a3b45;
    border-radius: 4px;
    cursor: pointer;
}

    .filter-option:hover[b-wy04swh96m] {
        background: #f5f7fb;
    }

    .filter-option input[b-wy04swh96m] {
        accent-color: var(--brand);
        width: 14px;
        height: 14px;
        flex-shrink: 0;
    }

.btn-download[b-wy04swh96m] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.45rem;
    width: 100%;
    padding: 0.6rem 0.5rem;
    background: var(--brand);
    color: #fff;
    border: none;
    cursor: pointer;
    font-family: inherit;
    font-size: 0.76rem;
    font-weight: 600;
    letter-spacing: 0.05em;
}

    .btn-download:hover[b-wy04swh96m] {
        background: var(--brand-dark);
    }

    .btn-download svg[b-wy04swh96m] {
        width: 17px;
        height: 17px;
    }
/* /Components/Islands/ChargeDialog.razor.rz.scp.css */
.cd-fields[b-tcw4rbkmxn] {
    display: flex;
    flex-direction: column;
    gap: 0.9rem;
    padding-top: 0.25rem;
}
/* /Components/Islands/ChargeSettingsIsland.razor.rz.scp.css */
.cs-toolbar[b-deyhv7zo5f] {
    max-width: 420px;
    margin-bottom: 0.75rem;
}

.cs-section[b-deyhv7zo5f] {
    margin-bottom: 1.25rem;
}

.cs-section-head[b-deyhv7zo5f] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 0.4rem;
}

.chg-section-title[b-deyhv7zo5f] {
    background: var(--brand);
    color: #fff;
    font-size: 0.8rem;
    font-weight: 600;
    letter-spacing: 0.04em;
    border-radius: 6px;
    padding: 0.35rem 0.8rem;
    display: block;
    width: fit-content;
    min-width: 150px;
}
/* /Components/Islands/InventoryGrid.razor.rz.scp.css */
.inv-toolbar[b-kxzsnhgp5e] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.5rem 1rem;
    margin-bottom: 0.5rem;
}

.inv-search[b-kxzsnhgp5e] {
    flex: 1 1 280px;
    max-width: 420px;
}

.inv-filters[b-kxzsnhgp5e] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));
    gap: 0.5rem 0.75rem;
    margin-bottom: 0.75rem;
    max-width: 760px;
}

/* no ::deep here - these are authored elements (carry the scope attribute),
   with no scoped ancestor inside the MudTable cell for ::deep to anchor on */
.inv-thumb-wrap[b-kxzsnhgp5e] {
    display: inline-block;
    width: 56px;
    height: 56px;
    border-radius: 6px;
    background: #f0f0f4;
}

.inv-thumb[b-kxzsnhgp5e] {
    width: 56px;
    height: 56px;
    object-fit: cover;
    border-radius: 6px;
    background: #f0f0f4;
    display: block;
}

/* ---------- Amazon-style item cards (phones) ---------- */

.inv-cards[b-kxzsnhgp5e] {
    display: none; /* desktop keeps the table */
}

@media (max-width: 767.98px) {
    .inv-cards[b-kxzsnhgp5e] {
        display: block;
        background: #fff;
        border: 1px solid #e3e4ec;
        border-radius: 10px;
        overflow: hidden;
    }

    .inv-cards-empty[b-kxzsnhgp5e] {
        margin: 0;
        padding: 1rem;
        color: #8a8d9c;
    }

    .inv-card[b-kxzsnhgp5e] {
        display: flex;
        align-items: center;
        gap: 0.75rem;
        padding: 0.8rem 0.8rem 0.8rem 0.9rem;
        border-bottom: 1px solid #eef0f5;
    }

        .inv-card:last-child[b-kxzsnhgp5e] {
            border-bottom: 0;
        }

    .inv-card-img[b-kxzsnhgp5e] {
        flex: 0 0 auto;
        width: 64px;
        height: 64px;
        border-radius: 8px;
        background: #f7f8fb;
        overflow: hidden;
        position: relative;
    }

        .inv-card-img img[b-kxzsnhgp5e] {
            width: 100%;
            height: 100%;
            object-fit: cover;
            display: block;
        }

        /* camera placeholder when the product image is missing */
        .inv-card-img.img-missing[b-kxzsnhgp5e]::after {
            content: "";
            position: absolute;
            inset: 0;
            background-color: #c6c9d4;
            -webkit-mask: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M12 15.2a3.2 3.2 0 1 0 0-6.4 3.2 3.2 0 0 0 0 6.4zM9 3 7.17 5H4c-1.1 0-2 .9-2 2v12c0 1.1.9 2 2 2h16c1.1 0 2-.9 2-2V7c0-1.1-.9-2-2-2h-3.17L15 3H9z"/></svg>') center / 26px 26px no-repeat;
            mask: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M12 15.2a3.2 3.2 0 1 0 0-6.4 3.2 3.2 0 0 0 0 6.4zM9 3 7.17 5H4c-1.1 0-2 .9-2 2v12c0 1.1.9 2 2 2h16c1.1 0 2-.9 2-2V7c0-1.1-.9-2-2-2h-3.17L15 3H9z"/></svg>') center / 26px 26px no-repeat;
        }

    .ic-body[b-kxzsnhgp5e] {
        flex: 1 1 auto;
        min-width: 0;
        display: flex;
        flex-direction: column;
        gap: 0.22rem;
        cursor: pointer;
    }

    .ic-active[b-kxzsnhgp5e] {
        font-size: 0.78rem;
        font-weight: 700;
        color: #1e7a3c;
    }

    .ic-inactive[b-kxzsnhgp5e] {
        font-size: 0.78rem;
        font-weight: 700;
        color: #b3261e;
    }

    .ic-title[b-kxzsnhgp5e] {
        font-size: 0.98rem;
        font-weight: 600;
        overflow-wrap: break-word;
    }

    .ic-sub[b-kxzsnhgp5e] {
        font-size: 0.88rem;
        color: #4a4c59;
        overflow-wrap: break-word;
    }

    .ic-meta[b-kxzsnhgp5e] {
        font-size: 0.78rem;
        color: #8a8d9c;
    }

    .ic-chev[b-kxzsnhgp5e] {
        flex: 0 0 auto;
        font-size: 1.8rem;
        line-height: 1;
        color: #b8bbc9;
        cursor: pointer;
        padding: 0 0.2rem;
    }

    .ic-more[b-kxzsnhgp5e] {
        display: block;
        width: 100%;
        padding: 0.85rem;
        background: #f7f8fb;
        border: 0;
        border-top: 1px solid #eef0f5;
        color: var(--brand);
        font-family: inherit;
        font-size: 0.9rem;
        font-weight: 600;
        cursor: pointer;
    }
}
/* /Components/Islands/ItemDetailForm.razor.rz.scp.css */
.idf-loading[b-lkjtkctekg] {
    display: flex;
    justify-content: center;
    padding: 3rem 0;
}

.idf-layout[b-lkjtkctekg] {
    display: grid;
    grid-template-columns: 260px minmax(0, 1fr);
    gap: 1rem;
    align-items: start;
}

.idf-image[b-lkjtkctekg] {
    position: sticky;
    top: 1rem;
    text-align: center;
}

    .idf-image img[b-lkjtkctekg] {
        max-width: 100%;
        border-radius: 8px;
        background: #f7f8fb;
    }

.idf-main[b-lkjtkctekg] {
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 1rem;
}

    .idf-main .panel[b-lkjtkctekg] {
        margin-bottom: 0;
    }

.idf-sku-row[b-lkjtkctekg] {
    display: flex;
    align-items: flex-start;
    gap: 0.75rem;
    margin-bottom: 0.75rem;
}

    .idf-sku-row[b-lkjtkctekg]  .mud-input-control {
        flex: 1 1 auto;
    }

.idf-grid-2[b-lkjtkctekg] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.75rem 1rem;
}

.idf-grid-3[b-lkjtkctekg] {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 0.75rem 1rem;
}

.idf-grid-4[b-lkjtkctekg] {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 0.75rem 1rem;
}

.idf-switches[b-lkjtkctekg] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.25rem 1.25rem;
}

.idf-empty[b-lkjtkctekg] {
    color: #8a8d9c;
    font-size: 0.88rem;
    margin: 0.5rem 0 0;
}

.idf-submit[b-lkjtkctekg] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.5rem;
    padding-bottom: 0.5rem;
}

@media (max-width: 959.98px) {
    .idf-layout[b-lkjtkctekg] {
        grid-template-columns: 1fr;
    }

    .idf-image[b-lkjtkctekg] {
        position: static;
        max-width: 300px;
    }

    .idf-grid-4[b-lkjtkctekg] {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 599.98px) {
    .idf-grid-2[b-lkjtkctekg],
    .idf-grid-3[b-lkjtkctekg] {
        grid-template-columns: 1fr;
    }
}
/* /Components/Islands/OrderDetailIsland.razor.rz.scp.css */
.od-loading[b-gb85mff7t1],
.od-error[b-gb85mff7t1] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.5rem;
    padding: 4rem 1rem;
    background: #fff;
    border: 1px solid #e3e4ec;
    border-radius: 10px;
    color: #6b6e80;
}

.od-toprow[b-gb85mff7t1] {
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 0.5rem;
    margin-bottom: 1rem;
}

/* ---------- Layout ---------- */

.od-layout[b-gb85mff7t1] {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 360px;
    gap: 1rem;
    align-items: start;
}

.od-main[b-gb85mff7t1] {
    min-width: 0;
}

.od-side[b-gb85mff7t1] {
    position: sticky;
    top: 72px;
}

.od-panel[b-gb85mff7t1] {
    background: #fff;
    border: 1px solid #e3e4ec;
    border-radius: 10px;
    padding: 1rem 1.2rem;
    margin-bottom: 1rem;
}

.panel-head-row[b-gb85mff7t1] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin-bottom: 0.9rem;
}

    .panel-head-row h2[b-gb85mff7t1] {
        font-size: 1.02rem;
        font-weight: 600;
        margin: 0;
    }

    .panel-head-row.spread[b-gb85mff7t1] {
        justify-content: space-between;
    }

.head-left[b-gb85mff7t1] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.od-orderno[b-gb85mff7t1] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 0.5rem;
}

    .od-orderno .panel-head-row[b-gb85mff7t1] {
        margin-bottom: 0;
    }

.od-empty[b-gb85mff7t1] {
    color: #6b6e80;
    padding: 1rem 0.25rem;
}

.od-note[b-gb85mff7t1] {
    color: #9094a6;
    font-size: 0.85rem;
    margin: 0;
}

/* ---------- Items ---------- */

.od-item[b-gb85mff7t1] {
    display: grid;
    grid-template-columns: 84px minmax(0, 1fr) 130px 90px 100px auto;
    gap: 0.8rem;
    align-items: center;
    padding: 0.7rem 0;
    border-bottom: 1px solid #eef0f4;
}

.oi-img[b-gb85mff7t1] {
    width: 80px;
    height: 80px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: #f7f8fb;
    border-radius: 8px;
    overflow: hidden;
}

    .oi-img img[b-gb85mff7t1] {
        max-width: 100%;
        max-height: 100%;
        object-fit: contain;
    }

    .oi-img.img-missing[b-gb85mff7t1]::after {
        content: "";
        width: 32px;
        height: 32px;
        opacity: 0.35;
        background-color: #6b6e80;
        -webkit-mask: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M21 19V5c0-1.1-.9-2-2-2H5c-1.1 0-2 .9-2 2v14c0 1.1.9 2 2 2h14c1.1 0 2-.9 2-2zM8.5 13.5l2.5 3.01L14.5 12l4.5 6H5l3.5-4.5z"/></svg>') center / contain no-repeat;
        mask: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M21 19V5c0-1.1-.9-2-2-2H5c-1.1 0-2 .9-2 2v14c0 1.1.9 2 2 2h14c1.1 0 2-.9 2-2zM8.5 13.5l2.5 3.01L14.5 12l4.5 6H5l3.5-4.5z"/></svg>') center / contain no-repeat;
    }

.oi-info[b-gb85mff7t1] {
    display: flex;
    flex-direction: column;
    gap: 0.15rem;
    min-width: 0;
}

.oi-name[b-gb85mff7t1] {
    font-weight: 600;
    color: var(--brand-light);
}

.oi-spec[b-gb85mff7t1] {
    font-size: 0.83rem;
    color: #4a4c59;
    overflow-wrap: anywhere;
}

.oi-price[b-gb85mff7t1] {
    display: flex;
    flex-direction: column;
    text-align: right;
}

    .oi-price small[b-gb85mff7t1] {
        color: #8a8d9c;
        font-size: 0.72rem;
    }

    .oi-price span[b-gb85mff7t1] {
        font-weight: 600;
    }

.od-qty-limit[b-gb85mff7t1] {
    display: flex;
    justify-content: flex-end;
    padding-top: 0.7rem;
    font-size: 0.9rem;
}

/* ---------- Tracking ---------- */

.od-trk-add[b-gb85mff7t1] {
    display: flex;
    align-items: flex-end;
    gap: 0.6rem;
    margin-bottom: 0.5rem;
}

    .od-trk-add[b-gb85mff7t1]  .mud-input-control {
        flex: 1;
    }

.od-trk-row[b-gb85mff7t1] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.5rem;
    padding: 0.3rem 0;
    border-bottom: 1px solid #f2f3f7;
}

.trk-text[b-gb85mff7t1] {
    flex: 1;
    text-align: center;
    overflow-wrap: anywhere;
}

/* ---------- Address (same classes as CartIsland) ---------- */

.addr-actions[b-gb85mff7t1] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 0.75rem;
}

.addr-btns[b-gb85mff7t1] {
    display: flex;
    align-items: center;
    gap: 0.4rem;
}

.addr-grid[b-gb85mff7t1] {
    display: grid;
    grid-template-columns: repeat(6, minmax(0, 1fr));
    gap: 0.85rem 0.8rem;
}

.a-full[b-gb85mff7t1] {
    grid-column: 1 / -1;
}

.a-wide[b-gb85mff7t1] {
    grid-column: span 4;
}

[b-gb85mff7t1] .addr-grid > .a-3 {
    grid-column: span 3;
}

[b-gb85mff7t1] .addr-grid > .a-2 {
    grid-column: span 2;
}

/* ---------- Charges ---------- */

/* each charge section is its own block row, like the old ERP layout */
.chg-section[b-gb85mff7t1] {
    padding: 0.6rem 0 0.7rem;
}

    .chg-section + .chg-section[b-gb85mff7t1] {
        border-top: 1px solid #eef0f4;
    }

.chg-section-title[b-gb85mff7t1] {
    background: var(--brand);
    color: #fff;
    font-size: 0.8rem;
    font-weight: 600;
    letter-spacing: 0.04em;
    border-radius: 6px;
    padding: 0.35rem 0.8rem;
    display: block;
    width: fit-content;
    min-width: 150px;
    margin: 0 0 0.5rem;
}

.chg-add[b-gb85mff7t1] {
    display: flex;
    align-items: center;
    gap: 0.6rem;
    margin-bottom: 0.5rem;
}

    .chg-add > :first-child[b-gb85mff7t1] {
        flex: 1;
    }

.chg-row[b-gb85mff7t1] {
    display: grid;
    grid-template-columns: 90px minmax(0, 1fr) 80px 110px 110px auto;
    gap: 0.5rem;
    align-items: center;
    background: #f4f8fd;
    border-radius: 6px;
    padding: 0.25rem 0.6rem;
    margin-bottom: 0.35rem;
}

.chg-total[b-gb85mff7t1] {
    display: flex;
    justify-content: flex-end;
    padding-top: 0.8rem;
    font-size: 1rem;
}

/* ---------- Right side ---------- */

.od-timeline[b-gb85mff7t1] {
    display: flex;
    align-items: flex-start;
    justify-content: center;
    gap: 0.25rem;
    padding: 0.4rem 0 0.9rem;
}

.tl-step[b-gb85mff7t1] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.3rem;
    min-width: 78px;
    color: #9094a6;
}

    .tl-step span[b-gb85mff7t1] {
        font-size: 0.75rem;
        text-align: center;
    }

.tl-dot[b-gb85mff7t1] {
    width: 36px;
    height: 36px;
    display: flex;
    align-items: center;
    justify-content: center;
    border: 2px solid #c9cbd8;
    border-radius: 50%;
    background: #fff;
    color: #9094a6;
    transition: transform 0.15s;
}

.tl-step.done .tl-dot[b-gb85mff7t1] {
    border-color: var(--brand-light);
    color: var(--brand-light);
}

.tl-step.done[b-gb85mff7t1] {
    color: #4a4c59;
}

.tl-step.active .tl-dot[b-gb85mff7t1] {
    border-color: var(--brand);
    color: var(--brand);
    transform: scale(1.18);
    box-shadow: 0 0 0 4px var(--brand-soft);
}

.tl-step.active[b-gb85mff7t1] {
    color: var(--brand);
    font-weight: 600;
}

.tl-step.danger .tl-dot[b-gb85mff7t1] {
    border-color: #d32f2f;
    color: #d32f2f;
    box-shadow: 0 0 0 4px #fdecec;
}

.tl-step.danger[b-gb85mff7t1] {
    color: #d32f2f;
}

.tl-line[b-gb85mff7t1] {
    flex: 1;
    max-width: 46px;
    height: 2px;
    background: #d9dbe6;
    margin-top: 18px;
}

.od-fields[b-gb85mff7t1] {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

.od-field[b-gb85mff7t1] {
    display: flex;
    flex-direction: column;
    border: 1px solid #e3e4ec;
    border-radius: 6px;
    padding: 0.4rem 0.7rem;
}

    .od-field small[b-gb85mff7t1] {
        color: #8a8d9c;
        font-size: 0.72rem;
    }

    .od-field span[b-gb85mff7t1] {
        font-size: 0.9rem;
        font-weight: 500;
        overflow-wrap: anywhere;
        min-height: 1.2em;
    }

.sum-row[b-gb85mff7t1] {
    display: flex;
    justify-content: space-between;
    font-size: 0.92rem;
    margin-bottom: 0.4rem;
}

.sum-total[b-gb85mff7t1] {
    font-weight: 700;
}

.od-submit[b-gb85mff7t1] {
    display: flex;
    justify-content: center;
    padding: 0.5rem 0 1.5rem;
}

    .od-submit[b-gb85mff7t1]  .mud-button-root {
        min-width: 220px;
    }

/* ---------- Mobile ---------- */

@media (max-width: 959.98px) {
    .od-layout[b-gb85mff7t1] {
        grid-template-columns: 1fr;
    }

    .od-side[b-gb85mff7t1] {
        position: static;
    }

    .od-item[b-gb85mff7t1] {
        grid-template-columns: 70px minmax(0, 1fr) auto;
        grid-template-areas:
            "img info del"
            "qty bo price";
        row-gap: 0.4rem;
    }

    .oi-img[b-gb85mff7t1] {
        grid-area: img;
        width: 64px;
        height: 64px;
    }

    .oi-info[b-gb85mff7t1] {
        grid-area: info;
    }

    .oi-qty[b-gb85mff7t1] {
        grid-area: qty;
    }

    .oi-bo[b-gb85mff7t1] {
        grid-area: bo;
    }

    .oi-price[b-gb85mff7t1] {
        grid-area: price;
        align-self: center;
    }

    .od-item[b-gb85mff7t1]  .mud-icon-button {
        grid-area: del;
    }

    .addr-grid[b-gb85mff7t1] {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .a-wide[b-gb85mff7t1] {
        grid-column: 1 / -1;
    }

    [b-gb85mff7t1] .addr-grid > .a-3,
    [b-gb85mff7t1] .addr-grid > .a-2 {
        grid-column: span 1;
    }

    .chg-row[b-gb85mff7t1] {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

/* ---------- Attachments ---------- */

.att-hint[b-gb85mff7t1] {
    display: block;
    color: #8a8d9c;
    margin-top: 0.35rem;
}

.att-list[b-gb85mff7t1] {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 0.25rem;
    margin-top: 0.75rem;
}

    /* MudButton's Class lands on a Mud-rendered element (no scope attribute) - anchor ::deep on the authored list */
    .att-list[b-gb85mff7t1]  .att-file {
        text-transform: none;
        justify-content: flex-start;
    }

/* center the QTY / BO values in item rows (Mud-rendered inputs - anchor on the authored row) */
.od-item[b-gb85mff7t1]  input {
    text-align: center;
}
/* /Components/Islands/OrderItemPickerDialog.razor.rz.scp.css */
/* no ::deep - these are authored elements (carry the scope attribute) with no scoped
   ancestor inside the MudTable cell, so a leading ::deep never matches */
.pick-thumb-wrap[b-mvvkx9apc0] {
    display: inline-block;
    width: 56px;
    height: 56px;
    border-radius: 6px;
    background: #f7f8fb;
}

.pick-thumb[b-mvvkx9apc0] {
    width: 56px;
    height: 56px;
    object-fit: contain;
    border-radius: 6px;
    background: #f7f8fb;
    display: block;
}

.pick-qty[b-mvvkx9apc0] {
    display: flex;
    align-items: center;
    gap: 0.4rem;
    min-width: 140px;
}

    /* center the QTY value (Mud-rendered input - anchor ::deep on the authored wrapper) */
    .pick-qty[b-mvvkx9apc0]  input {
        text-align: center;
    }
/* /Components/Islands/PasswordResetDialog.razor.rz.scp.css */
.pr-fields[b-c5e1yb1iu4] {
    display: flex;
    flex-direction: column;
    gap: 0.9rem;
    padding-top: 0.25rem;
}
/* /Components/Islands/ProductDialog.razor.rz.scp.css */
.pd-loading[b-eded7plrg6] {
    display: flex;
    justify-content: center;
    padding: 2rem;
}

.pd-layout[b-eded7plrg6] {
    display: grid;
    grid-template-columns: 140px minmax(0, 1fr);
    gap: 1rem;
    align-items: start;
}

.pd-img[b-eded7plrg6] {
    width: 130px;
    height: 130px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: #f7f8fb;
    border-radius: 8px;
    overflow: hidden;
}

    .pd-img img[b-eded7plrg6] {
        max-width: 100%;
        max-height: 100%;
        object-fit: contain;
    }

.pd-fields[b-eded7plrg6] {
    display: flex;
    flex-direction: column;
    gap: 0.9rem;
}

.pd-hint[b-eded7plrg6] {
    color: #9094a6;
    font-size: 0.75rem;
    margin-top: -0.5rem;
}

@media (max-width: 599.98px) {
    .pd-layout[b-eded7plrg6] {
        grid-template-columns: 1fr;
        justify-items: center;
    }
}
/* /Components/Islands/ProductListIsland.razor.rz.scp.css */
.pl-toolbar[b-cpp77kter4] {
    max-width: 420px;
    margin-bottom: 0.75rem;
}

/* no ::deep - the img is authored here (carries the scope attribute) and has no scoped
   ancestor inside the MudTable cell, so a leading ::deep never matches */
.pl-thumb[b-cpp77kter4] {
    width: 72px;
    height: 72px;
    object-fit: contain;
    border-radius: 8px;
    background: #f7f8fb;
    display: block;
}
/* /Components/Islands/ProjectOverviewIsland.razor.rz.scp.css */
.pov-empty[b-ge5ccfplq8] {
    display: flex;
    justify-content: center;
    padding: 3rem 1rem;
    background: #fff;
    border: 1px solid #e3e4ec;
    border-radius: 10px;
}

.pov-card[b-ge5ccfplq8] {
    background: #fff;
    border: 1px solid #e3e4ec;
    border-radius: 10px;
    padding: 1.1rem 1.4rem;
    margin-bottom: 1rem;
    max-width: 900px;
}

.pov-head[b-ge5ccfplq8] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin-bottom: 1rem;
}

    .pov-head h2[b-ge5ccfplq8] {
        margin: 0;
        font-size: 1.05rem;
        font-weight: 600;
    }

/* ---------- horizontal status timeline ---------- */

.pov-timeline[b-ge5ccfplq8] {
    display: flex;
    justify-content: space-between;
    max-width: 640px;
    margin: 0 auto 1.25rem;
    position: relative;
}

    /* connecting line behind the dots */
    .pov-timeline[b-ge5ccfplq8]::before {
        content: "";
        position: absolute;
        top: 17px;
        left: 40px;
        right: 40px;
        height: 3px;
        background: #b7cdea;
    }

.pov-stage[b-ge5ccfplq8] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.35rem;
    flex: 1 1 0;
    min-width: 0;
    position: relative;
    color: #55586a;
}

.pov-dot[b-ge5ccfplq8] {
    width: 34px;
    height: 34px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    background: #fff;
    border: 2px solid var(--brand-light);
    color: var(--brand);
}

.pov-stage.active .pov-dot[b-ge5ccfplq8] {
    width: 42px;
    height: 42px;
    margin-top: -4px;
}

.pov-stage.danger .pov-dot[b-ge5ccfplq8] {
    border-color: #d32f2f;
    color: #d32f2f;
}

    /* MudIcon svg is Mud-rendered (no scope attr) - force it to follow the dot color */
    .pov-dot[b-ge5ccfplq8]  svg {
        fill: currentColor;
        color: inherit;
    }

.pov-stage.active .pov-stage-label[b-ge5ccfplq8] {
    font-weight: 700;
    color: #2b2c33;
}

.pov-stage-label[b-ge5ccfplq8] {
    font-size: 0.8rem;
    text-align: center;
    max-width: 150px;
}

/* ---------- fields ---------- */

.pov-fields[b-ge5ccfplq8] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.75rem 1rem;
}

.pov-memo-switch[b-ge5ccfplq8] {
    display: flex;
    justify-content: flex-end;
    margin-top: 0.25rem;
}

@media (max-width: 599.98px) {
    .pov-fields[b-ge5ccfplq8] {
        grid-template-columns: 1fr;
    }

    .pov-stage-label[b-ge5ccfplq8] {
        font-size: 0.72rem;
    }
}
/* /Components/Islands/RackDialog.razor.rz.scp.css */
.rd-body[b-pwa7u5gzb5] {
    min-height: 320px;
}

.rd-selects[b-pwa7u5gzb5] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.75rem 1rem;
    margin-bottom: 1rem;
}

.rd-lookup-head[b-pwa7u5gzb5] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    flex-wrap: wrap;
    margin-bottom: 0.5rem;
}

    .rd-lookup-head h4[b-pwa7u5gzb5] {
        margin: 0;
        font-size: 1rem;
        font-weight: 600;
    }

    .rd-lookup-head[b-pwa7u5gzb5]  .mud-input-control {
        max-width: 340px;
        flex: 1 1 240px;
    }

.rd-assigned-title[b-pwa7u5gzb5] {
    margin: 0 0 0.5rem;
    font-size: 1rem;
    font-weight: 600;
}

.rd-empty[b-pwa7u5gzb5] {
    color: #8a8d9c;
    margin: 0.5rem 0;
}

@media (max-width: 599.98px) {
    .rd-selects[b-pwa7u5gzb5] {
        grid-template-columns: 1fr;
    }
}
/* /Components/Islands/RackSystemIsland.razor.rz.scp.css */
.rack-toolbar[b-rde1nhgkdx] {
    max-width: 480px;
    margin-bottom: 1rem;
}

.rack-actions[b-rde1nhgkdx] {
    display: flex;
    justify-content: center;
    gap: 0.4rem;
    flex-wrap: wrap;
}
/* /Components/Islands/RevocationIsland.razor.rz.scp.css */
.rv-panel[b-0i4764sp5r] {
    background: #fff;
    border: 1px solid #e3e4ec;
    border-radius: 10px;
    padding: 1rem 1.2rem;
    margin-bottom: 1rem;
    max-width: 860px;
}

.rv-title[b-0i4764sp5r] {
    font-size: 1.05rem;
    font-weight: 600;
    margin: 0 0 0.75rem;
}

.rv-grid[b-0i4764sp5r] {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1.2fr);
    gap: 1rem;
}

.rv-status[b-0i4764sp5r] {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

.rv-form[b-0i4764sp5r] {
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
}

.rv-field[b-0i4764sp5r] {
    display: flex;
    flex-direction: column;
}

    .rv-field small[b-0i4764sp5r] {
        color: #8a8d9c;
        font-size: 0.75rem;
    }

    .rv-field span[b-0i4764sp5r] {
        font-weight: 600;
        overflow-wrap: anywhere;
    }

.rv-actions[b-0i4764sp5r] {
    display: flex;
    gap: 0.5rem;
    flex-wrap: wrap;
}

.v-blue[b-0i4764sp5r] {
    color: var(--brand-light);
}

.v-red[b-0i4764sp5r] {
    color: #d32f2f;
}

@media (max-width: 699.98px) {
    .rv-grid[b-0i4764sp5r] {
        grid-template-columns: 1fr;
    }
}
/* /Components/Islands/ShipMethodDialog.razor.rz.scp.css */
.cd-fields[b-dh5577ch9h] {
    display: flex;
    flex-direction: column;
    gap: 0.9rem;
    padding-top: 0.25rem;
}

.lv-switches[b-dh5577ch9h] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    flex-wrap: wrap;
}
/* /Components/Islands/ShippingCarriersIsland.razor.rz.scp.css */
.sc-wrap[b-ug1qpa32y1] {
    max-width: 900px;
}

.sc-head[b-ug1qpa32y1] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 0.4rem;
}

.chg-section-title[b-ug1qpa32y1] {
    background: var(--brand);
    color: #fff;
    font-size: 0.8rem;
    font-weight: 600;
    letter-spacing: 0.04em;
    border-radius: 6px;
    padding: 0.35rem 0.8rem;
    display: block;
    width: fit-content;
    min-width: 150px;
}

.sc-methods-head[b-ug1qpa32y1] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 0.4rem;
}
/* /Components/Islands/SlabCutIsland.razor.rz.scp.css */
.sc-grid[b-57hqlu9kkb] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 1rem;
}

    .sc-grid .panel[b-57hqlu9kkb] {
        margin-bottom: 0;
    }

.sc-head[b-57hqlu9kkb] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin-bottom: 0.75rem;
}

    .sc-head .panel-title[b-57hqlu9kkb] {
        margin: 0;
    }

.sc-buttons[b-57hqlu9kkb] {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: flex-start;
    gap: 0.75rem;
}

.sc-hint[b-57hqlu9kkb] {
    display: block;
    color: #8a8d9c;
    margin-top: 0.4rem;
}

.sc-results[b-57hqlu9kkb] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.75rem 1rem;
}

.sc-canvas-wrap[b-57hqlu9kkb] {
    margin: 1rem 0 3rem;
}

    .sc-canvas-wrap canvas[b-57hqlu9kkb] {
        border: 2px solid #000;
        background: #fff;
        max-width: 100%;
        cursor: pointer;
    }

@media (max-width: 767.98px) {
    .sc-grid[b-57hqlu9kkb] {
        grid-template-columns: 1fr;
    }

    .sc-results[b-57hqlu9kkb] {
        grid-template-columns: 1fr;
    }
}
/* /Components/Islands/SlabInventoryIsland.razor.rz.scp.css */
.slab-toolbar[b-yp03034xcb] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.5rem 1rem;
    margin-bottom: 1rem;
}

.slab-category[b-yp03034xcb] {
    flex: 0 1 260px;
    min-width: 200px;
}

.slab-search[b-yp03034xcb] {
    flex: 1 1 280px;
    max-width: 480px;
}

.slab-empty[b-yp03034xcb],
.slab-loading[b-yp03034xcb] {
    display: flex;
    justify-content: center;
    padding: 3rem 1rem;
    background: #fff;
    border: 1px solid #e3e4ec;
    border-radius: 10px;
}

.slab-none[b-yp03034xcb] {
    color: #8a8d9c;
}

.slab-group[b-yp03034xcb] {
    background: #fff;
    border: 1px solid #e3e4ec;
    border-radius: 10px;
    padding: 0.6rem 1rem;
    margin-bottom: 0.75rem;
}

    .slab-group summary[b-yp03034xcb] {
        cursor: pointer;
        list-style: none;
        display: flex;
        align-items: center;
        gap: 0.5rem;
    }

        .slab-group summary[b-yp03034xcb]::-webkit-details-marker {
            display: none;
        }

        .slab-group summary[b-yp03034xcb]::after {
            content: "";
            width: 18px;
            height: 18px;
            background-color: #6b6e80;
            -webkit-mask: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M7.41 8.59 12 13.17l4.59-4.58L18 10l-6 6-6-6z"/></svg>') center / contain no-repeat;
            mask: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M7.41 8.59 12 13.17l4.59-4.58L18 10l-6 6-6-6z"/></svg>') center / contain no-repeat;
            transition: transform 0.15s;
        }

    .slab-group[open] summary[b-yp03034xcb]::after {
        transform: rotate(180deg);
    }

    .slab-group .table-scroll[b-yp03034xcb] {
        margin-top: 0.6rem;
    }
/* /Components/Islands/UserInfoDialog.razor.rz.scp.css */
.ui-grid[b-hzucubbc6y] {
    display: grid;
    grid-template-columns: repeat(12, minmax(0, 1fr));
    gap: 0.85rem 0.8rem;
}

.g-full[b-hzucubbc6y] { grid-column: 1 / -1; }
.g-3[b-hzucubbc6y] { grid-column: span 3; }
.g-4[b-hzucubbc6y] { grid-column: span 4; }
.g-5[b-hzucubbc6y] { grid-column: span 5; }
.g-6[b-hzucubbc6y] { grid-column: span 6; }
.g-8[b-hzucubbc6y] { grid-column: span 8; }
.g-9[b-hzucubbc6y] { grid-column: span 9; }

@media (max-width: 699.98px) {
    .g-3[b-hzucubbc6y], .g-4[b-hzucubbc6y], .g-5[b-hzucubbc6y] {
        grid-column: span 6;
    }

    .g-6[b-hzucubbc6y], .g-8[b-hzucubbc6y], .g-9[b-hzucubbc6y] {
        grid-column: 1 / -1;
    }
}
/* /Components/Islands/UserListIsland.razor.rz.scp.css */
.ul-toolbar[b-0gi6gt0iix] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: flex-end;
    gap: 0.5rem 1rem;
    margin-bottom: 0.75rem;
}

.ul-search[b-0gi6gt0iix] {
    flex: 1 1 280px;
    max-width: 420px;
}

.ul-actions[b-0gi6gt0iix] {
    display: flex;
    gap: 0.35rem;
    justify-content: flex-end;
}
/* /Components/Layout/AuthLayout.razor.rz.scp.css */
.auth-shell[b-8654q9tvar] {
    min-height: 100dvh;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 1.75rem;
    padding: 1.5rem 1rem;
    background: #f2f4f8;
}

.auth-logo[b-8654q9tvar] {
    width: 150px;
    height: auto;
}

.auth-version[b-8654q9tvar] {
    color: #9094a6;
    font-size: 0.8rem;
}
/* /Components/Layout/MainLayout.razor.rz.scp.css */
.page[b-cp6jkpme3j] {
    min-height: 100dvh;
    display: grid;
    grid-template-rows: auto 1fr;
    grid-template-columns: 250px 1fr;
    grid-template-areas:
        "topbar topbar"
        "sidebar content";
    background-color: #f4f6f9;
}

.nav-toggle[b-cp6jkpme3j] {
    display: none;
}

/* ---------- Top bar ---------- */

.topbar[b-cp6jkpme3j] {
    grid-area: topbar;
    min-width: 0; /* grid item: never let the bar's intrinsic width widen the page column */
    position: sticky;
    top: 0;
    z-index: 100;
    display: flex;
    align-items: center;
    gap: 0.75rem;
    height: 56px;
    padding: 0 1rem;
    background: linear-gradient(90deg, #093579 0%, var(--brand) 55%, #1256b8 100%);
    color: #fff;
    box-shadow: 0 1px 4px rgba(0, 0, 0, 0.3);
}

.brand[b-cp6jkpme3j] {
    display: flex;
    align-items: center;
    gap: 0.6rem;
    color: #fff;
    text-decoration: none;
}

.brand-logo[b-cp6jkpme3j] {
    width: 30px;
    height: 30px;
    display: block;
}

.brand-text[b-cp6jkpme3j] {
    font-size: 1.1rem;
    font-weight: 600;
    letter-spacing: 0.08em;
}

.env-chip[b-cp6jkpme3j] {
    background: var(--accent);
    color: #fff;
    font-size: 0.65rem;
    font-weight: 700;
    letter-spacing: 0.06em;
    border-radius: 4px;
    padding: 0.15rem 0.4rem;
}

/* ---------- global search (old AppBar SearchBox) ---------- */

.topbar-search[b-cp6jkpme3j] {
    flex: 1 1 auto;
    min-width: 0; /* let it shrink on narrow screens instead of overflowing the bar */
    display: flex;
    align-items: center;
    gap: 0.5rem;
    max-width: 460px;
    margin: 0 auto;
    background: rgba(255, 255, 255, 0.16);
    border: 1px solid rgba(255, 255, 255, 0.28);
    border-radius: 8px;
    padding: 0.3rem 0.7rem;
    transition: background 0.15s, border-color 0.15s;
}

    .topbar-search:focus-within[b-cp6jkpme3j] {
        background: rgba(255, 255, 255, 0.94);
        border-color: #fff;
    }

    .topbar-search .search-svg[b-cp6jkpme3j] {
        width: 18px;
        height: 18px;
        opacity: 0.85;
        flex: 0 0 auto;
    }

    .topbar-search:focus-within .search-svg[b-cp6jkpme3j] {
        color: var(--brand);
    }

    .topbar-search input[b-cp6jkpme3j] {
        flex: 1 1 0;
        width: 0; /* kill the input's ~220px intrinsic width (size=20 default) - flex-grow sizes it */
        min-width: 0;
        background: transparent;
        border: 0;
        outline: none;
        color: #fff;
        font-size: 0.9rem;
        font-family: inherit;
    }

        .topbar-search input[b-cp6jkpme3j]::placeholder {
            color: rgba(255, 255, 255, 0.75);
        }

    .topbar-search:focus-within input[b-cp6jkpme3j] {
        color: #2b2c33;
    }

        .topbar-search:focus-within input[b-cp6jkpme3j]::placeholder {
            color: #8a8d9c;
        }

.topbar-right[b-cp6jkpme3j] {
    margin-left: auto;
    display: flex;
    align-items: center;
    gap: 0.75rem;
}

/* ---------- YouTube-style account menu ---------- */

.account-menu[b-cp6jkpme3j] {
    position: relative;
}

    .account-menu > summary[b-cp6jkpme3j] {
        list-style: none;
        cursor: pointer;
    }

        .account-menu > summary[b-cp6jkpme3j]::-webkit-details-marker {
            display: none;
        }

.avatar[b-cp6jkpme3j] {
    width: 36px;
    height: 36px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    background: #fff;
    color: var(--brand);
    font-size: 0.85rem;
    font-weight: 700;
    letter-spacing: 0.02em;
    user-select: none;
}

.account-menu > summary.avatar:hover[b-cp6jkpme3j] {
    box-shadow: 0 0 0 3px rgba(255, 255, 255, 0.25);
}

.account-menu[open] > summary.avatar[b-cp6jkpme3j] {
    box-shadow: 0 0 0 3px rgba(255, 255, 255, 0.35);
}

.avatar-lg[b-cp6jkpme3j] {
    width: 44px;
    height: 44px;
    font-size: 1rem;
    background: var(--brand);
    color: #fff;
    flex: 0 0 auto;
}

.account-panel[b-cp6jkpme3j] {
    position: absolute;
    top: calc(100% + 10px);
    right: 0;
    z-index: 130;
    min-width: 270px;
    background: #fff;
    color: #2b2c33;
    border: 1px solid #e3e4ec;
    border-radius: 12px;
    box-shadow: 0 8px 28px rgba(23, 43, 99, 0.22);
    padding: 0.5rem 0;
}

.account-head[b-cp6jkpme3j] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    padding: 0.6rem 1rem;
}

.account-id[b-cp6jkpme3j] {
    display: flex;
    flex-direction: column;
    min-width: 0;
}

.account-name[b-cp6jkpme3j] {
    font-weight: 600;
    font-size: 0.95rem;
}

.account-email[b-cp6jkpme3j] {
    font-size: 0.8rem;
    color: #6b6e80;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    max-width: 210px;
}

.account-sep[b-cp6jkpme3j] {
    height: 1px;
    background: #ecedf3;
    margin: 0.35rem 0;
}

.account-item[b-cp6jkpme3j] {
    display: flex;
    align-items: center;
    gap: 0.7rem;
    width: 100%;
    padding: 0.55rem 1rem;
    font-size: 0.9rem;
    font-family: inherit;
    color: #2b2c33;
    text-decoration: none;
    background: none;
    border: 0;
    cursor: pointer;
    text-align: left;
}

    .account-item:hover[b-cp6jkpme3j] {
        background: #f2f5fa;
    }

    .account-item svg[b-cp6jkpme3j] {
        width: 20px;
        height: 20px;
        color: #55586a;
        flex: 0 0 auto;
    }

/* Amazon-style cart shortcut with count badge */
.cart-link[b-cp6jkpme3j] {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 42px;
    height: 42px;
    color: #fff;
    border-radius: 8px;
    text-decoration: none;
}

    .cart-link:hover[b-cp6jkpme3j] {
        background: rgba(255, 255, 255, 0.15);
    }

.cart-svg[b-cp6jkpme3j] {
    width: 26px;
    height: 26px;
}

.cart-count[b-cp6jkpme3j] {
    position: absolute;
    top: 1px;
    right: 0;
    min-width: 18px;
    height: 18px;
    padding: 0 4px;
    box-sizing: border-box;
    display: flex;
    align-items: center;
    justify-content: center;
    background: var(--accent);
    color: #fff;
    font-size: 0.7rem;
    font-weight: 700;
    border-radius: 999px;
    line-height: 1;
}

.logout-form[b-cp6jkpme3j] {
    margin: 0;
}

/* ---------- Brand as nav toggle (mobile/tablet only; desktop keeps the plain link) ---------- */

.brand-toggle[b-cp6jkpme3j] {
    display: none;
    cursor: pointer;
    padding: 0.25rem 0.45rem;
    border-radius: 6px;
    -webkit-tap-highlight-color: transparent;
}

    .brand-toggle:hover[b-cp6jkpme3j] {
        background: rgba(255, 255, 255, 0.15);
    }

.nav-toggle:checked ~ .topbar .brand-toggle[b-cp6jkpme3j] {
    background: rgba(255, 255, 255, 0.18);
}

/* ---------- Sidebar ---------- */

.sidebar[b-cp6jkpme3j] {
    grid-area: sidebar;
    display: flex;
    flex-direction: column;
    background: #fff;
    border-right: 1px solid #e3e4ec;
    overflow-y: auto;
}

.sidebar-footer[b-cp6jkpme3j] {
    margin-top: auto;
    padding: 0.9rem 1.3rem 0.6rem;
    font-size: 0.75rem;
    color: #9094a6;
}

.backdrop[b-cp6jkpme3j] {
    display: none;
}

/* ---------- Content ---------- */

.content[b-cp6jkpme3j] {
    grid-area: content;
    padding: 1.25rem 1.5rem;
    min-width: 0; /* allow children (tables/grids) to shrink instead of overflowing */
}

.has-footer .content[b-cp6jkpme3j] {
    padding-bottom: calc(var(--footer-h) + 1.25rem);
}

.has-footer .sidebar[b-cp6jkpme3j] {
    padding-bottom: var(--footer-h);
}

/* ---------- Fixed supplier footer bar (internal users) ---------- */

.supplier-bar[b-cp6jkpme3j] {
    position: fixed;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 95;
    height: var(--footer-h);
    display: flex;
    align-items: center;
    justify-content: flex-end;
    padding: 0 1rem;
    background: linear-gradient(90deg, #093579 0%, var(--brand) 55%, #1256b8 100%);
    box-shadow: 0 -1px 4px rgba(0, 0, 0, 0.25);
}

.supplier-form[b-cp6jkpme3j] {
    display: flex;
    align-items: center;
    gap: 0.6rem;
    margin: 0;
}

    .supplier-form label[b-cp6jkpme3j] {
        color: #fff;
        font-size: 0.85rem;
        font-weight: 500;
        letter-spacing: 0.03em;
    }

    .supplier-form select[b-cp6jkpme3j] {
        width: min(300px, 60vw);
        padding: 0.35rem 0.6rem;
        font-size: 0.9rem;
        font-family: inherit;
        border: 1px solid #c9cbd8;
        border-radius: 6px;
        background: #fff;
    }

        .supplier-form select:focus[b-cp6jkpme3j] {
            outline: none;
            border-color: var(--accent);
            box-shadow: 0 0 0 3px rgba(239, 108, 0, 0.25);
        }

        .supplier-form select:disabled[b-cp6jkpme3j] {
            background: #dfe2ec;
            color: #7a7d8f;
            cursor: not-allowed;
        }

/* ---------- Mobile ---------- */

@media (max-width: 959.98px) {
    .page[b-cp6jkpme3j] {
        grid-template-columns: 1fr;
        grid-template-areas:
            "topbar"
            "content";
    }

    .brand-link[b-cp6jkpme3j] {
        display: none;
    }

    .brand-toggle[b-cp6jkpme3j] {
        display: flex;
    }

    .brand-text[b-cp6jkpme3j] {
        font-size: 1rem;
    }

    .sidebar[b-cp6jkpme3j] {
        position: fixed;
        top: 56px;
        bottom: 0;
        left: 0;
        width: 272px;
        max-width: 85vw;
        z-index: 90;
        transform: translateX(-100%);
        transition: transform 0.2s ease;
        box-shadow: 2px 0 8px rgba(0, 0, 0, 0.15);
    }

    .nav-toggle:checked ~ .sidebar[b-cp6jkpme3j] {
        transform: translateX(0);
    }

    .nav-toggle:checked ~ .backdrop[b-cp6jkpme3j] {
        display: block;
        position: fixed;
        inset: 56px 0 0 0;
        z-index: 80;
        background: rgba(0, 0, 0, 0.35);
        cursor: pointer;
    }

    .content[b-cp6jkpme3j] {
        padding: 1rem 0.875rem;
    }

    .supplier-bar[b-cp6jkpme3j] {
        justify-content: center;
    }
}

/* ---------- Error UI (template default) ---------- */

#blazor-error-ui[b-cp6jkpme3j] {
    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-cp6jkpme3j] {
        cursor: pointer;
        position: absolute;
        right: 0.75rem;
        top: 0.5rem;
    }

@media (max-width: 767.98px) {
    /* tighten the bar so logo-toggle + search + cart + avatar fit a phone */
    .topbar[b-cp6jkpme3j] {
        gap: 0.45rem;
        padding: 0 0.6rem;
    }

    .brand-text[b-cp6jkpme3j] {
        display: none; /* logo + TEST chip stay */
    }

    .brand[b-cp6jkpme3j] {
        flex: 0 0 auto;
    }

    .topbar-right[b-cp6jkpme3j] {
        gap: 0.4rem;
    }

    .cart-link[b-cp6jkpme3j] {
        width: 38px;
        height: 38px;
    }

    .topbar-search[b-cp6jkpme3j] {
        margin: 0 0.25rem;
        padding: 0.22rem 0.55rem;
    }
}
/* /Components/Layout/NavMenu.razor.rz.scp.css */
.nav-menu[b-z84xqop85d] {
    display: flex;
    flex-direction: column;
    padding: 0.75rem 0.6rem 0.4rem;
}

/* ---------- Links ---------- */

[b-z84xqop85d] .nav-item {
    display: flex;
    align-items: center;
    gap: 0.6rem;
    padding: 0.55rem 0.8rem;
    margin-bottom: 2px;
    border-radius: 6px;
    color: #3a3b45;
    font-size: 0.95rem;
    text-decoration: none;
    transition: background 0.12s;
}

    [b-z84xqop85d] .nav-item:hover {
        background: #eef0f8;
    }

    [b-z84xqop85d] .nav-item.active {
        background: var(--brand-soft);
        color: var(--brand-dark);
        font-weight: 500;
    }

[b-z84xqop85d] .nav-svg {
    width: 1.15rem;
    height: 1.15rem;
    flex-shrink: 0;
    opacity: 0.75;
}

[b-z84xqop85d] .nav-item.active .nav-svg {
    opacity: 1;
}

/* ---------- Collapsible groups ---------- */

.nav-group[b-z84xqop85d] {
    margin-bottom: 2px;
}

    .nav-group summary[b-z84xqop85d] {
        display: flex;
        align-items: center;
        gap: 0.6rem;
        padding: 0.55rem 0.8rem;
        border-radius: 6px;
        color: #3a3b45;
        font-size: 0.95rem;
        cursor: pointer;
        user-select: none;
        list-style: none;
        transition: background 0.12s;
    }

        .nav-group summary[b-z84xqop85d]::-webkit-details-marker {
            display: none;
        }

        .nav-group summary:hover[b-z84xqop85d] {
            background: #eef0f8;
        }

        .nav-group summary span[b-z84xqop85d] {
            flex: 1;
        }

.nav-chev[b-z84xqop85d] {
    width: 1.1rem;
    height: 1.1rem;
    opacity: 0.55;
    transition: transform 0.15s;
}

.nav-group[open] > summary .nav-chev[b-z84xqop85d] {
    transform: rotate(180deg);
}

.nav-group[open] > summary[b-z84xqop85d] {
    color: var(--brand-dark);
    font-weight: 500;
}

    .nav-group[open] > summary .nav-svg[b-z84xqop85d] {
        opacity: 1;
    }

.nav-sub[b-z84xqop85d] {
    border-left: 2px solid #e3e4ec;
    margin: 0.15rem 0 0.35rem 1.35rem;
    padding-left: 0.35rem;
}

    [b-z84xqop85d] .nav-sub .nav-item {
        padding: 0.42rem 0.7rem;
        font-size: 0.9rem;
    }

.nav-divider[b-z84xqop85d] {
    height: 1px;
    background: #eef0f4;
    margin: 0.3rem 0.5rem;
}
/* /Components/Layout/ReconnectModal.razor.rz.scp.css */
.components-reconnect-first-attempt-visible[b-lcwkwhx4bw],
.components-reconnect-repeated-attempt-visible[b-lcwkwhx4bw],
.components-reconnect-failed-visible[b-lcwkwhx4bw],
.components-pause-visible[b-lcwkwhx4bw],
.components-resume-failed-visible[b-lcwkwhx4bw],
.components-rejoining-animation[b-lcwkwhx4bw] {
    display: none;
}

#components-reconnect-modal.components-reconnect-show .components-reconnect-first-attempt-visible[b-lcwkwhx4bw],
#components-reconnect-modal.components-reconnect-show .components-rejoining-animation[b-lcwkwhx4bw],
#components-reconnect-modal.components-reconnect-paused .components-pause-visible[b-lcwkwhx4bw],
#components-reconnect-modal.components-reconnect-resume-failed .components-resume-failed-visible[b-lcwkwhx4bw],
#components-reconnect-modal.components-reconnect-retrying[b-lcwkwhx4bw],
#components-reconnect-modal.components-reconnect-retrying .components-reconnect-repeated-attempt-visible[b-lcwkwhx4bw],
#components-reconnect-modal.components-reconnect-retrying .components-rejoining-animation[b-lcwkwhx4bw],
#components-reconnect-modal.components-reconnect-failed[b-lcwkwhx4bw],
#components-reconnect-modal.components-reconnect-failed .components-reconnect-failed-visible[b-lcwkwhx4bw] {
    display: block;
}


#components-reconnect-modal[b-lcwkwhx4bw] {
    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-lcwkwhx4bw 0.5s both;
    &[open]

{
    animation: components-reconnect-modal-slideUp-b-lcwkwhx4bw 1.5s cubic-bezier(.05, .89, .25, 1.02) 0.3s, components-reconnect-modal-fadeInOpacity-b-lcwkwhx4bw 0.5s ease-in-out 0.3s;
    animation-fill-mode: both;
}

}

#components-reconnect-modal[b-lcwkwhx4bw]::backdrop {
    background-color: rgba(0, 0, 0, 0.4);
    animation: components-reconnect-modal-fadeInOpacity-b-lcwkwhx4bw 0.5s ease-in-out;
    opacity: 1;
}

@keyframes components-reconnect-modal-slideUp-b-lcwkwhx4bw {
    0% {
        transform: translateY(30px) scale(0.95);
    }

    100% {
        transform: translateY(0);
    }
}

@keyframes components-reconnect-modal-fadeInOpacity-b-lcwkwhx4bw {
    0% {
        opacity: 0;
    }

    100% {
        opacity: 1;
    }
}

@keyframes components-reconnect-modal-fadeOutOpacity-b-lcwkwhx4bw {
    0% {
        opacity: 1;
    }

    100% {
        opacity: 0;
    }
}

.components-reconnect-container[b-lcwkwhx4bw] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 1rem;
}

#components-reconnect-modal p[b-lcwkwhx4bw] {
    margin: 0;
    text-align: center;
}

#components-reconnect-modal button[b-lcwkwhx4bw] {
    border: 0;
    background-color: #6b9ed2;
    color: white;
    padding: 4px 24px;
    border-radius: 4px;
}

    #components-reconnect-modal button:hover[b-lcwkwhx4bw] {
        background-color: #3b6ea2;
    }

    #components-reconnect-modal button:active[b-lcwkwhx4bw] {
        background-color: #6b9ed2;
    }

.components-rejoining-animation[b-lcwkwhx4bw] {
    position: relative;
    width: 80px;
    height: 80px;
}

    .components-rejoining-animation div[b-lcwkwhx4bw] {
        position: absolute;
        border: 3px solid #0087ff;
        opacity: 1;
        border-radius: 50%;
        animation: components-rejoining-animation-b-lcwkwhx4bw 1.5s cubic-bezier(0, 0.2, 0.8, 1) infinite;
    }

        .components-rejoining-animation div:nth-child(2)[b-lcwkwhx4bw] {
            animation-delay: -0.5s;
        }

@keyframes components-rejoining-animation-b-lcwkwhx4bw {
    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/Auth/ForgotPassword.razor.rz.scp.css */
.fp-card[b-54dp6jk32q] {
    background: #fff;
    border-radius: 12px;
    box-shadow: 0 10px 30px rgba(23, 43, 99, 0.12);
    padding: 2rem 2.25rem;
    width: 100%;
    max-width: 430px;
}

.fp-title[b-54dp6jk32q] {
    margin: 0 0 0.75rem;
    font-size: 1.35rem;
    color: #2b2c33;
}

.fp-note[b-54dp6jk32q] {
    color: #6b6e80;
    font-size: 0.92rem;
    margin: 0 0 1.25rem;
}

.fp-submit[b-54dp6jk32q] {
    width: 100%;
    margin-top: 0.5rem;
}

.fp-back[b-54dp6jk32q] {
    display: inline-block;
    margin-top: 1.1rem;
    font-size: 0.9rem;
    color: var(--brand);
    text-decoration: none;
}

    .fp-back:hover[b-54dp6jk32q] {
        text-decoration: underline;
    }
/* /Components/Pages/Auth/Login.razor.rz.scp.css */
.login-wrap[b-mhc74ci5qf] {
    width: 100%;
    display: flex;
    justify-content: center;
}

[b-mhc74ci5qf] .login-card {
    display: grid;
    grid-template-columns: 1.15fr 1fr;
    width: min(680px, 100%);
    min-height: 380px;
    background: #fff;
    border-radius: 10px;
    overflow: hidden;
    box-shadow: 0 12px 34px rgba(21, 39, 75, 0.16);
}

/* ---------- Left: form ---------- */

[b-mhc74ci5qf] .login-left {
    padding: 2.4rem 2.2rem 2rem;
    display: flex;
    flex-direction: column;
}

[b-mhc74ci5qf] .login-title {
    font-size: 1.55rem;
    font-weight: 600;
    color: #23252d;
    margin: 0 0 1.6rem;
}

[b-mhc74ci5qf] .lf-field {
    margin-bottom: 1.1rem;
}

    [b-mhc74ci5qf] .lf-field label {
        display: block;
        font-size: 0.85rem;
        color: #8a8d9c;
        margin-bottom: 0.35rem;
    }

    [b-mhc74ci5qf] .lf-field input {
        width: 100%;
        box-sizing: border-box;
        padding: 0.6rem 0.7rem;
        font-size: 0.95rem;
        font-family: inherit;
        color: #23252d;
        background: #eef3fb;
        border: none;
        border-bottom: 2px solid #d7dce6;
        border-radius: 4px 4px 0 0;
        transition: border-color 0.15s, background 0.15s;
    }

        [b-mhc74ci5qf] .lf-field input:focus {
            outline: none;
            border-bottom-color: var(--brand);
            background: #e8effb;
        }

[b-mhc74ci5qf] .lf-remember {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    font-size: 0.85rem;
    color: #6b6e80;
    margin-top: 0.25rem;
    cursor: pointer;
}

/* ---------- Right: blue action panel ---------- */

[b-mhc74ci5qf] .login-right {
    background: #1976d2;
    color: #fff;
    padding: 2.4rem 1.9rem 1.5rem;
    display: flex;
    flex-direction: column;
    align-items: center;
}

[b-mhc74ci5qf] .login-btn {
    width: 100%;
    padding: 0.75rem 1rem;
    background: #1b2430;
    color: #fff;
    border: none;
    border-radius: 6px;
    cursor: pointer;
    font-family: inherit;
    font-size: 1rem;
    font-weight: 600;
    transition: background 0.15s;
}

    [b-mhc74ci5qf] .login-btn:hover {
        background: #101720;
    }

[b-mhc74ci5qf] .login-forgot {
    color: #fff;
    font-size: 0.9rem;
    margin-top: 1rem;
    text-decoration: none;
    opacity: 0.95;
}

    [b-mhc74ci5qf] .login-forgot:hover {
        text-decoration: underline;
    }

[b-mhc74ci5qf] .login-bottom {
    margin-top: auto;
    text-align: center;
    padding-top: 2rem;
}

[b-mhc74ci5qf] .login-tagline {
    font-size: 0.85rem;
    opacity: 0.95;
    margin-bottom: 0.7rem;
}

[b-mhc74ci5qf] .login-icons {
    display: flex;
    justify-content: center;
    gap: 1.3rem;
    margin-bottom: 0.6rem;
}

    [b-mhc74ci5qf] .login-icons svg {
        width: 30px;
        height: 30px;
    }

[b-mhc74ci5qf] .login-copy {
    font-size: 0.78rem;
    opacity: 0.85;
}

/* ---------- Mobile ---------- */

@media (max-width: 639.98px) {
    [b-mhc74ci5qf] .login-card {
        grid-template-columns: 1fr;
        min-height: 0;
    }

    [b-mhc74ci5qf] .login-left {
        padding: 1.8rem 1.5rem 1.2rem;
    }

    [b-mhc74ci5qf] .login-right {
        padding: 1.5rem 1.5rem 1.2rem;
    }

    [b-mhc74ci5qf] .login-bottom {
        padding-top: 1.2rem;
    }
}
/* /Components/Pages/Auth/ResetPassword.razor.rz.scp.css */
.rp-card[b-xrvvf5xvnj] {
    background: #fff;
    border-radius: 12px;
    box-shadow: 0 10px 30px rgba(23, 43, 99, 0.12);
    padding: 2rem 2.25rem;
    width: 100%;
    max-width: 430px;
}

.rp-title[b-xrvvf5xvnj] {
    margin: 0 0 1rem;
    font-size: 1.35rem;
    color: #2b2c33;
}

.rp-submit[b-xrvvf5xvnj] {
    display: inline-block;
    width: 100%;
    margin-top: 0.5rem;
    text-align: center;
    text-decoration: none;
}

.rp-back[b-xrvvf5xvnj] {
    display: inline-block;
    margin-top: 1.1rem;
    font-size: 0.9rem;
    color: var(--brand);
    text-decoration: none;
}

    .rp-back:hover[b-xrvvf5xvnj] {
        text-decoration: underline;
    }
/* /Components/Pages/Management/UpdateInformation.razor.rz.scp.css */
.profile-wrap[b-3ghces01f1] {
    max-width: 760px;
    margin: 0 auto;
}

.profile-panel[b-3ghces01f1] {
    max-width: none;
    text-align: center;
}

.profile-img[b-3ghces01f1] {
    width: 150px;
    height: auto;
    margin: 0.25rem auto 1rem;
}

.profile-grid[b-3ghces01f1] {
    display: grid;
    grid-template-columns: repeat(6, minmax(0, 1fr));
    gap: 0.9rem 0.8rem;
    text-align: left;
}

    .profile-grid label[b-3ghces01f1] {
        display: block;
        font-size: 0.8rem;
        font-weight: 500;
        color: #6b6e80;
        margin-bottom: 0.25rem;
    }

    .profile-grid[b-3ghces01f1]  input {
        width: 100%;
        box-sizing: border-box;
        padding: 0.5rem 0.7rem;
        font-size: 0.92rem;
        font-family: inherit;
        border: 1px solid #c9cbd8;
        border-radius: 6px;
        transition: border-color 0.15s, box-shadow 0.15s;
    }

        .profile-grid[b-3ghces01f1]  input:focus {
            outline: none;
            border-color: var(--brand);
            box-shadow: 0 0 0 3px rgba(13, 71, 161, 0.15);
        }

.p-full[b-3ghces01f1] { grid-column: 1 / -1; }
.p-half[b-3ghces01f1] { grid-column: span 3; }
.p-wide[b-3ghces01f1] { grid-column: span 4; }
.p-narrow[b-3ghces01f1] { grid-column: span 2; }
.p-third[b-3ghces01f1] { grid-column: span 2; }

.profile-actions[b-3ghces01f1] {
    display: flex;
    justify-content: center;
    gap: 0.75rem;
    margin-top: 1.4rem;
}

@media (max-width: 599.98px) {
    .p-half[b-3ghces01f1], .p-wide[b-3ghces01f1], .p-narrow[b-3ghces01f1], .p-third[b-3ghces01f1] {
        grid-column: 1 / -1;
    }
}
/* /Components/Reports/ChargePie.razor.rz.scp.css */
.pie-wrap[b-fv4cmj7gg1] {
    display: flex;
    align-items: center;
    gap: 1.25rem;
    flex-wrap: wrap;
}

    .pie-wrap svg[b-fv4cmj7gg1] {
        width: 150px;
        height: 150px;
        flex-shrink: 0;
    }

.pie-legend[b-fv4cmj7gg1] {
    display: flex;
    flex-direction: column;
    gap: 0.35rem;
    min-width: 0;
}

.pie-legend-row[b-fv4cmj7gg1] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    font-size: 0.85rem;
}

.pie-dot[b-fv4cmj7gg1] {
    width: 12px;
    height: 12px;
    border-radius: 3px;
    flex-shrink: 0;
}

.pie-label[b-fv4cmj7gg1] {
    color: #4a4c59;
    min-width: 120px;
}

.pie-value[b-fv4cmj7gg1] {
    font-weight: 600;
}

.pie-empty[b-fv4cmj7gg1] {
    color: #9094a6;
    margin: 0;
}
/* /Components/Shared/SearchSelect.razor.rz.scp.css */
.ss-root[b-s8umk7nikl] {
    position: relative;
}

.ss-click[b-s8umk7nikl]  input {
    cursor: pointer;
}

/* transparent click-catcher; sibling of .ss-panel so the panel always paints above it */
.ss-overlay[b-s8umk7nikl] {
    position: fixed;
    inset: 0;
    z-index: 1290;
    background: transparent;
}

.ss-panel[b-s8umk7nikl] {
    position: absolute;
    top: calc(100% + 4px);
    left: 0;
    right: 0;
    z-index: 1300;
    background: #fff;
    border: 1px solid #d9dbe6;
    border-radius: 8px;
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.18);
    max-height: 320px;
    overflow-y: auto;
}

    /* opens upward when there is not enough room below (viewport / supplier bar) */
    .ss-panel.ss-up[b-s8umk7nikl] {
        top: auto;
        bottom: calc(100% + 4px);
        box-shadow: 0 -8px 24px rgba(0, 0, 0, 0.18);
    }

.ss-filter-wrap[b-s8umk7nikl] {
    position: sticky;
    top: 0;
    z-index: 2;
    background: #fff;
    padding: 0.2rem 0.9rem 0.4rem;
    border-bottom: 1px solid #eef0f4;
}

.ss-list[b-s8umk7nikl] {
    padding: 0.25rem 0;
}

.ss-item[b-s8umk7nikl] {
    padding: 0.45rem 1rem;
    font-size: 0.92rem;
    color: #2b2c33;
    cursor: pointer;
    overflow-wrap: anywhere;
}

    .ss-item:hover[b-s8umk7nikl] {
        background: #f1f4fa;
    }

    .ss-item.selected[b-s8umk7nikl] {
        background: var(--brand-soft);
        color: var(--brand);
        font-weight: 500;
    }

.ss-empty[b-s8umk7nikl] {
    padding: 0.7rem 1rem;
    font-size: 0.85rem;
    color: #9094a6;
}
