/* /Components/Layout/EmptyLayout.razor.rz.scp.css */
/* ===========================
   EmptyLayout - Scoped Styles
   Layout without sidebar: just @Body
   Each page handles its own layout/background
   =========================== */

#blazor-error-ui[b-89tozeakzw] {
    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-89tozeakzw] {
        cursor: pointer;
        position: absolute;
        right: 0.75rem;
        top: 0.5rem;
    }
/* /Components/Layout/MainLayout.razor.rz.scp.css */
.page[b-05yy9g4u9y] {
    position: relative;
    display: flex;
    flex-direction: column;
}

main[b-05yy9g4u9y] {
    flex: 1;
}

.sidebar[b-05yy9g4u9y] {
    background-color: #0B243E;
}

.top-row[b-05yy9g4u9y] {
    background-color: #f7f7f7;
    border-bottom: 1px solid #d6d5d5;
    justify-content: flex-end;
    height: 3.5rem;
    display: flex;
    align-items: center;
}

    .top-row .user-info[b-05yy9g4u9y] {
        display: flex;
        align-items: center;
        gap: 0.5rem;
        font-size: 0.9rem;
    }

    .top-row[b-05yy9g4u9y]  a, .top-row[b-05yy9g4u9y]  .btn-link {
        white-space: nowrap;
        margin-left: 1.5rem;
        text-decoration: none;
    }

    .top-row[b-05yy9g4u9y]  a:hover, .top-row[b-05yy9g4u9y]  .btn-link:hover {
        text-decoration: underline;
    }

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

@media (max-width: 640.98px) {
    .top-row[b-05yy9g4u9y] {
        justify-content: space-between;
    }

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

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

    .sidebar[b-05yy9g4u9y] {
        width: 250px;
        height: 100vh;
        position: sticky;
        top: 0;
        transition: width 0.3s ease;
    }

    /* Collapsed sidebar - narrower width */
    .sidebar:has(.nav-scrollable.collapsed)[b-05yy9g4u9y] {
        width: 80px;
    }

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

    .top-row.auth[b-05yy9g4u9y]  a:first-child {
        flex: 1;
        text-align: right;
        width: 0;
    }

    .top-row[b-05yy9g4u9y], article[b-05yy9g4u9y] {
        padding-left: 2rem !important;
        padding-right: 1.5rem !important;
    }
}

#blazor-error-ui[b-05yy9g4u9y] {
    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-05yy9g4u9y] {
        cursor: pointer;
        position: absolute;
        right: 0.75rem;
        top: 0.5rem;
    }
/* /Components/Layout/NavMenu.razor.rz.scp.css */
.navbar-toggler[b-fdyf7lhme5] {
    appearance: none;
    cursor: pointer;
    width: 3.5rem;
    height: 2.5rem;
    color: white;
    position: absolute;
    top: 0.5rem;
    right: 1rem;
    border: 1px solid rgba(255, 255, 255, 0.1);
    border-radius: 0; /* Flat Industrial - no rounded corners */
    background: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3e%3cpath stroke='rgba%28255, 255, 255, 0.55%29' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e") no-repeat center/1.75rem rgba(255, 255, 255, 0.1);
}

.navbar-toggler:checked[b-fdyf7lhme5] {
    background-color: rgba(255, 255, 255, 0.5);
}

.top-row[b-fdyf7lhme5] {
    min-height: 3.5rem;
    background-color: var(--color-primary, #0B243E);
}

.navbar-brand[b-fdyf7lhme5] {
    font-size: 1.1rem;
    color: white !important;
    font-weight: 600;
}

/* Collapse Button Styles */
.btn-collapse[b-fdyf7lhme5] {
    background: transparent;
    border: none;
    color: white;
    cursor: pointer;
    padding: 0.5rem;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: background-color 0.2s ease;
    border-radius: 4px;
}

.btn-collapse:hover[b-fdyf7lhme5] {
    background-color: rgba(255, 255, 255, 0.1);
}

/* Hide collapse button on mobile (when hamburger is visible) */
@media (max-width: 640.98px) {
    .btn-collapse[b-fdyf7lhme5] {
        display: none;
    }
}

/* Menu Group Styles */
.menu-group[b-fdyf7lhme5] {
    display: flex;
    align-items: center;
    width: 100%;
    padding: 12px 16px;
    margin: 4px 0;
    background: transparent;
    border: none;
    cursor: pointer;
    font-weight: 600;
    font-size: 0.95rem;
    color: white !important;
    text-align: left;
    transition: all 0.2s ease;
}

.menu-group:hover[b-fdyf7lhme5] {
    background: rgba(255, 255, 255, 0.1);
}

/* Menu icon styles - 24x24px (updated) */
.menu-icon[b-fdyf7lhme5] {
    display: inline-flex;
    align-items: center;
    margin-right: 12px;
    width: 24px;
    height: 24px;
}

    .menu-icon svg[b-fdyf7lhme5] {
        width: 24px;
        height: 24px;
        stroke: white;
    }

.menu-text[b-fdyf7lhme5] {
    flex: 1;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

/* Menu Items Container */
.menu-items[b-fdyf7lhme5] {
    margin: 0;
    padding: 0;
}

/* Menu Item Styles */
.menu-item[b-fdyf7lhme5] {
    display: block;
    padding: 10px 16px 10px 48px;
    color: #d7d7d7 !important;
    text-decoration: none;
    font-size: 0.9rem;
    transition: all 0.2s ease;
    border-left: 3px solid transparent;
}

    .menu-item:hover[b-fdyf7lhme5] {
        background-color: rgba(255, 255, 255, 0.1);
        color: white !important;
        border-left-color: var(--color-action, #B22222);
    }

    .menu-item.active[b-fdyf7lhme5] {
        background-color: rgba(255, 255, 255, 0.15);
        color: white !important;
        border-left-color: var(--color-action, #B22222);
        font-weight: 600;
    }

.menu-item-text[b-fdyf7lhme5] {
    display: block;
}

/* Folder Styles */
.menu-folder[b-fdyf7lhme5] {
    margin: 0;
}

.menu-subitems[b-fdyf7lhme5] {
    margin-left: 16px;
    border-left: 1px solid rgba(255, 255, 255, 0.1);
}

.menu-subitem[b-fdyf7lhme5] {
    padding-left: 32px;
    font-size: 0.85rem;
}

/* Loading & Error States */
.spinner-border-sm[b-fdyf7lhme5] {
    width: 1rem;
    height: 1rem;
}

.alert[b-fdyf7lhme5] {
    border-radius: 0; /* Flat Industrial */
    font-size: 0.85rem;
}

/* Navigation Item Base */
.nav-item[b-fdyf7lhme5] {
    font-size: 0.9rem;
    padding-bottom: 0.5rem;
}

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

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

/* Scrollable Container */
.nav-scrollable[b-fdyf7lhme5] {
    display: none;
}

.navbar-toggler:checked ~ .nav-scrollable[b-fdyf7lhme5] {
    display: block;
}

/* Desktop: Handle collapsed state */
@media (min-width: 641px) {
    .navbar-toggler[b-fdyf7lhme5] {
        display: none;
    }

    .nav-scrollable[b-fdyf7lhme5] {
        display: block;
        height: calc(100vh - 3.5rem);
        overflow-y: auto;
        /* Custom scrollbar for modern look */
        scrollbar-width: thin;
        scrollbar-color: rgba(255, 255, 255, 0.3) transparent;
    }

        .nav-scrollable[b-fdyf7lhme5]::-webkit-scrollbar {
            width: 6px;
        }

        .nav-scrollable[b-fdyf7lhme5]::-webkit-scrollbar-track {
            background: transparent;
        }

        .nav-scrollable[b-fdyf7lhme5]::-webkit-scrollbar-thumb {
            background-color: rgba(255, 255, 255, 0.3);
            border-radius: 0; /* Flat Industrial */
        }

            .nav-scrollable[b-fdyf7lhme5]::-webkit-scrollbar-thumb:hover {
                background-color: rgba(255, 255, 255, 0.5);
            }

    /* When collapsed, hide menu text and center icons */
    .nav-scrollable.collapsed .menu-text[b-fdyf7lhme5] {
        display: none;
    }

    .nav-scrollable.collapsed .menu-group[b-fdyf7lhme5] {
        justify-content: center;
    }

    .nav-scrollable.collapsed .menu-icon[b-fdyf7lhme5] {
        margin-right: 0;
    }
}

/* Mobile: Always show menu text regardless of collapsed state */
@media (max-width: 640.98px) {
    .menu-text[b-fdyf7lhme5] {
        display: block !important;
    }
}

/* /Components/Layout/ReconnectModal.razor.rz.scp.css */
.components-reconnect-first-attempt-visible[b-9qug7801nb],
.components-reconnect-repeated-attempt-visible[b-9qug7801nb],
.components-reconnect-failed-visible[b-9qug7801nb],
.components-pause-visible[b-9qug7801nb],
.components-resume-failed-visible[b-9qug7801nb],
.components-rejoining-animation[b-9qug7801nb] {
    display: none;
}

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


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

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

}

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

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

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

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

    100% {
        opacity: 1;
    }
}

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

    100% {
        opacity: 0;
    }
}

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

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

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

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

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

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

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

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

@keyframes components-rejoining-animation-b-9qug7801nb {
    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/Common/AgentCreate.razor.rz.scp.css */
/* ===========================
   AgentCreate - Scoped Styles
   Flat Industrial Minimal
   =========================== */

/* Page Container */
.page-container[b-wz2qtrresp] {
    max-width: 1200px;
    margin: 0 auto;
    padding: var(--space-6) var(--space-4);
}

/* Header */
.page-header[b-wz2qtrresp] {
    display: flex;
    align-items: flex-start;
    gap: var(--space-4);
    margin-bottom: var(--space-6);
}

.btn-back[b-wz2qtrresp] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    background: none;
    border: var(--border-width-thin) solid var(--border-color-light);
    color: var(--text-muted);
    text-decoration: none;
    cursor: pointer;
    transition: all var(--transition-fast) var(--transition-ease);
    flex-shrink: 0;
    margin-top: 2px;
}

.btn-back:hover[b-wz2qtrresp] {
    color: var(--color-primary);
    border-color: var(--color-primary);
    background-color: var(--color-gray-50);
    text-decoration: none;
}

.page-header-text[b-wz2qtrresp] {
    flex: 1;
}

.page-title[b-wz2qtrresp] {
    font-size: var(--font-size-2xl);
    font-weight: var(--font-weight-bold);
    color: var(--color-primary);
    display: flex;
    align-items: center;
    gap: var(--space-2);
    margin: 0;
}

.page-title svg[b-wz2qtrresp] {
    color: var(--color-primary);
    flex-shrink: 0;
}

.page-subtitle[b-wz2qtrresp] {
    color: var(--text-muted);
    font-size: var(--font-size-sm);
    margin: var(--space-1) 0 0 0;
}

/* Alert Bars */
.alert-bar[b-wz2qtrresp] {
    display: flex;
    align-items: center;
    gap: var(--space-2);
    padding: var(--space-3) var(--space-4);
    margin-bottom: var(--space-4);
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-medium);
    border-left: var(--border-width-thick) solid;
}

.alert-bar-danger[b-wz2qtrresp] {
    background-color: #fdeded;
    border-left-color: var(--color-danger);
    color: #5f2120;
}

.alert-bar-close[b-wz2qtrresp] {
    margin-left: auto;
    background: none;
    border: none;
    font-size: var(--font-size-lg);
    cursor: pointer;
    color: inherit;
    opacity: 0.6;
    line-height: 1;
}

.alert-bar-close:hover[b-wz2qtrresp] {
    opacity: 1;
}

/* Form Sections */
.form-section[b-wz2qtrresp] {
    margin-bottom: var(--space-6);
    padding: var(--space-6);
    background-color: var(--color-white);
    border: var(--border-width-thin) solid var(--border-color-light);
}

.section-title[b-wz2qtrresp] {
    display: flex;
    align-items: center;
    gap: var(--space-2);
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-semibold);
    color: var(--color-primary);
    text-transform: uppercase;
    letter-spacing: 0.5px;
    margin: 0 0 var(--space-4) 0;
    padding-bottom: var(--space-3);
    border-bottom: var(--border-width-thin) solid var(--border-color-light);
}

.section-title svg[b-wz2qtrresp] {
    color: var(--color-primary);
    opacity: 0.6;
}

/* Form Grid */
.form-grid[b-wz2qtrresp] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
    gap: var(--space-4);
}

.form-group[b-wz2qtrresp] {
    display: flex;
    flex-direction: column;
}

.form-label[b-wz2qtrresp] {
    font-size: var(--font-size-xs);
    font-weight: var(--font-weight-medium);
    color: var(--text-secondary);
    text-transform: uppercase;
    letter-spacing: 0.3px;
    margin-bottom: var(--space-1);
}

.form-control[b-wz2qtrresp] {
    padding: var(--space-2) var(--space-3);
    font-size: var(--font-size-sm);
    color: var(--color-gray-700);
    border: var(--border-width-thin) solid var(--border-color-light);
    background-color: var(--color-white);
    transition: border-color var(--transition-fast) var(--transition-ease);
}

.form-control:focus[b-wz2qtrresp] {
    border-color: var(--color-primary);
    outline: none;
    box-shadow: none;
}

/* Form Actions */
.form-actions[b-wz2qtrresp] {
    display: flex;
    justify-content: flex-end;
    gap: var(--space-3);
    padding: var(--space-4) 0;
    border-top: var(--border-width-thin) solid var(--border-color-light);
}

.form-actions .btn[b-wz2qtrresp] {
    display: inline-flex;
    align-items: center;
    gap: var(--space-2);
    padding: var(--space-2) var(--space-4);
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-medium);
    text-decoration: none;
    cursor: pointer;
}

/* Buttons */
.btn-action[b-wz2qtrresp] {
    display: inline-flex;
    align-items: center;
    gap: var(--space-2);
    padding: var(--space-2) var(--space-4);
    background-color: var(--color-action);
    color: var(--text-on-action);
    border: var(--border-width-thin) solid var(--color-action);
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-medium);
    text-decoration: none;
    cursor: pointer;
    transition: background-color var(--transition-fast) var(--transition-ease),
                box-shadow var(--transition-fast) var(--transition-ease);
}

.btn-action:hover[b-wz2qtrresp] {
    background-color: var(--color-action-hover);
    border-color: var(--color-action-hover);
    color: var(--text-on-action);
    box-shadow: var(--shadow-sm);
}

.btn-outline-primary[b-wz2qtrresp] {
    background: transparent;
    color: var(--color-primary);
    border: var(--border-width-thin) solid var(--color-primary);
}

.btn-outline-primary:hover[b-wz2qtrresp] {
    background-color: var(--color-primary);
    color: var(--text-on-primary);
}

/* Validation */
[b-wz2qtrresp] .validation-message {
    color: var(--color-danger);
    font-size: var(--font-size-xs);
    margin-top: 2px;
}

/* Responsive */
@media (max-width: 768px) {
    .form-grid[b-wz2qtrresp] {
        grid-template-columns: 1fr;
    }

    .form-actions[b-wz2qtrresp] {
        flex-direction: column;
    }
}
/* /Components/Pages/Common/AgentEdit.razor.rz.scp.css */
/* ===========================
   AgentEdit - Scoped Styles
   Flat Industrial Minimal
   =========================== */

/* Page Container */
.page-container[b-iec80r7zdx] {
    max-width: 1200px;
    margin: 0 auto;
    padding: var(--space-6) var(--space-4);
}

/* Header */
.page-header[b-iec80r7zdx] {
    display: flex;
    align-items: flex-start;
    gap: var(--space-4);
    margin-bottom: var(--space-6);
}

.btn-back[b-iec80r7zdx] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    background: none;
    border: var(--border-width-thin) solid var(--border-color-light);
    color: var(--text-muted);
    text-decoration: none;
    cursor: pointer;
    transition: all var(--transition-fast) var(--transition-ease);
    flex-shrink: 0;
    margin-top: 2px;
}

.btn-back:hover[b-iec80r7zdx] {
    color: var(--color-primary);
    border-color: var(--color-primary);
    background-color: var(--color-gray-50);
    text-decoration: none;
}

.page-header-text[b-iec80r7zdx] {
    flex: 1;
}

.page-title[b-iec80r7zdx] {
    font-size: var(--font-size-2xl);
    font-weight: var(--font-weight-bold);
    color: var(--color-primary);
    display: flex;
    align-items: center;
    gap: var(--space-2);
    margin: 0;
}

.page-title svg[b-iec80r7zdx] {
    color: var(--color-primary);
    flex-shrink: 0;
}

.page-subtitle[b-iec80r7zdx] {
    color: var(--text-muted);
    font-size: var(--font-size-sm);
    margin: var(--space-1) 0 0 0;
    display: flex;
    align-items: center;
    gap: var(--space-2);
}

.subtitle-code[b-iec80r7zdx] {
    font-family: var(--font-mono);
    font-size: var(--font-size-xs);
    background-color: var(--color-gray-100);
    padding: 1px var(--space-2);
    color: var(--color-primary);
    opacity: 0.7;
}

/* Alert Bars */
.alert-bar[b-iec80r7zdx] {
    display: flex;
    align-items: center;
    gap: var(--space-2);
    padding: var(--space-3) var(--space-4);
    margin-bottom: var(--space-4);
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-medium);
    border-left: var(--border-width-thick) solid;
}

.alert-bar-success[b-iec80r7zdx] {
    background-color: #edf7ed;
    border-left-color: var(--color-success);
    color: #1e4620;
}

.alert-bar-danger[b-iec80r7zdx] {
    background-color: #fdeded;
    border-left-color: var(--color-danger);
    color: #5f2120;
}

.alert-bar-close[b-iec80r7zdx] {
    margin-left: auto;
    background: none;
    border: none;
    font-size: var(--font-size-lg);
    cursor: pointer;
    color: inherit;
    opacity: 0.6;
    line-height: 1;
}

.alert-bar-close:hover[b-iec80r7zdx] {
    opacity: 1;
}

/* Loading / Empty States */
.loading-state[b-iec80r7zdx] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: var(--space-16) 0;
    color: var(--text-muted);
    gap: var(--space-4);
}

.empty-state[b-iec80r7zdx] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: var(--space-16) 0;
    color: var(--text-muted);
    gap: var(--space-3);
}

.empty-state svg[b-iec80r7zdx] {
    opacity: 0.4;
}

.empty-state-text[b-iec80r7zdx] {
    font-size: var(--font-size-base);
    margin: 0;
}

/* Form Sections */
.form-section[b-iec80r7zdx] {
    margin-bottom: var(--space-6);
    padding: var(--space-6);
    background-color: var(--color-white);
    border: var(--border-width-thin) solid var(--border-color-light);
}

.section-header[b-iec80r7zdx] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: var(--space-4);
}

.section-title[b-iec80r7zdx] {
    display: flex;
    align-items: center;
    gap: var(--space-2);
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-semibold);
    color: var(--color-primary);
    text-transform: uppercase;
    letter-spacing: 0.5px;
    margin: 0 0 var(--space-4) 0;
    padding-bottom: var(--space-3);
    border-bottom: var(--border-width-thin) solid var(--border-color-light);
}

.section-header .section-title[b-iec80r7zdx] {
    margin-bottom: 0;
    padding-bottom: 0;
    border-bottom: none;
}

.section-title svg[b-iec80r7zdx] {
    color: var(--color-primary);
    opacity: 0.6;
}

/* Form Grid */
.form-grid[b-iec80r7zdx] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
    gap: var(--space-4);
}

.form-group[b-iec80r7zdx] {
    display: flex;
    flex-direction: column;
}

.form-group-wide[b-iec80r7zdx] {
    grid-column: 1 / -1;
}

.form-label[b-iec80r7zdx] {
    font-size: var(--font-size-xs);
    font-weight: var(--font-weight-medium);
    color: var(--text-secondary);
    text-transform: uppercase;
    letter-spacing: 0.3px;
    margin-bottom: var(--space-1);
}

.form-control[b-iec80r7zdx] {
    padding: var(--space-2) var(--space-3);
    font-size: var(--font-size-sm);
    color: var(--color-gray-700);
    border: var(--border-width-thin) solid var(--border-color-light);
    background-color: var(--color-white);
    transition: border-color var(--transition-fast) var(--transition-ease);
}

.form-control:focus[b-iec80r7zdx] {
    border-color: var(--color-primary);
    outline: none;
    box-shadow: none;
}

.form-control-static[b-iec80r7zdx] {
    padding: var(--space-2) var(--space-3);
    font-size: var(--font-size-sm);
    color: var(--color-gray-700);
    background-color: var(--color-gray-50);
    border: var(--border-width-thin) solid var(--border-color-light);
    font-weight: var(--font-weight-medium);
}

/* Form Actions */
.form-actions[b-iec80r7zdx] {
    display: flex;
    justify-content: flex-end;
    gap: var(--space-3);
    margin-bottom: var(--space-8);
    padding: var(--space-4) 0;
    border-top: var(--border-width-thin) solid var(--border-color-light);
}

.form-actions .btn[b-iec80r7zdx] {
    display: inline-flex;
    align-items: center;
    gap: var(--space-2);
    padding: var(--space-2) var(--space-4);
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-medium);
    text-decoration: none;
    cursor: pointer;
}

/* Buttons */
.btn-action[b-iec80r7zdx] {
    display: inline-flex;
    align-items: center;
    gap: var(--space-2);
    padding: var(--space-2) var(--space-4);
    background-color: var(--color-action);
    color: var(--text-on-action);
    border: var(--border-width-thin) solid var(--color-action);
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-medium);
    text-decoration: none;
    cursor: pointer;
    transition: background-color var(--transition-fast) var(--transition-ease),
                box-shadow var(--transition-fast) var(--transition-ease);
}

.btn-action:hover[b-iec80r7zdx] {
    background-color: var(--color-action-hover);
    border-color: var(--color-action-hover);
    color: var(--text-on-action);
    box-shadow: var(--shadow-sm);
}

.btn-sm[b-iec80r7zdx] {
    padding: var(--space-1) var(--space-3);
    font-size: var(--font-size-xs);
}

.btn-outline-primary[b-iec80r7zdx] {
    background: transparent;
    color: var(--color-primary);
    border: var(--border-width-thin) solid var(--color-primary);
}

.btn-outline-primary:hover[b-iec80r7zdx] {
    background-color: var(--color-primary);
    color: var(--text-on-primary);
}

/* ─── Detail Table (AgentContacts) ─────────────────────── */

.detail-loading[b-iec80r7zdx] {
    display: flex;
    align-items: center;
    gap: var(--space-2);
    padding: var(--space-4) 0;
    font-size: var(--font-size-sm);
    color: var(--text-muted);
}

.detail-empty[b-iec80r7zdx] {
    padding: var(--space-4) 0;
    font-size: var(--font-size-sm);
    color: var(--text-muted);
    text-align: center;
}

.detail-table[b-iec80r7zdx] {
    border: var(--border-width-thin) solid var(--border-color-light);
    background-color: var(--color-white);
}

.detail-table-header[b-iec80r7zdx] {
    display: flex;
    align-items: center;
    gap: var(--space-3);
    padding: var(--space-2) var(--space-3);
    background-color: var(--color-gray-100);
    font-size: var(--font-size-xs);
    font-weight: var(--font-weight-semibold);
    color: var(--text-secondary);
    text-transform: uppercase;
    letter-spacing: 0.3px;
}

.detail-table-row[b-iec80r7zdx] {
    display: flex;
    align-items: center;
    gap: var(--space-3);
    padding: var(--space-2) var(--space-3);
    border-top: var(--border-width-thin) solid var(--border-color-light);
    font-size: var(--font-size-sm);
    transition: background-color var(--transition-fast) var(--transition-ease);
}

.detail-table-row:hover[b-iec80r7zdx] {
    background-color: rgba(11, 36, 62, 0.02);
}

.detail-col[b-iec80r7zdx] {
    min-width: 0;
}

.detail-col-indicator[b-iec80r7zdx] {
    flex: 0 0 90px;
}

.detail-col-code[b-iec80r7zdx] {
    flex: 0 0 140px;
}

.detail-col-name[b-iec80r7zdx] {
    flex: 1;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.detail-col-actions[b-iec80r7zdx] {
    flex: 0 0 40px;
    display: flex;
    justify-content: flex-end;
}

.item-code[b-iec80r7zdx] {
    font-family: var(--font-mono);
    font-weight: var(--font-weight-medium);
    color: var(--color-primary);
    opacity: 0.7;
}

/* Badge Indicator */
.badge-indicator[b-iec80r7zdx] {
    display: inline-block;
    padding: 1px var(--space-2);
    font-size: var(--font-size-xs);
    font-weight: var(--font-weight-medium);
    letter-spacing: 0.3px;
}

.badge-cliente[b-iec80r7zdx] {
    background-color: #e3f2fd;
    color: #1565c0;
}

.badge-fornitore[b-iec80r7zdx] {
    background-color: #fff3e0;
    color: #e65100;
}

/* Icon Buttons */
.btn-icon[b-iec80r7zdx] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 36px;
    background: none;
    border: var(--border-width-thin) solid transparent;
    cursor: pointer;
    color: var(--text-muted);
    text-decoration: none;
    transition: all var(--transition-fast) var(--transition-ease);
}

.btn-icon:hover[b-iec80r7zdx] {
    color: var(--color-primary);
    background-color: var(--color-gray-100);
    border-color: var(--border-color-light);
}

.btn-icon-danger:hover[b-iec80r7zdx] {
    color: var(--color-action);
    background-color: rgba(178, 34, 34, 0.06);
    border-color: rgba(178, 34, 34, 0.2);
}

.btn-icon-sm[b-iec80r7zdx] {
    width: 30px;
    height: 30px;
}

/* Overlay & Dialog */
.overlay[b-iec80r7zdx] {
    position: fixed;
    inset: 0;
    background-color: rgba(0, 0, 0, 0.4);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: var(--z-modal-backdrop);
}

.confirm-dialog[b-iec80r7zdx] {
    background-color: var(--color-white);
    padding: var(--space-8);
    max-width: 420px;
    width: 90%;
    box-shadow: var(--shadow-xl);
    text-align: center;
    z-index: var(--z-modal);
}

.dialog-wide[b-iec80r7zdx] {
    max-width: 500px;
    text-align: left;
}

.confirm-icon[b-iec80r7zdx] {
    color: var(--color-action);
    margin-bottom: var(--space-4);
}

.confirm-dialog h3[b-iec80r7zdx] {
    font-size: var(--font-size-lg);
    font-weight: var(--font-weight-semibold);
    color: var(--color-primary);
    margin: 0 0 var(--space-2) 0;
}

.confirm-dialog p[b-iec80r7zdx] {
    font-size: var(--font-size-sm);
    color: var(--text-secondary);
    margin: 0 0 var(--space-2) 0;
}

.confirm-warning[b-iec80r7zdx] {
    font-size: var(--font-size-xs) !important;
    color: var(--color-action) !important;
    font-weight: var(--font-weight-medium);
}

.confirm-actions[b-iec80r7zdx] {
    display: flex;
    gap: var(--space-3);
    justify-content: center;
    margin-top: var(--space-6);
}

.confirm-actions .btn[b-iec80r7zdx] {
    min-width: 100px;
    padding: var(--space-2) var(--space-4);
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-medium);
    cursor: pointer;
}

/* Dialog Form */
.dialog-form[b-iec80r7zdx] {
    display: flex;
    gap: var(--space-4);
    margin-top: var(--space-4);
}

.dialog-form .form-group[b-iec80r7zdx] {
    flex: 1;
}

/* Validation */
[b-iec80r7zdx] .validation-message {
    color: var(--color-danger);
    font-size: var(--font-size-xs);
    margin-top: 2px;
}

/* Responsive */
@media (max-width: 768px) {
    .form-grid[b-iec80r7zdx] {
        grid-template-columns: 1fr;
    }

    .form-actions[b-iec80r7zdx] {
        flex-direction: column;
    }

    .detail-table-header[b-iec80r7zdx],
    .detail-table-row[b-iec80r7zdx] {
        flex-wrap: wrap;
    }

    .dialog-form[b-iec80r7zdx] {
        flex-direction: column;
    }
}
/* /Components/Pages/Common/AgentList.razor.rz.scp.css */
/* ===========================
   AgentList - Scoped Styles
   Flat Industrial Minimal
   =========================== */

/* Page Container */
.page-container[b-86al26voqr] {
    max-width: 1200px;
    margin: 0 auto;
    padding: var(--space-6) var(--space-4);
}

/* Header */
.page-header[b-86al26voqr] {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    margin-bottom: var(--space-6);
    gap: var(--space-4);
}

.page-header-left[b-86al26voqr] {
    flex: 1;
}

.page-header-right[b-86al26voqr] {
    flex-shrink: 0;
}

.page-title[b-86al26voqr] {
    font-size: var(--font-size-2xl);
    font-weight: var(--font-weight-bold);
    color: var(--color-primary);
    display: flex;
    align-items: center;
    gap: var(--space-2);
    margin: 0;
}

.page-title svg[b-86al26voqr] {
    color: var(--color-primary);
    flex-shrink: 0;
}

.page-subtitle[b-86al26voqr] {
    color: var(--text-muted);
    font-size: var(--font-size-sm);
    margin: var(--space-1) 0 0 0;
}

/* Action Button */
.btn-action[b-86al26voqr] {
    display: inline-flex;
    align-items: center;
    gap: var(--space-2);
    padding: var(--space-2) var(--space-4);
    background-color: var(--color-action);
    color: var(--text-on-action);
    border: var(--border-width-thin) solid var(--color-action);
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-medium);
    text-decoration: none;
    cursor: pointer;
    transition: background-color var(--transition-fast) var(--transition-ease),
                box-shadow var(--transition-fast) var(--transition-ease);
}

.btn-action:hover[b-86al26voqr] {
    background-color: var(--color-action-hover);
    border-color: var(--color-action-hover);
    color: var(--text-on-action);
    text-decoration: none;
    box-shadow: var(--shadow-sm);
}

.btn-action:active[b-86al26voqr] {
    background-color: var(--color-action-active);
}

.btn-sm[b-86al26voqr] {
    padding: var(--space-1) var(--space-3);
    font-size: var(--font-size-xs);
}

/* Alert Bars */
.alert-bar[b-86al26voqr] {
    display: flex;
    align-items: center;
    gap: var(--space-2);
    padding: var(--space-3) var(--space-4);
    margin-bottom: var(--space-4);
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-medium);
    border-left: var(--border-width-thick) solid;
}

.alert-bar-success[b-86al26voqr] {
    background-color: #edf7ed;
    border-left-color: var(--color-success);
    color: #1e4620;
}

.alert-bar-danger[b-86al26voqr] {
    background-color: #fdeded;
    border-left-color: var(--color-danger);
    color: #5f2120;
}

.alert-bar-close[b-86al26voqr] {
    margin-left: auto;
    background: none;
    border: none;
    font-size: var(--font-size-lg);
    cursor: pointer;
    color: inherit;
    opacity: 0.6;
    line-height: 1;
}

.alert-bar-close:hover[b-86al26voqr] {
    opacity: 1;
}

/* Search Bar */
.search-bar[b-86al26voqr] {
    display: flex;
    align-items: center;
    gap: var(--space-4);
    margin-bottom: var(--space-4);
    padding: var(--space-3) var(--space-4);
    background-color: var(--bg-secondary);
    border: var(--border-width-thin) solid var(--border-color-light);
}

.search-input-wrapper[b-86al26voqr] {
    display: flex;
    align-items: center;
    flex: 1;
    position: relative;
}

.search-icon[b-86al26voqr] {
    color: var(--text-muted);
    flex-shrink: 0;
    margin-right: var(--space-2);
}

.search-input[b-86al26voqr] {
    flex: 1;
    border: none;
    background: transparent;
    font-size: var(--font-size-sm);
    color: var(--color-gray-700);
    outline: none;
    padding: var(--space-1) 0;
}

.search-input[b-86al26voqr]::placeholder {
    color: var(--text-muted);
}

.search-clear[b-86al26voqr] {
    background: none;
    border: none;
    cursor: pointer;
    color: var(--text-muted);
    padding: var(--space-1);
    display: flex;
    align-items: center;
}

.search-clear:hover[b-86al26voqr] {
    color: var(--color-primary);
}

.search-count[b-86al26voqr] {
    flex-shrink: 0;
    font-size: var(--font-size-xs);
    color: var(--text-muted);
    font-weight: var(--font-weight-medium);
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

/* Loading / Empty States */
.loading-state[b-86al26voqr] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: var(--space-16) 0;
    color: var(--text-muted);
    gap: var(--space-4);
}

.empty-state[b-86al26voqr] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: var(--space-16) 0;
    color: var(--text-muted);
    gap: var(--space-3);
}

.empty-state svg[b-86al26voqr] {
    opacity: 0.4;
}

.empty-state-text[b-86al26voqr] {
    font-size: var(--font-size-base);
    margin: 0;
}

/* Item List */
.item-list[b-86al26voqr] {
    display: flex;
    flex-direction: column;
    border: var(--border-width-thin) solid var(--border-color-light);
}

/* Item Block (row + detail panel) */
.item-block[b-86al26voqr] {
    border-bottom: var(--border-width-thin) solid var(--border-color-light);
}

.item-block:last-child[b-86al26voqr] {
    border-bottom: none;
}

/* Item Row */
.item-row[b-86al26voqr] {
    display: flex;
    align-items: center;
    gap: var(--space-4);
    padding: var(--space-4);
    transition: background-color var(--transition-fast) var(--transition-ease);
}

.item-row:hover[b-86al26voqr] {
    background-color: rgba(11, 36, 62, 0.03);
}

/* Expand Button */
.btn-expand[b-86al26voqr] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 28px;
    height: 28px;
    background: none;
    border: var(--border-width-thin) solid var(--border-color-light);
    cursor: pointer;
    color: var(--text-muted);
    flex-shrink: 0;
    transition: all var(--transition-fast) var(--transition-ease);
}

.btn-expand:hover[b-86al26voqr] {
    color: var(--color-primary);
    border-color: var(--color-primary);
    background-color: var(--color-gray-50);
}

.btn-expand svg[b-86al26voqr] {
    transition: transform var(--transition-fast) var(--transition-ease);
}

.chevron-rotated[b-86al26voqr] {
    transform: rotate(90deg);
}

/* Avatar */
.item-avatar[b-86al26voqr] {
    flex-shrink: 0;
    width: 40px;
    height: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: var(--color-gray-100);
    color: var(--color-primary);
}

/* Item Info */
.item-info[b-86al26voqr] {
    flex: 1;
    min-width: 0;
}

.item-name[b-86al26voqr] {
    font-size: var(--font-size-base);
    font-weight: var(--font-weight-semibold);
    color: var(--color-primary);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.item-meta[b-86al26voqr] {
    display: flex;
    align-items: center;
    gap: var(--space-1);
    flex-wrap: wrap;
    font-size: var(--font-size-xs);
    color: var(--text-secondary);
    margin-top: 2px;
}

.item-code[b-86al26voqr] {
    font-family: var(--font-mono);
    font-weight: var(--font-weight-medium);
    color: var(--color-primary);
    opacity: 0.7;
}

.meta-separator[b-86al26voqr] {
    color: var(--color-gray-300);
}

/* Action Buttons */
.item-actions[b-86al26voqr] {
    flex-shrink: 0;
    display: flex;
    align-items: center;
    gap: var(--space-1);
}

.btn-icon[b-86al26voqr] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 36px;
    background: none;
    border: var(--border-width-thin) solid transparent;
    cursor: pointer;
    color: var(--text-muted);
    text-decoration: none;
    transition: all var(--transition-fast) var(--transition-ease);
}

.btn-icon:hover[b-86al26voqr] {
    color: var(--color-primary);
    background-color: var(--color-gray-100);
    border-color: var(--border-color-light);
    text-decoration: none;
}

.btn-icon-danger:hover[b-86al26voqr] {
    color: var(--color-action);
    background-color: rgba(178, 34, 34, 0.06);
    border-color: rgba(178, 34, 34, 0.2);
}

.btn-icon-sm[b-86al26voqr] {
    width: 30px;
    height: 30px;
}

/* ─── Detail Panel (AgentContacts) ─────────────────────── */

.detail-panel[b-86al26voqr] {
    padding: 0 var(--space-4) var(--space-4) var(--space-4);
    margin-left: calc(28px + var(--space-4));
    border-top: var(--border-width-thin) dashed var(--border-color-light);
    background-color: var(--color-gray-50);
}

.detail-header[b-86al26voqr] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: var(--space-3) 0;
}

.detail-title[b-86al26voqr] {
    display: flex;
    align-items: center;
    gap: var(--space-2);
    font-size: var(--font-size-xs);
    font-weight: var(--font-weight-semibold);
    color: var(--color-primary);
    text-transform: uppercase;
    letter-spacing: 0.5px;
    margin: 0;
}

.detail-title svg[b-86al26voqr] {
    color: var(--color-primary);
    opacity: 0.6;
}

.detail-loading[b-86al26voqr] {
    display: flex;
    align-items: center;
    gap: var(--space-2);
    padding: var(--space-4) 0;
    font-size: var(--font-size-sm);
    color: var(--text-muted);
}

.detail-empty[b-86al26voqr] {
    padding: var(--space-4) 0;
    font-size: var(--font-size-sm);
    color: var(--text-muted);
    text-align: center;
}

/* Detail Table */
.detail-table[b-86al26voqr] {
    border: var(--border-width-thin) solid var(--border-color-light);
    background-color: var(--color-white);
}

.detail-table-header[b-86al26voqr] {
    display: flex;
    align-items: center;
    gap: var(--space-3);
    padding: var(--space-2) var(--space-3);
    background-color: var(--color-gray-100);
    font-size: var(--font-size-xs);
    font-weight: var(--font-weight-semibold);
    color: var(--text-secondary);
    text-transform: uppercase;
    letter-spacing: 0.3px;
}

.detail-table-row[b-86al26voqr] {
    display: flex;
    align-items: center;
    gap: var(--space-3);
    padding: var(--space-2) var(--space-3);
    border-top: var(--border-width-thin) solid var(--border-color-light);
    font-size: var(--font-size-sm);
    transition: background-color var(--transition-fast) var(--transition-ease);
}

.detail-table-row:hover[b-86al26voqr] {
    background-color: rgba(11, 36, 62, 0.02);
}

.detail-col[b-86al26voqr] {
    min-width: 0;
}

.detail-col-indicator[b-86al26voqr] {
    flex: 0 0 90px;
}

.detail-col-code[b-86al26voqr] {
    flex: 0 0 140px;
}

.detail-col-name[b-86al26voqr] {
    flex: 1;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.detail-col-actions[b-86al26voqr] {
    flex: 0 0 40px;
    display: flex;
    justify-content: flex-end;
}

/* Badge Indicator */
.badge-indicator[b-86al26voqr] {
    display: inline-block;
    padding: 1px var(--space-2);
    font-size: var(--font-size-xs);
    font-weight: var(--font-weight-medium);
    letter-spacing: 0.3px;
}

.badge-cliente[b-86al26voqr] {
    background-color: #e3f2fd;
    color: #1565c0;
}

.badge-fornitore[b-86al26voqr] {
    background-color: #fff3e0;
    color: #e65100;
}

/* Overlay & Dialog */
.overlay[b-86al26voqr] {
    position: fixed;
    inset: 0;
    background-color: rgba(0, 0, 0, 0.4);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: var(--z-modal-backdrop);
}

.confirm-dialog[b-86al26voqr] {
    background-color: var(--color-white);
    padding: var(--space-8);
    max-width: 420px;
    width: 90%;
    box-shadow: var(--shadow-xl);
    text-align: center;
    z-index: var(--z-modal);
}

.dialog-wide[b-86al26voqr] {
    max-width: 500px;
    text-align: left;
}

.confirm-icon[b-86al26voqr] {
    color: var(--color-action);
    margin-bottom: var(--space-4);
}

.confirm-dialog h3[b-86al26voqr] {
    font-size: var(--font-size-lg);
    font-weight: var(--font-weight-semibold);
    color: var(--color-primary);
    margin: 0 0 var(--space-2) 0;
}

.confirm-dialog p[b-86al26voqr] {
    font-size: var(--font-size-sm);
    color: var(--text-secondary);
    margin: 0 0 var(--space-2) 0;
}

.confirm-warning[b-86al26voqr] {
    font-size: var(--font-size-xs) !important;
    color: var(--color-action) !important;
    font-weight: var(--font-weight-medium);
}

.confirm-actions[b-86al26voqr] {
    display: flex;
    gap: var(--space-3);
    justify-content: center;
    margin-top: var(--space-6);
}

.confirm-actions .btn[b-86al26voqr] {
    min-width: 100px;
    padding: var(--space-2) var(--space-4);
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-medium);
    cursor: pointer;
}

/* Dialog Form */
.dialog-form[b-86al26voqr] {
    display: flex;
    gap: var(--space-4);
    margin-top: var(--space-4);
}

.dialog-form .form-group[b-86al26voqr] {
    flex: 1;
    display: flex;
    flex-direction: column;
}

.form-label[b-86al26voqr] {
    font-size: var(--font-size-xs);
    font-weight: var(--font-weight-medium);
    color: var(--text-secondary);
    text-transform: uppercase;
    letter-spacing: 0.3px;
    margin-bottom: var(--space-1);
}

.form-control[b-86al26voqr] {
    padding: var(--space-2) var(--space-3);
    font-size: var(--font-size-sm);
    color: var(--color-gray-700);
    border: var(--border-width-thin) solid var(--border-color-light);
    background-color: var(--color-white);
    transition: border-color var(--transition-fast) var(--transition-ease);
}

.form-control:focus[b-86al26voqr] {
    border-color: var(--color-primary);
    outline: none;
    box-shadow: none;
}

/* Outline Primary Button */
.btn-outline-primary[b-86al26voqr] {
    background: transparent;
    color: var(--color-primary);
    border: var(--border-width-thin) solid var(--color-primary);
}

.btn-outline-primary:hover[b-86al26voqr] {
    background-color: var(--color-primary);
    color: var(--text-on-primary);
}

/* Validation */
[b-86al26voqr] .validation-message {
    color: var(--color-danger);
    font-size: var(--font-size-xs);
    margin-top: 2px;
}

/* Responsive */
@media (max-width: 768px) {
    .page-header[b-86al26voqr] {
        flex-direction: column;
        gap: var(--space-3);
    }

    .item-row[b-86al26voqr] {
        flex-wrap: wrap;
    }

    .item-actions[b-86al26voqr] {
        order: 6;
        margin-left: auto;
    }

    .detail-panel[b-86al26voqr] {
        margin-left: 0;
    }

    .detail-table-header[b-86al26voqr],
    .detail-table-row[b-86al26voqr] {
        flex-wrap: wrap;
    }

    .dialog-form[b-86al26voqr] {
        flex-direction: column;
    }
}
/* /Components/Pages/Common/CompanyLocationCreate.razor.rz.scp.css */
/* ===========================
   CompanyLocationCreate - Scoped Styles
   Flat Industrial Minimal
   =========================== */

/* Page Container */
.page-container[b-gcisa4fzzh] {
    max-width: 900px;
    margin: 0 auto;
    padding: var(--space-6) var(--space-4);
}

/* Header */
.page-header[b-gcisa4fzzh] {
    display: flex;
    align-items: center;
    gap: var(--space-4);
    margin-bottom: var(--space-6);
}

.btn-back[b-gcisa4fzzh] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    color: var(--text-muted);
    border: var(--border-width-thin) solid var(--border-color-light);
    text-decoration: none;
    transition: all var(--transition-fast) var(--transition-ease);
    flex-shrink: 0;
}

.btn-back:hover[b-gcisa4fzzh] {
    color: var(--color-primary);
    border-color: var(--color-primary);
    background-color: var(--color-gray-50);
    text-decoration: none;
}

.page-header-text[b-gcisa4fzzh] {
    flex: 1;
}

.page-title[b-gcisa4fzzh] {
    font-size: var(--font-size-xl);
    font-weight: var(--font-weight-bold);
    color: var(--color-primary);
    display: flex;
    align-items: center;
    gap: var(--space-2);
    margin: 0;
}

.page-title svg[b-gcisa4fzzh] {
    color: var(--color-primary);
    flex-shrink: 0;
}

.page-subtitle[b-gcisa4fzzh] {
    color: var(--text-muted);
    font-size: var(--font-size-sm);
    margin: 2px 0 0 0;
}

/* Alert Bar */
.alert-bar[b-gcisa4fzzh] {
    display: flex;
    align-items: center;
    gap: var(--space-2);
    padding: var(--space-3) var(--space-4);
    margin-bottom: var(--space-4);
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-medium);
    border-left: var(--border-width-thick) solid;
}

.alert-bar-danger[b-gcisa4fzzh] {
    background-color: #fdeded;
    border-left-color: var(--color-danger);
    color: #5f2120;
}

.alert-bar-close[b-gcisa4fzzh] {
    margin-left: auto;
    background: none;
    border: none;
    font-size: var(--font-size-lg);
    cursor: pointer;
    color: inherit;
    opacity: 0.6;
    line-height: 1;
}

.alert-bar-close:hover[b-gcisa4fzzh] {
    opacity: 1;
}

/* Form Sections */
.form-section[b-gcisa4fzzh] {
    margin-bottom: var(--space-6);
    padding: var(--space-5);
    background-color: var(--color-white);
    border: var(--border-width-thin) solid var(--border-color-light);
}

.section-title[b-gcisa4fzzh] {
    display: flex;
    align-items: center;
    gap: var(--space-2);
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-semibold);
    color: var(--color-primary);
    text-transform: uppercase;
    letter-spacing: 0.5px;
    margin: 0 0 var(--space-4) 0;
    padding-bottom: var(--space-3);
    border-bottom: var(--border-width-thin) solid var(--border-color-light);
}

.section-title svg[b-gcisa4fzzh] {
    color: var(--color-primary);
    opacity: 0.6;
    flex-shrink: 0;
}

/* Form Grid */
.form-grid[b-gcisa4fzzh] {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: var(--space-4);
}

.form-group[b-gcisa4fzzh] {
    display: flex;
    flex-direction: column;
}

.form-group-wide[b-gcisa4fzzh] {
    grid-column: span 2;
}

/* Form Controls */
.form-label[b-gcisa4fzzh] {
    font-size: var(--font-size-xs);
    font-weight: var(--font-weight-medium);
    color: var(--text-secondary);
    text-transform: uppercase;
    letter-spacing: 0.3px;
    margin-bottom: var(--space-1);
}

.form-label-check[b-gcisa4fzzh] {
    display: flex;
    align-items: center;
    gap: var(--space-2);
    text-transform: none;
    cursor: pointer;
    padding-top: var(--space-4);
}

.form-control[b-gcisa4fzzh] {
    padding: var(--space-2) var(--space-3);
    font-size: var(--font-size-sm);
    color: var(--color-gray-700);
    border: var(--border-width-thin) solid var(--border-color-light);
    background-color: var(--color-white);
    transition: border-color var(--transition-fast) var(--transition-ease);
}

.form-control:focus[b-gcisa4fzzh] {
    border-color: var(--color-primary);
    outline: none;
    box-shadow: none;
}

.form-control[b-gcisa4fzzh]::placeholder {
    color: var(--color-gray-400);
}

.text-end[b-gcisa4fzzh] {
    text-align: right;
}

/* Form Actions */
.form-actions[b-gcisa4fzzh] {
    display: flex;
    justify-content: flex-end;
    gap: var(--space-3);
    padding-top: var(--space-4);
    border-top: var(--border-width-thin) solid var(--border-color-light);
}

.form-actions .btn[b-gcisa4fzzh] {
    display: inline-flex;
    align-items: center;
    gap: var(--space-2);
    padding: var(--space-2) var(--space-5);
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-medium);
    cursor: pointer;
    text-decoration: none;
}

.btn-action[b-gcisa4fzzh] {
    background-color: var(--color-action);
    color: var(--text-on-action);
    border: var(--border-width-thin) solid var(--color-action);
    transition: background-color var(--transition-fast) var(--transition-ease);
}

.btn-action:hover[b-gcisa4fzzh] {
    background-color: var(--color-action-hover);
    border-color: var(--color-action-hover);
    color: var(--text-on-action);
}

.btn-action:disabled[b-gcisa4fzzh] {
    opacity: 0.65;
    cursor: not-allowed;
}

.btn-outline-primary[b-gcisa4fzzh] {
    background: transparent;
    color: var(--color-primary);
    border: var(--border-width-thin) solid var(--color-primary);
}

.btn-outline-primary:hover[b-gcisa4fzzh] {
    background-color: var(--color-primary);
    color: var(--text-on-primary);
    text-decoration: none;
}

/* Validation */
[b-gcisa4fzzh] .validation-message {
    color: var(--color-danger);
    font-size: var(--font-size-xs);
    margin-top: 2px;
}

/* Responsive */
@media (max-width: 768px) {
    .form-grid[b-gcisa4fzzh] {
        grid-template-columns: 1fr;
    }

    .form-group-wide[b-gcisa4fzzh] {
        grid-column: span 1;
    }

    .form-actions[b-gcisa4fzzh] {
        flex-direction: column-reverse;
    }

    .form-actions .btn[b-gcisa4fzzh] {
        justify-content: center;
    }
}
/* /Components/Pages/Common/CompanyLocationEdit.razor.rz.scp.css */
/* ===========================
   CompanyLocationEdit - Scoped Styles
   Flat Industrial Minimal
   =========================== */

/* Page Container */
.page-container[b-y660vyhjwd] {
    max-width: 900px;
    margin: 0 auto;
    padding: var(--space-6) var(--space-4);
}

/* Header */
.page-header[b-y660vyhjwd] {
    display: flex;
    align-items: center;
    gap: var(--space-4);
    margin-bottom: var(--space-6);
}

.btn-back[b-y660vyhjwd] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    color: var(--text-muted);
    border: var(--border-width-thin) solid var(--border-color-light);
    text-decoration: none;
    transition: all var(--transition-fast) var(--transition-ease);
    flex-shrink: 0;
}

.btn-back:hover[b-y660vyhjwd] {
    color: var(--color-primary);
    border-color: var(--color-primary);
    background-color: var(--color-gray-50);
    text-decoration: none;
}

.page-header-text[b-y660vyhjwd] {
    flex: 1;
}

.page-title[b-y660vyhjwd] {
    font-size: var(--font-size-xl);
    font-weight: var(--font-weight-bold);
    color: var(--color-primary);
    display: flex;
    align-items: center;
    gap: var(--space-2);
    margin: 0;
}

.page-title svg[b-y660vyhjwd] {
    color: var(--color-primary);
    flex-shrink: 0;
}

.page-subtitle[b-y660vyhjwd] {
    color: var(--text-muted);
    font-size: var(--font-size-sm);
    margin: 2px 0 0 0;
    display: flex;
    align-items: center;
    gap: var(--space-2);
}

.subtitle-code[b-y660vyhjwd] {
    font-family: var(--font-mono);
    font-size: var(--font-size-xs);
    color: var(--color-primary);
    opacity: 0.6;
    padding: 1px var(--space-2);
    background-color: var(--color-gray-100);
}

/* Alert Bar */
.alert-bar[b-y660vyhjwd] {
    display: flex;
    align-items: center;
    gap: var(--space-2);
    padding: var(--space-3) var(--space-4);
    margin-bottom: var(--space-4);
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-medium);
    border-left: var(--border-width-thick) solid;
}

.alert-bar-danger[b-y660vyhjwd] {
    background-color: #fdeded;
    border-left-color: var(--color-danger);
    color: #5f2120;
}

.alert-bar-close[b-y660vyhjwd] {
    margin-left: auto;
    background: none;
    border: none;
    font-size: var(--font-size-lg);
    cursor: pointer;
    color: inherit;
    opacity: 0.6;
    line-height: 1;
}

.alert-bar-close:hover[b-y660vyhjwd] {
    opacity: 1;
}

/* Loading / Empty States */
.loading-state[b-y660vyhjwd] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: var(--space-16) 0;
    color: var(--text-muted);
    gap: var(--space-4);
}

.empty-state[b-y660vyhjwd] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: var(--space-16) 0;
    color: var(--text-muted);
    gap: var(--space-3);
}

.empty-state svg[b-y660vyhjwd] {
    opacity: 0.4;
}

.empty-state-text[b-y660vyhjwd] {
    font-size: var(--font-size-base);
    margin: 0;
}

/* Form Sections */
.form-section[b-y660vyhjwd] {
    margin-bottom: var(--space-6);
    padding: var(--space-5);
    background-color: var(--color-white);
    border: var(--border-width-thin) solid var(--border-color-light);
}

.section-title[b-y660vyhjwd] {
    display: flex;
    align-items: center;
    gap: var(--space-2);
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-semibold);
    color: var(--color-primary);
    text-transform: uppercase;
    letter-spacing: 0.5px;
    margin: 0 0 var(--space-4) 0;
    padding-bottom: var(--space-3);
    border-bottom: var(--border-width-thin) solid var(--border-color-light);
}

.section-title svg[b-y660vyhjwd] {
    color: var(--color-primary);
    opacity: 0.6;
    flex-shrink: 0;
}

/* Form Grid */
.form-grid[b-y660vyhjwd] {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: var(--space-4);
}

.form-group[b-y660vyhjwd] {
    display: flex;
    flex-direction: column;
}

.form-group-wide[b-y660vyhjwd] {
    grid-column: span 2;
}

/* Form Controls */
.form-label[b-y660vyhjwd] {
    font-size: var(--font-size-xs);
    font-weight: var(--font-weight-medium);
    color: var(--text-secondary);
    text-transform: uppercase;
    letter-spacing: 0.3px;
    margin-bottom: var(--space-1);
}

.form-label-check[b-y660vyhjwd] {
    display: flex;
    align-items: center;
    gap: var(--space-2);
    text-transform: none;
    cursor: pointer;
    padding-top: var(--space-4);
}

.form-control[b-y660vyhjwd] {
    padding: var(--space-2) var(--space-3);
    font-size: var(--font-size-sm);
    color: var(--color-gray-700);
    border: var(--border-width-thin) solid var(--border-color-light);
    background-color: var(--color-white);
    transition: border-color var(--transition-fast) var(--transition-ease);
}

.form-control:focus[b-y660vyhjwd] {
    border-color: var(--color-primary);
    outline: none;
    box-shadow: none;
}

.form-control[b-y660vyhjwd]::placeholder {
    color: var(--color-gray-400);
}

.form-control-static[b-y660vyhjwd] {
    padding: var(--space-2) var(--space-3);
    font-size: var(--font-size-sm);
    color: var(--text-muted);
    background-color: var(--color-gray-50);
    border: var(--border-width-thin) solid var(--border-color-light);
    font-family: var(--font-mono);
}

.text-end[b-y660vyhjwd] {
    text-align: right;
}

/* Form Actions */
.form-actions[b-y660vyhjwd] {
    display: flex;
    justify-content: flex-end;
    gap: var(--space-3);
    padding-top: var(--space-4);
    border-top: var(--border-width-thin) solid var(--border-color-light);
}

.form-actions .btn[b-y660vyhjwd] {
    display: inline-flex;
    align-items: center;
    gap: var(--space-2);
    padding: var(--space-2) var(--space-5);
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-medium);
    cursor: pointer;
    text-decoration: none;
}

.btn-action[b-y660vyhjwd] {
    background-color: var(--color-action);
    color: var(--text-on-action);
    border: var(--border-width-thin) solid var(--color-action);
    transition: background-color var(--transition-fast) var(--transition-ease);
}

.btn-action:hover[b-y660vyhjwd] {
    background-color: var(--color-action-hover);
    border-color: var(--color-action-hover);
    color: var(--text-on-action);
}

.btn-action:disabled[b-y660vyhjwd] {
    opacity: 0.65;
    cursor: not-allowed;
}

.btn-outline-primary[b-y660vyhjwd] {
    background: transparent;
    color: var(--color-primary);
    border: var(--border-width-thin) solid var(--color-primary);
}

.btn-outline-primary:hover[b-y660vyhjwd] {
    background-color: var(--color-primary);
    color: var(--text-on-primary);
    text-decoration: none;
}

/* Validation */
[b-y660vyhjwd] .validation-message {
    color: var(--color-danger);
    font-size: var(--font-size-xs);
    margin-top: 2px;
}

/* Responsive */
@media (max-width: 768px) {
    .form-grid[b-y660vyhjwd] {
        grid-template-columns: 1fr;
    }

    .form-group-wide[b-y660vyhjwd] {
        grid-column: span 1;
    }

    .form-actions[b-y660vyhjwd] {
        flex-direction: column-reverse;
    }

    .form-actions .btn[b-y660vyhjwd] {
        justify-content: center;
    }
}
/* /Components/Pages/Common/CompanyLocationList.razor.rz.scp.css */
/* ===========================
   CompanyLocationList - Scoped Styles
   Flat Industrial Minimal
   =========================== */

/* Page Container */
.page-container[b-2hdwxkm96y] {
    max-width: 1200px;
    margin: 0 auto;
    padding: var(--space-6) var(--space-4);
}

/* Header */
.page-header[b-2hdwxkm96y] {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    margin-bottom: var(--space-6);
    gap: var(--space-4);
}

.page-header-left[b-2hdwxkm96y] {
    flex: 1;
}

.page-header-right[b-2hdwxkm96y] {
    flex-shrink: 0;
}

.btn-back[b-2hdwxkm96y] {
    display: inline-flex;
    align-items: center;
    gap: var(--space-1);
    background: none;
    border: none;
    color: var(--text-muted);
    font-size: var(--font-size-xs);
    cursor: pointer;
    padding: 0;
    margin-bottom: var(--space-2);
    text-transform: uppercase;
    letter-spacing: 0.5px;
    font-weight: var(--font-weight-medium);
}

.btn-back:hover[b-2hdwxkm96y] {
    color: var(--color-primary);
}

.page-title-filter[b-2hdwxkm96y] {
    font-weight: var(--font-weight-normal);
    font-size: var(--font-size-lg);
    color: var(--text-secondary);
}

.page-title[b-2hdwxkm96y] {
    font-size: var(--font-size-2xl);
    font-weight: var(--font-weight-bold);
    color: var(--color-primary);
    display: flex;
    align-items: center;
    gap: var(--space-2);
    margin: 0;
}

.page-title svg[b-2hdwxkm96y] {
    color: var(--color-primary);
    flex-shrink: 0;
}

.page-subtitle[b-2hdwxkm96y] {
    color: var(--text-muted);
    font-size: var(--font-size-sm);
    margin: var(--space-1) 0 0 0;
}

/* Action Button */
.btn-action[b-2hdwxkm96y] {
    display: inline-flex;
    align-items: center;
    gap: var(--space-2);
    padding: var(--space-2) var(--space-4);
    background-color: var(--color-action);
    color: var(--text-on-action);
    border: var(--border-width-thin) solid var(--color-action);
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-medium);
    text-decoration: none;
    cursor: pointer;
    transition: background-color var(--transition-fast) var(--transition-ease),
                box-shadow var(--transition-fast) var(--transition-ease);
}

.btn-action:hover[b-2hdwxkm96y] {
    background-color: var(--color-action-hover);
    border-color: var(--color-action-hover);
    color: var(--text-on-action);
    text-decoration: none;
    box-shadow: var(--shadow-sm);
}

.btn-action:active[b-2hdwxkm96y] {
    background-color: var(--color-action-active);
}

/* Alert Bars */
.alert-bar[b-2hdwxkm96y] {
    display: flex;
    align-items: center;
    gap: var(--space-2);
    padding: var(--space-3) var(--space-4);
    margin-bottom: var(--space-4);
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-medium);
    border-left: var(--border-width-thick) solid;
}

.alert-bar-success[b-2hdwxkm96y] {
    background-color: #edf7ed;
    border-left-color: var(--color-success);
    color: #1e4620;
}

.alert-bar-danger[b-2hdwxkm96y] {
    background-color: #fdeded;
    border-left-color: var(--color-danger);
    color: #5f2120;
}

.alert-bar-close[b-2hdwxkm96y] {
    margin-left: auto;
    background: none;
    border: none;
    font-size: var(--font-size-lg);
    cursor: pointer;
    color: inherit;
    opacity: 0.6;
    line-height: 1;
}

.alert-bar-close:hover[b-2hdwxkm96y] {
    opacity: 1;
}

/* Search Bar */
.search-bar[b-2hdwxkm96y] {
    display: flex;
    align-items: center;
    gap: var(--space-4);
    margin-bottom: var(--space-4);
    padding: var(--space-3) var(--space-4);
    background-color: var(--bg-secondary);
    border: var(--border-width-thin) solid var(--border-color-light);
}

.search-input-wrapper[b-2hdwxkm96y] {
    display: flex;
    align-items: center;
    flex: 1;
    position: relative;
}

.search-icon[b-2hdwxkm96y] {
    color: var(--text-muted);
    flex-shrink: 0;
    margin-right: var(--space-2);
}

.search-input[b-2hdwxkm96y] {
    flex: 1;
    border: none;
    background: transparent;
    font-size: var(--font-size-sm);
    color: var(--color-gray-700);
    outline: none;
    padding: var(--space-1) 0;
}

.search-input[b-2hdwxkm96y]::placeholder {
    color: var(--text-muted);
}

.search-clear[b-2hdwxkm96y] {
    background: none;
    border: none;
    cursor: pointer;
    color: var(--text-muted);
    padding: var(--space-1);
    display: flex;
    align-items: center;
}

.search-clear:hover[b-2hdwxkm96y] {
    color: var(--color-primary);
}

.search-count[b-2hdwxkm96y] {
    flex-shrink: 0;
    font-size: var(--font-size-xs);
    color: var(--text-muted);
    font-weight: var(--font-weight-medium);
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

/* Loading / Empty States */
.loading-state[b-2hdwxkm96y] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: var(--space-16) 0;
    color: var(--text-muted);
    gap: var(--space-4);
}

.empty-state[b-2hdwxkm96y] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: var(--space-16) 0;
    color: var(--text-muted);
    gap: var(--space-3);
}

.empty-state svg[b-2hdwxkm96y] {
    opacity: 0.4;
}

.empty-state-text[b-2hdwxkm96y] {
    font-size: var(--font-size-base);
    margin: 0;
}

/* Item List */
.item-list[b-2hdwxkm96y] {
    display: flex;
    flex-direction: column;
    border: var(--border-width-thin) solid var(--border-color-light);
}

/* Item Row */
.item-row[b-2hdwxkm96y] {
    display: flex;
    align-items: center;
    gap: var(--space-4);
    padding: var(--space-4);
    border-bottom: var(--border-width-thin) solid var(--border-color-light);
    transition: background-color var(--transition-fast) var(--transition-ease);
}

.item-row:last-child[b-2hdwxkm96y] {
    border-bottom: none;
}

.item-row:hover[b-2hdwxkm96y] {
    background-color: rgba(11, 36, 62, 0.03);
}

/* Avatar */
.item-avatar[b-2hdwxkm96y] {
    flex-shrink: 0;
    width: 40px;
    height: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: var(--color-gray-100);
    color: var(--color-primary);
}

/* Item Info */
.item-info[b-2hdwxkm96y] {
    flex: 1;
    min-width: 0;
}

.item-name[b-2hdwxkm96y] {
    font-size: var(--font-size-base);
    font-weight: var(--font-weight-semibold);
    color: var(--color-primary);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.item-meta[b-2hdwxkm96y] {
    display: flex;
    align-items: center;
    gap: var(--space-1);
    flex-wrap: wrap;
    font-size: var(--font-size-xs);
    color: var(--text-secondary);
    margin-top: 2px;
}

.item-code[b-2hdwxkm96y] {
    font-family: var(--font-mono);
    font-weight: var(--font-weight-medium);
    color: var(--color-primary);
    opacity: 0.7;
}

.meta-separator[b-2hdwxkm96y] {
    color: var(--color-gray-300);
}

.badge-default[b-2hdwxkm96y] {
    display: inline-flex;
    align-items: center;
    padding: 1px 6px;
    font-size: var(--font-size-xs);
    font-weight: var(--font-weight-medium);
    color: var(--color-success);
    background-color: #edf7ed;
    border: 1px solid var(--color-success);
    margin-left: var(--space-1);
}

/* Action Buttons */
.item-actions[b-2hdwxkm96y] {
    flex-shrink: 0;
    display: flex;
    align-items: center;
    gap: var(--space-1);
}

.btn-icon[b-2hdwxkm96y] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 36px;
    background: none;
    border: var(--border-width-thin) solid transparent;
    cursor: pointer;
    color: var(--text-muted);
    text-decoration: none;
    transition: all var(--transition-fast) var(--transition-ease);
}

.btn-icon:hover[b-2hdwxkm96y] {
    color: var(--color-primary);
    background-color: var(--color-gray-100);
    border-color: var(--border-color-light);
    text-decoration: none;
}

.btn-icon-danger:hover[b-2hdwxkm96y] {
    color: var(--color-action);
    background-color: rgba(178, 34, 34, 0.06);
    border-color: rgba(178, 34, 34, 0.2);
}

/* Overlay & Dialog */
.overlay[b-2hdwxkm96y] {
    position: fixed;
    inset: 0;
    background-color: rgba(0, 0, 0, 0.4);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: var(--z-modal-backdrop);
}

.confirm-dialog[b-2hdwxkm96y] {
    background-color: var(--color-white);
    padding: var(--space-8);
    max-width: 420px;
    width: 90%;
    box-shadow: var(--shadow-xl);
    text-align: center;
    z-index: var(--z-modal);
}

.confirm-icon[b-2hdwxkm96y] {
    color: var(--color-action);
    margin-bottom: var(--space-4);
}

.confirm-dialog h3[b-2hdwxkm96y] {
    font-size: var(--font-size-lg);
    font-weight: var(--font-weight-semibold);
    color: var(--color-primary);
    margin: 0 0 var(--space-2) 0;
}

.confirm-dialog p[b-2hdwxkm96y] {
    font-size: var(--font-size-sm);
    color: var(--text-secondary);
    margin: 0 0 var(--space-2) 0;
}

.confirm-warning[b-2hdwxkm96y] {
    font-size: var(--font-size-xs) !important;
    color: var(--color-action) !important;
    font-weight: var(--font-weight-medium);
}

.confirm-actions[b-2hdwxkm96y] {
    display: flex;
    gap: var(--space-3);
    justify-content: center;
    margin-top: var(--space-6);
}

.confirm-actions .btn[b-2hdwxkm96y] {
    min-width: 100px;
    padding: var(--space-2) var(--space-4);
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-medium);
    cursor: pointer;
}

/* Outline Primary Button */
.btn-outline-primary[b-2hdwxkm96y] {
    background: transparent;
    color: var(--color-primary);
    border: var(--border-width-thin) solid var(--color-primary);
}

.btn-outline-primary:hover[b-2hdwxkm96y] {
    background-color: var(--color-primary);
    color: var(--text-on-primary);
}

/* Responsive */
@media (max-width: 768px) {
    .page-header[b-2hdwxkm96y] {
        flex-direction: column;
        gap: var(--space-3);
    }

    .item-row[b-2hdwxkm96y] {
        flex-wrap: wrap;
    }

    .item-actions[b-2hdwxkm96y] {
        order: 6;
        margin-left: auto;
    }
}
/* /Components/Pages/Common/ContactCreate.razor.rz.scp.css */
/* ===========================
   ContactCreate / ContactEdit - Shared Form Styles
   Flat Industrial Minimal
   =========================== */

/* Page Container */
.page-container[b-1ih1s65q42] {
    max-width: 900px;
    margin: 0 auto;
    padding: var(--space-6) var(--space-4);
}

/* Header */
.page-header[b-1ih1s65q42] {
    display: flex;
    align-items: center;
    gap: var(--space-4);
    margin-bottom: var(--space-6);
}

.btn-back[b-1ih1s65q42] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    color: var(--text-muted);
    border: var(--border-width-thin) solid var(--border-color-light);
    text-decoration: none;
    transition: all var(--transition-fast) var(--transition-ease);
    flex-shrink: 0;
}

.btn-back:hover[b-1ih1s65q42] {
    color: var(--color-primary);
    border-color: var(--color-primary);
    background-color: var(--color-gray-50);
    text-decoration: none;
}

.page-header-text[b-1ih1s65q42] {
    flex: 1;
}

.page-title[b-1ih1s65q42] {
    font-size: var(--font-size-xl);
    font-weight: var(--font-weight-bold);
    color: var(--color-primary);
    display: flex;
    align-items: center;
    gap: var(--space-2);
    margin: 0;
}

.page-title svg[b-1ih1s65q42] {
    color: var(--color-primary);
    flex-shrink: 0;
}

.page-subtitle[b-1ih1s65q42] {
    color: var(--text-muted);
    font-size: var(--font-size-sm);
    margin: 2px 0 0 0;
}

/* Alert Bar */
.alert-bar[b-1ih1s65q42] {
    display: flex;
    align-items: center;
    gap: var(--space-2);
    padding: var(--space-3) var(--space-4);
    margin-bottom: var(--space-4);
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-medium);
    border-left: var(--border-width-thick) solid;
}

.alert-bar-danger[b-1ih1s65q42] {
    background-color: #fdeded;
    border-left-color: var(--color-danger);
    color: #5f2120;
}

.alert-bar-close[b-1ih1s65q42] {
    margin-left: auto;
    background: none;
    border: none;
    font-size: var(--font-size-lg);
    cursor: pointer;
    color: inherit;
    opacity: 0.6;
    line-height: 1;
}

.alert-bar-close:hover[b-1ih1s65q42] {
    opacity: 1;
}

/* Form Sections */
.form-section[b-1ih1s65q42] {
    margin-bottom: var(--space-6);
    padding: var(--space-5);
    background-color: var(--color-white);
    border: var(--border-width-thin) solid var(--border-color-light);
}

.section-title[b-1ih1s65q42] {
    display: flex;
    align-items: center;
    gap: var(--space-2);
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-semibold);
    color: var(--color-primary);
    text-transform: uppercase;
    letter-spacing: 0.5px;
    margin: 0 0 var(--space-4) 0;
    padding-bottom: var(--space-3);
    border-bottom: var(--border-width-thin) solid var(--border-color-light);
}

.section-title svg[b-1ih1s65q42] {
    color: var(--color-primary);
    opacity: 0.6;
    flex-shrink: 0;
}

/* Form Grid */
.form-grid[b-1ih1s65q42] {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: var(--space-4);
}

.form-group[b-1ih1s65q42] {
    display: flex;
    flex-direction: column;
}

.form-group-wide[b-1ih1s65q42] {
    grid-column: span 2;
}

.form-group-checkbox[b-1ih1s65q42] {
    display: flex;
    align-items: center;
    padding-top: var(--space-6);
}

.form-group-checkbox .form-check-label[b-1ih1s65q42] {
    display: flex;
    align-items: center;
    gap: var(--space-2);
    font-size: var(--font-size-sm);
    color: var(--text-secondary);
    cursor: pointer;
}

.form-group-checkbox .form-check-input[b-1ih1s65q42] {
    width: 18px;
    height: 18px;
    accent-color: var(--color-primary);
    cursor: pointer;
}

/* Form Controls */
.form-label[b-1ih1s65q42] {
    font-size: var(--font-size-xs);
    font-weight: var(--font-weight-medium);
    color: var(--text-secondary);
    text-transform: uppercase;
    letter-spacing: 0.3px;
    margin-bottom: var(--space-1);
}

.form-control[b-1ih1s65q42] {
    padding: var(--space-2) var(--space-3);
    font-size: var(--font-size-sm);
    color: var(--color-gray-700);
    border: var(--border-width-thin) solid var(--border-color-light);
    background-color: var(--color-white);
    transition: border-color var(--transition-fast) var(--transition-ease);
}

.form-control:focus[b-1ih1s65q42] {
    border-color: var(--color-primary);
    outline: none;
    box-shadow: none;
}

.form-control[b-1ih1s65q42]::placeholder {
    color: var(--color-gray-400);
}

/* Form Actions */
.form-actions[b-1ih1s65q42] {
    display: flex;
    justify-content: flex-end;
    gap: var(--space-3);
    padding-top: var(--space-4);
    border-top: var(--border-width-thin) solid var(--border-color-light);
}

.form-actions .btn[b-1ih1s65q42] {
    display: inline-flex;
    align-items: center;
    gap: var(--space-2);
    padding: var(--space-2) var(--space-5);
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-medium);
    cursor: pointer;
    text-decoration: none;
}

.btn-action[b-1ih1s65q42] {
    background-color: var(--color-action);
    color: var(--text-on-action);
    border: var(--border-width-thin) solid var(--color-action);
    transition: background-color var(--transition-fast) var(--transition-ease);
}

.btn-action:hover[b-1ih1s65q42] {
    background-color: var(--color-action-hover);
    border-color: var(--color-action-hover);
    color: var(--text-on-action);
}

.btn-action:disabled[b-1ih1s65q42] {
    opacity: 0.65;
    cursor: not-allowed;
}

.btn-outline-primary[b-1ih1s65q42] {
    background: transparent;
    color: var(--color-primary);
    border: var(--border-width-thin) solid var(--color-primary);
}

.btn-outline-primary:hover[b-1ih1s65q42] {
    background-color: var(--color-primary);
    color: var(--text-on-primary);
    text-decoration: none;
}

/* Validation */
[b-1ih1s65q42] .validation-message {
    color: var(--color-danger);
    font-size: var(--font-size-xs);
    margin-top: 2px;
}

/* Responsive */
@media (max-width: 768px) {
    .form-grid[b-1ih1s65q42] {
        grid-template-columns: 1fr;
    }

    .form-group-wide[b-1ih1s65q42] {
        grid-column: span 1;
    }

    .form-actions[b-1ih1s65q42] {
        flex-direction: column-reverse;
    }

    .form-actions .btn[b-1ih1s65q42] {
        justify-content: center;
    }
}
/* /Components/Pages/Common/ContactEdit.razor.rz.scp.css */
/* ===========================
   ContactEdit - Scoped Styles
   Reuses same patterns as ContactCreate
   =========================== */

/* Page Container */
.page-container[b-r958csxctl] {
    max-width: 900px;
    margin: 0 auto;
    padding: var(--space-6) var(--space-4);
}

/* Header */
.page-header[b-r958csxctl] {
    display: flex;
    align-items: center;
    gap: var(--space-4);
    margin-bottom: var(--space-6);
}

.btn-back[b-r958csxctl] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    color: var(--text-muted);
    border: var(--border-width-thin) solid var(--border-color-light);
    text-decoration: none;
    transition: all var(--transition-fast) var(--transition-ease);
    flex-shrink: 0;
}

.btn-back:hover[b-r958csxctl] {
    color: var(--color-primary);
    border-color: var(--color-primary);
    background-color: var(--color-gray-50);
    text-decoration: none;
}

.page-header-text[b-r958csxctl] {
    flex: 1;
}

.page-title[b-r958csxctl] {
    font-size: var(--font-size-xl);
    font-weight: var(--font-weight-bold);
    color: var(--color-primary);
    display: flex;
    align-items: center;
    gap: var(--space-2);
    margin: 0;
}

.page-title svg[b-r958csxctl] {
    color: var(--color-primary);
    flex-shrink: 0;
}

.page-subtitle[b-r958csxctl] {
    color: var(--text-muted);
    font-size: var(--font-size-sm);
    margin: 2px 0 0 0;
    display: flex;
    align-items: center;
    gap: var(--space-2);
}

.subtitle-code[b-r958csxctl] {
    font-family: var(--font-mono);
    font-size: var(--font-size-xs);
    color: var(--color-primary);
    opacity: 0.6;
    padding: 1px var(--space-2);
    background-color: var(--color-gray-100);
}

/* Alert Bar */
.alert-bar[b-r958csxctl] {
    display: flex;
    align-items: center;
    gap: var(--space-2);
    padding: var(--space-3) var(--space-4);
    margin-bottom: var(--space-4);
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-medium);
    border-left: var(--border-width-thick) solid;
}

.alert-bar-danger[b-r958csxctl] {
    background-color: #fdeded;
    border-left-color: var(--color-danger);
    color: #5f2120;
}

.alert-bar-close[b-r958csxctl] {
    margin-left: auto;
    background: none;
    border: none;
    font-size: var(--font-size-lg);
    cursor: pointer;
    color: inherit;
    opacity: 0.6;
    line-height: 1;
}

.alert-bar-close:hover[b-r958csxctl] {
    opacity: 1;
}

/* Loading / Empty States */
.loading-state[b-r958csxctl] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: var(--space-16) 0;
    color: var(--text-muted);
    gap: var(--space-4);
}

.empty-state[b-r958csxctl] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: var(--space-16) 0;
    color: var(--text-muted);
    gap: var(--space-3);
}

.empty-state svg[b-r958csxctl] {
    opacity: 0.4;
}

.empty-state-text[b-r958csxctl] {
    font-size: var(--font-size-base);
    margin: 0;
}

/* Form Sections */
.form-section[b-r958csxctl] {
    margin-bottom: var(--space-6);
    padding: var(--space-5);
    background-color: var(--color-white);
    border: var(--border-width-thin) solid var(--border-color-light);
}

.section-title[b-r958csxctl] {
    display: flex;
    align-items: center;
    gap: var(--space-2);
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-semibold);
    color: var(--color-primary);
    text-transform: uppercase;
    letter-spacing: 0.5px;
    margin: 0 0 var(--space-4) 0;
    padding-bottom: var(--space-3);
    border-bottom: var(--border-width-thin) solid var(--border-color-light);
}

.section-title svg[b-r958csxctl] {
    color: var(--color-primary);
    opacity: 0.6;
    flex-shrink: 0;
}

/* Form Grid */
.form-grid[b-r958csxctl] {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: var(--space-4);
}

.form-group[b-r958csxctl] {
    display: flex;
    flex-direction: column;
}

.form-group-wide[b-r958csxctl] {
    grid-column: span 2;
}

/* Form Controls */
.form-label[b-r958csxctl] {
    font-size: var(--font-size-xs);
    font-weight: var(--font-weight-medium);
    color: var(--text-secondary);
    text-transform: uppercase;
    letter-spacing: 0.3px;
    margin-bottom: var(--space-1);
}

.form-control[b-r958csxctl] {
    padding: var(--space-2) var(--space-3);
    font-size: var(--font-size-sm);
    color: var(--color-gray-700);
    border: var(--border-width-thin) solid var(--border-color-light);
    background-color: var(--color-white);
    transition: border-color var(--transition-fast) var(--transition-ease);
}

.form-control:focus[b-r958csxctl] {
    border-color: var(--color-primary);
    outline: none;
    box-shadow: none;
}

.form-control[b-r958csxctl]::placeholder {
    color: var(--color-gray-400);
}

.form-control-static[b-r958csxctl] {
    padding: var(--space-2) var(--space-3);
    font-size: var(--font-size-sm);
    color: var(--text-muted);
    background-color: var(--color-gray-50);
    border: var(--border-width-thin) solid var(--border-color-light);
    font-family: var(--font-mono);
}

/* Form Actions */
.form-actions[b-r958csxctl] {
    display: flex;
    justify-content: flex-end;
    gap: var(--space-3);
    padding-top: var(--space-4);
    border-top: var(--border-width-thin) solid var(--border-color-light);
}

.form-actions .btn[b-r958csxctl] {
    display: inline-flex;
    align-items: center;
    gap: var(--space-2);
    padding: var(--space-2) var(--space-5);
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-medium);
    cursor: pointer;
    text-decoration: none;
}

.btn-action[b-r958csxctl] {
    background-color: var(--color-action);
    color: var(--text-on-action);
    border: var(--border-width-thin) solid var(--color-action);
    transition: background-color var(--transition-fast) var(--transition-ease);
}

.btn-action:hover[b-r958csxctl] {
    background-color: var(--color-action-hover);
    border-color: var(--color-action-hover);
    color: var(--text-on-action);
}

.btn-action:disabled[b-r958csxctl] {
    opacity: 0.65;
    cursor: not-allowed;
}

.btn-outline-primary[b-r958csxctl] {
    background: transparent;
    color: var(--color-primary);
    border: var(--border-width-thin) solid var(--color-primary);
}

.btn-outline-primary:hover[b-r958csxctl] {
    background-color: var(--color-primary);
    color: var(--text-on-primary);
    text-decoration: none;
}

/* Validation */
[b-r958csxctl] .validation-message {
    color: var(--color-danger);
    font-size: var(--font-size-xs);
    margin-top: 2px;
}

/* Responsive */
@media (max-width: 768px) {
    .form-grid[b-r958csxctl] {
        grid-template-columns: 1fr;
    }

    .form-group-wide[b-r958csxctl] {
        grid-column: span 1;
    }

    .form-actions[b-r958csxctl] {
        flex-direction: column-reverse;
    }

    .form-actions .btn[b-r958csxctl] {
        justify-content: center;
    }
}
/* /Components/Pages/Common/ContactList.razor.rz.scp.css */
/* ===========================
   ContactList - Scoped Styles
   Flat Industrial Minimal
   =========================== */

/* Page Container */
.page-container[b-fv8g4mgwr1] {
    max-width: 1200px;
    margin: 0 auto;
    padding: var(--space-6) var(--space-4);
}

/* Header */
.page-header[b-fv8g4mgwr1] {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    margin-bottom: var(--space-6);
    gap: var(--space-4);
}

.page-header-left[b-fv8g4mgwr1] {
    flex: 1;
}

.page-header-right[b-fv8g4mgwr1] {
    flex-shrink: 0;
}

.page-title[b-fv8g4mgwr1] {
    font-size: var(--font-size-2xl);
    font-weight: var(--font-weight-bold);
    color: var(--color-primary);
    display: flex;
    align-items: center;
    gap: var(--space-2);
    margin: 0;
}

.page-title svg[b-fv8g4mgwr1] {
    color: var(--color-primary);
    flex-shrink: 0;
}

.page-subtitle[b-fv8g4mgwr1] {
    color: var(--text-muted);
    font-size: var(--font-size-sm);
    margin: var(--space-1) 0 0 0;
}

/* Action Button */
.btn-action[b-fv8g4mgwr1] {
    display: inline-flex;
    align-items: center;
    gap: var(--space-2);
    padding: var(--space-2) var(--space-4);
    background-color: var(--color-action);
    color: var(--text-on-action);
    border: var(--border-width-thin) solid var(--color-action);
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-medium);
    text-decoration: none;
    cursor: pointer;
    transition: background-color var(--transition-fast) var(--transition-ease),
                box-shadow var(--transition-fast) var(--transition-ease);
}

.btn-action:hover[b-fv8g4mgwr1] {
    background-color: var(--color-action-hover);
    border-color: var(--color-action-hover);
    color: var(--text-on-action);
    text-decoration: none;
    box-shadow: var(--shadow-sm);
}

.btn-action:active[b-fv8g4mgwr1] {
    background-color: var(--color-action-active);
}

/* Alert Bars */
.alert-bar[b-fv8g4mgwr1] {
    display: flex;
    align-items: center;
    gap: var(--space-2);
    padding: var(--space-3) var(--space-4);
    margin-bottom: var(--space-4);
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-medium);
    border-left: var(--border-width-thick) solid;
}

.alert-bar-success[b-fv8g4mgwr1] {
    background-color: #edf7ed;
    border-left-color: var(--color-success);
    color: #1e4620;
}

.alert-bar-danger[b-fv8g4mgwr1] {
    background-color: #fdeded;
    border-left-color: var(--color-danger);
    color: #5f2120;
}

.alert-bar-close[b-fv8g4mgwr1] {
    margin-left: auto;
    background: none;
    border: none;
    font-size: var(--font-size-lg);
    cursor: pointer;
    color: inherit;
    opacity: 0.6;
    line-height: 1;
}

.alert-bar-close:hover[b-fv8g4mgwr1] {
    opacity: 1;
}

/* Search Bar */
.search-bar[b-fv8g4mgwr1] {
    display: flex;
    align-items: center;
    gap: var(--space-4);
    margin-bottom: var(--space-4);
    padding: var(--space-3) var(--space-4);
    background-color: var(--bg-secondary);
    border: var(--border-width-thin) solid var(--border-color-light);
}

.search-input-wrapper[b-fv8g4mgwr1] {
    display: flex;
    align-items: center;
    flex: 1;
    position: relative;
}

.search-icon[b-fv8g4mgwr1] {
    color: var(--text-muted);
    flex-shrink: 0;
    margin-right: var(--space-2);
}

.search-input[b-fv8g4mgwr1] {
    flex: 1;
    border: none;
    background: transparent;
    font-size: var(--font-size-sm);
    color: var(--color-gray-700);
    outline: none;
    padding: var(--space-1) 0;
}

.search-input[b-fv8g4mgwr1]::placeholder {
    color: var(--text-muted);
}

.search-clear[b-fv8g4mgwr1] {
    background: none;
    border: none;
    cursor: pointer;
    color: var(--text-muted);
    padding: var(--space-1);
    display: flex;
    align-items: center;
}

.search-clear:hover[b-fv8g4mgwr1] {
    color: var(--color-primary);
}

.search-count[b-fv8g4mgwr1] {
    flex-shrink: 0;
    font-size: var(--font-size-xs);
    color: var(--text-muted);
    font-weight: var(--font-weight-medium);
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

/* Loading / Empty States */
.loading-state[b-fv8g4mgwr1] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: var(--space-16) 0;
    color: var(--text-muted);
    gap: var(--space-4);
}

.empty-state[b-fv8g4mgwr1] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: var(--space-16) 0;
    color: var(--text-muted);
    gap: var(--space-3);
}

.empty-state svg[b-fv8g4mgwr1] {
    opacity: 0.4;
}

.empty-state-text[b-fv8g4mgwr1] {
    font-size: var(--font-size-base);
    margin: 0;
}

/* Contact List */
.contact-list[b-fv8g4mgwr1] {
    display: flex;
    flex-direction: column;
    border: var(--border-width-thin) solid var(--border-color-light);
}

/* Contact Row */
.contact-row[b-fv8g4mgwr1] {
    display: flex;
    align-items: center;
    gap: var(--space-4);
    padding: var(--space-4);
    border-bottom: var(--border-width-thin) solid var(--border-color-light);
    transition: background-color var(--transition-fast) var(--transition-ease);
}

.contact-row:last-child[b-fv8g4mgwr1] {
    border-bottom: none;
}

.contact-row:hover[b-fv8g4mgwr1] {
    background-color: rgba(11, 36, 62, 0.03);
}

/* Avatar */
.contact-avatar[b-fv8g4mgwr1] {
    flex-shrink: 0;
    width: 40px;
    height: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: var(--color-gray-100);
    color: var(--color-primary);
}

/* Contact Info */
.contact-info[b-fv8g4mgwr1] {
    flex: 1;
    min-width: 0;
}

.contact-name[b-fv8g4mgwr1] {
    font-size: var(--font-size-base);
    font-weight: var(--font-weight-semibold);
    color: var(--color-primary);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.contact-meta[b-fv8g4mgwr1] {
    display: flex;
    align-items: center;
    gap: var(--space-1);
    flex-wrap: wrap;
    font-size: var(--font-size-xs);
    color: var(--text-secondary);
    margin-top: 2px;
}

.contact-code[b-fv8g4mgwr1] {
    font-family: var(--font-mono);
    font-weight: var(--font-weight-medium);
    color: var(--color-primary);
    opacity: 0.7;
}

.meta-separator[b-fv8g4mgwr1] {
    color: var(--color-gray-300);
}

.contact-details[b-fv8g4mgwr1] {
    display: flex;
    align-items: center;
    gap: var(--space-4);
    margin-top: var(--space-1);
}

.contact-detail-item[b-fv8g4mgwr1] {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    font-size: var(--font-size-xs);
    color: var(--text-muted);
}

.contact-detail-item svg[b-fv8g4mgwr1] {
    flex-shrink: 0;
}

/* Badges */
.contact-badges[b-fv8g4mgwr1] {
    flex-shrink: 0;
    display: flex;
    gap: var(--space-2);
}

.badge[b-fv8g4mgwr1] {
    display: inline-flex;
    align-items: center;
    padding: 3px var(--space-2);
    font-size: var(--font-size-xs);
    font-weight: var(--font-weight-medium);
    letter-spacing: 0.3px;
    text-transform: uppercase;
}

.badge-primary[b-fv8g4mgwr1] {
    background-color: rgba(11, 36, 62, 0.1);
    color: var(--color-primary);
}

.badge-info[b-fv8g4mgwr1] {
    background-color: rgba(23, 162, 184, 0.1);
    color: var(--color-info);
}

/* Action Buttons */
.contact-actions[b-fv8g4mgwr1] {
    flex-shrink: 0;
    display: flex;
    align-items: center;
    gap: var(--space-1);
}

.btn-icon[b-fv8g4mgwr1] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 36px;
    background: none;
    border: var(--border-width-thin) solid transparent;
    cursor: pointer;
    color: var(--text-muted);
    text-decoration: none;
    transition: all var(--transition-fast) var(--transition-ease);
}

.btn-icon:hover[b-fv8g4mgwr1] {
    color: var(--color-primary);
    background-color: var(--color-gray-100);
    border-color: var(--border-color-light);
    text-decoration: none;
}

.btn-icon-danger:hover[b-fv8g4mgwr1] {
    color: var(--color-action);
    background-color: rgba(178, 34, 34, 0.06);
    border-color: rgba(178, 34, 34, 0.2);
}

/* Overlay & Dialog */
.overlay[b-fv8g4mgwr1] {
    position: fixed;
    inset: 0;
    background-color: rgba(0, 0, 0, 0.4);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: var(--z-modal-backdrop);
}

.confirm-dialog[b-fv8g4mgwr1] {
    background-color: var(--color-white);
    padding: var(--space-8);
    max-width: 420px;
    width: 90%;
    box-shadow: var(--shadow-xl);
    text-align: center;
    z-index: var(--z-modal);
}

.confirm-icon[b-fv8g4mgwr1] {
    color: var(--color-action);
    margin-bottom: var(--space-4);
}

.confirm-dialog h3[b-fv8g4mgwr1] {
    font-size: var(--font-size-lg);
    font-weight: var(--font-weight-semibold);
    color: var(--color-primary);
    margin: 0 0 var(--space-2) 0;
}

.confirm-dialog p[b-fv8g4mgwr1] {
    font-size: var(--font-size-sm);
    color: var(--text-secondary);
    margin: 0 0 var(--space-2) 0;
}

.confirm-warning[b-fv8g4mgwr1] {
    font-size: var(--font-size-xs) !important;
    color: var(--color-action) !important;
    font-weight: var(--font-weight-medium);
}

.confirm-actions[b-fv8g4mgwr1] {
    display: flex;
    gap: var(--space-3);
    justify-content: center;
    margin-top: var(--space-6);
}

.confirm-actions .btn[b-fv8g4mgwr1] {
    min-width: 100px;
    padding: var(--space-2) var(--space-4);
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-medium);
    cursor: pointer;
}

/* Outline Primary Button (used in confirm dialog) */
.btn-outline-primary[b-fv8g4mgwr1] {
    background: transparent;
    color: var(--color-primary);
    border: var(--border-width-thin) solid var(--color-primary);
}

.btn-outline-primary:hover[b-fv8g4mgwr1] {
    background-color: var(--color-primary);
    color: var(--text-on-primary);
}

/* Responsive */
@media (max-width: 768px) {
    .page-header[b-fv8g4mgwr1] {
        flex-direction: column;
        gap: var(--space-3);
    }

    .contact-row[b-fv8g4mgwr1] {
        flex-wrap: wrap;
    }

    .contact-badges[b-fv8g4mgwr1] {
        order: 5;
    }

    .contact-actions[b-fv8g4mgwr1] {
        order: 6;
        margin-left: auto;
    }

    .contact-details[b-fv8g4mgwr1] {
        flex-wrap: wrap;
    }
}
/* /Components/Pages/Common/CountryCreate.razor.rz.scp.css */
/* ===========================
   CountryCreate - Scoped Styles
   Flat Industrial Minimal
   =========================== */

/* Page Container */
.page-container[b-hh7821j9oe] {
    max-width: 900px;
    margin: 0 auto;
    padding: var(--space-6) var(--space-4);
}

/* Header */
.page-header[b-hh7821j9oe] {
    display: flex;
    align-items: center;
    gap: var(--space-4);
    margin-bottom: var(--space-6);
}

.btn-back[b-hh7821j9oe] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    color: var(--text-muted);
    border: var(--border-width-thin) solid var(--border-color-light);
    text-decoration: none;
    transition: all var(--transition-fast) var(--transition-ease);
    flex-shrink: 0;
}

.btn-back:hover[b-hh7821j9oe] {
    color: var(--color-primary);
    border-color: var(--color-primary);
    background-color: var(--color-gray-50);
    text-decoration: none;
}

.page-header-text[b-hh7821j9oe] {
    flex: 1;
}

.page-title[b-hh7821j9oe] {
    font-size: var(--font-size-xl);
    font-weight: var(--font-weight-bold);
    color: var(--color-primary);
    display: flex;
    align-items: center;
    gap: var(--space-2);
    margin: 0;
}

.page-title svg[b-hh7821j9oe] {
    color: var(--color-primary);
    flex-shrink: 0;
}

.page-subtitle[b-hh7821j9oe] {
    color: var(--text-muted);
    font-size: var(--font-size-sm);
    margin: 2px 0 0 0;
}

/* Alert Bar */
.alert-bar[b-hh7821j9oe] {
    display: flex;
    align-items: center;
    gap: var(--space-2);
    padding: var(--space-3) var(--space-4);
    margin-bottom: var(--space-4);
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-medium);
    border-left: var(--border-width-thick) solid;
}

.alert-bar-danger[b-hh7821j9oe] {
    background-color: #fdeded;
    border-left-color: var(--color-danger);
    color: #5f2120;
}

.alert-bar-close[b-hh7821j9oe] {
    margin-left: auto;
    background: none;
    border: none;
    font-size: var(--font-size-lg);
    cursor: pointer;
    color: inherit;
    opacity: 0.6;
    line-height: 1;
}

.alert-bar-close:hover[b-hh7821j9oe] {
    opacity: 1;
}

/* Form Sections */
.form-section[b-hh7821j9oe] {
    margin-bottom: var(--space-6);
    padding: var(--space-5);
    background-color: var(--color-white);
    border: var(--border-width-thin) solid var(--border-color-light);
}

.section-title[b-hh7821j9oe] {
    display: flex;
    align-items: center;
    gap: var(--space-2);
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-semibold);
    color: var(--color-primary);
    text-transform: uppercase;
    letter-spacing: 0.5px;
    margin: 0 0 var(--space-4) 0;
    padding-bottom: var(--space-3);
    border-bottom: var(--border-width-thin) solid var(--border-color-light);
}

.section-title svg[b-hh7821j9oe] {
    color: var(--color-primary);
    opacity: 0.6;
    flex-shrink: 0;
}

/* Form Grid */
.form-grid[b-hh7821j9oe] {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: var(--space-4);
}

.form-group[b-hh7821j9oe] {
    display: flex;
    flex-direction: column;
}

.form-group-wide[b-hh7821j9oe] {
    grid-column: span 2;
}

/* Form Controls */
.form-label[b-hh7821j9oe] {
    font-size: var(--font-size-xs);
    font-weight: var(--font-weight-medium);
    color: var(--text-secondary);
    text-transform: uppercase;
    letter-spacing: 0.3px;
    margin-bottom: var(--space-1);
}

.form-control[b-hh7821j9oe] {
    padding: var(--space-2) var(--space-3);
    font-size: var(--font-size-sm);
    color: var(--color-gray-700);
    border: var(--border-width-thin) solid var(--border-color-light);
    background-color: var(--color-white);
    transition: border-color var(--transition-fast) var(--transition-ease);
}

.form-control:focus[b-hh7821j9oe] {
    border-color: var(--color-primary);
    outline: none;
    box-shadow: none;
}

.form-control[b-hh7821j9oe]::placeholder {
    color: var(--color-gray-400);
}

/* Form Actions */
.form-actions[b-hh7821j9oe] {
    display: flex;
    justify-content: flex-end;
    gap: var(--space-3);
    padding-top: var(--space-4);
    border-top: var(--border-width-thin) solid var(--border-color-light);
}

.form-actions .btn[b-hh7821j9oe] {
    display: inline-flex;
    align-items: center;
    gap: var(--space-2);
    padding: var(--space-2) var(--space-5);
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-medium);
    cursor: pointer;
    text-decoration: none;
}

.btn-action[b-hh7821j9oe] {
    background-color: var(--color-action);
    color: var(--text-on-action);
    border: var(--border-width-thin) solid var(--color-action);
    transition: background-color var(--transition-fast) var(--transition-ease);
}

.btn-action:hover[b-hh7821j9oe] {
    background-color: var(--color-action-hover);
    border-color: var(--color-action-hover);
    color: var(--text-on-action);
}

.btn-action:disabled[b-hh7821j9oe] {
    opacity: 0.65;
    cursor: not-allowed;
}

.btn-outline-primary[b-hh7821j9oe] {
    background: transparent;
    color: var(--color-primary);
    border: var(--border-width-thin) solid var(--color-primary);
}

.btn-outline-primary:hover[b-hh7821j9oe] {
    background-color: var(--color-primary);
    color: var(--text-on-primary);
    text-decoration: none;
}

/* Validation */
[b-hh7821j9oe] .validation-message {
    color: var(--color-danger);
    font-size: var(--font-size-xs);
    margin-top: 2px;
}

/* Responsive */
@media (max-width: 768px) {
    .form-grid[b-hh7821j9oe] {
        grid-template-columns: 1fr;
    }

    .form-group-wide[b-hh7821j9oe] {
        grid-column: span 1;
    }

    .form-actions[b-hh7821j9oe] {
        flex-direction: column-reverse;
    }

    .form-actions .btn[b-hh7821j9oe] {
        justify-content: center;
    }
}
/* /Components/Pages/Common/CountryEdit.razor.rz.scp.css */
/* ===========================
   CountryEdit - Scoped Styles
   Flat Industrial Minimal
   =========================== */

/* Page Container */
.page-container[b-mj1r8rcu88] {
    max-width: 900px;
    margin: 0 auto;
    padding: var(--space-6) var(--space-4);
}

/* Header */
.page-header[b-mj1r8rcu88] {
    display: flex;
    align-items: center;
    gap: var(--space-4);
    margin-bottom: var(--space-6);
}

.btn-back[b-mj1r8rcu88] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    color: var(--text-muted);
    border: var(--border-width-thin) solid var(--border-color-light);
    text-decoration: none;
    transition: all var(--transition-fast) var(--transition-ease);
    flex-shrink: 0;
}

.btn-back:hover[b-mj1r8rcu88] {
    color: var(--color-primary);
    border-color: var(--color-primary);
    background-color: var(--color-gray-50);
    text-decoration: none;
}

.page-header-text[b-mj1r8rcu88] {
    flex: 1;
}

.page-title[b-mj1r8rcu88] {
    font-size: var(--font-size-xl);
    font-weight: var(--font-weight-bold);
    color: var(--color-primary);
    display: flex;
    align-items: center;
    gap: var(--space-2);
    margin: 0;
}

.page-title svg[b-mj1r8rcu88] {
    color: var(--color-primary);
    flex-shrink: 0;
}

.page-subtitle[b-mj1r8rcu88] {
    color: var(--text-muted);
    font-size: var(--font-size-sm);
    margin: 2px 0 0 0;
    display: flex;
    align-items: center;
    gap: var(--space-2);
}

.subtitle-code[b-mj1r8rcu88] {
    font-family: var(--font-mono);
    font-size: var(--font-size-xs);
    color: var(--color-primary);
    opacity: 0.6;
    padding: 1px var(--space-2);
    background-color: var(--color-gray-100);
}

/* Alert Bar */
.alert-bar[b-mj1r8rcu88] {
    display: flex;
    align-items: center;
    gap: var(--space-2);
    padding: var(--space-3) var(--space-4);
    margin-bottom: var(--space-4);
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-medium);
    border-left: var(--border-width-thick) solid;
}

.alert-bar-danger[b-mj1r8rcu88] {
    background-color: #fdeded;
    border-left-color: var(--color-danger);
    color: #5f2120;
}

.alert-bar-close[b-mj1r8rcu88] {
    margin-left: auto;
    background: none;
    border: none;
    font-size: var(--font-size-lg);
    cursor: pointer;
    color: inherit;
    opacity: 0.6;
    line-height: 1;
}

.alert-bar-close:hover[b-mj1r8rcu88] {
    opacity: 1;
}

/* Loading / Empty States */
.loading-state[b-mj1r8rcu88] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: var(--space-16) 0;
    color: var(--text-muted);
    gap: var(--space-4);
}

.empty-state[b-mj1r8rcu88] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: var(--space-16) 0;
    color: var(--text-muted);
    gap: var(--space-3);
}

.empty-state svg[b-mj1r8rcu88] {
    opacity: 0.4;
}

.empty-state-text[b-mj1r8rcu88] {
    font-size: var(--font-size-base);
    margin: 0;
}

/* Form Sections */
.form-section[b-mj1r8rcu88] {
    margin-bottom: var(--space-6);
    padding: var(--space-5);
    background-color: var(--color-white);
    border: var(--border-width-thin) solid var(--border-color-light);
}

.section-title[b-mj1r8rcu88] {
    display: flex;
    align-items: center;
    gap: var(--space-2);
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-semibold);
    color: var(--color-primary);
    text-transform: uppercase;
    letter-spacing: 0.5px;
    margin: 0 0 var(--space-4) 0;
    padding-bottom: var(--space-3);
    border-bottom: var(--border-width-thin) solid var(--border-color-light);
}

.section-title svg[b-mj1r8rcu88] {
    color: var(--color-primary);
    opacity: 0.6;
    flex-shrink: 0;
}

/* Form Grid */
.form-grid[b-mj1r8rcu88] {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: var(--space-4);
}

.form-group[b-mj1r8rcu88] {
    display: flex;
    flex-direction: column;
}

.form-group-wide[b-mj1r8rcu88] {
    grid-column: span 2;
}

/* Form Controls */
.form-label[b-mj1r8rcu88] {
    font-size: var(--font-size-xs);
    font-weight: var(--font-weight-medium);
    color: var(--text-secondary);
    text-transform: uppercase;
    letter-spacing: 0.3px;
    margin-bottom: var(--space-1);
}

.form-control[b-mj1r8rcu88] {
    padding: var(--space-2) var(--space-3);
    font-size: var(--font-size-sm);
    color: var(--color-gray-700);
    border: var(--border-width-thin) solid var(--border-color-light);
    background-color: var(--color-white);
    transition: border-color var(--transition-fast) var(--transition-ease);
}

.form-control:focus[b-mj1r8rcu88] {
    border-color: var(--color-primary);
    outline: none;
    box-shadow: none;
}

.form-control[b-mj1r8rcu88]::placeholder {
    color: var(--color-gray-400);
}

.form-control-static[b-mj1r8rcu88] {
    padding: var(--space-2) var(--space-3);
    font-size: var(--font-size-sm);
    color: var(--text-muted);
    background-color: var(--color-gray-50);
    border: var(--border-width-thin) solid var(--border-color-light);
    font-family: var(--font-mono);
}

/* Form Actions */
.form-actions[b-mj1r8rcu88] {
    display: flex;
    justify-content: flex-end;
    gap: var(--space-3);
    padding-top: var(--space-4);
    border-top: var(--border-width-thin) solid var(--border-color-light);
}

.form-actions .btn[b-mj1r8rcu88] {
    display: inline-flex;
    align-items: center;
    gap: var(--space-2);
    padding: var(--space-2) var(--space-5);
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-medium);
    cursor: pointer;
    text-decoration: none;
}

.btn-action[b-mj1r8rcu88] {
    background-color: var(--color-action);
    color: var(--text-on-action);
    border: var(--border-width-thin) solid var(--color-action);
    transition: background-color var(--transition-fast) var(--transition-ease);
}

.btn-action:hover[b-mj1r8rcu88] {
    background-color: var(--color-action-hover);
    border-color: var(--color-action-hover);
    color: var(--text-on-action);
}

.btn-action:disabled[b-mj1r8rcu88] {
    opacity: 0.65;
    cursor: not-allowed;
}

.btn-outline-primary[b-mj1r8rcu88] {
    background: transparent;
    color: var(--color-primary);
    border: var(--border-width-thin) solid var(--color-primary);
}

.btn-outline-primary:hover[b-mj1r8rcu88] {
    background-color: var(--color-primary);
    color: var(--text-on-primary);
    text-decoration: none;
}

/* Validation */
[b-mj1r8rcu88] .validation-message {
    color: var(--color-danger);
    font-size: var(--font-size-xs);
    margin-top: 2px;
}

/* Responsive */
@media (max-width: 768px) {
    .form-grid[b-mj1r8rcu88] {
        grid-template-columns: 1fr;
    }

    .form-group-wide[b-mj1r8rcu88] {
        grid-column: span 1;
    }

    .form-actions[b-mj1r8rcu88] {
        flex-direction: column-reverse;
    }

    .form-actions .btn[b-mj1r8rcu88] {
        justify-content: center;
    }
}
/* /Components/Pages/Common/CountryList.razor.rz.scp.css */
/* ===========================
   CountryList - Scoped Styles
   Flat Industrial Minimal
   =========================== */

/* Page Container */
.page-container[b-0tnhm7v24q] {
    max-width: 1200px;
    margin: 0 auto;
    padding: var(--space-6) var(--space-4);
}

/* Header */
.page-header[b-0tnhm7v24q] {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    margin-bottom: var(--space-6);
    gap: var(--space-4);
}

.page-header-left[b-0tnhm7v24q] {
    flex: 1;
}

.page-header-right[b-0tnhm7v24q] {
    flex-shrink: 0;
}

.page-title[b-0tnhm7v24q] {
    font-size: var(--font-size-2xl);
    font-weight: var(--font-weight-bold);
    color: var(--color-primary);
    display: flex;
    align-items: center;
    gap: var(--space-2);
    margin: 0;
}

.page-title svg[b-0tnhm7v24q] {
    color: var(--color-primary);
    flex-shrink: 0;
}

.page-subtitle[b-0tnhm7v24q] {
    color: var(--text-muted);
    font-size: var(--font-size-sm);
    margin: var(--space-1) 0 0 0;
}

/* Action Button */
.btn-action[b-0tnhm7v24q] {
    display: inline-flex;
    align-items: center;
    gap: var(--space-2);
    padding: var(--space-2) var(--space-4);
    background-color: var(--color-action);
    color: var(--text-on-action);
    border: var(--border-width-thin) solid var(--color-action);
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-medium);
    text-decoration: none;
    cursor: pointer;
    transition: background-color var(--transition-fast) var(--transition-ease),
                box-shadow var(--transition-fast) var(--transition-ease);
}

.btn-action:hover[b-0tnhm7v24q] {
    background-color: var(--color-action-hover);
    border-color: var(--color-action-hover);
    color: var(--text-on-action);
    text-decoration: none;
    box-shadow: var(--shadow-sm);
}

.btn-action:active[b-0tnhm7v24q] {
    background-color: var(--color-action-active);
}

/* Alert Bars */
.alert-bar[b-0tnhm7v24q] {
    display: flex;
    align-items: center;
    gap: var(--space-2);
    padding: var(--space-3) var(--space-4);
    margin-bottom: var(--space-4);
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-medium);
    border-left: var(--border-width-thick) solid;
}

.alert-bar-success[b-0tnhm7v24q] {
    background-color: #edf7ed;
    border-left-color: var(--color-success);
    color: #1e4620;
}

.alert-bar-danger[b-0tnhm7v24q] {
    background-color: #fdeded;
    border-left-color: var(--color-danger);
    color: #5f2120;
}

.alert-bar-close[b-0tnhm7v24q] {
    margin-left: auto;
    background: none;
    border: none;
    font-size: var(--font-size-lg);
    cursor: pointer;
    color: inherit;
    opacity: 0.6;
    line-height: 1;
}

.alert-bar-close:hover[b-0tnhm7v24q] {
    opacity: 1;
}

/* Search Bar */
.search-bar[b-0tnhm7v24q] {
    display: flex;
    align-items: center;
    gap: var(--space-4);
    margin-bottom: var(--space-4);
    padding: var(--space-3) var(--space-4);
    background-color: var(--bg-secondary);
    border: var(--border-width-thin) solid var(--border-color-light);
}

.search-input-wrapper[b-0tnhm7v24q] {
    display: flex;
    align-items: center;
    flex: 1;
    position: relative;
}

.search-icon[b-0tnhm7v24q] {
    color: var(--text-muted);
    flex-shrink: 0;
    margin-right: var(--space-2);
}

.search-input[b-0tnhm7v24q] {
    flex: 1;
    border: none;
    background: transparent;
    font-size: var(--font-size-sm);
    color: var(--color-gray-700);
    outline: none;
    padding: var(--space-1) 0;
}

.search-input[b-0tnhm7v24q]::placeholder {
    color: var(--text-muted);
}

.search-clear[b-0tnhm7v24q] {
    background: none;
    border: none;
    cursor: pointer;
    color: var(--text-muted);
    padding: var(--space-1);
    display: flex;
    align-items: center;
}

.search-clear:hover[b-0tnhm7v24q] {
    color: var(--color-primary);
}

.search-count[b-0tnhm7v24q] {
    flex-shrink: 0;
    font-size: var(--font-size-xs);
    color: var(--text-muted);
    font-weight: var(--font-weight-medium);
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

/* Loading / Empty States */
.loading-state[b-0tnhm7v24q] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: var(--space-16) 0;
    color: var(--text-muted);
    gap: var(--space-4);
}

.empty-state[b-0tnhm7v24q] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: var(--space-16) 0;
    color: var(--text-muted);
    gap: var(--space-3);
}

.empty-state svg[b-0tnhm7v24q] {
    opacity: 0.4;
}

.empty-state-text[b-0tnhm7v24q] {
    font-size: var(--font-size-base);
    margin: 0;
}

/* Item List */
.item-list[b-0tnhm7v24q] {
    display: flex;
    flex-direction: column;
    border: var(--border-width-thin) solid var(--border-color-light);
}

/* Item Row */
.item-row[b-0tnhm7v24q] {
    display: flex;
    align-items: center;
    gap: var(--space-4);
    padding: var(--space-4);
    border-bottom: var(--border-width-thin) solid var(--border-color-light);
    transition: background-color var(--transition-fast) var(--transition-ease);
}

.item-row:last-child[b-0tnhm7v24q] {
    border-bottom: none;
}

.item-row:hover[b-0tnhm7v24q] {
    background-color: rgba(11, 36, 62, 0.03);
}

/* Avatar */
.item-avatar[b-0tnhm7v24q] {
    flex-shrink: 0;
    width: 40px;
    height: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: var(--color-gray-100);
    color: var(--color-primary);
}

/* Item Info */
.item-info[b-0tnhm7v24q] {
    flex: 1;
    min-width: 0;
}

.item-name[b-0tnhm7v24q] {
    font-size: var(--font-size-base);
    font-weight: var(--font-weight-semibold);
    color: var(--color-primary);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.item-meta[b-0tnhm7v24q] {
    display: flex;
    align-items: center;
    gap: var(--space-1);
    flex-wrap: wrap;
    font-size: var(--font-size-xs);
    color: var(--text-secondary);
    margin-top: 2px;
}

.item-code[b-0tnhm7v24q] {
    font-family: var(--font-mono);
    font-weight: var(--font-weight-medium);
    color: var(--color-primary);
    opacity: 0.7;
}

.meta-separator[b-0tnhm7v24q] {
    color: var(--color-gray-300);
}

/* Action Buttons */
.item-actions[b-0tnhm7v24q] {
    flex-shrink: 0;
    display: flex;
    align-items: center;
    gap: var(--space-1);
}

.btn-icon[b-0tnhm7v24q] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 36px;
    background: none;
    border: var(--border-width-thin) solid transparent;
    cursor: pointer;
    color: var(--text-muted);
    text-decoration: none;
    transition: all var(--transition-fast) var(--transition-ease);
}

.btn-icon:hover[b-0tnhm7v24q] {
    color: var(--color-primary);
    background-color: var(--color-gray-100);
    border-color: var(--border-color-light);
    text-decoration: none;
}

.btn-icon-danger:hover[b-0tnhm7v24q] {
    color: var(--color-action);
    background-color: rgba(178, 34, 34, 0.06);
    border-color: rgba(178, 34, 34, 0.2);
}

/* Overlay & Dialog */
.overlay[b-0tnhm7v24q] {
    position: fixed;
    inset: 0;
    background-color: rgba(0, 0, 0, 0.4);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: var(--z-modal-backdrop);
}

.confirm-dialog[b-0tnhm7v24q] {
    background-color: var(--color-white);
    padding: var(--space-8);
    max-width: 420px;
    width: 90%;
    box-shadow: var(--shadow-xl);
    text-align: center;
    z-index: var(--z-modal);
}

.confirm-icon[b-0tnhm7v24q] {
    color: var(--color-action);
    margin-bottom: var(--space-4);
}

.confirm-dialog h3[b-0tnhm7v24q] {
    font-size: var(--font-size-lg);
    font-weight: var(--font-weight-semibold);
    color: var(--color-primary);
    margin: 0 0 var(--space-2) 0;
}

.confirm-dialog p[b-0tnhm7v24q] {
    font-size: var(--font-size-sm);
    color: var(--text-secondary);
    margin: 0 0 var(--space-2) 0;
}

.confirm-warning[b-0tnhm7v24q] {
    font-size: var(--font-size-xs) !important;
    color: var(--color-action) !important;
    font-weight: var(--font-weight-medium);
}

.confirm-actions[b-0tnhm7v24q] {
    display: flex;
    gap: var(--space-3);
    justify-content: center;
    margin-top: var(--space-6);
}

.confirm-actions .btn[b-0tnhm7v24q] {
    min-width: 100px;
    padding: var(--space-2) var(--space-4);
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-medium);
    cursor: pointer;
}

/* Outline Primary Button */
.btn-outline-primary[b-0tnhm7v24q] {
    background: transparent;
    color: var(--color-primary);
    border: var(--border-width-thin) solid var(--color-primary);
}

.btn-outline-primary:hover[b-0tnhm7v24q] {
    background-color: var(--color-primary);
    color: var(--text-on-primary);
}

/* Responsive */
@media (max-width: 768px) {
    .page-header[b-0tnhm7v24q] {
        flex-direction: column;
        gap: var(--space-3);
    }

    .item-row[b-0tnhm7v24q] {
        flex-wrap: wrap;
    }

    .item-actions[b-0tnhm7v24q] {
        order: 6;
        margin-left: auto;
    }
}
/* /Components/Pages/Common/CountryRegionCreate.razor.rz.scp.css */
/* ===========================
   CountryRegionCreate - Scoped Styles
   Flat Industrial Minimal
   =========================== */

/* Page Container */
.page-container[b-vf7a72g7m3] {
    max-width: 900px;
    margin: 0 auto;
    padding: var(--space-6) var(--space-4);
}

/* Header */
.page-header[b-vf7a72g7m3] {
    display: flex;
    align-items: center;
    gap: var(--space-4);
    margin-bottom: var(--space-6);
}

.btn-back[b-vf7a72g7m3] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    color: var(--text-muted);
    border: var(--border-width-thin) solid var(--border-color-light);
    text-decoration: none;
    transition: all var(--transition-fast) var(--transition-ease);
    flex-shrink: 0;
}

.btn-back:hover[b-vf7a72g7m3] {
    color: var(--color-primary);
    border-color: var(--color-primary);
    background-color: var(--color-gray-50);
    text-decoration: none;
}

.page-header-text[b-vf7a72g7m3] {
    flex: 1;
}

.page-title[b-vf7a72g7m3] {
    font-size: var(--font-size-xl);
    font-weight: var(--font-weight-bold);
    color: var(--color-primary);
    display: flex;
    align-items: center;
    gap: var(--space-2);
    margin: 0;
}

.page-title svg[b-vf7a72g7m3] {
    color: var(--color-primary);
    flex-shrink: 0;
}

.page-subtitle[b-vf7a72g7m3] {
    color: var(--text-muted);
    font-size: var(--font-size-sm);
    margin: 2px 0 0 0;
}

/* Alert Bar */
.alert-bar[b-vf7a72g7m3] {
    display: flex;
    align-items: center;
    gap: var(--space-2);
    padding: var(--space-3) var(--space-4);
    margin-bottom: var(--space-4);
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-medium);
    border-left: var(--border-width-thick) solid;
}

.alert-bar-danger[b-vf7a72g7m3] {
    background-color: #fdeded;
    border-left-color: var(--color-danger);
    color: #5f2120;
}

.alert-bar-close[b-vf7a72g7m3] {
    margin-left: auto;
    background: none;
    border: none;
    font-size: var(--font-size-lg);
    cursor: pointer;
    color: inherit;
    opacity: 0.6;
    line-height: 1;
}

.alert-bar-close:hover[b-vf7a72g7m3] {
    opacity: 1;
}

/* Form Sections */
.form-section[b-vf7a72g7m3] {
    margin-bottom: var(--space-6);
    padding: var(--space-5);
    background-color: var(--color-white);
    border: var(--border-width-thin) solid var(--border-color-light);
}

.section-title[b-vf7a72g7m3] {
    display: flex;
    align-items: center;
    gap: var(--space-2);
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-semibold);
    color: var(--color-primary);
    text-transform: uppercase;
    letter-spacing: 0.5px;
    margin: 0 0 var(--space-4) 0;
    padding-bottom: var(--space-3);
    border-bottom: var(--border-width-thin) solid var(--border-color-light);
}

.section-title svg[b-vf7a72g7m3] {
    color: var(--color-primary);
    opacity: 0.6;
    flex-shrink: 0;
}

/* Form Grid */
.form-grid[b-vf7a72g7m3] {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: var(--space-4);
}

.form-group[b-vf7a72g7m3] {
    display: flex;
    flex-direction: column;
}

.form-group-wide[b-vf7a72g7m3] {
    grid-column: span 2;
}

/* Form Controls */
.form-label[b-vf7a72g7m3] {
    font-size: var(--font-size-xs);
    font-weight: var(--font-weight-medium);
    color: var(--text-secondary);
    text-transform: uppercase;
    letter-spacing: 0.3px;
    margin-bottom: var(--space-1);
}

.form-control[b-vf7a72g7m3] {
    padding: var(--space-2) var(--space-3);
    font-size: var(--font-size-sm);
    color: var(--color-gray-700);
    border: var(--border-width-thin) solid var(--border-color-light);
    background-color: var(--color-white);
    transition: border-color var(--transition-fast) var(--transition-ease);
}

.form-control:focus[b-vf7a72g7m3] {
    border-color: var(--color-primary);
    outline: none;
    box-shadow: none;
}

.form-control[b-vf7a72g7m3]::placeholder {
    color: var(--color-gray-400);
}

/* Form Actions */
.form-actions[b-vf7a72g7m3] {
    display: flex;
    justify-content: flex-end;
    gap: var(--space-3);
    padding-top: var(--space-4);
    border-top: var(--border-width-thin) solid var(--border-color-light);
}

.form-actions .btn[b-vf7a72g7m3] {
    display: inline-flex;
    align-items: center;
    gap: var(--space-2);
    padding: var(--space-2) var(--space-5);
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-medium);
    cursor: pointer;
    text-decoration: none;
}

.btn-action[b-vf7a72g7m3] {
    background-color: var(--color-action);
    color: var(--text-on-action);
    border: var(--border-width-thin) solid var(--color-action);
    transition: background-color var(--transition-fast) var(--transition-ease);
}

.btn-action:hover[b-vf7a72g7m3] {
    background-color: var(--color-action-hover);
    border-color: var(--color-action-hover);
    color: var(--text-on-action);
}

.btn-action:disabled[b-vf7a72g7m3] {
    opacity: 0.65;
    cursor: not-allowed;
}

.btn-outline-primary[b-vf7a72g7m3] {
    background: transparent;
    color: var(--color-primary);
    border: var(--border-width-thin) solid var(--color-primary);
}

.btn-outline-primary:hover[b-vf7a72g7m3] {
    background-color: var(--color-primary);
    color: var(--text-on-primary);
    text-decoration: none;
}

/* Validation */
[b-vf7a72g7m3] .validation-message {
    color: var(--color-danger);
    font-size: var(--font-size-xs);
    margin-top: 2px;
}

/* Responsive */
@media (max-width: 768px) {
    .form-grid[b-vf7a72g7m3] {
        grid-template-columns: 1fr;
    }

    .form-group-wide[b-vf7a72g7m3] {
        grid-column: span 1;
    }

    .form-actions[b-vf7a72g7m3] {
        flex-direction: column-reverse;
    }

    .form-actions .btn[b-vf7a72g7m3] {
        justify-content: center;
    }
}
/* /Components/Pages/Common/CountryRegionEdit.razor.rz.scp.css */
/* ===========================
   CountryRegionEdit - Scoped Styles
   Flat Industrial Minimal
   =========================== */

/* Page Container */
.page-container[b-tbh06ri6zt] {
    max-width: 900px;
    margin: 0 auto;
    padding: var(--space-6) var(--space-4);
}

/* Header */
.page-header[b-tbh06ri6zt] {
    display: flex;
    align-items: center;
    gap: var(--space-4);
    margin-bottom: var(--space-6);
}

.btn-back[b-tbh06ri6zt] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    color: var(--text-muted);
    border: var(--border-width-thin) solid var(--border-color-light);
    text-decoration: none;
    transition: all var(--transition-fast) var(--transition-ease);
    flex-shrink: 0;
}

.btn-back:hover[b-tbh06ri6zt] {
    color: var(--color-primary);
    border-color: var(--color-primary);
    background-color: var(--color-gray-50);
    text-decoration: none;
}

.page-header-text[b-tbh06ri6zt] {
    flex: 1;
}

.page-title[b-tbh06ri6zt] {
    font-size: var(--font-size-xl);
    font-weight: var(--font-weight-bold);
    color: var(--color-primary);
    display: flex;
    align-items: center;
    gap: var(--space-2);
    margin: 0;
}

.page-title svg[b-tbh06ri6zt] {
    color: var(--color-primary);
    flex-shrink: 0;
}

.page-subtitle[b-tbh06ri6zt] {
    color: var(--text-muted);
    font-size: var(--font-size-sm);
    margin: 2px 0 0 0;
    display: flex;
    align-items: center;
    gap: var(--space-2);
}

.subtitle-code[b-tbh06ri6zt] {
    font-family: var(--font-mono);
    font-size: var(--font-size-xs);
    color: var(--color-primary);
    opacity: 0.6;
    padding: 1px var(--space-2);
    background-color: var(--color-gray-100);
}

/* Alert Bar */
.alert-bar[b-tbh06ri6zt] {
    display: flex;
    align-items: center;
    gap: var(--space-2);
    padding: var(--space-3) var(--space-4);
    margin-bottom: var(--space-4);
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-medium);
    border-left: var(--border-width-thick) solid;
}

.alert-bar-danger[b-tbh06ri6zt] {
    background-color: #fdeded;
    border-left-color: var(--color-danger);
    color: #5f2120;
}

.alert-bar-close[b-tbh06ri6zt] {
    margin-left: auto;
    background: none;
    border: none;
    font-size: var(--font-size-lg);
    cursor: pointer;
    color: inherit;
    opacity: 0.6;
    line-height: 1;
}

.alert-bar-close:hover[b-tbh06ri6zt] {
    opacity: 1;
}

/* Loading / Empty States */
.loading-state[b-tbh06ri6zt] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: var(--space-16) 0;
    color: var(--text-muted);
    gap: var(--space-4);
}

.empty-state[b-tbh06ri6zt] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: var(--space-16) 0;
    color: var(--text-muted);
    gap: var(--space-3);
}

.empty-state svg[b-tbh06ri6zt] {
    opacity: 0.4;
}

.empty-state-text[b-tbh06ri6zt] {
    font-size: var(--font-size-base);
    margin: 0;
}

/* Form Sections */
.form-section[b-tbh06ri6zt] {
    margin-bottom: var(--space-6);
    padding: var(--space-5);
    background-color: var(--color-white);
    border: var(--border-width-thin) solid var(--border-color-light);
}

.section-title[b-tbh06ri6zt] {
    display: flex;
    align-items: center;
    gap: var(--space-2);
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-semibold);
    color: var(--color-primary);
    text-transform: uppercase;
    letter-spacing: 0.5px;
    margin: 0 0 var(--space-4) 0;
    padding-bottom: var(--space-3);
    border-bottom: var(--border-width-thin) solid var(--border-color-light);
}

.section-title svg[b-tbh06ri6zt] {
    color: var(--color-primary);
    opacity: 0.6;
    flex-shrink: 0;
}

/* Form Grid */
.form-grid[b-tbh06ri6zt] {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: var(--space-4);
}

.form-group[b-tbh06ri6zt] {
    display: flex;
    flex-direction: column;
}

.form-group-wide[b-tbh06ri6zt] {
    grid-column: span 2;
}

/* Form Controls */
.form-label[b-tbh06ri6zt] {
    font-size: var(--font-size-xs);
    font-weight: var(--font-weight-medium);
    color: var(--text-secondary);
    text-transform: uppercase;
    letter-spacing: 0.3px;
    margin-bottom: var(--space-1);
}

.form-control[b-tbh06ri6zt] {
    padding: var(--space-2) var(--space-3);
    font-size: var(--font-size-sm);
    color: var(--color-gray-700);
    border: var(--border-width-thin) solid var(--border-color-light);
    background-color: var(--color-white);
    transition: border-color var(--transition-fast) var(--transition-ease);
}

.form-control:focus[b-tbh06ri6zt] {
    border-color: var(--color-primary);
    outline: none;
    box-shadow: none;
}

.form-control[b-tbh06ri6zt]::placeholder {
    color: var(--color-gray-400);
}

.form-control-static[b-tbh06ri6zt] {
    padding: var(--space-2) var(--space-3);
    font-size: var(--font-size-sm);
    color: var(--text-muted);
    background-color: var(--color-gray-50);
    border: var(--border-width-thin) solid var(--border-color-light);
    font-family: var(--font-mono);
}

/* Form Actions */
.form-actions[b-tbh06ri6zt] {
    display: flex;
    justify-content: flex-end;
    gap: var(--space-3);
    padding-top: var(--space-4);
    border-top: var(--border-width-thin) solid var(--border-color-light);
}

.form-actions .btn[b-tbh06ri6zt] {
    display: inline-flex;
    align-items: center;
    gap: var(--space-2);
    padding: var(--space-2) var(--space-5);
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-medium);
    cursor: pointer;
    text-decoration: none;
}

.btn-action[b-tbh06ri6zt] {
    background-color: var(--color-action);
    color: var(--text-on-action);
    border: var(--border-width-thin) solid var(--color-action);
    transition: background-color var(--transition-fast) var(--transition-ease);
}

.btn-action:hover[b-tbh06ri6zt] {
    background-color: var(--color-action-hover);
    border-color: var(--color-action-hover);
    color: var(--text-on-action);
}

.btn-action:disabled[b-tbh06ri6zt] {
    opacity: 0.65;
    cursor: not-allowed;
}

.btn-outline-primary[b-tbh06ri6zt] {
    background: transparent;
    color: var(--color-primary);
    border: var(--border-width-thin) solid var(--color-primary);
}

.btn-outline-primary:hover[b-tbh06ri6zt] {
    background-color: var(--color-primary);
    color: var(--text-on-primary);
    text-decoration: none;
}

/* Validation */
[b-tbh06ri6zt] .validation-message {
    color: var(--color-danger);
    font-size: var(--font-size-xs);
    margin-top: 2px;
}

/* Responsive */
@media (max-width: 768px) {
    .form-grid[b-tbh06ri6zt] {
        grid-template-columns: 1fr;
    }

    .form-group-wide[b-tbh06ri6zt] {
        grid-column: span 1;
    }

    .form-actions[b-tbh06ri6zt] {
        flex-direction: column-reverse;
    }

    .form-actions .btn[b-tbh06ri6zt] {
        justify-content: center;
    }
}
/* /Components/Pages/Common/CountryRegionList.razor.rz.scp.css */
/* ===========================
   CountryRegionList - Scoped Styles
   Flat Industrial Minimal
   =========================== */

/* Page Container */
.page-container[b-1cp24zz9hq] {
    max-width: 1200px;
    margin: 0 auto;
    padding: var(--space-6) var(--space-4);
}

/* Header */
.page-header[b-1cp24zz9hq] {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    margin-bottom: var(--space-6);
    gap: var(--space-4);
}

.page-header-left[b-1cp24zz9hq] {
    flex: 1;
}

.page-header-right[b-1cp24zz9hq] {
    flex-shrink: 0;
}

.page-title[b-1cp24zz9hq] {
    font-size: var(--font-size-2xl);
    font-weight: var(--font-weight-bold);
    color: var(--color-primary);
    display: flex;
    align-items: center;
    gap: var(--space-2);
    margin: 0;
}

.page-title svg[b-1cp24zz9hq] {
    color: var(--color-primary);
    flex-shrink: 0;
}

.page-subtitle[b-1cp24zz9hq] {
    color: var(--text-muted);
    font-size: var(--font-size-sm);
    margin: var(--space-1) 0 0 0;
}

/* Action Button */
.btn-action[b-1cp24zz9hq] {
    display: inline-flex;
    align-items: center;
    gap: var(--space-2);
    padding: var(--space-2) var(--space-4);
    background-color: var(--color-action);
    color: var(--text-on-action);
    border: var(--border-width-thin) solid var(--color-action);
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-medium);
    text-decoration: none;
    cursor: pointer;
    transition: background-color var(--transition-fast) var(--transition-ease),
                box-shadow var(--transition-fast) var(--transition-ease);
}

.btn-action:hover[b-1cp24zz9hq] {
    background-color: var(--color-action-hover);
    border-color: var(--color-action-hover);
    color: var(--text-on-action);
    text-decoration: none;
    box-shadow: var(--shadow-sm);
}

.btn-action:active[b-1cp24zz9hq] {
    background-color: var(--color-action-active);
}

/* Alert Bars */
.alert-bar[b-1cp24zz9hq] {
    display: flex;
    align-items: center;
    gap: var(--space-2);
    padding: var(--space-3) var(--space-4);
    margin-bottom: var(--space-4);
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-medium);
    border-left: var(--border-width-thick) solid;
}

.alert-bar-success[b-1cp24zz9hq] {
    background-color: #edf7ed;
    border-left-color: var(--color-success);
    color: #1e4620;
}

.alert-bar-danger[b-1cp24zz9hq] {
    background-color: #fdeded;
    border-left-color: var(--color-danger);
    color: #5f2120;
}

.alert-bar-close[b-1cp24zz9hq] {
    margin-left: auto;
    background: none;
    border: none;
    font-size: var(--font-size-lg);
    cursor: pointer;
    color: inherit;
    opacity: 0.6;
    line-height: 1;
}

.alert-bar-close:hover[b-1cp24zz9hq] {
    opacity: 1;
}

/* Search Bar */
.search-bar[b-1cp24zz9hq] {
    display: flex;
    align-items: center;
    gap: var(--space-4);
    margin-bottom: var(--space-4);
    padding: var(--space-3) var(--space-4);
    background-color: var(--bg-secondary);
    border: var(--border-width-thin) solid var(--border-color-light);
}

.search-input-wrapper[b-1cp24zz9hq] {
    display: flex;
    align-items: center;
    flex: 1;
    position: relative;
}

.search-icon[b-1cp24zz9hq] {
    color: var(--text-muted);
    flex-shrink: 0;
    margin-right: var(--space-2);
}

.search-input[b-1cp24zz9hq] {
    flex: 1;
    border: none;
    background: transparent;
    font-size: var(--font-size-sm);
    color: var(--color-gray-700);
    outline: none;
    padding: var(--space-1) 0;
}

.search-input[b-1cp24zz9hq]::placeholder {
    color: var(--text-muted);
}

.search-clear[b-1cp24zz9hq] {
    background: none;
    border: none;
    cursor: pointer;
    color: var(--text-muted);
    padding: var(--space-1);
    display: flex;
    align-items: center;
}

.search-clear:hover[b-1cp24zz9hq] {
    color: var(--color-primary);
}

.search-count[b-1cp24zz9hq] {
    flex-shrink: 0;
    font-size: var(--font-size-xs);
    color: var(--text-muted);
    font-weight: var(--font-weight-medium);
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

/* Loading / Empty States */
.loading-state[b-1cp24zz9hq] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: var(--space-16) 0;
    color: var(--text-muted);
    gap: var(--space-4);
}

.empty-state[b-1cp24zz9hq] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: var(--space-16) 0;
    color: var(--text-muted);
    gap: var(--space-3);
}

.empty-state svg[b-1cp24zz9hq] {
    opacity: 0.4;
}

.empty-state-text[b-1cp24zz9hq] {
    font-size: var(--font-size-base);
    margin: 0;
}

/* Item List */
.item-list[b-1cp24zz9hq] {
    display: flex;
    flex-direction: column;
    border: var(--border-width-thin) solid var(--border-color-light);
}

/* Item Row */
.item-row[b-1cp24zz9hq] {
    display: flex;
    align-items: center;
    gap: var(--space-4);
    padding: var(--space-4);
    border-bottom: var(--border-width-thin) solid var(--border-color-light);
    transition: background-color var(--transition-fast) var(--transition-ease);
}

.item-row:last-child[b-1cp24zz9hq] {
    border-bottom: none;
}

.item-row:hover[b-1cp24zz9hq] {
    background-color: rgba(11, 36, 62, 0.03);
}

/* Avatar */
.item-avatar[b-1cp24zz9hq] {
    flex-shrink: 0;
    width: 40px;
    height: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: var(--color-gray-100);
    color: var(--color-primary);
}

/* Item Info */
.item-info[b-1cp24zz9hq] {
    flex: 1;
    min-width: 0;
}

.item-name[b-1cp24zz9hq] {
    font-size: var(--font-size-base);
    font-weight: var(--font-weight-semibold);
    color: var(--color-primary);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.item-meta[b-1cp24zz9hq] {
    display: flex;
    align-items: center;
    gap: var(--space-1);
    flex-wrap: wrap;
    font-size: var(--font-size-xs);
    color: var(--text-secondary);
    margin-top: 2px;
}

.item-code[b-1cp24zz9hq] {
    font-family: var(--font-mono);
    font-weight: var(--font-weight-medium);
    color: var(--color-primary);
    opacity: 0.7;
}

.meta-separator[b-1cp24zz9hq] {
    color: var(--color-gray-300);
}

/* Action Buttons */
.item-actions[b-1cp24zz9hq] {
    flex-shrink: 0;
    display: flex;
    align-items: center;
    gap: var(--space-1);
}

.btn-icon[b-1cp24zz9hq] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 36px;
    background: none;
    border: var(--border-width-thin) solid transparent;
    cursor: pointer;
    color: var(--text-muted);
    text-decoration: none;
    transition: all var(--transition-fast) var(--transition-ease);
}

.btn-icon:hover[b-1cp24zz9hq] {
    color: var(--color-primary);
    background-color: var(--color-gray-100);
    border-color: var(--border-color-light);
    text-decoration: none;
}

.btn-icon-danger:hover[b-1cp24zz9hq] {
    color: var(--color-action);
    background-color: rgba(178, 34, 34, 0.06);
    border-color: rgba(178, 34, 34, 0.2);
}

/* Overlay & Dialog */
.overlay[b-1cp24zz9hq] {
    position: fixed;
    inset: 0;
    background-color: rgba(0, 0, 0, 0.4);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: var(--z-modal-backdrop);
}

.confirm-dialog[b-1cp24zz9hq] {
    background-color: var(--color-white);
    padding: var(--space-8);
    max-width: 420px;
    width: 90%;
    box-shadow: var(--shadow-xl);
    text-align: center;
    z-index: var(--z-modal);
}

.confirm-icon[b-1cp24zz9hq] {
    color: var(--color-action);
    margin-bottom: var(--space-4);
}

.confirm-dialog h3[b-1cp24zz9hq] {
    font-size: var(--font-size-lg);
    font-weight: var(--font-weight-semibold);
    color: var(--color-primary);
    margin: 0 0 var(--space-2) 0;
}

.confirm-dialog p[b-1cp24zz9hq] {
    font-size: var(--font-size-sm);
    color: var(--text-secondary);
    margin: 0 0 var(--space-2) 0;
}

.confirm-warning[b-1cp24zz9hq] {
    font-size: var(--font-size-xs) !important;
    color: var(--color-action) !important;
    font-weight: var(--font-weight-medium);
}

.confirm-actions[b-1cp24zz9hq] {
    display: flex;
    gap: var(--space-3);
    justify-content: center;
    margin-top: var(--space-6);
}

.confirm-actions .btn[b-1cp24zz9hq] {
    min-width: 100px;
    padding: var(--space-2) var(--space-4);
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-medium);
    cursor: pointer;
}

/* Outline Primary Button */
.btn-outline-primary[b-1cp24zz9hq] {
    background: transparent;
    color: var(--color-primary);
    border: var(--border-width-thin) solid var(--color-primary);
}

.btn-outline-primary:hover[b-1cp24zz9hq] {
    background-color: var(--color-primary);
    color: var(--text-on-primary);
}

/* Responsive */
@media (max-width: 768px) {
    .page-header[b-1cp24zz9hq] {
        flex-direction: column;
        gap: var(--space-3);
    }

    .item-row[b-1cp24zz9hq] {
        flex-wrap: wrap;
    }

    .item-actions[b-1cp24zz9hq] {
        order: 6;
        margin-left: auto;
    }
}
/* /Components/Pages/Common/CurrencyCreate.razor.rz.scp.css */
/* ===========================
   CurrencyCreate - Scoped Styles
   Flat Industrial Minimal
   =========================== */

/* Page Container */
.page-container[b-eanl1817dm] {
    max-width: 900px;
    margin: 0 auto;
    padding: var(--space-6) var(--space-4);
}

/* Header */
.page-header[b-eanl1817dm] {
    display: flex;
    align-items: center;
    gap: var(--space-4);
    margin-bottom: var(--space-6);
}

.btn-back[b-eanl1817dm] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    color: var(--text-muted);
    border: var(--border-width-thin) solid var(--border-color-light);
    text-decoration: none;
    transition: all var(--transition-fast) var(--transition-ease);
    flex-shrink: 0;
}

.btn-back:hover[b-eanl1817dm] {
    color: var(--color-primary);
    border-color: var(--color-primary);
    background-color: var(--color-gray-50);
    text-decoration: none;
}

.page-header-text[b-eanl1817dm] {
    flex: 1;
}

.page-title[b-eanl1817dm] {
    font-size: var(--font-size-xl);
    font-weight: var(--font-weight-bold);
    color: var(--color-primary);
    display: flex;
    align-items: center;
    gap: var(--space-2);
    margin: 0;
}

.page-title svg[b-eanl1817dm] {
    color: var(--color-primary);
    flex-shrink: 0;
}

.page-subtitle[b-eanl1817dm] {
    color: var(--text-muted);
    font-size: var(--font-size-sm);
    margin: 2px 0 0 0;
}

/* Alert Bar */
.alert-bar[b-eanl1817dm] {
    display: flex;
    align-items: center;
    gap: var(--space-2);
    padding: var(--space-3) var(--space-4);
    margin-bottom: var(--space-4);
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-medium);
    border-left: var(--border-width-thick) solid;
}

.alert-bar-danger[b-eanl1817dm] {
    background-color: #fdeded;
    border-left-color: var(--color-danger);
    color: #5f2120;
}

.alert-bar-close[b-eanl1817dm] {
    margin-left: auto;
    background: none;
    border: none;
    font-size: var(--font-size-lg);
    cursor: pointer;
    color: inherit;
    opacity: 0.6;
    line-height: 1;
}

.alert-bar-close:hover[b-eanl1817dm] {
    opacity: 1;
}

/* Form Sections */
.form-section[b-eanl1817dm] {
    margin-bottom: var(--space-6);
    padding: var(--space-5);
    background-color: var(--color-white);
    border: var(--border-width-thin) solid var(--border-color-light);
}

.section-title[b-eanl1817dm] {
    display: flex;
    align-items: center;
    gap: var(--space-2);
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-semibold);
    color: var(--color-primary);
    text-transform: uppercase;
    letter-spacing: 0.5px;
    margin: 0 0 var(--space-4) 0;
    padding-bottom: var(--space-3);
    border-bottom: var(--border-width-thin) solid var(--border-color-light);
}

.section-title svg[b-eanl1817dm] {
    color: var(--color-primary);
    opacity: 0.6;
    flex-shrink: 0;
}

/* Form Grid */
.form-grid[b-eanl1817dm] {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: var(--space-4);
}

.form-group[b-eanl1817dm] {
    display: flex;
    flex-direction: column;
}

.form-group-wide[b-eanl1817dm] {
    grid-column: span 2;
}

/* Form Controls */
.form-label[b-eanl1817dm] {
    font-size: var(--font-size-xs);
    font-weight: var(--font-weight-medium);
    color: var(--text-secondary);
    text-transform: uppercase;
    letter-spacing: 0.3px;
    margin-bottom: var(--space-1);
}

.form-control[b-eanl1817dm] {
    padding: var(--space-2) var(--space-3);
    font-size: var(--font-size-sm);
    color: var(--color-gray-700);
    border: var(--border-width-thin) solid var(--border-color-light);
    background-color: var(--color-white);
    transition: border-color var(--transition-fast) var(--transition-ease);
}

.form-control:focus[b-eanl1817dm] {
    border-color: var(--color-primary);
    outline: none;
    box-shadow: none;
}

.form-control[b-eanl1817dm]::placeholder {
    color: var(--color-gray-400);
}

/* Form Actions */
.form-actions[b-eanl1817dm] {
    display: flex;
    justify-content: flex-end;
    gap: var(--space-3);
    padding-top: var(--space-4);
    border-top: var(--border-width-thin) solid var(--border-color-light);
}

.form-actions .btn[b-eanl1817dm] {
    display: inline-flex;
    align-items: center;
    gap: var(--space-2);
    padding: var(--space-2) var(--space-5);
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-medium);
    cursor: pointer;
    text-decoration: none;
}

.btn-action[b-eanl1817dm] {
    background-color: var(--color-action);
    color: var(--text-on-action);
    border: var(--border-width-thin) solid var(--color-action);
    transition: background-color var(--transition-fast) var(--transition-ease);
}

.btn-action:hover[b-eanl1817dm] {
    background-color: var(--color-action-hover);
    border-color: var(--color-action-hover);
    color: var(--text-on-action);
}

.btn-action:disabled[b-eanl1817dm] {
    opacity: 0.65;
    cursor: not-allowed;
}

.btn-outline-primary[b-eanl1817dm] {
    background: transparent;
    color: var(--color-primary);
    border: var(--border-width-thin) solid var(--color-primary);
}

.btn-outline-primary:hover[b-eanl1817dm] {
    background-color: var(--color-primary);
    color: var(--text-on-primary);
    text-decoration: none;
}

/* Validation */
[b-eanl1817dm] .validation-message {
    color: var(--color-danger);
    font-size: var(--font-size-xs);
    margin-top: 2px;
}

/* Responsive */
@media (max-width: 768px) {
    .form-grid[b-eanl1817dm] {
        grid-template-columns: 1fr;
    }

    .form-group-wide[b-eanl1817dm] {
        grid-column: span 1;
    }

    .form-actions[b-eanl1817dm] {
        flex-direction: column-reverse;
    }

    .form-actions .btn[b-eanl1817dm] {
        justify-content: center;
    }
}
/* /Components/Pages/Common/CurrencyEdit.razor.rz.scp.css */
/* ===========================
   CurrencyEdit - Scoped Styles
   Flat Industrial Minimal
   =========================== */

/* Page Container */
.page-container[b-j67jsmbtqe] {
    max-width: 900px;
    margin: 0 auto;
    padding: var(--space-6) var(--space-4);
}

/* Header */
.page-header[b-j67jsmbtqe] {
    display: flex;
    align-items: center;
    gap: var(--space-4);
    margin-bottom: var(--space-6);
}

.btn-back[b-j67jsmbtqe] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    color: var(--text-muted);
    border: var(--border-width-thin) solid var(--border-color-light);
    text-decoration: none;
    transition: all var(--transition-fast) var(--transition-ease);
    flex-shrink: 0;
}

.btn-back:hover[b-j67jsmbtqe] {
    color: var(--color-primary);
    border-color: var(--color-primary);
    background-color: var(--color-gray-50);
    text-decoration: none;
}

.page-header-text[b-j67jsmbtqe] {
    flex: 1;
}

.page-title[b-j67jsmbtqe] {
    font-size: var(--font-size-xl);
    font-weight: var(--font-weight-bold);
    color: var(--color-primary);
    display: flex;
    align-items: center;
    gap: var(--space-2);
    margin: 0;
}

.page-title svg[b-j67jsmbtqe] {
    color: var(--color-primary);
    flex-shrink: 0;
}

.page-subtitle[b-j67jsmbtqe] {
    color: var(--text-muted);
    font-size: var(--font-size-sm);
    margin: 2px 0 0 0;
    display: flex;
    align-items: center;
    gap: var(--space-2);
}

.subtitle-code[b-j67jsmbtqe] {
    font-family: var(--font-mono);
    font-size: var(--font-size-xs);
    color: var(--color-primary);
    opacity: 0.6;
    padding: 1px var(--space-2);
    background-color: var(--color-gray-100);
}

/* Alert Bar */
.alert-bar[b-j67jsmbtqe] {
    display: flex;
    align-items: center;
    gap: var(--space-2);
    padding: var(--space-3) var(--space-4);
    margin-bottom: var(--space-4);
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-medium);
    border-left: var(--border-width-thick) solid;
}

.alert-bar-danger[b-j67jsmbtqe] {
    background-color: #fdeded;
    border-left-color: var(--color-danger);
    color: #5f2120;
}

.alert-bar-close[b-j67jsmbtqe] {
    margin-left: auto;
    background: none;
    border: none;
    font-size: var(--font-size-lg);
    cursor: pointer;
    color: inherit;
    opacity: 0.6;
    line-height: 1;
}

.alert-bar-close:hover[b-j67jsmbtqe] {
    opacity: 1;
}

/* Loading / Empty States */
.loading-state[b-j67jsmbtqe] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: var(--space-16) 0;
    color: var(--text-muted);
    gap: var(--space-4);
}

.empty-state[b-j67jsmbtqe] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: var(--space-16) 0;
    color: var(--text-muted);
    gap: var(--space-3);
}

.empty-state svg[b-j67jsmbtqe] {
    opacity: 0.4;
}

.empty-state-text[b-j67jsmbtqe] {
    font-size: var(--font-size-base);
    margin: 0;
}

/* Form Sections */
.form-section[b-j67jsmbtqe] {
    margin-bottom: var(--space-6);
    padding: var(--space-5);
    background-color: var(--color-white);
    border: var(--border-width-thin) solid var(--border-color-light);
}

.section-title[b-j67jsmbtqe] {
    display: flex;
    align-items: center;
    gap: var(--space-2);
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-semibold);
    color: var(--color-primary);
    text-transform: uppercase;
    letter-spacing: 0.5px;
    margin: 0 0 var(--space-4) 0;
    padding-bottom: var(--space-3);
    border-bottom: var(--border-width-thin) solid var(--border-color-light);
}

.section-title svg[b-j67jsmbtqe] {
    color: var(--color-primary);
    opacity: 0.6;
    flex-shrink: 0;
}

/* Form Grid */
.form-grid[b-j67jsmbtqe] {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: var(--space-4);
}

.form-group[b-j67jsmbtqe] {
    display: flex;
    flex-direction: column;
}

.form-group-wide[b-j67jsmbtqe] {
    grid-column: span 2;
}

/* Form Controls */
.form-label[b-j67jsmbtqe] {
    font-size: var(--font-size-xs);
    font-weight: var(--font-weight-medium);
    color: var(--text-secondary);
    text-transform: uppercase;
    letter-spacing: 0.3px;
    margin-bottom: var(--space-1);
}

.form-control[b-j67jsmbtqe] {
    padding: var(--space-2) var(--space-3);
    font-size: var(--font-size-sm);
    color: var(--color-gray-700);
    border: var(--border-width-thin) solid var(--border-color-light);
    background-color: var(--color-white);
    transition: border-color var(--transition-fast) var(--transition-ease);
}

.form-control:focus[b-j67jsmbtqe] {
    border-color: var(--color-primary);
    outline: none;
    box-shadow: none;
}

.form-control[b-j67jsmbtqe]::placeholder {
    color: var(--color-gray-400);
}

.form-control-static[b-j67jsmbtqe] {
    padding: var(--space-2) var(--space-3);
    font-size: var(--font-size-sm);
    color: var(--text-muted);
    background-color: var(--color-gray-50);
    border: var(--border-width-thin) solid var(--border-color-light);
    font-family: var(--font-mono);
}

/* Form Actions */
.form-actions[b-j67jsmbtqe] {
    display: flex;
    justify-content: flex-end;
    gap: var(--space-3);
    padding-top: var(--space-4);
    border-top: var(--border-width-thin) solid var(--border-color-light);
}

.form-actions .btn[b-j67jsmbtqe] {
    display: inline-flex;
    align-items: center;
    gap: var(--space-2);
    padding: var(--space-2) var(--space-5);
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-medium);
    cursor: pointer;
    text-decoration: none;
}

.btn-action[b-j67jsmbtqe] {
    background-color: var(--color-action);
    color: var(--text-on-action);
    border: var(--border-width-thin) solid var(--color-action);
    transition: background-color var(--transition-fast) var(--transition-ease);
}

.btn-action:hover[b-j67jsmbtqe] {
    background-color: var(--color-action-hover);
    border-color: var(--color-action-hover);
    color: var(--text-on-action);
}

.btn-action:disabled[b-j67jsmbtqe] {
    opacity: 0.65;
    cursor: not-allowed;
}

.btn-outline-primary[b-j67jsmbtqe] {
    background: transparent;
    color: var(--color-primary);
    border: var(--border-width-thin) solid var(--color-primary);
}

.btn-outline-primary:hover[b-j67jsmbtqe] {
    background-color: var(--color-primary);
    color: var(--text-on-primary);
    text-decoration: none;
}

/* Validation */
[b-j67jsmbtqe] .validation-message {
    color: var(--color-danger);
    font-size: var(--font-size-xs);
    margin-top: 2px;
}

/* Responsive */
@media (max-width: 768px) {
    .form-grid[b-j67jsmbtqe] {
        grid-template-columns: 1fr;
    }

    .form-group-wide[b-j67jsmbtqe] {
        grid-column: span 1;
    }

    .form-actions[b-j67jsmbtqe] {
        flex-direction: column-reverse;
    }

    .form-actions .btn[b-j67jsmbtqe] {
        justify-content: center;
    }
}
/* /Components/Pages/Common/CurrencyList.razor.rz.scp.css */
/* ===========================
   CurrencyList - Scoped Styles
   Flat Industrial Minimal
   =========================== */

/* Page Container */
.page-container[b-0yspmw985d] {
    max-width: 1200px;
    margin: 0 auto;
    padding: var(--space-6) var(--space-4);
}

/* Header */
.page-header[b-0yspmw985d] {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    margin-bottom: var(--space-6);
    gap: var(--space-4);
}

.page-header-left[b-0yspmw985d] {
    flex: 1;
}

.page-header-right[b-0yspmw985d] {
    flex-shrink: 0;
}

.page-title[b-0yspmw985d] {
    font-size: var(--font-size-2xl);
    font-weight: var(--font-weight-bold);
    color: var(--color-primary);
    display: flex;
    align-items: center;
    gap: var(--space-2);
    margin: 0;
}

.page-title svg[b-0yspmw985d] {
    color: var(--color-primary);
    flex-shrink: 0;
}

.page-subtitle[b-0yspmw985d] {
    color: var(--text-muted);
    font-size: var(--font-size-sm);
    margin: var(--space-1) 0 0 0;
}

/* Action Button */
.btn-action[b-0yspmw985d] {
    display: inline-flex;
    align-items: center;
    gap: var(--space-2);
    padding: var(--space-2) var(--space-4);
    background-color: var(--color-action);
    color: var(--text-on-action);
    border: var(--border-width-thin) solid var(--color-action);
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-medium);
    text-decoration: none;
    cursor: pointer;
    transition: background-color var(--transition-fast) var(--transition-ease),
                box-shadow var(--transition-fast) var(--transition-ease);
}

.btn-action:hover[b-0yspmw985d] {
    background-color: var(--color-action-hover);
    border-color: var(--color-action-hover);
    color: var(--text-on-action);
    text-decoration: none;
    box-shadow: var(--shadow-sm);
}

.btn-action:active[b-0yspmw985d] {
    background-color: var(--color-action-active);
}

/* Alert Bars */
.alert-bar[b-0yspmw985d] {
    display: flex;
    align-items: center;
    gap: var(--space-2);
    padding: var(--space-3) var(--space-4);
    margin-bottom: var(--space-4);
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-medium);
    border-left: var(--border-width-thick) solid;
}

.alert-bar-success[b-0yspmw985d] {
    background-color: #edf7ed;
    border-left-color: var(--color-success);
    color: #1e4620;
}

.alert-bar-danger[b-0yspmw985d] {
    background-color: #fdeded;
    border-left-color: var(--color-danger);
    color: #5f2120;
}

.alert-bar-close[b-0yspmw985d] {
    margin-left: auto;
    background: none;
    border: none;
    font-size: var(--font-size-lg);
    cursor: pointer;
    color: inherit;
    opacity: 0.6;
    line-height: 1;
}

.alert-bar-close:hover[b-0yspmw985d] {
    opacity: 1;
}

/* Search Bar */
.search-bar[b-0yspmw985d] {
    display: flex;
    align-items: center;
    gap: var(--space-4);
    margin-bottom: var(--space-4);
    padding: var(--space-3) var(--space-4);
    background-color: var(--bg-secondary);
    border: var(--border-width-thin) solid var(--border-color-light);
}

.search-input-wrapper[b-0yspmw985d] {
    display: flex;
    align-items: center;
    flex: 1;
    position: relative;
}

.search-icon[b-0yspmw985d] {
    color: var(--text-muted);
    flex-shrink: 0;
    margin-right: var(--space-2);
}

.search-input[b-0yspmw985d] {
    flex: 1;
    border: none;
    background: transparent;
    font-size: var(--font-size-sm);
    color: var(--color-gray-700);
    outline: none;
    padding: var(--space-1) 0;
}

.search-input[b-0yspmw985d]::placeholder {
    color: var(--text-muted);
}

.search-clear[b-0yspmw985d] {
    background: none;
    border: none;
    cursor: pointer;
    color: var(--text-muted);
    padding: var(--space-1);
    display: flex;
    align-items: center;
}

.search-clear:hover[b-0yspmw985d] {
    color: var(--color-primary);
}

.search-count[b-0yspmw985d] {
    flex-shrink: 0;
    font-size: var(--font-size-xs);
    color: var(--text-muted);
    font-weight: var(--font-weight-medium);
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

/* Loading / Empty States */
.loading-state[b-0yspmw985d] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: var(--space-16) 0;
    color: var(--text-muted);
    gap: var(--space-4);
}

.empty-state[b-0yspmw985d] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: var(--space-16) 0;
    color: var(--text-muted);
    gap: var(--space-3);
}

.empty-state svg[b-0yspmw985d] {
    opacity: 0.4;
}

.empty-state-text[b-0yspmw985d] {
    font-size: var(--font-size-base);
    margin: 0;
}

/* Item List */
.item-list[b-0yspmw985d] {
    display: flex;
    flex-direction: column;
    border: var(--border-width-thin) solid var(--border-color-light);
}

/* Item Row */
.item-row[b-0yspmw985d] {
    display: flex;
    align-items: center;
    gap: var(--space-4);
    padding: var(--space-4);
    border-bottom: var(--border-width-thin) solid var(--border-color-light);
    transition: background-color var(--transition-fast) var(--transition-ease);
}

.item-row:last-child[b-0yspmw985d] {
    border-bottom: none;
}

.item-row:hover[b-0yspmw985d] {
    background-color: rgba(11, 36, 62, 0.03);
}

/* Avatar */
.item-avatar[b-0yspmw985d] {
    flex-shrink: 0;
    width: 40px;
    height: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: var(--color-gray-100);
    color: var(--color-primary);
}

/* Item Info */
.item-info[b-0yspmw985d] {
    flex: 1;
    min-width: 0;
}

.item-name[b-0yspmw985d] {
    font-size: var(--font-size-base);
    font-weight: var(--font-weight-semibold);
    color: var(--color-primary);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.item-meta[b-0yspmw985d] {
    display: flex;
    align-items: center;
    gap: var(--space-1);
    flex-wrap: wrap;
    font-size: var(--font-size-xs);
    color: var(--text-secondary);
    margin-top: 2px;
}

.item-code[b-0yspmw985d] {
    font-family: var(--font-mono);
    font-weight: var(--font-weight-medium);
    color: var(--color-primary);
    opacity: 0.7;
}

.meta-separator[b-0yspmw985d] {
    color: var(--color-gray-300);
}

/* Action Buttons */
.item-actions[b-0yspmw985d] {
    flex-shrink: 0;
    display: flex;
    align-items: center;
    gap: var(--space-1);
}

.btn-icon[b-0yspmw985d] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 36px;
    background: none;
    border: var(--border-width-thin) solid transparent;
    cursor: pointer;
    color: var(--text-muted);
    text-decoration: none;
    transition: all var(--transition-fast) var(--transition-ease);
}

.btn-icon:hover[b-0yspmw985d] {
    color: var(--color-primary);
    background-color: var(--color-gray-100);
    border-color: var(--border-color-light);
    text-decoration: none;
}

.btn-icon-danger:hover[b-0yspmw985d] {
    color: var(--color-action);
    background-color: rgba(178, 34, 34, 0.06);
    border-color: rgba(178, 34, 34, 0.2);
}

/* Overlay & Dialog */
.overlay[b-0yspmw985d] {
    position: fixed;
    inset: 0;
    background-color: rgba(0, 0, 0, 0.4);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: var(--z-modal-backdrop);
}

.confirm-dialog[b-0yspmw985d] {
    background-color: var(--color-white);
    padding: var(--space-8);
    max-width: 420px;
    width: 90%;
    box-shadow: var(--shadow-xl);
    text-align: center;
    z-index: var(--z-modal);
}

.confirm-icon[b-0yspmw985d] {
    color: var(--color-action);
    margin-bottom: var(--space-4);
}

.confirm-dialog h3[b-0yspmw985d] {
    font-size: var(--font-size-lg);
    font-weight: var(--font-weight-semibold);
    color: var(--color-primary);
    margin: 0 0 var(--space-2) 0;
}

.confirm-dialog p[b-0yspmw985d] {
    font-size: var(--font-size-sm);
    color: var(--text-secondary);
    margin: 0 0 var(--space-2) 0;
}

.confirm-warning[b-0yspmw985d] {
    font-size: var(--font-size-xs) !important;
    color: var(--color-action) !important;
    font-weight: var(--font-weight-medium);
}

.confirm-actions[b-0yspmw985d] {
    display: flex;
    gap: var(--space-3);
    justify-content: center;
    margin-top: var(--space-6);
}

.confirm-actions .btn[b-0yspmw985d] {
    min-width: 100px;
    padding: var(--space-2) var(--space-4);
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-medium);
    cursor: pointer;
}

/* Outline Primary Button */
.btn-outline-primary[b-0yspmw985d] {
    background: transparent;
    color: var(--color-primary);
    border: var(--border-width-thin) solid var(--color-primary);
}

.btn-outline-primary:hover[b-0yspmw985d] {
    background-color: var(--color-primary);
    color: var(--text-on-primary);
}

/* Responsive */
@media (max-width: 768px) {
    .page-header[b-0yspmw985d] {
        flex-direction: column;
        gap: var(--space-3);
    }

    .item-row[b-0yspmw985d] {
        flex-wrap: wrap;
    }

    .item-actions[b-0yspmw985d] {
        order: 6;
        margin-left: auto;
    }
}
/* /Components/Pages/Common/CustomerCreate.razor.rz.scp.css */
/* ===========================
   ContactCreate / ContactEdit - Shared Form Styles
   Flat Industrial Minimal
   =========================== */

/* Page Container */
.page-container[b-bhzq71ftei] {
    max-width: 900px;
    margin: 0 auto;
    padding: var(--space-6) var(--space-4);
}

/* Header */
.page-header[b-bhzq71ftei] {
    display: flex;
    align-items: center;
    gap: var(--space-4);
    margin-bottom: var(--space-6);
}

.btn-back[b-bhzq71ftei] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    color: var(--text-muted);
    border: var(--border-width-thin) solid var(--border-color-light);
    text-decoration: none;
    transition: all var(--transition-fast) var(--transition-ease);
    flex-shrink: 0;
}

.btn-back:hover[b-bhzq71ftei] {
    color: var(--color-primary);
    border-color: var(--color-primary);
    background-color: var(--color-gray-50);
    text-decoration: none;
}

.page-header-text[b-bhzq71ftei] {
    flex: 1;
}

.page-title[b-bhzq71ftei] {
    font-size: var(--font-size-xl);
    font-weight: var(--font-weight-bold);
    color: var(--color-primary);
    display: flex;
    align-items: center;
    gap: var(--space-2);
    margin: 0;
}

.page-title svg[b-bhzq71ftei] {
    color: var(--color-primary);
    flex-shrink: 0;
}

.page-subtitle[b-bhzq71ftei] {
    color: var(--text-muted);
    font-size: var(--font-size-sm);
    margin: 2px 0 0 0;
}

/* Alert Bar */
.alert-bar[b-bhzq71ftei] {
    display: flex;
    align-items: center;
    gap: var(--space-2);
    padding: var(--space-3) var(--space-4);
    margin-bottom: var(--space-4);
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-medium);
    border-left: var(--border-width-thick) solid;
}

.alert-bar-danger[b-bhzq71ftei] {
    background-color: #fdeded;
    border-left-color: var(--color-danger);
    color: #5f2120;
}

.alert-bar-close[b-bhzq71ftei] {
    margin-left: auto;
    background: none;
    border: none;
    font-size: var(--font-size-lg);
    cursor: pointer;
    color: inherit;
    opacity: 0.6;
    line-height: 1;
}

.alert-bar-close:hover[b-bhzq71ftei] {
    opacity: 1;
}

/* Form Sections */
.form-section[b-bhzq71ftei] {
    margin-bottom: var(--space-6);
    padding: var(--space-5);
    background-color: var(--color-white);
    border: var(--border-width-thin) solid var(--border-color-light);
}

.section-title[b-bhzq71ftei] {
    display: flex;
    align-items: center;
    gap: var(--space-2);
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-semibold);
    color: var(--color-primary);
    text-transform: uppercase;
    letter-spacing: 0.5px;
    margin: 0 0 var(--space-4) 0;
    padding-bottom: var(--space-3);
    border-bottom: var(--border-width-thin) solid var(--border-color-light);
}

.section-title svg[b-bhzq71ftei] {
    color: var(--color-primary);
    opacity: 0.6;
    flex-shrink: 0;
}

/* Form Grid */
.form-grid[b-bhzq71ftei] {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: var(--space-4);
}

.form-group[b-bhzq71ftei] {
    display: flex;
    flex-direction: column;
}

.form-group-wide[b-bhzq71ftei] {
    grid-column: span 2;
}

.form-group-checkbox[b-bhzq71ftei] {
    display: flex;
    align-items: center;
    padding-top: var(--space-6);
}

.form-group-checkbox .form-check-label[b-bhzq71ftei] {
    display: flex;
    align-items: center;
    gap: var(--space-2);
    font-size: var(--font-size-sm);
    color: var(--text-secondary);
    cursor: pointer;
}

.form-group-checkbox .form-check-input[b-bhzq71ftei] {
    width: 18px;
    height: 18px;
    accent-color: var(--color-primary);
    cursor: pointer;
}

/* Form Controls */
.form-label[b-bhzq71ftei] {
    font-size: var(--font-size-xs);
    font-weight: var(--font-weight-medium);
    color: var(--text-secondary);
    text-transform: uppercase;
    letter-spacing: 0.3px;
    margin-bottom: var(--space-1);
}

.form-control[b-bhzq71ftei] {
    padding: var(--space-2) var(--space-3);
    font-size: var(--font-size-sm);
    color: var(--color-gray-700);
    border: var(--border-width-thin) solid var(--border-color-light);
    background-color: var(--color-white);
    transition: border-color var(--transition-fast) var(--transition-ease);
}

.form-control:focus[b-bhzq71ftei] {
    border-color: var(--color-primary);
    outline: none;
    box-shadow: none;
}

.form-control[b-bhzq71ftei]::placeholder {
    color: var(--color-gray-400);
}

/* Form Actions */
.form-actions[b-bhzq71ftei] {
    display: flex;
    justify-content: flex-end;
    gap: var(--space-3);
    padding-top: var(--space-4);
    border-top: var(--border-width-thin) solid var(--border-color-light);
}

.form-actions .btn[b-bhzq71ftei] {
    display: inline-flex;
    align-items: center;
    gap: var(--space-2);
    padding: var(--space-2) var(--space-5);
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-medium);
    cursor: pointer;
    text-decoration: none;
}

.btn-action[b-bhzq71ftei] {
    background-color: var(--color-action);
    color: var(--text-on-action);
    border: var(--border-width-thin) solid var(--color-action);
    transition: background-color var(--transition-fast) var(--transition-ease);
}

.btn-action:hover[b-bhzq71ftei] {
    background-color: var(--color-action-hover);
    border-color: var(--color-action-hover);
    color: var(--text-on-action);
}

.btn-action:disabled[b-bhzq71ftei] {
    opacity: 0.65;
    cursor: not-allowed;
}

.btn-outline-primary[b-bhzq71ftei] {
    background: transparent;
    color: var(--color-primary);
    border: var(--border-width-thin) solid var(--color-primary);
}

.btn-outline-primary:hover[b-bhzq71ftei] {
    background-color: var(--color-primary);
    color: var(--text-on-primary);
    text-decoration: none;
}

/* Validation */
[b-bhzq71ftei] .validation-message {
    color: var(--color-danger);
    font-size: var(--font-size-xs);
    margin-top: 2px;
}

/* Responsive */
@media (max-width: 768px) {
    .form-grid[b-bhzq71ftei] {
        grid-template-columns: 1fr;
    }

    .form-group-wide[b-bhzq71ftei] {
        grid-column: span 1;
    }

    .form-actions[b-bhzq71ftei] {
        flex-direction: column-reverse;
    }

    .form-actions .btn[b-bhzq71ftei] {
        justify-content: center;
    }
}
/* /Components/Pages/Common/CustomerEdit.razor.rz.scp.css */
/* ===========================
   ContactEdit - Scoped Styles
   Reuses same patterns as ContactCreate
   =========================== */

/* Page Container */
.page-container[b-thp4qcka0q] {
    max-width: 900px;
    margin: 0 auto;
    padding: var(--space-6) var(--space-4);
}

/* Header */
.page-header[b-thp4qcka0q] {
    display: flex;
    align-items: center;
    gap: var(--space-4);
    margin-bottom: var(--space-6);
}

.btn-back[b-thp4qcka0q] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    color: var(--text-muted);
    border: var(--border-width-thin) solid var(--border-color-light);
    text-decoration: none;
    transition: all var(--transition-fast) var(--transition-ease);
    flex-shrink: 0;
}

.btn-back:hover[b-thp4qcka0q] {
    color: var(--color-primary);
    border-color: var(--color-primary);
    background-color: var(--color-gray-50);
    text-decoration: none;
}

.page-header-text[b-thp4qcka0q] {
    flex: 1;
}

.page-title[b-thp4qcka0q] {
    font-size: var(--font-size-xl);
    font-weight: var(--font-weight-bold);
    color: var(--color-primary);
    display: flex;
    align-items: center;
    gap: var(--space-2);
    margin: 0;
}

.page-title svg[b-thp4qcka0q] {
    color: var(--color-primary);
    flex-shrink: 0;
}

.page-subtitle[b-thp4qcka0q] {
    color: var(--text-muted);
    font-size: var(--font-size-sm);
    margin: 2px 0 0 0;
    display: flex;
    align-items: center;
    gap: var(--space-2);
}

.subtitle-code[b-thp4qcka0q] {
    font-family: var(--font-mono);
    font-size: var(--font-size-xs);
    color: var(--color-primary);
    opacity: 0.6;
    padding: 1px var(--space-2);
    background-color: var(--color-gray-100);
}

/* Alert Bar */
.alert-bar[b-thp4qcka0q] {
    display: flex;
    align-items: center;
    gap: var(--space-2);
    padding: var(--space-3) var(--space-4);
    margin-bottom: var(--space-4);
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-medium);
    border-left: var(--border-width-thick) solid;
}

.alert-bar-danger[b-thp4qcka0q] {
    background-color: #fdeded;
    border-left-color: var(--color-danger);
    color: #5f2120;
}

.alert-bar-close[b-thp4qcka0q] {
    margin-left: auto;
    background: none;
    border: none;
    font-size: var(--font-size-lg);
    cursor: pointer;
    color: inherit;
    opacity: 0.6;
    line-height: 1;
}

.alert-bar-close:hover[b-thp4qcka0q] {
    opacity: 1;
}

/* Loading / Empty States */
.loading-state[b-thp4qcka0q] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: var(--space-16) 0;
    color: var(--text-muted);
    gap: var(--space-4);
}

.empty-state[b-thp4qcka0q] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: var(--space-16) 0;
    color: var(--text-muted);
    gap: var(--space-3);
}

.empty-state svg[b-thp4qcka0q] {
    opacity: 0.4;
}

.empty-state-text[b-thp4qcka0q] {
    font-size: var(--font-size-base);
    margin: 0;
}

/* Form Sections */
.form-section[b-thp4qcka0q] {
    margin-bottom: var(--space-6);
    padding: var(--space-5);
    background-color: var(--color-white);
    border: var(--border-width-thin) solid var(--border-color-light);
}

.section-title[b-thp4qcka0q] {
    display: flex;
    align-items: center;
    gap: var(--space-2);
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-semibold);
    color: var(--color-primary);
    text-transform: uppercase;
    letter-spacing: 0.5px;
    margin: 0 0 var(--space-4) 0;
    padding-bottom: var(--space-3);
    border-bottom: var(--border-width-thin) solid var(--border-color-light);
}

.section-title svg[b-thp4qcka0q] {
    color: var(--color-primary);
    opacity: 0.6;
    flex-shrink: 0;
}

/* Form Grid */
.form-grid[b-thp4qcka0q] {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: var(--space-4);
}

.form-group[b-thp4qcka0q] {
    display: flex;
    flex-direction: column;
}

.form-group-wide[b-thp4qcka0q] {
    grid-column: span 2;
}

/* Form Controls */
.form-label[b-thp4qcka0q] {
    font-size: var(--font-size-xs);
    font-weight: var(--font-weight-medium);
    color: var(--text-secondary);
    text-transform: uppercase;
    letter-spacing: 0.3px;
    margin-bottom: var(--space-1);
}

.form-control[b-thp4qcka0q] {
    padding: var(--space-2) var(--space-3);
    font-size: var(--font-size-sm);
    color: var(--color-gray-700);
    border: var(--border-width-thin) solid var(--border-color-light);
    background-color: var(--color-white);
    transition: border-color var(--transition-fast) var(--transition-ease);
}

.form-control:focus[b-thp4qcka0q] {
    border-color: var(--color-primary);
    outline: none;
    box-shadow: none;
}

.form-control[b-thp4qcka0q]::placeholder {
    color: var(--color-gray-400);
}

.form-control-static[b-thp4qcka0q] {
    padding: var(--space-2) var(--space-3);
    font-size: var(--font-size-sm);
    color: var(--text-muted);
    background-color: var(--color-gray-50);
    border: var(--border-width-thin) solid var(--border-color-light);
    font-family: var(--font-mono);
}

/* Form Actions */
.form-actions[b-thp4qcka0q] {
    display: flex;
    justify-content: flex-end;
    gap: var(--space-3);
    padding-top: var(--space-4);
    border-top: var(--border-width-thin) solid var(--border-color-light);
}

.form-actions .btn[b-thp4qcka0q] {
    display: inline-flex;
    align-items: center;
    gap: var(--space-2);
    padding: var(--space-2) var(--space-5);
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-medium);
    cursor: pointer;
    text-decoration: none;
}

.btn-action[b-thp4qcka0q] {
    background-color: var(--color-action);
    color: var(--text-on-action);
    border: var(--border-width-thin) solid var(--color-action);
    transition: background-color var(--transition-fast) var(--transition-ease);
}

.btn-action:hover[b-thp4qcka0q] {
    background-color: var(--color-action-hover);
    border-color: var(--color-action-hover);
    color: var(--text-on-action);
}

.btn-action:disabled[b-thp4qcka0q] {
    opacity: 0.65;
    cursor: not-allowed;
}

.btn-outline-primary[b-thp4qcka0q] {
    background: transparent;
    color: var(--color-primary);
    border: var(--border-width-thin) solid var(--color-primary);
}

.btn-outline-primary:hover[b-thp4qcka0q] {
    background-color: var(--color-primary);
    color: var(--text-on-primary);
    text-decoration: none;
}

/* Validation */
[b-thp4qcka0q] .validation-message {
    color: var(--color-danger);
    font-size: var(--font-size-xs);
    margin-top: 2px;
}

/* Responsive */
@media (max-width: 768px) {
    .form-grid[b-thp4qcka0q] {
        grid-template-columns: 1fr;
    }

    .form-group-wide[b-thp4qcka0q] {
        grid-column: span 1;
    }

    .form-actions[b-thp4qcka0q] {
        flex-direction: column-reverse;
    }

    .form-actions .btn[b-thp4qcka0q] {
        justify-content: center;
    }
}
/* /Components/Pages/Common/CustomerList.razor.rz.scp.css */
/* ===========================
   ContactList - Scoped Styles
   Flat Industrial Minimal
   =========================== */

/* Page Container */
.page-container[b-6lqaaq29wf] {
    max-width: 1200px;
    margin: 0 auto;
    padding: var(--space-6) var(--space-4);
}

/* Header */
.page-header[b-6lqaaq29wf] {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    margin-bottom: var(--space-6);
    gap: var(--space-4);
}

.page-header-left[b-6lqaaq29wf] {
    flex: 1;
}

.page-header-right[b-6lqaaq29wf] {
    flex-shrink: 0;
}

.page-title[b-6lqaaq29wf] {
    font-size: var(--font-size-2xl);
    font-weight: var(--font-weight-bold);
    color: var(--color-primary);
    display: flex;
    align-items: center;
    gap: var(--space-2);
    margin: 0;
}

.page-title svg[b-6lqaaq29wf] {
    color: var(--color-primary);
    flex-shrink: 0;
}

.page-subtitle[b-6lqaaq29wf] {
    color: var(--text-muted);
    font-size: var(--font-size-sm);
    margin: var(--space-1) 0 0 0;
}

/* Action Button */
.btn-action[b-6lqaaq29wf] {
    display: inline-flex;
    align-items: center;
    gap: var(--space-2);
    padding: var(--space-2) var(--space-4);
    background-color: var(--color-action);
    color: var(--text-on-action);
    border: var(--border-width-thin) solid var(--color-action);
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-medium);
    text-decoration: none;
    cursor: pointer;
    transition: background-color var(--transition-fast) var(--transition-ease),
                box-shadow var(--transition-fast) var(--transition-ease);
}

.btn-action:hover[b-6lqaaq29wf] {
    background-color: var(--color-action-hover);
    border-color: var(--color-action-hover);
    color: var(--text-on-action);
    text-decoration: none;
    box-shadow: var(--shadow-sm);
}

.btn-action:active[b-6lqaaq29wf] {
    background-color: var(--color-action-active);
}

/* Alert Bars */
.alert-bar[b-6lqaaq29wf] {
    display: flex;
    align-items: center;
    gap: var(--space-2);
    padding: var(--space-3) var(--space-4);
    margin-bottom: var(--space-4);
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-medium);
    border-left: var(--border-width-thick) solid;
}

.alert-bar-success[b-6lqaaq29wf] {
    background-color: #edf7ed;
    border-left-color: var(--color-success);
    color: #1e4620;
}

.alert-bar-danger[b-6lqaaq29wf] {
    background-color: #fdeded;
    border-left-color: var(--color-danger);
    color: #5f2120;
}

.alert-bar-close[b-6lqaaq29wf] {
    margin-left: auto;
    background: none;
    border: none;
    font-size: var(--font-size-lg);
    cursor: pointer;
    color: inherit;
    opacity: 0.6;
    line-height: 1;
}

.alert-bar-close:hover[b-6lqaaq29wf] {
    opacity: 1;
}

/* Search Bar */
.search-bar[b-6lqaaq29wf] {
    display: flex;
    align-items: center;
    gap: var(--space-4);
    margin-bottom: var(--space-4);
    padding: var(--space-3) var(--space-4);
    background-color: var(--bg-secondary);
    border: var(--border-width-thin) solid var(--border-color-light);
}

.search-input-wrapper[b-6lqaaq29wf] {
    display: flex;
    align-items: center;
    flex: 1;
    position: relative;
}

.search-icon[b-6lqaaq29wf] {
    color: var(--text-muted);
    flex-shrink: 0;
    margin-right: var(--space-2);
}

.search-input[b-6lqaaq29wf] {
    flex: 1;
    border: none;
    background: transparent;
    font-size: var(--font-size-sm);
    color: var(--color-gray-700);
    outline: none;
    padding: var(--space-1) 0;
}

.search-input[b-6lqaaq29wf]::placeholder {
    color: var(--text-muted);
}

.search-clear[b-6lqaaq29wf] {
    background: none;
    border: none;
    cursor: pointer;
    color: var(--text-muted);
    padding: var(--space-1);
    display: flex;
    align-items: center;
}

.search-clear:hover[b-6lqaaq29wf] {
    color: var(--color-primary);
}

.search-count[b-6lqaaq29wf] {
    flex-shrink: 0;
    font-size: var(--font-size-xs);
    color: var(--text-muted);
    font-weight: var(--font-weight-medium);
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

/* Loading / Empty States */
.loading-state[b-6lqaaq29wf] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: var(--space-16) 0;
    color: var(--text-muted);
    gap: var(--space-4);
}

.empty-state[b-6lqaaq29wf] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: var(--space-16) 0;
    color: var(--text-muted);
    gap: var(--space-3);
}

.empty-state svg[b-6lqaaq29wf] {
    opacity: 0.4;
}

.empty-state-text[b-6lqaaq29wf] {
    font-size: var(--font-size-base);
    margin: 0;
}

/* Contact List */
.contact-list[b-6lqaaq29wf] {
    display: flex;
    flex-direction: column;
    border: var(--border-width-thin) solid var(--border-color-light);
}

/* Contact Row */
.contact-row[b-6lqaaq29wf] {
    display: flex;
    align-items: center;
    gap: var(--space-4);
    padding: var(--space-4);
    border-bottom: var(--border-width-thin) solid var(--border-color-light);
    transition: background-color var(--transition-fast) var(--transition-ease);
}

.contact-row:last-child[b-6lqaaq29wf] {
    border-bottom: none;
}

.contact-row:hover[b-6lqaaq29wf] {
    background-color: rgba(11, 36, 62, 0.03);
}

/* Avatar */
.contact-avatar[b-6lqaaq29wf] {
    flex-shrink: 0;
    width: 40px;
    height: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: var(--color-gray-100);
    color: var(--color-primary);
}

/* Contact Info */
.contact-info[b-6lqaaq29wf] {
    flex: 1;
    min-width: 0;
}

.contact-name[b-6lqaaq29wf] {
    font-size: var(--font-size-base);
    font-weight: var(--font-weight-semibold);
    color: var(--color-primary);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.contact-meta[b-6lqaaq29wf] {
    display: flex;
    align-items: center;
    gap: var(--space-1);
    flex-wrap: wrap;
    font-size: var(--font-size-xs);
    color: var(--text-secondary);
    margin-top: 2px;
}

.contact-code[b-6lqaaq29wf] {
    font-family: var(--font-mono);
    font-weight: var(--font-weight-medium);
    color: var(--color-primary);
    opacity: 0.7;
}

.meta-separator[b-6lqaaq29wf] {
    color: var(--color-gray-300);
}

.contact-details[b-6lqaaq29wf] {
    display: flex;
    align-items: center;
    gap: var(--space-4);
    margin-top: var(--space-1);
}

.contact-detail-item[b-6lqaaq29wf] {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    font-size: var(--font-size-xs);
    color: var(--text-muted);
}

.contact-detail-item svg[b-6lqaaq29wf] {
    flex-shrink: 0;
}

/* Badges */
.contact-badges[b-6lqaaq29wf] {
    flex-shrink: 0;
    display: flex;
    gap: var(--space-2);
}

.badge[b-6lqaaq29wf] {
    display: inline-flex;
    align-items: center;
    padding: 3px var(--space-2);
    font-size: var(--font-size-xs);
    font-weight: var(--font-weight-medium);
    letter-spacing: 0.3px;
    text-transform: uppercase;
}

.badge-primary[b-6lqaaq29wf] {
    background-color: rgba(11, 36, 62, 0.1);
    color: var(--color-primary);
}

.badge-info[b-6lqaaq29wf] {
    background-color: rgba(23, 162, 184, 0.1);
    color: var(--color-info);
}

.badge-danger[b-6lqaaq29wf] {
    background-color: rgba(178, 34, 34, 0.1);
    color: var(--color-action);
}

/* Action Buttons */
.contact-actions[b-6lqaaq29wf] {
    flex-shrink: 0;
    display: flex;
    align-items: center;
    gap: var(--space-1);
}

.actions-separator[b-6lqaaq29wf] {
    width: 1px;
    height: 20px;
    background-color: var(--border-color-light);
    margin: 0 var(--space-1);
}

.btn-icon[b-6lqaaq29wf] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 36px;
    background: none;
    border: var(--border-width-thin) solid transparent;
    cursor: pointer;
    color: var(--text-muted);
    text-decoration: none;
    transition: all var(--transition-fast) var(--transition-ease);
}

.btn-icon:hover[b-6lqaaq29wf] {
    color: var(--color-primary);
    background-color: var(--color-gray-100);
    border-color: var(--border-color-light);
    text-decoration: none;
}

.btn-icon-danger:hover[b-6lqaaq29wf] {
    color: var(--color-action);
    background-color: rgba(178, 34, 34, 0.06);
    border-color: rgba(178, 34, 34, 0.2);
}

/* Overlay & Dialog */
.overlay[b-6lqaaq29wf] {
    position: fixed;
    inset: 0;
    background-color: rgba(0, 0, 0, 0.4);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: var(--z-modal-backdrop);
}

.confirm-dialog[b-6lqaaq29wf] {
    background-color: var(--color-white);
    padding: var(--space-8);
    max-width: 420px;
    width: 90%;
    box-shadow: var(--shadow-xl);
    text-align: center;
    z-index: var(--z-modal);
}

.confirm-icon[b-6lqaaq29wf] {
    color: var(--color-action);
    margin-bottom: var(--space-4);
}

.confirm-dialog h3[b-6lqaaq29wf] {
    font-size: var(--font-size-lg);
    font-weight: var(--font-weight-semibold);
    color: var(--color-primary);
    margin: 0 0 var(--space-2) 0;
}

.confirm-dialog p[b-6lqaaq29wf] {
    font-size: var(--font-size-sm);
    color: var(--text-secondary);
    margin: 0 0 var(--space-2) 0;
}

.confirm-warning[b-6lqaaq29wf] {
    font-size: var(--font-size-xs) !important;
    color: var(--color-action) !important;
    font-weight: var(--font-weight-medium);
}

.confirm-actions[b-6lqaaq29wf] {
    display: flex;
    gap: var(--space-3);
    justify-content: center;
    margin-top: var(--space-6);
}

.confirm-actions .btn[b-6lqaaq29wf] {
    min-width: 100px;
    padding: var(--space-2) var(--space-4);
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-medium);
    cursor: pointer;
}

/* Outline Primary Button (used in confirm dialog) */
.btn-outline-primary[b-6lqaaq29wf] {
    background: transparent;
    color: var(--color-primary);
    border: var(--border-width-thin) solid var(--color-primary);
}

.btn-outline-primary:hover[b-6lqaaq29wf] {
    background-color: var(--color-primary);
    color: var(--text-on-primary);
}

/* Responsive */
@media (max-width: 768px) {
    .page-header[b-6lqaaq29wf] {
        flex-direction: column;
        gap: var(--space-3);
    }

    .contact-row[b-6lqaaq29wf] {
        flex-wrap: wrap;
    }

    .contact-badges[b-6lqaaq29wf] {
        order: 5;
    }

    .contact-actions[b-6lqaaq29wf] {
        order: 6;
        margin-left: auto;
    }

    .contact-details[b-6lqaaq29wf] {
        flex-wrap: wrap;
    }
}
/* /Components/Pages/Common/DocumentGroupTypeList.razor.rz.scp.css */
/* ===========================
   DocumentGroupTypeList - Scoped Styles
   Flat Industrial Minimal
   =========================== */

/* Page Container */
.page-container[b-yqlzjnjfyp] {
    max-width: 1200px;
    margin: 0 auto;
    padding: var(--space-6) var(--space-4);
}

/* Header */
.page-header[b-yqlzjnjfyp] {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    margin-bottom: var(--space-6);
    gap: var(--space-4);
}

.page-header-left[b-yqlzjnjfyp] {
    flex: 1;
}

.page-title[b-yqlzjnjfyp] {
    font-size: var(--font-size-2xl);
    font-weight: var(--font-weight-bold);
    color: var(--color-primary);
    display: flex;
    align-items: center;
    gap: var(--space-2);
    margin: 0;
}

.page-title svg[b-yqlzjnjfyp] {
    color: var(--color-primary);
    flex-shrink: 0;
}

.page-subtitle[b-yqlzjnjfyp] {
    color: var(--text-muted);
    font-size: var(--font-size-sm);
    margin: var(--space-1) 0 0 0;
}

/* Alert Bars */
.alert-bar[b-yqlzjnjfyp] {
    display: flex;
    align-items: center;
    gap: var(--space-2);
    padding: var(--space-3) var(--space-4);
    margin-bottom: var(--space-4);
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-medium);
    border-left: var(--border-width-thick) solid;
}

.alert-bar-danger[b-yqlzjnjfyp] {
    background-color: #fdeded;
    border-left-color: var(--color-danger);
    color: #5f2120;
}

.alert-bar-close[b-yqlzjnjfyp] {
    margin-left: auto;
    background: none;
    border: none;
    font-size: var(--font-size-lg);
    cursor: pointer;
    color: inherit;
    opacity: 0.6;
    line-height: 1;
}

.alert-bar-close:hover[b-yqlzjnjfyp] {
    opacity: 1;
}

/* Search Bar */
.search-bar[b-yqlzjnjfyp] {
    display: flex;
    align-items: center;
    gap: var(--space-4);
    margin-bottom: var(--space-4);
    padding: var(--space-3) var(--space-4);
    background-color: var(--bg-secondary);
    border: var(--border-width-thin) solid var(--border-color-light);
}

.search-input-wrapper[b-yqlzjnjfyp] {
    display: flex;
    align-items: center;
    flex: 1;
    position: relative;
}

.search-icon[b-yqlzjnjfyp] {
    color: var(--text-muted);
    flex-shrink: 0;
    margin-right: var(--space-2);
}

.search-input[b-yqlzjnjfyp] {
    flex: 1;
    border: none;
    background: transparent;
    font-size: var(--font-size-sm);
    color: var(--color-gray-700);
    outline: none;
    padding: var(--space-1) 0;
}

.search-input[b-yqlzjnjfyp]::placeholder {
    color: var(--text-muted);
}

.search-clear[b-yqlzjnjfyp] {
    background: none;
    border: none;
    cursor: pointer;
    color: var(--text-muted);
    padding: var(--space-1);
    display: flex;
    align-items: center;
}

.search-clear:hover[b-yqlzjnjfyp] {
    color: var(--color-primary);
}

.search-count[b-yqlzjnjfyp] {
    flex-shrink: 0;
    font-size: var(--font-size-xs);
    color: var(--text-muted);
    font-weight: var(--font-weight-medium);
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

/* Loading / Empty States */
.loading-state[b-yqlzjnjfyp] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: var(--space-16) 0;
    color: var(--text-muted);
    gap: var(--space-4);
}

.empty-state[b-yqlzjnjfyp] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: var(--space-16) 0;
    color: var(--text-muted);
    gap: var(--space-3);
}

.empty-state svg[b-yqlzjnjfyp] {
    opacity: 0.4;
}

.empty-state-text[b-yqlzjnjfyp] {
    font-size: var(--font-size-base);
    margin: 0;
}

/* Item List */
.item-list[b-yqlzjnjfyp] {
    display: flex;
    flex-direction: column;
    border: var(--border-width-thin) solid var(--border-color-light);
}

/* Item Row */
.item-row[b-yqlzjnjfyp] {
    display: flex;
    align-items: center;
    gap: var(--space-4);
    padding: var(--space-4);
    border-bottom: var(--border-width-thin) solid var(--border-color-light);
    transition: background-color var(--transition-fast) var(--transition-ease);
    cursor: pointer;
}

.item-row:last-child[b-yqlzjnjfyp] {
    border-bottom: none;
}

.item-row:hover[b-yqlzjnjfyp] {
    background-color: rgba(11, 36, 62, 0.03);
}

/* Avatar */
.item-avatar[b-yqlzjnjfyp] {
    flex-shrink: 0;
    width: 40px;
    height: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: var(--color-gray-100);
    color: var(--color-primary);
}

/* Item Info */
.item-info[b-yqlzjnjfyp] {
    flex: 1;
    min-width: 0;
}

.item-name[b-yqlzjnjfyp] {
    font-size: var(--font-size-base);
    font-weight: var(--font-weight-semibold);
    color: var(--color-primary);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.item-meta[b-yqlzjnjfyp] {
    display: flex;
    align-items: center;
    gap: var(--space-1);
    flex-wrap: wrap;
    font-size: var(--font-size-xs);
    color: var(--text-secondary);
    margin-top: 2px;
}

.item-code[b-yqlzjnjfyp] {
    font-family: var(--font-mono);
    font-weight: var(--font-weight-medium);
    color: var(--color-primary);
    opacity: 0.7;
}

.meta-separator[b-yqlzjnjfyp] {
    color: var(--color-gray-300);
}

/* Action Buttons */
.item-actions[b-yqlzjnjfyp] {
    flex-shrink: 0;
    display: flex;
    align-items: center;
    gap: var(--space-1);
}

.btn-icon[b-yqlzjnjfyp] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 36px;
    background: none;
    border: var(--border-width-thin) solid transparent;
    cursor: pointer;
    color: var(--text-muted);
    text-decoration: none;
    transition: all var(--transition-fast) var(--transition-ease);
}

.btn-icon:hover[b-yqlzjnjfyp] {
    color: var(--color-primary);
    background-color: var(--color-gray-100);
    border-color: var(--border-color-light);
    text-decoration: none;
}

/* Detail Panel */
.detail-panel[b-yqlzjnjfyp] {
    padding: var(--space-4) var(--space-6);
    background-color: var(--bg-secondary);
    border-bottom: var(--border-width-thin) solid var(--border-color-light);
}

.detail-grid[b-yqlzjnjfyp] {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
    gap: var(--space-4);
}

.detail-field[b-yqlzjnjfyp] {
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.detail-label[b-yqlzjnjfyp] {
    font-size: var(--font-size-xs);
    color: var(--text-muted);
    font-weight: var(--font-weight-medium);
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.detail-value[b-yqlzjnjfyp] {
    font-size: var(--font-size-sm);
    color: var(--color-primary);
    font-weight: var(--font-weight-medium);
}

/* Outline Primary Button */
.btn-outline-primary[b-yqlzjnjfyp] {
    background: transparent;
    color: var(--color-primary);
    border: var(--border-width-thin) solid var(--color-primary);
}

.btn-outline-primary:hover[b-yqlzjnjfyp] {
    background-color: var(--color-primary);
    color: var(--text-on-primary);
}

/* Responsive */
@media (max-width: 768px) {
    .page-header[b-yqlzjnjfyp] {
        flex-direction: column;
        gap: var(--space-3);
    }

    .item-row[b-yqlzjnjfyp] {
        flex-wrap: wrap;
    }

    .detail-grid[b-yqlzjnjfyp] {
        grid-template-columns: 1fr;
    }
}
/* /Components/Pages/Common/ImageCreate.razor.rz.scp.css */
/* ===========================
   ImageCreate - Scoped Styles
   Flat Industrial Minimal
   =========================== */

/* Page Container */
.page-container[b-ept18b7y7j] {
    max-width: 900px;
    margin: 0 auto;
    padding: var(--space-6) var(--space-4);
}

/* Header */
.page-header[b-ept18b7y7j] {
    display: flex;
    align-items: center;
    gap: var(--space-4);
    margin-bottom: var(--space-6);
}

.btn-back[b-ept18b7y7j] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    color: var(--text-muted);
    border: var(--border-width-thin) solid var(--border-color-light);
    text-decoration: none;
    transition: all var(--transition-fast) var(--transition-ease);
    flex-shrink: 0;
}

.btn-back:hover[b-ept18b7y7j] {
    color: var(--color-primary);
    border-color: var(--color-primary);
    background-color: var(--color-gray-50);
    text-decoration: none;
}

.page-header-text[b-ept18b7y7j] {
    flex: 1;
}

.page-title[b-ept18b7y7j] {
    font-size: var(--font-size-xl);
    font-weight: var(--font-weight-bold);
    color: var(--color-primary);
    display: flex;
    align-items: center;
    gap: var(--space-2);
    margin: 0;
}

.page-title svg[b-ept18b7y7j] {
    color: var(--color-primary);
    flex-shrink: 0;
}

.page-subtitle[b-ept18b7y7j] {
    color: var(--text-muted);
    font-size: var(--font-size-sm);
    margin: 2px 0 0 0;
}

/* Alert Bar */
.alert-bar[b-ept18b7y7j] {
    display: flex;
    align-items: center;
    gap: var(--space-2);
    padding: var(--space-3) var(--space-4);
    margin-bottom: var(--space-4);
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-medium);
    border-left: var(--border-width-thick) solid;
}

.alert-bar-danger[b-ept18b7y7j] {
    background-color: #fdeded;
    border-left-color: var(--color-danger);
    color: #5f2120;
}

.alert-bar-close[b-ept18b7y7j] {
    margin-left: auto;
    background: none;
    border: none;
    font-size: var(--font-size-lg);
    cursor: pointer;
    color: inherit;
    opacity: 0.6;
    line-height: 1;
}

.alert-bar-close:hover[b-ept18b7y7j] {
    opacity: 1;
}

/* Form Sections */
.form-section[b-ept18b7y7j] {
    margin-bottom: var(--space-6);
    padding: var(--space-5);
    background-color: var(--color-white);
    border: var(--border-width-thin) solid var(--border-color-light);
}

.section-title[b-ept18b7y7j] {
    display: flex;
    align-items: center;
    gap: var(--space-2);
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-semibold);
    color: var(--color-primary);
    text-transform: uppercase;
    letter-spacing: 0.5px;
    margin: 0 0 var(--space-4) 0;
    padding-bottom: var(--space-3);
    border-bottom: var(--border-width-thin) solid var(--border-color-light);
}

.section-title svg[b-ept18b7y7j] {
    color: var(--color-primary);
    opacity: 0.6;
    flex-shrink: 0;
}

/* Form Grid */
.form-grid[b-ept18b7y7j] {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: var(--space-4);
}

.form-group[b-ept18b7y7j] {
    display: flex;
    flex-direction: column;
}

.form-group-wide[b-ept18b7y7j] {
    grid-column: span 2;
}

/* Form Controls */
.form-label[b-ept18b7y7j] {
    font-size: var(--font-size-xs);
    font-weight: var(--font-weight-medium);
    color: var(--text-secondary);
    text-transform: uppercase;
    letter-spacing: 0.3px;
    margin-bottom: var(--space-1);
}

.form-control[b-ept18b7y7j] {
    padding: var(--space-2) var(--space-3);
    font-size: var(--font-size-sm);
    color: var(--color-gray-700);
    border: var(--border-width-thin) solid var(--border-color-light);
    background-color: var(--color-white);
    transition: border-color var(--transition-fast) var(--transition-ease);
}

.form-control:focus[b-ept18b7y7j] {
    border-color: var(--color-primary);
    outline: none;
    box-shadow: none;
}

.form-control[b-ept18b7y7j]::placeholder {
    color: var(--color-gray-400);
}

/* Upload Area */
.upload-area[b-ept18b7y7j] {
    position: relative;
    border: 2px dashed var(--border-color-light);
    background-color: var(--bg-secondary);
    transition: all var(--transition-fast) var(--transition-ease);
}

.upload-area-dragover[b-ept18b7y7j] {
    border-color: var(--color-primary);
    background-color: rgba(11, 36, 62, 0.04);
}

.upload-placeholder[b-ept18b7y7j] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: var(--space-10) var(--space-4);
    gap: var(--space-3);
    color: var(--text-muted);
}

.upload-placeholder svg[b-ept18b7y7j] {
    opacity: 0.4;
}

.upload-text[b-ept18b7y7j] {
    font-size: var(--font-size-sm);
    margin: 0;
}

.upload-hint[b-ept18b7y7j] {
    font-size: var(--font-size-xs);
    color: var(--text-muted);
    opacity: 0.7;
    margin: 0;
}

.upload-button[b-ept18b7y7j] {
    display: inline-flex;
    align-items: center;
    gap: var(--space-2);
    padding: var(--space-2) var(--space-4);
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-medium);
    cursor: pointer;
}

.file-input-hidden[b-ept18b7y7j] {
    position: absolute;
    inset: 0;
    opacity: 0;
    cursor: pointer;
    width: 100%;
    height: 100%;
}

/* Upload Preview */
.upload-preview[b-ept18b7y7j] {
    display: flex;
    align-items: center;
    gap: var(--space-4);
    padding: var(--space-4);
}

.preview-image[b-ept18b7y7j] {
    width: 120px;
    height: 120px;
    object-fit: contain;
    background-color: var(--color-white);
    border: var(--border-width-thin) solid var(--border-color-light);
    padding: var(--space-2);
}

.preview-info[b-ept18b7y7j] {
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: var(--space-1);
}

.preview-filename[b-ept18b7y7j] {
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-semibold);
    color: var(--color-primary);
    word-break: break-all;
}

.preview-size[b-ept18b7y7j] {
    font-size: var(--font-size-xs);
    color: var(--text-muted);
}

.preview-remove[b-ept18b7y7j] {
    flex-shrink: 0;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 36px;
    background: none;
    border: var(--border-width-thin) solid transparent;
    cursor: pointer;
    color: var(--text-muted);
    transition: all var(--transition-fast) var(--transition-ease);
}

.preview-remove:hover[b-ept18b7y7j] {
    color: var(--color-danger);
    background-color: rgba(178, 34, 34, 0.06);
    border-color: rgba(178, 34, 34, 0.2);
}

/* Field Error */
.field-error[b-ept18b7y7j] {
    color: var(--color-danger);
    font-size: var(--font-size-xs);
    margin-top: var(--space-2);
}

/* Form Actions */
.form-actions[b-ept18b7y7j] {
    display: flex;
    justify-content: flex-end;
    gap: var(--space-3);
    padding-top: var(--space-4);
    border-top: var(--border-width-thin) solid var(--border-color-light);
}

.form-actions .btn[b-ept18b7y7j] {
    display: inline-flex;
    align-items: center;
    gap: var(--space-2);
    padding: var(--space-2) var(--space-5);
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-medium);
    cursor: pointer;
    text-decoration: none;
}

.btn-action[b-ept18b7y7j] {
    background-color: var(--color-action);
    color: var(--text-on-action);
    border: var(--border-width-thin) solid var(--color-action);
    transition: background-color var(--transition-fast) var(--transition-ease);
}

.btn-action:hover[b-ept18b7y7j] {
    background-color: var(--color-action-hover);
    border-color: var(--color-action-hover);
    color: var(--text-on-action);
}

.btn-action:disabled[b-ept18b7y7j] {
    opacity: 0.65;
    cursor: not-allowed;
}

.btn-outline-primary[b-ept18b7y7j] {
    background: transparent;
    color: var(--color-primary);
    border: var(--border-width-thin) solid var(--color-primary);
}

.btn-outline-primary:hover[b-ept18b7y7j] {
    background-color: var(--color-primary);
    color: var(--text-on-primary);
    text-decoration: none;
}

/* Validation */
[b-ept18b7y7j] .validation-message {
    color: var(--color-danger);
    font-size: var(--font-size-xs);
    margin-top: 2px;
}

/* Responsive */
@media (max-width: 768px) {
    .form-grid[b-ept18b7y7j] {
        grid-template-columns: 1fr;
    }

    .form-group-wide[b-ept18b7y7j] {
        grid-column: span 1;
    }

    .form-actions[b-ept18b7y7j] {
        flex-direction: column-reverse;
    }

    .form-actions .btn[b-ept18b7y7j] {
        justify-content: center;
    }

    .upload-preview[b-ept18b7y7j] {
        flex-direction: column;
        text-align: center;
    }
}
/* /Components/Pages/Common/ImageEdit.razor.rz.scp.css */
/* ===========================
   ImageEdit - Scoped Styles
   Flat Industrial Minimal
   =========================== */

/* Page Container */
.page-container[b-pa49zxde9t] {
    max-width: 900px;
    margin: 0 auto;
    padding: var(--space-6) var(--space-4);
}

/* Header */
.page-header[b-pa49zxde9t] {
    display: flex;
    align-items: center;
    gap: var(--space-4);
    margin-bottom: var(--space-6);
}

.btn-back[b-pa49zxde9t] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    color: var(--text-muted);
    border: var(--border-width-thin) solid var(--border-color-light);
    text-decoration: none;
    transition: all var(--transition-fast) var(--transition-ease);
    flex-shrink: 0;
}

.btn-back:hover[b-pa49zxde9t] {
    color: var(--color-primary);
    border-color: var(--color-primary);
    background-color: var(--color-gray-50);
    text-decoration: none;
}

.page-header-text[b-pa49zxde9t] {
    flex: 1;
}

.page-title[b-pa49zxde9t] {
    font-size: var(--font-size-xl);
    font-weight: var(--font-weight-bold);
    color: var(--color-primary);
    display: flex;
    align-items: center;
    gap: var(--space-2);
    margin: 0;
}

.page-title svg[b-pa49zxde9t] {
    color: var(--color-primary);
    flex-shrink: 0;
}

.page-subtitle[b-pa49zxde9t] {
    color: var(--text-muted);
    font-size: var(--font-size-sm);
    margin: 2px 0 0 0;
    display: flex;
    align-items: center;
    gap: var(--space-2);
}

.subtitle-code[b-pa49zxde9t] {
    font-family: var(--font-mono);
    font-size: var(--font-size-xs);
    color: var(--color-primary);
    opacity: 0.5;
}

/* Alert Bar */
.alert-bar[b-pa49zxde9t] {
    display: flex;
    align-items: center;
    gap: var(--space-2);
    padding: var(--space-3) var(--space-4);
    margin-bottom: var(--space-4);
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-medium);
    border-left: var(--border-width-thick) solid;
}

.alert-bar-danger[b-pa49zxde9t] {
    background-color: #fdeded;
    border-left-color: var(--color-danger);
    color: #5f2120;
}

.alert-bar-close[b-pa49zxde9t] {
    margin-left: auto;
    background: none;
    border: none;
    font-size: var(--font-size-lg);
    cursor: pointer;
    color: inherit;
    opacity: 0.6;
    line-height: 1;
}

.alert-bar-close:hover[b-pa49zxde9t] {
    opacity: 1;
}

/* Loading / Empty States */
.loading-state[b-pa49zxde9t] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: var(--space-16) 0;
    color: var(--text-muted);
    gap: var(--space-4);
}

.empty-state[b-pa49zxde9t] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: var(--space-16) 0;
    color: var(--text-muted);
    gap: var(--space-3);
}

.empty-state svg[b-pa49zxde9t] {
    opacity: 0.4;
}

.empty-state-text[b-pa49zxde9t] {
    font-size: var(--font-size-base);
    margin: 0;
}

/* Form Sections */
.form-section[b-pa49zxde9t] {
    margin-bottom: var(--space-6);
    padding: var(--space-5);
    background-color: var(--color-white);
    border: var(--border-width-thin) solid var(--border-color-light);
}

.section-title[b-pa49zxde9t] {
    display: flex;
    align-items: center;
    gap: var(--space-2);
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-semibold);
    color: var(--color-primary);
    text-transform: uppercase;
    letter-spacing: 0.5px;
    margin: 0 0 var(--space-4) 0;
    padding-bottom: var(--space-3);
    border-bottom: var(--border-width-thin) solid var(--border-color-light);
}

.section-title svg[b-pa49zxde9t] {
    color: var(--color-primary);
    opacity: 0.6;
    flex-shrink: 0;
}

/* Form Grid */
.form-grid[b-pa49zxde9t] {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: var(--space-4);
}

.form-group[b-pa49zxde9t] {
    display: flex;
    flex-direction: column;
}

.form-group-wide[b-pa49zxde9t] {
    grid-column: span 2;
}

/* Form Controls */
.form-label[b-pa49zxde9t] {
    font-size: var(--font-size-xs);
    font-weight: var(--font-weight-medium);
    color: var(--text-secondary);
    text-transform: uppercase;
    letter-spacing: 0.3px;
    margin-bottom: var(--space-1);
}

.form-control[b-pa49zxde9t] {
    padding: var(--space-2) var(--space-3);
    font-size: var(--font-size-sm);
    color: var(--color-gray-700);
    border: var(--border-width-thin) solid var(--border-color-light);
    background-color: var(--color-white);
    transition: border-color var(--transition-fast) var(--transition-ease);
}

.form-control:focus[b-pa49zxde9t] {
    border-color: var(--color-primary);
    outline: none;
    box-shadow: none;
}

.form-control-static[b-pa49zxde9t] {
    padding: var(--space-2) var(--space-3);
    font-size: var(--font-size-sm);
    color: var(--text-secondary);
    background-color: var(--bg-secondary);
    border: var(--border-width-thin) solid var(--border-color-light);
    font-family: var(--font-mono);
}

/* Current Image Preview */
.current-image[b-pa49zxde9t] {
    display: flex;
    justify-content: center;
    padding: var(--space-4);
    margin-bottom: var(--space-4);
    background-color: var(--bg-secondary);
    border: var(--border-width-thin) solid var(--border-color-light);
}

.current-image-preview[b-pa49zxde9t] {
    max-width: 100%;
    max-height: 300px;
    object-fit: contain;
}

/* Upload Area */
.upload-area[b-pa49zxde9t] {
    position: relative;
    border: 2px dashed var(--border-color-light);
    background-color: var(--bg-secondary);
    transition: all var(--transition-fast) var(--transition-ease);
}

.upload-area-dragover[b-pa49zxde9t] {
    border-color: var(--color-primary);
    background-color: rgba(11, 36, 62, 0.04);
}

.upload-placeholder[b-pa49zxde9t] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: var(--space-6) var(--space-4);
    gap: var(--space-2);
    color: var(--text-muted);
}

.upload-placeholder svg[b-pa49zxde9t] {
    opacity: 0.4;
}

.upload-text[b-pa49zxde9t] {
    font-size: var(--font-size-sm);
    margin: 0;
}

.upload-hint[b-pa49zxde9t] {
    font-size: var(--font-size-xs);
    color: var(--text-muted);
    opacity: 0.7;
    margin: 0;
}

.upload-button[b-pa49zxde9t] {
    display: inline-flex;
    align-items: center;
    gap: var(--space-2);
    padding: var(--space-2) var(--space-4);
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-medium);
    cursor: pointer;
}

.file-input-hidden[b-pa49zxde9t] {
    position: absolute;
    inset: 0;
    opacity: 0;
    cursor: pointer;
    width: 100%;
    height: 100%;
}

/* Field Error */
.field-error[b-pa49zxde9t] {
    color: var(--color-danger);
    font-size: var(--font-size-xs);
    margin-top: var(--space-2);
}

/* New File Info */
.new-file-info[b-pa49zxde9t] {
    display: flex;
    align-items: center;
    gap: var(--space-2);
    margin-top: var(--space-2);
    padding: var(--space-2) var(--space-3);
    font-size: var(--font-size-xs);
    color: var(--color-success);
    background-color: #edf7ed;
    border-left: var(--border-width-thick) solid var(--color-success);
}

/* Form Actions */
.form-actions[b-pa49zxde9t] {
    display: flex;
    justify-content: flex-end;
    gap: var(--space-3);
    padding-top: var(--space-4);
    border-top: var(--border-width-thin) solid var(--border-color-light);
}

.form-actions .btn[b-pa49zxde9t] {
    display: inline-flex;
    align-items: center;
    gap: var(--space-2);
    padding: var(--space-2) var(--space-5);
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-medium);
    cursor: pointer;
    text-decoration: none;
}

.btn-action[b-pa49zxde9t] {
    background-color: var(--color-action);
    color: var(--text-on-action);
    border: var(--border-width-thin) solid var(--color-action);
    transition: background-color var(--transition-fast) var(--transition-ease);
}

.btn-action:hover[b-pa49zxde9t] {
    background-color: var(--color-action-hover);
    border-color: var(--color-action-hover);
    color: var(--text-on-action);
}

.btn-action:disabled[b-pa49zxde9t] {
    opacity: 0.65;
    cursor: not-allowed;
}

.btn-outline-primary[b-pa49zxde9t] {
    background: transparent;
    color: var(--color-primary);
    border: var(--border-width-thin) solid var(--color-primary);
}

.btn-outline-primary:hover[b-pa49zxde9t] {
    background-color: var(--color-primary);
    color: var(--text-on-primary);
    text-decoration: none;
}

/* Validation */
[b-pa49zxde9t] .validation-message {
    color: var(--color-danger);
    font-size: var(--font-size-xs);
    margin-top: 2px;
}

/* Responsive */
@media (max-width: 768px) {
    .form-grid[b-pa49zxde9t] {
        grid-template-columns: 1fr;
    }

    .form-group-wide[b-pa49zxde9t] {
        grid-column: span 1;
    }

    .form-actions[b-pa49zxde9t] {
        flex-direction: column-reverse;
    }

    .form-actions .btn[b-pa49zxde9t] {
        justify-content: center;
    }
}
/* /Components/Pages/Common/ImageList.razor.rz.scp.css */
/* ===========================
   ImageList - Scoped Styles
   Flat Industrial Minimal
   =========================== */

/* Page Container */
.page-container[b-rildnx61fj] {
    max-width: 1200px;
    margin: 0 auto;
    padding: var(--space-6) var(--space-4);
}

/* Header */
.page-header[b-rildnx61fj] {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    margin-bottom: var(--space-6);
    gap: var(--space-4);
}

.page-header-left[b-rildnx61fj] {
    flex: 1;
}

.page-header-right[b-rildnx61fj] {
    flex-shrink: 0;
}

.page-title[b-rildnx61fj] {
    font-size: var(--font-size-2xl);
    font-weight: var(--font-weight-bold);
    color: var(--color-primary);
    display: flex;
    align-items: center;
    gap: var(--space-2);
    margin: 0;
}

.page-title svg[b-rildnx61fj] {
    color: var(--color-primary);
    flex-shrink: 0;
}

.page-subtitle[b-rildnx61fj] {
    color: var(--text-muted);
    font-size: var(--font-size-sm);
    margin: var(--space-1) 0 0 0;
}

/* Action Button */
.btn-action[b-rildnx61fj] {
    display: inline-flex;
    align-items: center;
    gap: var(--space-2);
    padding: var(--space-2) var(--space-4);
    background-color: var(--color-action);
    color: var(--text-on-action);
    border: var(--border-width-thin) solid var(--color-action);
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-medium);
    text-decoration: none;
    cursor: pointer;
    transition: background-color var(--transition-fast) var(--transition-ease),
                box-shadow var(--transition-fast) var(--transition-ease);
}

.btn-action:hover[b-rildnx61fj] {
    background-color: var(--color-action-hover);
    border-color: var(--color-action-hover);
    color: var(--text-on-action);
    text-decoration: none;
    box-shadow: var(--shadow-sm);
}

.btn-action:active[b-rildnx61fj] {
    background-color: var(--color-action-active);
}

/* Alert Bars */
.alert-bar[b-rildnx61fj] {
    display: flex;
    align-items: center;
    gap: var(--space-2);
    padding: var(--space-3) var(--space-4);
    margin-bottom: var(--space-4);
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-medium);
    border-left: var(--border-width-thick) solid;
}

.alert-bar-success[b-rildnx61fj] {
    background-color: #edf7ed;
    border-left-color: var(--color-success);
    color: #1e4620;
}

.alert-bar-danger[b-rildnx61fj] {
    background-color: #fdeded;
    border-left-color: var(--color-danger);
    color: #5f2120;
}

.alert-bar-close[b-rildnx61fj] {
    margin-left: auto;
    background: none;
    border: none;
    font-size: var(--font-size-lg);
    cursor: pointer;
    color: inherit;
    opacity: 0.6;
    line-height: 1;
}

.alert-bar-close:hover[b-rildnx61fj] {
    opacity: 1;
}

/* Search Bar */
.search-bar[b-rildnx61fj] {
    display: flex;
    align-items: center;
    gap: var(--space-4);
    margin-bottom: var(--space-4);
    padding: var(--space-3) var(--space-4);
    background-color: var(--bg-secondary);
    border: var(--border-width-thin) solid var(--border-color-light);
}

.search-input-wrapper[b-rildnx61fj] {
    display: flex;
    align-items: center;
    flex: 1;
    position: relative;
}

.search-icon[b-rildnx61fj] {
    color: var(--text-muted);
    flex-shrink: 0;
    margin-right: var(--space-2);
}

.search-input[b-rildnx61fj] {
    flex: 1;
    border: none;
    background: transparent;
    font-size: var(--font-size-sm);
    color: var(--color-gray-700);
    outline: none;
    padding: var(--space-1) 0;
}

.search-input[b-rildnx61fj]::placeholder {
    color: var(--text-muted);
}

.search-clear[b-rildnx61fj] {
    background: none;
    border: none;
    cursor: pointer;
    color: var(--text-muted);
    padding: var(--space-1);
    display: flex;
    align-items: center;
}

.search-clear:hover[b-rildnx61fj] {
    color: var(--color-primary);
}

.search-count[b-rildnx61fj] {
    flex-shrink: 0;
    font-size: var(--font-size-xs);
    color: var(--text-muted);
    font-weight: var(--font-weight-medium);
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

/* Loading / Empty States */
.loading-state[b-rildnx61fj] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: var(--space-16) 0;
    color: var(--text-muted);
    gap: var(--space-4);
}

.empty-state[b-rildnx61fj] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: var(--space-16) 0;
    color: var(--text-muted);
    gap: var(--space-3);
}

.empty-state svg[b-rildnx61fj] {
    opacity: 0.4;
}

.empty-state-text[b-rildnx61fj] {
    font-size: var(--font-size-base);
    margin: 0;
}

/* Item List */
.item-list[b-rildnx61fj] {
    display: flex;
    flex-direction: column;
    border: var(--border-width-thin) solid var(--border-color-light);
}

/* Item Row */
.item-row[b-rildnx61fj] {
    display: flex;
    align-items: center;
    gap: var(--space-4);
    padding: var(--space-4);
    border-bottom: var(--border-width-thin) solid var(--border-color-light);
    transition: background-color var(--transition-fast) var(--transition-ease);
}

.item-row:last-child[b-rildnx61fj] {
    border-bottom: none;
}

.item-row:hover[b-rildnx61fj] {
    background-color: rgba(11, 36, 62, 0.03);
}

/* Avatar */
.item-avatar[b-rildnx61fj] {
    flex-shrink: 0;
    width: 40px;
    height: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: var(--color-gray-100);
    color: var(--color-primary);
}

/* Item Info */
.item-info[b-rildnx61fj] {
    flex: 1;
    min-width: 0;
}

.item-name[b-rildnx61fj] {
    font-size: var(--font-size-base);
    font-weight: var(--font-weight-semibold);
    color: var(--color-primary);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.item-meta[b-rildnx61fj] {
    display: flex;
    align-items: center;
    gap: var(--space-1);
    flex-wrap: wrap;
    font-size: var(--font-size-xs);
    color: var(--text-secondary);
    margin-top: 2px;
}

.item-code[b-rildnx61fj] {
    font-family: var(--font-mono);
    font-weight: var(--font-weight-medium);
    color: var(--color-primary);
    opacity: 0.7;
}

/* Action Buttons */
.item-actions[b-rildnx61fj] {
    flex-shrink: 0;
    display: flex;
    align-items: center;
    gap: var(--space-1);
}

.btn-icon[b-rildnx61fj] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 36px;
    background: none;
    border: var(--border-width-thin) solid transparent;
    cursor: pointer;
    color: var(--text-muted);
    text-decoration: none;
    transition: all var(--transition-fast) var(--transition-ease);
}

.btn-icon:hover[b-rildnx61fj] {
    color: var(--color-primary);
    background-color: var(--color-gray-100);
    border-color: var(--border-color-light);
    text-decoration: none;
}

.btn-icon-danger:hover[b-rildnx61fj] {
    color: var(--color-action);
    background-color: rgba(178, 34, 34, 0.06);
    border-color: rgba(178, 34, 34, 0.2);
}

/* Overlay & Dialog */
.overlay[b-rildnx61fj] {
    position: fixed;
    inset: 0;
    background-color: rgba(0, 0, 0, 0.4);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: var(--z-modal-backdrop);
}

.confirm-dialog[b-rildnx61fj] {
    background-color: var(--color-white);
    padding: var(--space-8);
    max-width: 420px;
    width: 90%;
    box-shadow: var(--shadow-xl);
    text-align: center;
    z-index: var(--z-modal);
}

.confirm-icon[b-rildnx61fj] {
    color: var(--color-action);
    margin-bottom: var(--space-4);
}

.confirm-dialog h3[b-rildnx61fj] {
    font-size: var(--font-size-lg);
    font-weight: var(--font-weight-semibold);
    color: var(--color-primary);
    margin: 0 0 var(--space-2) 0;
}

.confirm-dialog p[b-rildnx61fj] {
    font-size: var(--font-size-sm);
    color: var(--text-secondary);
    margin: 0 0 var(--space-2) 0;
}

.confirm-warning[b-rildnx61fj] {
    font-size: var(--font-size-xs) !important;
    color: var(--color-action) !important;
    font-weight: var(--font-weight-medium);
}

.confirm-actions[b-rildnx61fj] {
    display: flex;
    gap: var(--space-3);
    justify-content: center;
    margin-top: var(--space-6);
}

.confirm-actions .btn[b-rildnx61fj] {
    min-width: 100px;
    padding: var(--space-2) var(--space-4);
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-medium);
    cursor: pointer;
}

/* Outline Primary Button */
.btn-outline-primary[b-rildnx61fj] {
    background: transparent;
    color: var(--color-primary);
    border: var(--border-width-thin) solid var(--color-primary);
}

.btn-outline-primary:hover[b-rildnx61fj] {
    background-color: var(--color-primary);
    color: var(--text-on-primary);
}

/* Responsive */
@media (max-width: 768px) {
    .page-header[b-rildnx61fj] {
        flex-direction: column;
        gap: var(--space-3);
    }

    .item-row[b-rildnx61fj] {
        flex-wrap: wrap;
    }

    .item-actions[b-rildnx61fj] {
        width: 100%;
        justify-content: flex-end;
    }
}
/* /Components/Pages/Common/LocalityCreate.razor.rz.scp.css */
/* ===========================
   LocalityCreate - Scoped Styles
   Flat Industrial Minimal
   =========================== */

/* Page Container */
.page-container[b-21p0x67txy] {
    max-width: 900px;
    margin: 0 auto;
    padding: var(--space-6) var(--space-4);
}

/* Header */
.page-header[b-21p0x67txy] {
    display: flex;
    align-items: center;
    gap: var(--space-4);
    margin-bottom: var(--space-6);
}

.btn-back[b-21p0x67txy] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    color: var(--text-muted);
    border: var(--border-width-thin) solid var(--border-color-light);
    text-decoration: none;
    transition: all var(--transition-fast) var(--transition-ease);
    flex-shrink: 0;
}

.btn-back:hover[b-21p0x67txy] {
    color: var(--color-primary);
    border-color: var(--color-primary);
    background-color: var(--color-gray-50);
    text-decoration: none;
}

.page-header-text[b-21p0x67txy] {
    flex: 1;
}

.page-title[b-21p0x67txy] {
    font-size: var(--font-size-xl);
    font-weight: var(--font-weight-bold);
    color: var(--color-primary);
    display: flex;
    align-items: center;
    gap: var(--space-2);
    margin: 0;
}

.page-title svg[b-21p0x67txy] {
    color: var(--color-primary);
    flex-shrink: 0;
}

.page-subtitle[b-21p0x67txy] {
    color: var(--text-muted);
    font-size: var(--font-size-sm);
    margin: 2px 0 0 0;
}

/* Alert Bar */
.alert-bar[b-21p0x67txy] {
    display: flex;
    align-items: center;
    gap: var(--space-2);
    padding: var(--space-3) var(--space-4);
    margin-bottom: var(--space-4);
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-medium);
    border-left: var(--border-width-thick) solid;
}

.alert-bar-danger[b-21p0x67txy] {
    background-color: #fdeded;
    border-left-color: var(--color-danger);
    color: #5f2120;
}

.alert-bar-close[b-21p0x67txy] {
    margin-left: auto;
    background: none;
    border: none;
    font-size: var(--font-size-lg);
    cursor: pointer;
    color: inherit;
    opacity: 0.6;
    line-height: 1;
}

.alert-bar-close:hover[b-21p0x67txy] {
    opacity: 1;
}

/* Form Sections */
.form-section[b-21p0x67txy] {
    margin-bottom: var(--space-6);
    padding: var(--space-5);
    background-color: var(--color-white);
    border: var(--border-width-thin) solid var(--border-color-light);
}

.section-title[b-21p0x67txy] {
    display: flex;
    align-items: center;
    gap: var(--space-2);
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-semibold);
    color: var(--color-primary);
    text-transform: uppercase;
    letter-spacing: 0.5px;
    margin: 0 0 var(--space-4) 0;
    padding-bottom: var(--space-3);
    border-bottom: var(--border-width-thin) solid var(--border-color-light);
}

.section-title svg[b-21p0x67txy] {
    color: var(--color-primary);
    opacity: 0.6;
    flex-shrink: 0;
}

/* Form Grid */
.form-grid[b-21p0x67txy] {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: var(--space-4);
}

.form-group[b-21p0x67txy] {
    display: flex;
    flex-direction: column;
}

.form-group-wide[b-21p0x67txy] {
    grid-column: span 2;
}

/* Form Controls */
.form-label[b-21p0x67txy] {
    font-size: var(--font-size-xs);
    font-weight: var(--font-weight-medium);
    color: var(--text-secondary);
    text-transform: uppercase;
    letter-spacing: 0.3px;
    margin-bottom: var(--space-1);
}

.form-control[b-21p0x67txy] {
    padding: var(--space-2) var(--space-3);
    font-size: var(--font-size-sm);
    color: var(--color-gray-700);
    border: var(--border-width-thin) solid var(--border-color-light);
    background-color: var(--color-white);
    transition: border-color var(--transition-fast) var(--transition-ease);
}

.form-control:focus[b-21p0x67txy] {
    border-color: var(--color-primary);
    outline: none;
    box-shadow: none;
}

.form-control[b-21p0x67txy]::placeholder {
    color: var(--color-gray-400);
}

/* Form Actions */
.form-actions[b-21p0x67txy] {
    display: flex;
    justify-content: flex-end;
    gap: var(--space-3);
    padding-top: var(--space-4);
    border-top: var(--border-width-thin) solid var(--border-color-light);
}

.form-actions .btn[b-21p0x67txy] {
    display: inline-flex;
    align-items: center;
    gap: var(--space-2);
    padding: var(--space-2) var(--space-5);
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-medium);
    cursor: pointer;
    text-decoration: none;
}

.btn-action[b-21p0x67txy] {
    background-color: var(--color-action);
    color: var(--text-on-action);
    border: var(--border-width-thin) solid var(--color-action);
    transition: background-color var(--transition-fast) var(--transition-ease);
}

.btn-action:hover[b-21p0x67txy] {
    background-color: var(--color-action-hover);
    border-color: var(--color-action-hover);
    color: var(--text-on-action);
}

.btn-action:disabled[b-21p0x67txy] {
    opacity: 0.6;
    cursor: not-allowed;
}

.btn-outline-primary[b-21p0x67txy] {
    background: transparent;
    color: var(--color-primary);
    border: var(--border-width-thin) solid var(--color-primary);
}

.btn-outline-primary:hover[b-21p0x67txy] {
    background-color: var(--color-primary);
    color: var(--text-on-primary);
    text-decoration: none;
}

/* Responsive */
@media (max-width: 768px) {
    .form-grid[b-21p0x67txy] {
        grid-template-columns: 1fr;
    }

    .form-group-wide[b-21p0x67txy] {
        grid-column: span 1;
    }
}
/* /Components/Pages/Common/LocalityEdit.razor.rz.scp.css */
/* ===========================
   LocalityEdit - Scoped Styles
   Flat Industrial Minimal
   =========================== */

/* Page Container */
.page-container[b-rqxnddj5nx] {
    max-width: 900px;
    margin: 0 auto;
    padding: var(--space-6) var(--space-4);
}

/* Header */
.page-header[b-rqxnddj5nx] {
    display: flex;
    align-items: center;
    gap: var(--space-4);
    margin-bottom: var(--space-6);
}

.btn-back[b-rqxnddj5nx] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    color: var(--text-muted);
    border: var(--border-width-thin) solid var(--border-color-light);
    text-decoration: none;
    transition: all var(--transition-fast) var(--transition-ease);
    flex-shrink: 0;
}

.btn-back:hover[b-rqxnddj5nx] {
    color: var(--color-primary);
    border-color: var(--color-primary);
    background-color: var(--color-gray-50);
    text-decoration: none;
}

.page-header-text[b-rqxnddj5nx] {
    flex: 1;
}

.page-title[b-rqxnddj5nx] {
    font-size: var(--font-size-xl);
    font-weight: var(--font-weight-bold);
    color: var(--color-primary);
    display: flex;
    align-items: center;
    gap: var(--space-2);
    margin: 0;
}

.page-title svg[b-rqxnddj5nx] {
    color: var(--color-primary);
    flex-shrink: 0;
}

.page-subtitle[b-rqxnddj5nx] {
    color: var(--text-muted);
    font-size: var(--font-size-sm);
    margin: 2px 0 0 0;
    display: flex;
    align-items: center;
    gap: var(--space-2);
}

.subtitle-code[b-rqxnddj5nx] {
    font-family: var(--font-mono);
    font-size: var(--font-size-xs);
    color: var(--color-primary);
    opacity: 0.6;
    padding: 1px var(--space-2);
    background-color: var(--color-gray-100);
}

/* Alert Bar */
.alert-bar[b-rqxnddj5nx] {
    display: flex;
    align-items: center;
    gap: var(--space-2);
    padding: var(--space-3) var(--space-4);
    margin-bottom: var(--space-4);
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-medium);
    border-left: var(--border-width-thick) solid;
}

.alert-bar-danger[b-rqxnddj5nx] {
    background-color: #fdeded;
    border-left-color: var(--color-danger);
    color: #5f2120;
}

.alert-bar-close[b-rqxnddj5nx] {
    margin-left: auto;
    background: none;
    border: none;
    font-size: var(--font-size-lg);
    cursor: pointer;
    color: inherit;
    opacity: 0.6;
    line-height: 1;
}

.alert-bar-close:hover[b-rqxnddj5nx] {
    opacity: 1;
}

/* Loading / Empty States */
.loading-state[b-rqxnddj5nx] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: var(--space-16) 0;
    color: var(--text-muted);
    gap: var(--space-4);
}

.empty-state[b-rqxnddj5nx] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: var(--space-16) 0;
    color: var(--text-muted);
    gap: var(--space-3);
}

.empty-state svg[b-rqxnddj5nx] {
    opacity: 0.4;
}

.empty-state-text[b-rqxnddj5nx] {
    font-size: var(--font-size-base);
    margin: 0;
}

/* Form Sections */
.form-section[b-rqxnddj5nx] {
    margin-bottom: var(--space-6);
    padding: var(--space-5);
    background-color: var(--color-white);
    border: var(--border-width-thin) solid var(--border-color-light);
}

.section-title[b-rqxnddj5nx] {
    display: flex;
    align-items: center;
    gap: var(--space-2);
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-semibold);
    color: var(--color-primary);
    text-transform: uppercase;
    letter-spacing: 0.5px;
    margin: 0 0 var(--space-4) 0;
    padding-bottom: var(--space-3);
    border-bottom: var(--border-width-thin) solid var(--border-color-light);
}

.section-title svg[b-rqxnddj5nx] {
    color: var(--color-primary);
    opacity: 0.6;
    flex-shrink: 0;
}

/* Form Grid */
.form-grid[b-rqxnddj5nx] {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: var(--space-4);
}

.form-group[b-rqxnddj5nx] {
    display: flex;
    flex-direction: column;
}

.form-group-wide[b-rqxnddj5nx] {
    grid-column: span 2;
}

/* Form Controls */
.form-label[b-rqxnddj5nx] {
    font-size: var(--font-size-xs);
    font-weight: var(--font-weight-medium);
    color: var(--text-secondary);
    text-transform: uppercase;
    letter-spacing: 0.3px;
    margin-bottom: var(--space-1);
}

.form-control[b-rqxnddj5nx] {
    padding: var(--space-2) var(--space-3);
    font-size: var(--font-size-sm);
    color: var(--color-gray-700);
    border: var(--border-width-thin) solid var(--border-color-light);
    background-color: var(--color-white);
    transition: border-color var(--transition-fast) var(--transition-ease);
}

.form-control:focus[b-rqxnddj5nx] {
    border-color: var(--color-primary);
    outline: none;
    box-shadow: none;
}

.form-control[b-rqxnddj5nx]::placeholder {
    color: var(--color-gray-400);
}

.form-control-static[b-rqxnddj5nx] {
    padding: var(--space-2) var(--space-3);
    font-size: var(--font-size-sm);
    color: var(--text-secondary);
    background-color: var(--color-gray-50);
    border: var(--border-width-thin) solid var(--border-color-light);
    font-family: var(--font-mono);
}

/* Form Actions */
.form-actions[b-rqxnddj5nx] {
    display: flex;
    justify-content: flex-end;
    gap: var(--space-3);
    padding-top: var(--space-4);
    border-top: var(--border-width-thin) solid var(--border-color-light);
}

.form-actions .btn[b-rqxnddj5nx] {
    display: inline-flex;
    align-items: center;
    gap: var(--space-2);
    padding: var(--space-2) var(--space-5);
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-medium);
    cursor: pointer;
    text-decoration: none;
}

.btn-action[b-rqxnddj5nx] {
    background-color: var(--color-action);
    color: var(--text-on-action);
    border: var(--border-width-thin) solid var(--color-action);
    transition: background-color var(--transition-fast) var(--transition-ease);
}

.btn-action:hover[b-rqxnddj5nx] {
    background-color: var(--color-action-hover);
    border-color: var(--color-action-hover);
    color: var(--text-on-action);
}

.btn-action:disabled[b-rqxnddj5nx] {
    opacity: 0.6;
    cursor: not-allowed;
}

.btn-outline-primary[b-rqxnddj5nx] {
    background: transparent;
    color: var(--color-primary);
    border: var(--border-width-thin) solid var(--color-primary);
}

.btn-outline-primary:hover[b-rqxnddj5nx] {
    background-color: var(--color-primary);
    color: var(--text-on-primary);
    text-decoration: none;
}

/* Responsive */
@media (max-width: 768px) {
    .form-grid[b-rqxnddj5nx] {
        grid-template-columns: 1fr;
    }

    .form-group-wide[b-rqxnddj5nx] {
        grid-column: span 1;
    }
}
/* /Components/Pages/Common/LocalityList.razor.rz.scp.css */
/* ===========================
   LocalityList - Scoped Styles
   Flat Industrial Minimal
   =========================== */

/* Page Container */
.page-container[b-ao2mu8eobm] {
    max-width: 1200px;
    margin: 0 auto;
    padding: var(--space-6) var(--space-4);
}

/* Header */
.page-header[b-ao2mu8eobm] {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    margin-bottom: var(--space-6);
    gap: var(--space-4);
}

.page-header-left[b-ao2mu8eobm] {
    flex: 1;
}

.page-header-right[b-ao2mu8eobm] {
    flex-shrink: 0;
}

.page-title[b-ao2mu8eobm] {
    font-size: var(--font-size-2xl);
    font-weight: var(--font-weight-bold);
    color: var(--color-primary);
    display: flex;
    align-items: center;
    gap: var(--space-2);
    margin: 0;
}

.page-title svg[b-ao2mu8eobm] {
    color: var(--color-primary);
    flex-shrink: 0;
}

.page-subtitle[b-ao2mu8eobm] {
    color: var(--text-muted);
    font-size: var(--font-size-sm);
    margin: var(--space-1) 0 0 0;
}

/* Action Button */
.btn-action[b-ao2mu8eobm] {
    display: inline-flex;
    align-items: center;
    gap: var(--space-2);
    padding: var(--space-2) var(--space-4);
    background-color: var(--color-action);
    color: var(--text-on-action);
    border: var(--border-width-thin) solid var(--color-action);
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-medium);
    text-decoration: none;
    cursor: pointer;
    transition: background-color var(--transition-fast) var(--transition-ease),
                box-shadow var(--transition-fast) var(--transition-ease);
}

.btn-action:hover[b-ao2mu8eobm] {
    background-color: var(--color-action-hover);
    border-color: var(--color-action-hover);
    color: var(--text-on-action);
    text-decoration: none;
    box-shadow: var(--shadow-sm);
}

.btn-action:active[b-ao2mu8eobm] {
    background-color: var(--color-action-active);
}

/* Alert Bars */
.alert-bar[b-ao2mu8eobm] {
    display: flex;
    align-items: center;
    gap: var(--space-2);
    padding: var(--space-3) var(--space-4);
    margin-bottom: var(--space-4);
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-medium);
    border-left: var(--border-width-thick) solid;
}

.alert-bar-success[b-ao2mu8eobm] {
    background-color: #edf7ed;
    border-left-color: var(--color-success);
    color: #1e4620;
}

.alert-bar-danger[b-ao2mu8eobm] {
    background-color: #fdeded;
    border-left-color: var(--color-danger);
    color: #5f2120;
}

.alert-bar-close[b-ao2mu8eobm] {
    margin-left: auto;
    background: none;
    border: none;
    font-size: var(--font-size-lg);
    cursor: pointer;
    color: inherit;
    opacity: 0.6;
    line-height: 1;
}

.alert-bar-close:hover[b-ao2mu8eobm] {
    opacity: 1;
}

/* Search Bar */
.search-bar[b-ao2mu8eobm] {
    display: flex;
    align-items: center;
    gap: var(--space-4);
    margin-bottom: var(--space-4);
    padding: var(--space-3) var(--space-4);
    background-color: var(--bg-secondary);
    border: var(--border-width-thin) solid var(--border-color-light);
}

.search-input-wrapper[b-ao2mu8eobm] {
    display: flex;
    align-items: center;
    flex: 1;
    position: relative;
}

.search-icon[b-ao2mu8eobm] {
    color: var(--text-muted);
    flex-shrink: 0;
    margin-right: var(--space-2);
}

.search-input[b-ao2mu8eobm] {
    flex: 1;
    border: none;
    background: transparent;
    font-size: var(--font-size-sm);
    color: var(--color-gray-700);
    outline: none;
    padding: var(--space-1) 0;
}

.search-input[b-ao2mu8eobm]::placeholder {
    color: var(--text-muted);
}

.search-clear[b-ao2mu8eobm] {
    background: none;
    border: none;
    cursor: pointer;
    color: var(--text-muted);
    padding: var(--space-1);
    display: flex;
    align-items: center;
}

.search-clear:hover[b-ao2mu8eobm] {
    color: var(--color-primary);
}

.search-count[b-ao2mu8eobm] {
    flex-shrink: 0;
    font-size: var(--font-size-xs);
    color: var(--text-muted);
    font-weight: var(--font-weight-medium);
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

/* Loading / Empty States */
.loading-state[b-ao2mu8eobm] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: var(--space-16) 0;
    color: var(--text-muted);
    gap: var(--space-4);
}

.empty-state[b-ao2mu8eobm] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: var(--space-16) 0;
    color: var(--text-muted);
    gap: var(--space-3);
}

.empty-state svg[b-ao2mu8eobm] {
    opacity: 0.4;
}

.empty-state-text[b-ao2mu8eobm] {
    font-size: var(--font-size-base);
    margin: 0;
}

/* Item List */
.item-list[b-ao2mu8eobm] {
    display: flex;
    flex-direction: column;
    border: var(--border-width-thin) solid var(--border-color-light);
}

/* Item Row */
.item-row[b-ao2mu8eobm] {
    display: flex;
    align-items: center;
    gap: var(--space-4);
    padding: var(--space-4);
    border-bottom: var(--border-width-thin) solid var(--border-color-light);
    transition: background-color var(--transition-fast) var(--transition-ease);
}

.item-row:last-child[b-ao2mu8eobm] {
    border-bottom: none;
}

.item-row:hover[b-ao2mu8eobm] {
    background-color: rgba(11, 36, 62, 0.03);
}

/* Avatar */
.item-avatar[b-ao2mu8eobm] {
    flex-shrink: 0;
    width: 40px;
    height: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: var(--color-gray-100);
    color: var(--color-primary);
}

/* Item Info */
.item-info[b-ao2mu8eobm] {
    flex: 1;
    min-width: 0;
}

.item-name[b-ao2mu8eobm] {
    font-size: var(--font-size-base);
    font-weight: var(--font-weight-semibold);
    color: var(--color-primary);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.item-meta[b-ao2mu8eobm] {
    display: flex;
    align-items: center;
    gap: var(--space-1);
    flex-wrap: wrap;
    font-size: var(--font-size-xs);
    color: var(--text-secondary);
    margin-top: 2px;
}

.item-code[b-ao2mu8eobm] {
    font-family: var(--font-mono);
    font-weight: var(--font-weight-medium);
    color: var(--color-primary);
    opacity: 0.7;
}

.meta-separator[b-ao2mu8eobm] {
    color: var(--color-gray-300);
}

/* Action Buttons */
.item-actions[b-ao2mu8eobm] {
    flex-shrink: 0;
    display: flex;
    align-items: center;
    gap: var(--space-1);
}

.btn-icon[b-ao2mu8eobm] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 36px;
    background: none;
    border: var(--border-width-thin) solid transparent;
    cursor: pointer;
    color: var(--text-muted);
    text-decoration: none;
    transition: all var(--transition-fast) var(--transition-ease);
}

.btn-icon:hover[b-ao2mu8eobm] {
    color: var(--color-primary);
    background-color: var(--color-gray-100);
    border-color: var(--border-color-light);
    text-decoration: none;
}

.btn-icon-danger:hover[b-ao2mu8eobm] {
    color: var(--color-action);
    background-color: rgba(178, 34, 34, 0.06);
    border-color: rgba(178, 34, 34, 0.2);
}

/* Overlay & Dialog */
.overlay[b-ao2mu8eobm] {
    position: fixed;
    inset: 0;
    background-color: rgba(0, 0, 0, 0.4);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: var(--z-modal-backdrop);
}

.confirm-dialog[b-ao2mu8eobm] {
    background-color: var(--color-white);
    padding: var(--space-8);
    max-width: 420px;
    width: 90%;
    box-shadow: var(--shadow-xl);
    text-align: center;
    z-index: var(--z-modal);
}

.confirm-icon[b-ao2mu8eobm] {
    color: var(--color-action);
    margin-bottom: var(--space-4);
}

.confirm-dialog h3[b-ao2mu8eobm] {
    font-size: var(--font-size-lg);
    font-weight: var(--font-weight-semibold);
    color: var(--color-primary);
    margin: 0 0 var(--space-2) 0;
}

.confirm-dialog p[b-ao2mu8eobm] {
    font-size: var(--font-size-sm);
    color: var(--text-secondary);
    margin: 0 0 var(--space-2) 0;
}

.confirm-warning[b-ao2mu8eobm] {
    font-size: var(--font-size-xs) !important;
    color: var(--color-action) !important;
    font-weight: var(--font-weight-medium);
}

.confirm-actions[b-ao2mu8eobm] {
    display: flex;
    gap: var(--space-3);
    justify-content: center;
    margin-top: var(--space-6);
}

.confirm-actions .btn[b-ao2mu8eobm] {
    min-width: 100px;
    padding: var(--space-2) var(--space-4);
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-medium);
    cursor: pointer;
}

/* Outline Primary Button */
.btn-outline-primary[b-ao2mu8eobm] {
    background: transparent;
    color: var(--color-primary);
    border: var(--border-width-thin) solid var(--color-primary);
}

.btn-outline-primary:hover[b-ao2mu8eobm] {
    background-color: var(--color-primary);
    color: var(--text-on-primary);
}

/* Responsive */
@media (max-width: 768px) {
    .page-header[b-ao2mu8eobm] {
        flex-direction: column;
        gap: var(--space-3);
    }

    .item-row[b-ao2mu8eobm] {
        flex-wrap: wrap;
    }

    .item-actions[b-ao2mu8eobm] {
        order: 6;
        margin-left: auto;
    }
}
/* /Components/Pages/Common/LookupSearch.razor.rz.scp.css */
/* ===========================
   LookupSearch - Scoped Styles
   Flat Industrial Minimal
   =========================== */

/* Page Container */
.page-container[b-eqnmyb0zrg] {
    max-width: 700px;
    margin: 0 auto;
    padding: var(--space-6) var(--space-4);
}

/* Header */
.page-header[b-eqnmyb0zrg] {
    display: flex;
    align-items: center;
    gap: var(--space-4);
    margin-bottom: var(--space-6);
}

.btn-back[b-eqnmyb0zrg] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    color: var(--text-muted);
    border: var(--border-width-thin) solid var(--border-color-light);
    background: none;
    cursor: pointer;
    text-decoration: none;
    transition: all var(--transition-fast) var(--transition-ease);
    flex-shrink: 0;
}

.btn-back:hover[b-eqnmyb0zrg] {
    color: var(--color-primary);
    border-color: var(--color-primary);
    background-color: var(--color-gray-50);
}

.page-header-text[b-eqnmyb0zrg] {
    flex: 1;
}

.page-title[b-eqnmyb0zrg] {
    font-size: var(--font-size-xl);
    font-weight: var(--font-weight-bold);
    color: var(--color-primary);
    display: flex;
    align-items: center;
    gap: var(--space-2);
    margin: 0;
}

.page-title svg[b-eqnmyb0zrg] {
    color: var(--color-primary);
    flex-shrink: 0;
}

.page-subtitle[b-eqnmyb0zrg] {
    color: var(--text-muted);
    font-size: var(--font-size-sm);
    margin: 2px 0 0 0;
}

/* Search Bar */
.search-bar[b-eqnmyb0zrg] {
    display: flex;
    align-items: center;
    gap: var(--space-4);
    margin-bottom: var(--space-4);
    padding: var(--space-3) var(--space-4);
    background-color: var(--bg-secondary);
    border: var(--border-width-thin) solid var(--border-color-light);
}

.search-input-wrapper[b-eqnmyb0zrg] {
    display: flex;
    align-items: center;
    flex: 1;
    position: relative;
}

.search-icon[b-eqnmyb0zrg] {
    color: var(--text-muted);
    flex-shrink: 0;
    margin-right: var(--space-2);
}

.search-input[b-eqnmyb0zrg] {
    flex: 1;
    border: none;
    background: transparent;
    font-size: var(--font-size-sm);
    color: var(--color-gray-700);
    outline: none;
    padding: var(--space-1) 0;
}

.search-input[b-eqnmyb0zrg]::placeholder {
    color: var(--text-muted);
}

.search-clear[b-eqnmyb0zrg] {
    background: none;
    border: none;
    cursor: pointer;
    color: var(--text-muted);
    padding: var(--space-1);
    display: flex;
    align-items: center;
}

.search-clear:hover[b-eqnmyb0zrg] {
    color: var(--color-primary);
}

.search-count[b-eqnmyb0zrg] {
    flex-shrink: 0;
    font-size: var(--font-size-xs);
    color: var(--text-muted);
    font-weight: var(--font-weight-medium);
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

/* Alert Bar */
.alert-bar[b-eqnmyb0zrg] {
    display: flex;
    align-items: center;
    gap: var(--space-2);
    padding: var(--space-3) var(--space-4);
    margin-bottom: var(--space-4);
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-medium);
    border-left: var(--border-width-thick) solid;
}

.alert-bar-danger[b-eqnmyb0zrg] {
    background-color: #fdeded;
    border-left-color: var(--color-danger);
    color: #5f2120;
}

/* Loading / Empty States */
.loading-state[b-eqnmyb0zrg] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: var(--space-16) 0;
    color: var(--text-muted);
    gap: var(--space-4);
}

.empty-state[b-eqnmyb0zrg] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: var(--space-16) 0;
    color: var(--text-muted);
    gap: var(--space-3);
}

.empty-state svg[b-eqnmyb0zrg] {
    opacity: 0.4;
}

.empty-state-text[b-eqnmyb0zrg] {
    font-size: var(--font-size-base);
    margin: 0;
}

/* Lookup Results List */
.lookup-list[b-eqnmyb0zrg] {
    display: flex;
    flex-direction: column;
    border: var(--border-width-thin) solid var(--border-color-light);
}

.lookup-row[b-eqnmyb0zrg] {
    display: flex;
    align-items: center;
    gap: var(--space-3);
    padding: var(--space-3) var(--space-4);
    border: none;
    border-bottom: var(--border-width-thin) solid var(--border-color-light);
    background: var(--color-white);
    cursor: pointer;
    text-align: left;
    width: 100%;
    transition: background-color var(--transition-fast) var(--transition-ease);
}

.lookup-row:last-child[b-eqnmyb0zrg] {
    border-bottom: none;
}

.lookup-row:hover[b-eqnmyb0zrg] {
    background-color: rgba(11, 36, 62, 0.04);
}

.lookup-row:active[b-eqnmyb0zrg] {
    background-color: rgba(11, 36, 62, 0.08);
}

.lookup-code[b-eqnmyb0zrg] {
    flex-shrink: 0;
    min-width: 80px;
    font-family: var(--font-mono);
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-semibold);
    color: var(--color-primary);
}

.lookup-description[b-eqnmyb0zrg] {
    flex: 1;
    font-size: var(--font-size-sm);
    color: var(--color-gray-700);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.lookup-select-icon[b-eqnmyb0zrg] {
    flex-shrink: 0;
    color: var(--text-muted);
    opacity: 0;
    transition: opacity var(--transition-fast) var(--transition-ease);
}

.lookup-row:hover .lookup-select-icon[b-eqnmyb0zrg] {
    opacity: 1;
    color: var(--color-primary);
}

/* Responsive */
@media (max-width: 768px) {
    .lookup-code[b-eqnmyb0zrg] {
        min-width: 60px;
    }
}
/* /Components/Pages/Common/PaymentCreate.razor.rz.scp.css */
/* ===========================
   PaymentCreate - Scoped Styles
   Flat Industrial Minimal
   =========================== */

/* Page Container */
.page-container[b-qx6dxzazma] {
    max-width: 1100px;
    margin: 0 auto;
    padding: var(--space-6) var(--space-4);
}

/* Header */
.page-header[b-qx6dxzazma] {
    display: flex;
    align-items: center;
    gap: var(--space-4);
    margin-bottom: var(--space-6);
}

.btn-back[b-qx6dxzazma] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    color: var(--text-muted);
    border: var(--border-width-thin) solid var(--border-color-light);
    text-decoration: none;
    transition: all var(--transition-fast) var(--transition-ease);
    flex-shrink: 0;
}

.btn-back:hover[b-qx6dxzazma] {
    color: var(--color-primary);
    border-color: var(--color-primary);
    background-color: var(--color-gray-50);
    text-decoration: none;
}

.page-header-text[b-qx6dxzazma] {
    flex: 1;
}

.page-title[b-qx6dxzazma] {
    font-size: var(--font-size-xl);
    font-weight: var(--font-weight-bold);
    color: var(--color-primary);
    display: flex;
    align-items: center;
    gap: var(--space-2);
    margin: 0;
}

.page-title svg[b-qx6dxzazma] {
    color: var(--color-primary);
    flex-shrink: 0;
}

.page-subtitle[b-qx6dxzazma] {
    color: var(--text-muted);
    font-size: var(--font-size-sm);
    margin: 2px 0 0 0;
}

/* Alert Bar */
.alert-bar[b-qx6dxzazma] {
    display: flex;
    align-items: center;
    gap: var(--space-2);
    padding: var(--space-3) var(--space-4);
    margin-bottom: var(--space-4);
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-medium);
    border-left: var(--border-width-thick) solid;
}

.alert-bar-danger[b-qx6dxzazma] {
    background-color: #fdeded;
    border-left-color: var(--color-danger);
    color: #5f2120;
}

.alert-bar-close[b-qx6dxzazma] {
    margin-left: auto;
    background: none;
    border: none;
    font-size: var(--font-size-lg);
    cursor: pointer;
    color: inherit;
    opacity: 0.6;
    line-height: 1;
}

.alert-bar-close:hover[b-qx6dxzazma] {
    opacity: 1;
}

/* Form Sections */
.form-section[b-qx6dxzazma] {
    margin-bottom: var(--space-6);
    padding: var(--space-5);
    background-color: var(--color-white);
    border: var(--border-width-thin) solid var(--border-color-light);
}

.section-title[b-qx6dxzazma] {
    display: flex;
    align-items: center;
    gap: var(--space-2);
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-semibold);
    color: var(--color-primary);
    text-transform: uppercase;
    letter-spacing: 0.5px;
    margin: 0 0 var(--space-4) 0;
    padding-bottom: var(--space-3);
    border-bottom: var(--border-width-thin) solid var(--border-color-light);
}

.section-title svg[b-qx6dxzazma] {
    color: var(--color-primary);
    opacity: 0.6;
    flex-shrink: 0;
}

/* Form Grid */
.form-grid[b-qx6dxzazma] {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: var(--space-4);
}

.form-group[b-qx6dxzazma] {
    display: flex;
    flex-direction: column;
}

.form-group-wide[b-qx6dxzazma] {
    grid-column: span 2;
}

/* Form Controls */
.form-label[b-qx6dxzazma] {
    font-size: var(--font-size-xs);
    font-weight: var(--font-weight-medium);
    color: var(--text-secondary);
    text-transform: uppercase;
    letter-spacing: 0.3px;
    margin-bottom: var(--space-1);
}

.form-control[b-qx6dxzazma] {
    padding: var(--space-2) var(--space-3);
    font-size: var(--font-size-sm);
    color: var(--color-gray-700);
    border: var(--border-width-thin) solid var(--border-color-light);
    background-color: var(--color-white);
    transition: border-color var(--transition-fast) var(--transition-ease);
}

.form-control:focus[b-qx6dxzazma] {
    border-color: var(--color-primary);
    outline: none;
    box-shadow: none;
}

.form-control[b-qx6dxzazma]::placeholder {
    color: var(--color-gray-400);
}

.form-control-sm[b-qx6dxzazma] {
    padding: var(--space-1) var(--space-2);
    font-size: var(--font-size-xs);
}

[b-qx6dxzazma] .form-check-input {
    width: 18px;
    height: 18px;
    margin-top: var(--space-1);
}

/* Lines Section */
.btn-add-line[b-qx6dxzazma] {
    display: inline-flex;
    align-items: center;
    gap: var(--space-1);
    margin-left: auto;
    padding: var(--space-1) var(--space-3);
    font-size: var(--font-size-xs);
    font-weight: var(--font-weight-medium);
    color: var(--color-action);
    background: transparent;
    border: var(--border-width-thin) solid var(--color-action);
    cursor: pointer;
    text-transform: uppercase;
    letter-spacing: 0.3px;
    transition: all var(--transition-fast) var(--transition-ease);
}

.btn-add-line:hover[b-qx6dxzazma] {
    background-color: var(--color-action);
    color: var(--text-on-action);
}

.lines-empty[b-qx6dxzazma] {
    text-align: center;
    padding: var(--space-8) 0;
    color: var(--text-muted);
    font-size: var(--font-size-sm);
}

.lines-table-wrapper[b-qx6dxzazma] {
    overflow-x: auto;
}

.lines-table[b-qx6dxzazma] {
    width: 100%;
    border-collapse: collapse;
    font-size: var(--font-size-xs);
}

.lines-table th[b-qx6dxzazma] {
    padding: var(--space-2) var(--space-2);
    text-align: left;
    font-weight: var(--font-weight-semibold);
    color: var(--text-secondary);
    text-transform: uppercase;
    letter-spacing: 0.3px;
    border-bottom: var(--border-width-thin) solid var(--border-color-light);
    white-space: nowrap;
}

.lines-table td[b-qx6dxzazma] {
    padding: var(--space-2) var(--space-2);
    border-bottom: var(--border-width-thin) solid var(--border-color-light);
    vertical-align: middle;
}

.lines-table tr:last-child td[b-qx6dxzazma] {
    border-bottom: none;
}

.col-num[b-qx6dxzazma] {
    width: 40px;
    text-align: center;
    font-family: var(--font-mono);
    font-weight: var(--font-weight-medium);
    color: var(--text-muted);
}

.col-type[b-qx6dxzazma] {
    min-width: 180px;
}

.col-due[b-qx6dxzazma], .col-exp[b-qx6dxzazma] {
    width: 80px;
}

.col-days[b-qx6dxzazma] {
    width: 70px;
}

.col-pct[b-qx6dxzazma] {
    width: 80px;
}

.col-action[b-qx6dxzazma] {
    width: 40px;
    text-align: center;
}

.btn-icon[b-qx6dxzazma] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 28px;
    height: 28px;
    background: none;
    border: var(--border-width-thin) solid transparent;
    cursor: pointer;
    color: var(--text-muted);
    transition: all var(--transition-fast) var(--transition-ease);
}

.btn-icon:hover[b-qx6dxzazma] {
    color: var(--color-primary);
    background-color: var(--color-gray-100);
    border-color: var(--border-color-light);
}

.btn-icon-danger:hover[b-qx6dxzazma] {
    color: var(--color-action);
    background-color: rgba(178, 34, 34, 0.06);
    border-color: rgba(178, 34, 34, 0.2);
}

/* Form Actions */
.form-actions[b-qx6dxzazma] {
    display: flex;
    justify-content: flex-end;
    gap: var(--space-3);
    padding-top: var(--space-4);
    border-top: var(--border-width-thin) solid var(--border-color-light);
}

.form-actions .btn[b-qx6dxzazma] {
    display: inline-flex;
    align-items: center;
    gap: var(--space-2);
    padding: var(--space-2) var(--space-5);
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-medium);
    cursor: pointer;
    text-decoration: none;
}

.btn-action[b-qx6dxzazma] {
    background-color: var(--color-action);
    color: var(--text-on-action);
    border: var(--border-width-thin) solid var(--color-action);
    transition: background-color var(--transition-fast) var(--transition-ease);
}

.btn-action:hover[b-qx6dxzazma] {
    background-color: var(--color-action-hover);
    border-color: var(--color-action-hover);
    color: var(--text-on-action);
}

.btn-action:disabled[b-qx6dxzazma] {
    opacity: 0.65;
    cursor: not-allowed;
}

.btn-outline-primary[b-qx6dxzazma] {
    background: transparent;
    color: var(--color-primary);
    border: var(--border-width-thin) solid var(--color-primary);
}

.btn-outline-primary:hover[b-qx6dxzazma] {
    background-color: var(--color-primary);
    color: var(--text-on-primary);
    text-decoration: none;
}

/* Validation */
[b-qx6dxzazma] .validation-message {
    color: var(--color-danger);
    font-size: var(--font-size-xs);
    margin-top: 2px;
}

/* Responsive */
@media (max-width: 768px) {
    .form-grid[b-qx6dxzazma] {
        grid-template-columns: 1fr;
    }

    .form-group-wide[b-qx6dxzazma] {
        grid-column: span 1;
    }

    .form-actions[b-qx6dxzazma] {
        flex-direction: column-reverse;
    }

    .form-actions .btn[b-qx6dxzazma] {
        justify-content: center;
    }
}
/* /Components/Pages/Common/PaymentEdit.razor.rz.scp.css */
/* ===========================
   PaymentEdit - Scoped Styles
   Flat Industrial Minimal
   =========================== */

/* Page Container */
.page-container[b-uh1bqqzcpw] {
    max-width: 1100px;
    margin: 0 auto;
    padding: var(--space-6) var(--space-4);
}

/* Header */
.page-header[b-uh1bqqzcpw] {
    display: flex;
    align-items: center;
    gap: var(--space-4);
    margin-bottom: var(--space-6);
}

.btn-back[b-uh1bqqzcpw] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    color: var(--text-muted);
    border: var(--border-width-thin) solid var(--border-color-light);
    text-decoration: none;
    transition: all var(--transition-fast) var(--transition-ease);
    flex-shrink: 0;
}

.btn-back:hover[b-uh1bqqzcpw] {
    color: var(--color-primary);
    border-color: var(--color-primary);
    background-color: var(--color-gray-50);
    text-decoration: none;
}

.page-header-text[b-uh1bqqzcpw] {
    flex: 1;
}

.page-title[b-uh1bqqzcpw] {
    font-size: var(--font-size-xl);
    font-weight: var(--font-weight-bold);
    color: var(--color-primary);
    display: flex;
    align-items: center;
    gap: var(--space-2);
    margin: 0;
}

.page-title svg[b-uh1bqqzcpw] {
    color: var(--color-primary);
    flex-shrink: 0;
}

.page-subtitle[b-uh1bqqzcpw] {
    color: var(--text-muted);
    font-size: var(--font-size-sm);
    margin: 2px 0 0 0;
    display: flex;
    align-items: center;
    gap: var(--space-2);
}

.subtitle-code[b-uh1bqqzcpw] {
    font-family: var(--font-mono);
    font-size: var(--font-size-xs);
    color: var(--color-primary);
    opacity: 0.6;
    padding: 1px var(--space-2);
    background-color: var(--color-gray-100);
}

/* Alert Bar */
.alert-bar[b-uh1bqqzcpw] {
    display: flex;
    align-items: center;
    gap: var(--space-2);
    padding: var(--space-3) var(--space-4);
    margin-bottom: var(--space-4);
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-medium);
    border-left: var(--border-width-thick) solid;
}

.alert-bar-danger[b-uh1bqqzcpw] {
    background-color: #fdeded;
    border-left-color: var(--color-danger);
    color: #5f2120;
}

.alert-bar-close[b-uh1bqqzcpw] {
    margin-left: auto;
    background: none;
    border: none;
    font-size: var(--font-size-lg);
    cursor: pointer;
    color: inherit;
    opacity: 0.6;
    line-height: 1;
}

.alert-bar-close:hover[b-uh1bqqzcpw] {
    opacity: 1;
}

/* Loading / Empty States */
.loading-state[b-uh1bqqzcpw] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: var(--space-16) 0;
    color: var(--text-muted);
    gap: var(--space-4);
}

.empty-state[b-uh1bqqzcpw] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: var(--space-16) 0;
    color: var(--text-muted);
    gap: var(--space-3);
}

.empty-state svg[b-uh1bqqzcpw] {
    opacity: 0.4;
}

.empty-state-text[b-uh1bqqzcpw] {
    font-size: var(--font-size-base);
    margin: 0;
}

/* Form Sections */
.form-section[b-uh1bqqzcpw] {
    margin-bottom: var(--space-6);
    padding: var(--space-5);
    background-color: var(--color-white);
    border: var(--border-width-thin) solid var(--border-color-light);
}

.section-title[b-uh1bqqzcpw] {
    display: flex;
    align-items: center;
    gap: var(--space-2);
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-semibold);
    color: var(--color-primary);
    text-transform: uppercase;
    letter-spacing: 0.5px;
    margin: 0 0 var(--space-4) 0;
    padding-bottom: var(--space-3);
    border-bottom: var(--border-width-thin) solid var(--border-color-light);
}

.section-title svg[b-uh1bqqzcpw] {
    color: var(--color-primary);
    opacity: 0.6;
    flex-shrink: 0;
}

/* Form Grid */
.form-grid[b-uh1bqqzcpw] {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: var(--space-4);
}

.form-group[b-uh1bqqzcpw] {
    display: flex;
    flex-direction: column;
}

.form-group-wide[b-uh1bqqzcpw] {
    grid-column: span 2;
}

/* Form Controls */
.form-label[b-uh1bqqzcpw] {
    font-size: var(--font-size-xs);
    font-weight: var(--font-weight-medium);
    color: var(--text-secondary);
    text-transform: uppercase;
    letter-spacing: 0.3px;
    margin-bottom: var(--space-1);
}

.form-control[b-uh1bqqzcpw] {
    padding: var(--space-2) var(--space-3);
    font-size: var(--font-size-sm);
    color: var(--color-gray-700);
    border: var(--border-width-thin) solid var(--border-color-light);
    background-color: var(--color-white);
    transition: border-color var(--transition-fast) var(--transition-ease);
}

.form-control:focus[b-uh1bqqzcpw] {
    border-color: var(--color-primary);
    outline: none;
    box-shadow: none;
}

.form-control[b-uh1bqqzcpw]::placeholder {
    color: var(--color-gray-400);
}

.form-control-sm[b-uh1bqqzcpw] {
    padding: var(--space-1) var(--space-2);
    font-size: var(--font-size-xs);
}

.form-control-static[b-uh1bqqzcpw] {
    padding: var(--space-2) var(--space-3);
    font-size: var(--font-size-sm);
    color: var(--text-muted);
    background-color: var(--color-gray-50);
    border: var(--border-width-thin) solid var(--border-color-light);
    font-family: var(--font-mono);
}

[b-uh1bqqzcpw] .form-check-input {
    width: 18px;
    height: 18px;
    margin-top: var(--space-1);
}

/* Lines Section */
.btn-add-line[b-uh1bqqzcpw] {
    display: inline-flex;
    align-items: center;
    gap: var(--space-1);
    margin-left: auto;
    padding: var(--space-1) var(--space-3);
    font-size: var(--font-size-xs);
    font-weight: var(--font-weight-medium);
    color: var(--color-action);
    background: transparent;
    border: var(--border-width-thin) solid var(--color-action);
    cursor: pointer;
    text-transform: uppercase;
    letter-spacing: 0.3px;
    transition: all var(--transition-fast) var(--transition-ease);
}

.btn-add-line:hover[b-uh1bqqzcpw] {
    background-color: var(--color-action);
    color: var(--text-on-action);
}

.lines-empty[b-uh1bqqzcpw] {
    text-align: center;
    padding: var(--space-8) 0;
    color: var(--text-muted);
    font-size: var(--font-size-sm);
}

.lines-table-wrapper[b-uh1bqqzcpw] {
    overflow-x: auto;
}

.lines-table[b-uh1bqqzcpw] {
    width: 100%;
    border-collapse: collapse;
    font-size: var(--font-size-xs);
}

.lines-table th[b-uh1bqqzcpw] {
    padding: var(--space-2) var(--space-2);
    text-align: left;
    font-weight: var(--font-weight-semibold);
    color: var(--text-secondary);
    text-transform: uppercase;
    letter-spacing: 0.3px;
    border-bottom: var(--border-width-thin) solid var(--border-color-light);
    white-space: nowrap;
}

.lines-table td[b-uh1bqqzcpw] {
    padding: var(--space-2) var(--space-2);
    border-bottom: var(--border-width-thin) solid var(--border-color-light);
    vertical-align: middle;
}

.lines-table tr:last-child td[b-uh1bqqzcpw] {
    border-bottom: none;
}

.col-num[b-uh1bqqzcpw] {
    width: 40px;
    text-align: center;
    font-family: var(--font-mono);
    font-weight: var(--font-weight-medium);
    color: var(--text-muted);
}

.col-type[b-uh1bqqzcpw] {
    min-width: 180px;
}

.col-due[b-uh1bqqzcpw], .col-exp[b-uh1bqqzcpw] {
    width: 80px;
}

.col-days[b-uh1bqqzcpw] {
    width: 70px;
}

.col-pct[b-uh1bqqzcpw] {
    width: 80px;
}

.col-action[b-uh1bqqzcpw] {
    width: 40px;
    text-align: center;
}

.btn-icon[b-uh1bqqzcpw] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 28px;
    height: 28px;
    background: none;
    border: var(--border-width-thin) solid transparent;
    cursor: pointer;
    color: var(--text-muted);
    transition: all var(--transition-fast) var(--transition-ease);
}

.btn-icon:hover[b-uh1bqqzcpw] {
    color: var(--color-primary);
    background-color: var(--color-gray-100);
    border-color: var(--border-color-light);
}

.btn-icon-danger:hover[b-uh1bqqzcpw] {
    color: var(--color-action);
    background-color: rgba(178, 34, 34, 0.06);
    border-color: rgba(178, 34, 34, 0.2);
}

/* Form Actions */
.form-actions[b-uh1bqqzcpw] {
    display: flex;
    justify-content: flex-end;
    gap: var(--space-3);
    padding-top: var(--space-4);
    border-top: var(--border-width-thin) solid var(--border-color-light);
}

.form-actions .btn[b-uh1bqqzcpw] {
    display: inline-flex;
    align-items: center;
    gap: var(--space-2);
    padding: var(--space-2) var(--space-5);
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-medium);
    cursor: pointer;
    text-decoration: none;
}

.btn-action[b-uh1bqqzcpw] {
    background-color: var(--color-action);
    color: var(--text-on-action);
    border: var(--border-width-thin) solid var(--color-action);
    transition: background-color var(--transition-fast) var(--transition-ease);
}

.btn-action:hover[b-uh1bqqzcpw] {
    background-color: var(--color-action-hover);
    border-color: var(--color-action-hover);
    color: var(--text-on-action);
}

.btn-action:disabled[b-uh1bqqzcpw] {
    opacity: 0.65;
    cursor: not-allowed;
}

.btn-outline-primary[b-uh1bqqzcpw] {
    background: transparent;
    color: var(--color-primary);
    border: var(--border-width-thin) solid var(--color-primary);
}

.btn-outline-primary:hover[b-uh1bqqzcpw] {
    background-color: var(--color-primary);
    color: var(--text-on-primary);
    text-decoration: none;
}

/* Validation */
[b-uh1bqqzcpw] .validation-message {
    color: var(--color-danger);
    font-size: var(--font-size-xs);
    margin-top: 2px;
}

/* Responsive */
@media (max-width: 768px) {
    .form-grid[b-uh1bqqzcpw] {
        grid-template-columns: 1fr;
    }

    .form-group-wide[b-uh1bqqzcpw] {
        grid-column: span 1;
    }

    .form-actions[b-uh1bqqzcpw] {
        flex-direction: column-reverse;
    }

    .form-actions .btn[b-uh1bqqzcpw] {
        justify-content: center;
    }
}
/* /Components/Pages/Common/PaymentList.razor.rz.scp.css */
/* ===========================
   PaymentList - Scoped Styles
   Flat Industrial Minimal
   =========================== */

/* Page Container */
.page-container[b-f04kzaeapg] {
    max-width: 1200px;
    margin: 0 auto;
    padding: var(--space-6) var(--space-4);
}

/* Header */
.page-header[b-f04kzaeapg] {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    margin-bottom: var(--space-6);
    gap: var(--space-4);
}

.page-header-left[b-f04kzaeapg] {
    flex: 1;
}

.page-header-right[b-f04kzaeapg] {
    flex-shrink: 0;
}

.page-title[b-f04kzaeapg] {
    font-size: var(--font-size-2xl);
    font-weight: var(--font-weight-bold);
    color: var(--color-primary);
    display: flex;
    align-items: center;
    gap: var(--space-2);
    margin: 0;
}

.page-title svg[b-f04kzaeapg] {
    color: var(--color-primary);
    flex-shrink: 0;
}

.page-subtitle[b-f04kzaeapg] {
    color: var(--text-muted);
    font-size: var(--font-size-sm);
    margin: var(--space-1) 0 0 0;
}

/* Action Button */
.btn-action[b-f04kzaeapg] {
    display: inline-flex;
    align-items: center;
    gap: var(--space-2);
    padding: var(--space-2) var(--space-4);
    background-color: var(--color-action);
    color: var(--text-on-action);
    border: var(--border-width-thin) solid var(--color-action);
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-medium);
    text-decoration: none;
    cursor: pointer;
    transition: background-color var(--transition-fast) var(--transition-ease),
                box-shadow var(--transition-fast) var(--transition-ease);
}

.btn-action:hover[b-f04kzaeapg] {
    background-color: var(--color-action-hover);
    border-color: var(--color-action-hover);
    color: var(--text-on-action);
    text-decoration: none;
    box-shadow: var(--shadow-sm);
}

.btn-action:active[b-f04kzaeapg] {
    background-color: var(--color-action-active);
}

/* Alert Bars */
.alert-bar[b-f04kzaeapg] {
    display: flex;
    align-items: center;
    gap: var(--space-2);
    padding: var(--space-3) var(--space-4);
    margin-bottom: var(--space-4);
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-medium);
    border-left: var(--border-width-thick) solid;
}

.alert-bar-success[b-f04kzaeapg] {
    background-color: #edf7ed;
    border-left-color: var(--color-success);
    color: #1e4620;
}

.alert-bar-danger[b-f04kzaeapg] {
    background-color: #fdeded;
    border-left-color: var(--color-danger);
    color: #5f2120;
}

.alert-bar-close[b-f04kzaeapg] {
    margin-left: auto;
    background: none;
    border: none;
    font-size: var(--font-size-lg);
    cursor: pointer;
    color: inherit;
    opacity: 0.6;
    line-height: 1;
}

.alert-bar-close:hover[b-f04kzaeapg] {
    opacity: 1;
}

/* Search Bar */
.search-bar[b-f04kzaeapg] {
    display: flex;
    align-items: center;
    gap: var(--space-4);
    margin-bottom: var(--space-4);
    padding: var(--space-3) var(--space-4);
    background-color: var(--bg-secondary);
    border: var(--border-width-thin) solid var(--border-color-light);
}

.search-input-wrapper[b-f04kzaeapg] {
    display: flex;
    align-items: center;
    flex: 1;
    position: relative;
}

.search-icon[b-f04kzaeapg] {
    color: var(--text-muted);
    flex-shrink: 0;
    margin-right: var(--space-2);
}

.search-input[b-f04kzaeapg] {
    flex: 1;
    border: none;
    background: transparent;
    font-size: var(--font-size-sm);
    color: var(--color-gray-700);
    outline: none;
    padding: var(--space-1) 0;
}

.search-input[b-f04kzaeapg]::placeholder {
    color: var(--text-muted);
}

.search-clear[b-f04kzaeapg] {
    background: none;
    border: none;
    cursor: pointer;
    color: var(--text-muted);
    padding: var(--space-1);
    display: flex;
    align-items: center;
}

.search-clear:hover[b-f04kzaeapg] {
    color: var(--color-primary);
}

.search-count[b-f04kzaeapg] {
    flex-shrink: 0;
    font-size: var(--font-size-xs);
    color: var(--text-muted);
    font-weight: var(--font-weight-medium);
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

/* Loading / Empty States */
.loading-state[b-f04kzaeapg] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: var(--space-16) 0;
    color: var(--text-muted);
    gap: var(--space-4);
}

.empty-state[b-f04kzaeapg] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: var(--space-16) 0;
    color: var(--text-muted);
    gap: var(--space-3);
}

.empty-state svg[b-f04kzaeapg] {
    opacity: 0.4;
}

.empty-state-text[b-f04kzaeapg] {
    font-size: var(--font-size-base);
    margin: 0;
}

/* Item List */
.item-list[b-f04kzaeapg] {
    display: flex;
    flex-direction: column;
    border: var(--border-width-thin) solid var(--border-color-light);
}

/* Item Row */
.item-row[b-f04kzaeapg] {
    display: flex;
    align-items: center;
    gap: var(--space-4);
    padding: var(--space-4);
    border-bottom: var(--border-width-thin) solid var(--border-color-light);
    transition: background-color var(--transition-fast) var(--transition-ease);
}

.item-row:last-child[b-f04kzaeapg] {
    border-bottom: none;
}

.item-row:hover[b-f04kzaeapg] {
    background-color: rgba(11, 36, 62, 0.03);
}

/* Avatar */
.item-avatar[b-f04kzaeapg] {
    flex-shrink: 0;
    width: 40px;
    height: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: var(--color-gray-100);
    color: var(--color-primary);
}

/* Item Info */
.item-info[b-f04kzaeapg] {
    flex: 1;
    min-width: 0;
}

.item-name[b-f04kzaeapg] {
    font-size: var(--font-size-base);
    font-weight: var(--font-weight-semibold);
    color: var(--color-primary);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.item-meta[b-f04kzaeapg] {
    display: flex;
    align-items: center;
    gap: var(--space-1);
    flex-wrap: wrap;
    font-size: var(--font-size-xs);
    color: var(--text-secondary);
    margin-top: 2px;
}

.item-code[b-f04kzaeapg] {
    font-family: var(--font-mono);
    font-weight: var(--font-weight-medium);
    color: var(--color-primary);
    opacity: 0.7;
}

.meta-separator[b-f04kzaeapg] {
    color: var(--color-gray-300);
}

.badge-default[b-f04kzaeapg] {
    display: inline-flex;
    align-items: center;
    padding: 1px var(--space-2);
    font-size: var(--font-size-xs);
    font-weight: var(--font-weight-semibold);
    color: var(--color-success);
    background-color: #edf7ed;
    text-transform: uppercase;
    letter-spacing: 0.3px;
}

/* Action Buttons */
.item-actions[b-f04kzaeapg] {
    flex-shrink: 0;
    display: flex;
    align-items: center;
    gap: var(--space-1);
}

.btn-icon[b-f04kzaeapg] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 36px;
    background: none;
    border: var(--border-width-thin) solid transparent;
    cursor: pointer;
    color: var(--text-muted);
    text-decoration: none;
    transition: all var(--transition-fast) var(--transition-ease);
}

.btn-icon:hover[b-f04kzaeapg] {
    color: var(--color-primary);
    background-color: var(--color-gray-100);
    border-color: var(--border-color-light);
    text-decoration: none;
}

.btn-icon-danger:hover[b-f04kzaeapg] {
    color: var(--color-action);
    background-color: rgba(178, 34, 34, 0.06);
    border-color: rgba(178, 34, 34, 0.2);
}

/* Overlay & Dialog */
.overlay[b-f04kzaeapg] {
    position: fixed;
    inset: 0;
    background-color: rgba(0, 0, 0, 0.4);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: var(--z-modal-backdrop);
}

.confirm-dialog[b-f04kzaeapg] {
    background-color: var(--color-white);
    padding: var(--space-8);
    max-width: 420px;
    width: 90%;
    box-shadow: var(--shadow-xl);
    text-align: center;
    z-index: var(--z-modal);
}

.confirm-icon[b-f04kzaeapg] {
    color: var(--color-action);
    margin-bottom: var(--space-4);
}

.confirm-dialog h3[b-f04kzaeapg] {
    font-size: var(--font-size-lg);
    font-weight: var(--font-weight-semibold);
    color: var(--color-primary);
    margin: 0 0 var(--space-2) 0;
}

.confirm-dialog p[b-f04kzaeapg] {
    font-size: var(--font-size-sm);
    color: var(--text-secondary);
    margin: 0 0 var(--space-2) 0;
}

.confirm-warning[b-f04kzaeapg] {
    font-size: var(--font-size-xs) !important;
    color: var(--color-action) !important;
    font-weight: var(--font-weight-medium);
}

.confirm-actions[b-f04kzaeapg] {
    display: flex;
    gap: var(--space-3);
    justify-content: center;
    margin-top: var(--space-6);
}

.confirm-actions .btn[b-f04kzaeapg] {
    min-width: 100px;
    padding: var(--space-2) var(--space-4);
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-medium);
    cursor: pointer;
}

/* Outline Primary Button */
.btn-outline-primary[b-f04kzaeapg] {
    background: transparent;
    color: var(--color-primary);
    border: var(--border-width-thin) solid var(--color-primary);
}

.btn-outline-primary:hover[b-f04kzaeapg] {
    background-color: var(--color-primary);
    color: var(--text-on-primary);
}

/* Responsive */
@media (max-width: 768px) {
    .page-header[b-f04kzaeapg] {
        flex-direction: column;
        gap: var(--space-3);
    }

    .item-row[b-f04kzaeapg] {
        flex-wrap: wrap;
    }

    .item-actions[b-f04kzaeapg] {
        order: 6;
        margin-left: auto;
    }
}
/* /Components/Pages/Common/PaymentTypeCreate.razor.rz.scp.css */
/* ===========================
   PaymentTypeCreate - Scoped Styles
   Flat Industrial Minimal
   =========================== */

/* Page Container */
.page-container[b-7oepswdw86] {
    max-width: 900px;
    margin: 0 auto;
    padding: var(--space-6) var(--space-4);
}

/* Header */
.page-header[b-7oepswdw86] {
    display: flex;
    align-items: center;
    gap: var(--space-4);
    margin-bottom: var(--space-6);
}

.btn-back[b-7oepswdw86] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    color: var(--text-muted);
    border: var(--border-width-thin) solid var(--border-color-light);
    text-decoration: none;
    transition: all var(--transition-fast) var(--transition-ease);
    flex-shrink: 0;
}

.btn-back:hover[b-7oepswdw86] {
    color: var(--color-primary);
    border-color: var(--color-primary);
    background-color: var(--color-gray-50);
    text-decoration: none;
}

.page-header-text[b-7oepswdw86] {
    flex: 1;
}

.page-title[b-7oepswdw86] {
    font-size: var(--font-size-xl);
    font-weight: var(--font-weight-bold);
    color: var(--color-primary);
    display: flex;
    align-items: center;
    gap: var(--space-2);
    margin: 0;
}

.page-title svg[b-7oepswdw86] {
    color: var(--color-primary);
    flex-shrink: 0;
}

.page-subtitle[b-7oepswdw86] {
    color: var(--text-muted);
    font-size: var(--font-size-sm);
    margin: 2px 0 0 0;
}

/* Alert Bar */
.alert-bar[b-7oepswdw86] {
    display: flex;
    align-items: center;
    gap: var(--space-2);
    padding: var(--space-3) var(--space-4);
    margin-bottom: var(--space-4);
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-medium);
    border-left: var(--border-width-thick) solid;
}

.alert-bar-danger[b-7oepswdw86] {
    background-color: #fdeded;
    border-left-color: var(--color-danger);
    color: #5f2120;
}

.alert-bar-close[b-7oepswdw86] {
    margin-left: auto;
    background: none;
    border: none;
    font-size: var(--font-size-lg);
    cursor: pointer;
    color: inherit;
    opacity: 0.6;
    line-height: 1;
}

.alert-bar-close:hover[b-7oepswdw86] {
    opacity: 1;
}

/* Form Sections */
.form-section[b-7oepswdw86] {
    margin-bottom: var(--space-6);
    padding: var(--space-5);
    background-color: var(--color-white);
    border: var(--border-width-thin) solid var(--border-color-light);
}

.section-title[b-7oepswdw86] {
    display: flex;
    align-items: center;
    gap: var(--space-2);
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-semibold);
    color: var(--color-primary);
    text-transform: uppercase;
    letter-spacing: 0.5px;
    margin: 0 0 var(--space-4) 0;
    padding-bottom: var(--space-3);
    border-bottom: var(--border-width-thin) solid var(--border-color-light);
}

.section-title svg[b-7oepswdw86] {
    color: var(--color-primary);
    opacity: 0.6;
    flex-shrink: 0;
}

/* Form Grid */
.form-grid[b-7oepswdw86] {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: var(--space-4);
}

.form-group[b-7oepswdw86] {
    display: flex;
    flex-direction: column;
}

.form-group-wide[b-7oepswdw86] {
    grid-column: span 2;
}

/* Form Controls */
.form-label[b-7oepswdw86] {
    font-size: var(--font-size-xs);
    font-weight: var(--font-weight-medium);
    color: var(--text-secondary);
    text-transform: uppercase;
    letter-spacing: 0.3px;
    margin-bottom: var(--space-1);
}

.form-control[b-7oepswdw86] {
    padding: var(--space-2) var(--space-3);
    font-size: var(--font-size-sm);
    color: var(--color-gray-700);
    border: var(--border-width-thin) solid var(--border-color-light);
    background-color: var(--color-white);
    transition: border-color var(--transition-fast) var(--transition-ease);
}

.form-control:focus[b-7oepswdw86] {
    border-color: var(--color-primary);
    outline: none;
    box-shadow: none;
}

.form-control[b-7oepswdw86]::placeholder {
    color: var(--color-gray-400);
}

/* Form Actions */
.form-actions[b-7oepswdw86] {
    display: flex;
    justify-content: flex-end;
    gap: var(--space-3);
    padding-top: var(--space-4);
    border-top: var(--border-width-thin) solid var(--border-color-light);
}

.form-actions .btn[b-7oepswdw86] {
    display: inline-flex;
    align-items: center;
    gap: var(--space-2);
    padding: var(--space-2) var(--space-5);
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-medium);
    cursor: pointer;
    text-decoration: none;
}

.btn-action[b-7oepswdw86] {
    background-color: var(--color-action);
    color: var(--text-on-action);
    border: var(--border-width-thin) solid var(--color-action);
    transition: background-color var(--transition-fast) var(--transition-ease);
}

.btn-action:hover[b-7oepswdw86] {
    background-color: var(--color-action-hover);
    border-color: var(--color-action-hover);
    color: var(--text-on-action);
}

.btn-action:disabled[b-7oepswdw86] {
    opacity: 0.65;
    cursor: not-allowed;
}

.btn-outline-primary[b-7oepswdw86] {
    background: transparent;
    color: var(--color-primary);
    border: var(--border-width-thin) solid var(--color-primary);
}

.btn-outline-primary:hover[b-7oepswdw86] {
    background-color: var(--color-primary);
    color: var(--text-on-primary);
    text-decoration: none;
}

/* Validation */
[b-7oepswdw86] .validation-message {
    color: var(--color-danger);
    font-size: var(--font-size-xs);
    margin-top: 2px;
}

/* Responsive */
@media (max-width: 768px) {
    .form-grid[b-7oepswdw86] {
        grid-template-columns: 1fr;
    }

    .form-group-wide[b-7oepswdw86] {
        grid-column: span 1;
    }

    .form-actions[b-7oepswdw86] {
        flex-direction: column-reverse;
    }

    .form-actions .btn[b-7oepswdw86] {
        justify-content: center;
    }
}
/* /Components/Pages/Common/PaymentTypeEdit.razor.rz.scp.css */
/* ===========================
   PaymentTypeEdit - Scoped Styles
   Flat Industrial Minimal
   =========================== */

/* Page Container */
.page-container[b-1k7yrydcvt] {
    max-width: 900px;
    margin: 0 auto;
    padding: var(--space-6) var(--space-4);
}

/* Header */
.page-header[b-1k7yrydcvt] {
    display: flex;
    align-items: center;
    gap: var(--space-4);
    margin-bottom: var(--space-6);
}

.btn-back[b-1k7yrydcvt] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    color: var(--text-muted);
    border: var(--border-width-thin) solid var(--border-color-light);
    text-decoration: none;
    transition: all var(--transition-fast) var(--transition-ease);
    flex-shrink: 0;
}

.btn-back:hover[b-1k7yrydcvt] {
    color: var(--color-primary);
    border-color: var(--color-primary);
    background-color: var(--color-gray-50);
    text-decoration: none;
}

.page-header-text[b-1k7yrydcvt] {
    flex: 1;
}

.page-title[b-1k7yrydcvt] {
    font-size: var(--font-size-xl);
    font-weight: var(--font-weight-bold);
    color: var(--color-primary);
    display: flex;
    align-items: center;
    gap: var(--space-2);
    margin: 0;
}

.page-title svg[b-1k7yrydcvt] {
    color: var(--color-primary);
    flex-shrink: 0;
}

.page-subtitle[b-1k7yrydcvt] {
    color: var(--text-muted);
    font-size: var(--font-size-sm);
    margin: 2px 0 0 0;
    display: flex;
    align-items: center;
    gap: var(--space-2);
}

.subtitle-code[b-1k7yrydcvt] {
    font-family: var(--font-mono);
    font-size: var(--font-size-xs);
    color: var(--color-primary);
    opacity: 0.6;
    padding: 1px var(--space-2);
    background-color: var(--color-gray-100);
}

/* Alert Bar */
.alert-bar[b-1k7yrydcvt] {
    display: flex;
    align-items: center;
    gap: var(--space-2);
    padding: var(--space-3) var(--space-4);
    margin-bottom: var(--space-4);
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-medium);
    border-left: var(--border-width-thick) solid;
}

.alert-bar-danger[b-1k7yrydcvt] {
    background-color: #fdeded;
    border-left-color: var(--color-danger);
    color: #5f2120;
}

.alert-bar-close[b-1k7yrydcvt] {
    margin-left: auto;
    background: none;
    border: none;
    font-size: var(--font-size-lg);
    cursor: pointer;
    color: inherit;
    opacity: 0.6;
    line-height: 1;
}

.alert-bar-close:hover[b-1k7yrydcvt] {
    opacity: 1;
}

/* Loading / Empty States */
.loading-state[b-1k7yrydcvt] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: var(--space-16) 0;
    color: var(--text-muted);
    gap: var(--space-4);
}

.empty-state[b-1k7yrydcvt] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: var(--space-16) 0;
    color: var(--text-muted);
    gap: var(--space-3);
}

.empty-state svg[b-1k7yrydcvt] {
    opacity: 0.4;
}

.empty-state-text[b-1k7yrydcvt] {
    font-size: var(--font-size-base);
    margin: 0;
}

/* Form Sections */
.form-section[b-1k7yrydcvt] {
    margin-bottom: var(--space-6);
    padding: var(--space-5);
    background-color: var(--color-white);
    border: var(--border-width-thin) solid var(--border-color-light);
}

.section-title[b-1k7yrydcvt] {
    display: flex;
    align-items: center;
    gap: var(--space-2);
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-semibold);
    color: var(--color-primary);
    text-transform: uppercase;
    letter-spacing: 0.5px;
    margin: 0 0 var(--space-4) 0;
    padding-bottom: var(--space-3);
    border-bottom: var(--border-width-thin) solid var(--border-color-light);
}

.section-title svg[b-1k7yrydcvt] {
    color: var(--color-primary);
    opacity: 0.6;
    flex-shrink: 0;
}

/* Form Grid */
.form-grid[b-1k7yrydcvt] {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: var(--space-4);
}

.form-group[b-1k7yrydcvt] {
    display: flex;
    flex-direction: column;
}

.form-group-wide[b-1k7yrydcvt] {
    grid-column: span 2;
}

/* Form Controls */
.form-label[b-1k7yrydcvt] {
    font-size: var(--font-size-xs);
    font-weight: var(--font-weight-medium);
    color: var(--text-secondary);
    text-transform: uppercase;
    letter-spacing: 0.3px;
    margin-bottom: var(--space-1);
}

.form-control[b-1k7yrydcvt] {
    padding: var(--space-2) var(--space-3);
    font-size: var(--font-size-sm);
    color: var(--color-gray-700);
    border: var(--border-width-thin) solid var(--border-color-light);
    background-color: var(--color-white);
    transition: border-color var(--transition-fast) var(--transition-ease);
}

.form-control:focus[b-1k7yrydcvt] {
    border-color: var(--color-primary);
    outline: none;
    box-shadow: none;
}

.form-control[b-1k7yrydcvt]::placeholder {
    color: var(--color-gray-400);
}

.form-control-static[b-1k7yrydcvt] {
    padding: var(--space-2) var(--space-3);
    font-size: var(--font-size-sm);
    color: var(--text-muted);
    background-color: var(--color-gray-50);
    border: var(--border-width-thin) solid var(--border-color-light);
    font-family: var(--font-mono);
}

/* Form Actions */
.form-actions[b-1k7yrydcvt] {
    display: flex;
    justify-content: flex-end;
    gap: var(--space-3);
    padding-top: var(--space-4);
    border-top: var(--border-width-thin) solid var(--border-color-light);
}

.form-actions .btn[b-1k7yrydcvt] {
    display: inline-flex;
    align-items: center;
    gap: var(--space-2);
    padding: var(--space-2) var(--space-5);
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-medium);
    cursor: pointer;
    text-decoration: none;
}

.btn-action[b-1k7yrydcvt] {
    background-color: var(--color-action);
    color: var(--text-on-action);
    border: var(--border-width-thin) solid var(--color-action);
    transition: background-color var(--transition-fast) var(--transition-ease);
}

.btn-action:hover[b-1k7yrydcvt] {
    background-color: var(--color-action-hover);
    border-color: var(--color-action-hover);
    color: var(--text-on-action);
}

.btn-action:disabled[b-1k7yrydcvt] {
    opacity: 0.65;
    cursor: not-allowed;
}

.btn-outline-primary[b-1k7yrydcvt] {
    background: transparent;
    color: var(--color-primary);
    border: var(--border-width-thin) solid var(--color-primary);
}

.btn-outline-primary:hover[b-1k7yrydcvt] {
    background-color: var(--color-primary);
    color: var(--text-on-primary);
    text-decoration: none;
}

/* Validation */
[b-1k7yrydcvt] .validation-message {
    color: var(--color-danger);
    font-size: var(--font-size-xs);
    margin-top: 2px;
}

/* Responsive */
@media (max-width: 768px) {
    .form-grid[b-1k7yrydcvt] {
        grid-template-columns: 1fr;
    }

    .form-group-wide[b-1k7yrydcvt] {
        grid-column: span 1;
    }

    .form-actions[b-1k7yrydcvt] {
        flex-direction: column-reverse;
    }

    .form-actions .btn[b-1k7yrydcvt] {
        justify-content: center;
    }
}
/* /Components/Pages/Common/PaymentTypeList.razor.rz.scp.css */
/* ===========================
   PaymentTypeList - Scoped Styles
   Flat Industrial Minimal
   =========================== */

/* Page Container */
.page-container[b-7hrmrufiqh] {
    max-width: 1200px;
    margin: 0 auto;
    padding: var(--space-6) var(--space-4);
}

/* Header */
.page-header[b-7hrmrufiqh] {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    margin-bottom: var(--space-6);
    gap: var(--space-4);
}

.page-header-left[b-7hrmrufiqh] {
    flex: 1;
}

.page-header-right[b-7hrmrufiqh] {
    flex-shrink: 0;
}

.page-title[b-7hrmrufiqh] {
    font-size: var(--font-size-2xl);
    font-weight: var(--font-weight-bold);
    color: var(--color-primary);
    display: flex;
    align-items: center;
    gap: var(--space-2);
    margin: 0;
}

.page-title svg[b-7hrmrufiqh] {
    color: var(--color-primary);
    flex-shrink: 0;
}

.page-subtitle[b-7hrmrufiqh] {
    color: var(--text-muted);
    font-size: var(--font-size-sm);
    margin: var(--space-1) 0 0 0;
}

/* Action Button */
.btn-action[b-7hrmrufiqh] {
    display: inline-flex;
    align-items: center;
    gap: var(--space-2);
    padding: var(--space-2) var(--space-4);
    background-color: var(--color-action);
    color: var(--text-on-action);
    border: var(--border-width-thin) solid var(--color-action);
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-medium);
    text-decoration: none;
    cursor: pointer;
    transition: background-color var(--transition-fast) var(--transition-ease),
                box-shadow var(--transition-fast) var(--transition-ease);
}

.btn-action:hover[b-7hrmrufiqh] {
    background-color: var(--color-action-hover);
    border-color: var(--color-action-hover);
    color: var(--text-on-action);
    text-decoration: none;
    box-shadow: var(--shadow-sm);
}

.btn-action:active[b-7hrmrufiqh] {
    background-color: var(--color-action-active);
}

/* Alert Bars */
.alert-bar[b-7hrmrufiqh] {
    display: flex;
    align-items: center;
    gap: var(--space-2);
    padding: var(--space-3) var(--space-4);
    margin-bottom: var(--space-4);
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-medium);
    border-left: var(--border-width-thick) solid;
}

.alert-bar-success[b-7hrmrufiqh] {
    background-color: #edf7ed;
    border-left-color: var(--color-success);
    color: #1e4620;
}

.alert-bar-danger[b-7hrmrufiqh] {
    background-color: #fdeded;
    border-left-color: var(--color-danger);
    color: #5f2120;
}

.alert-bar-close[b-7hrmrufiqh] {
    margin-left: auto;
    background: none;
    border: none;
    font-size: var(--font-size-lg);
    cursor: pointer;
    color: inherit;
    opacity: 0.6;
    line-height: 1;
}

.alert-bar-close:hover[b-7hrmrufiqh] {
    opacity: 1;
}

/* Search Bar */
.search-bar[b-7hrmrufiqh] {
    display: flex;
    align-items: center;
    gap: var(--space-4);
    margin-bottom: var(--space-4);
    padding: var(--space-3) var(--space-4);
    background-color: var(--bg-secondary);
    border: var(--border-width-thin) solid var(--border-color-light);
}

.search-input-wrapper[b-7hrmrufiqh] {
    display: flex;
    align-items: center;
    flex: 1;
    position: relative;
}

.search-icon[b-7hrmrufiqh] {
    color: var(--text-muted);
    flex-shrink: 0;
    margin-right: var(--space-2);
}

.search-input[b-7hrmrufiqh] {
    flex: 1;
    border: none;
    background: transparent;
    font-size: var(--font-size-sm);
    color: var(--color-gray-700);
    outline: none;
    padding: var(--space-1) 0;
}

.search-input[b-7hrmrufiqh]::placeholder {
    color: var(--text-muted);
}

.search-clear[b-7hrmrufiqh] {
    background: none;
    border: none;
    cursor: pointer;
    color: var(--text-muted);
    padding: var(--space-1);
    display: flex;
    align-items: center;
}

.search-clear:hover[b-7hrmrufiqh] {
    color: var(--color-primary);
}

.search-count[b-7hrmrufiqh] {
    flex-shrink: 0;
    font-size: var(--font-size-xs);
    color: var(--text-muted);
    font-weight: var(--font-weight-medium);
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

/* Loading / Empty States */
.loading-state[b-7hrmrufiqh] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: var(--space-16) 0;
    color: var(--text-muted);
    gap: var(--space-4);
}

.empty-state[b-7hrmrufiqh] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: var(--space-16) 0;
    color: var(--text-muted);
    gap: var(--space-3);
}

.empty-state svg[b-7hrmrufiqh] {
    opacity: 0.4;
}

.empty-state-text[b-7hrmrufiqh] {
    font-size: var(--font-size-base);
    margin: 0;
}

/* Item List */
.item-list[b-7hrmrufiqh] {
    display: flex;
    flex-direction: column;
    border: var(--border-width-thin) solid var(--border-color-light);
}

/* Item Row */
.item-row[b-7hrmrufiqh] {
    display: flex;
    align-items: center;
    gap: var(--space-4);
    padding: var(--space-4);
    border-bottom: var(--border-width-thin) solid var(--border-color-light);
    transition: background-color var(--transition-fast) var(--transition-ease);
}

.item-row:last-child[b-7hrmrufiqh] {
    border-bottom: none;
}

.item-row:hover[b-7hrmrufiqh] {
    background-color: rgba(11, 36, 62, 0.03);
}

/* Avatar */
.item-avatar[b-7hrmrufiqh] {
    flex-shrink: 0;
    width: 40px;
    height: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: var(--color-gray-100);
    color: var(--color-primary);
}

/* Item Info */
.item-info[b-7hrmrufiqh] {
    flex: 1;
    min-width: 0;
}

.item-name[b-7hrmrufiqh] {
    font-size: var(--font-size-base);
    font-weight: var(--font-weight-semibold);
    color: var(--color-primary);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.item-meta[b-7hrmrufiqh] {
    display: flex;
    align-items: center;
    gap: var(--space-1);
    flex-wrap: wrap;
    font-size: var(--font-size-xs);
    color: var(--text-secondary);
    margin-top: 2px;
}

.item-code[b-7hrmrufiqh] {
    font-family: var(--font-mono);
    font-weight: var(--font-weight-medium);
    color: var(--color-primary);
    opacity: 0.7;
}

.meta-separator[b-7hrmrufiqh] {
    color: var(--color-gray-300);
}

/* Action Buttons */
.item-actions[b-7hrmrufiqh] {
    flex-shrink: 0;
    display: flex;
    align-items: center;
    gap: var(--space-1);
}

.btn-icon[b-7hrmrufiqh] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 36px;
    background: none;
    border: var(--border-width-thin) solid transparent;
    cursor: pointer;
    color: var(--text-muted);
    text-decoration: none;
    transition: all var(--transition-fast) var(--transition-ease);
}

.btn-icon:hover[b-7hrmrufiqh] {
    color: var(--color-primary);
    background-color: var(--color-gray-100);
    border-color: var(--border-color-light);
    text-decoration: none;
}

.btn-icon-danger:hover[b-7hrmrufiqh] {
    color: var(--color-action);
    background-color: rgba(178, 34, 34, 0.06);
    border-color: rgba(178, 34, 34, 0.2);
}

/* Overlay & Dialog */
.overlay[b-7hrmrufiqh] {
    position: fixed;
    inset: 0;
    background-color: rgba(0, 0, 0, 0.4);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: var(--z-modal-backdrop);
}

.confirm-dialog[b-7hrmrufiqh] {
    background-color: var(--color-white);
    padding: var(--space-8);
    max-width: 420px;
    width: 90%;
    box-shadow: var(--shadow-xl);
    text-align: center;
    z-index: var(--z-modal);
}

.confirm-icon[b-7hrmrufiqh] {
    color: var(--color-action);
    margin-bottom: var(--space-4);
}

.confirm-dialog h3[b-7hrmrufiqh] {
    font-size: var(--font-size-lg);
    font-weight: var(--font-weight-semibold);
    color: var(--color-primary);
    margin: 0 0 var(--space-2) 0;
}

.confirm-dialog p[b-7hrmrufiqh] {
    font-size: var(--font-size-sm);
    color: var(--text-secondary);
    margin: 0 0 var(--space-2) 0;
}

.confirm-warning[b-7hrmrufiqh] {
    font-size: var(--font-size-xs) !important;
    color: var(--color-action) !important;
    font-weight: var(--font-weight-medium);
}

.confirm-actions[b-7hrmrufiqh] {
    display: flex;
    gap: var(--space-3);
    justify-content: center;
    margin-top: var(--space-6);
}

.confirm-actions .btn[b-7hrmrufiqh] {
    min-width: 100px;
    padding: var(--space-2) var(--space-4);
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-medium);
    cursor: pointer;
}

/* Outline Primary Button */
.btn-outline-primary[b-7hrmrufiqh] {
    background: transparent;
    color: var(--color-primary);
    border: var(--border-width-thin) solid var(--color-primary);
}

.btn-outline-primary:hover[b-7hrmrufiqh] {
    background-color: var(--color-primary);
    color: var(--text-on-primary);
}

/* Responsive */
@media (max-width: 768px) {
    .page-header[b-7hrmrufiqh] {
        flex-direction: column;
        gap: var(--space-3);
    }

    .item-row[b-7hrmrufiqh] {
        flex-wrap: wrap;
    }

    .item-actions[b-7hrmrufiqh] {
        order: 6;
        margin-left: auto;
    }
}
/* /Components/Pages/Common/SupplierCreate.razor.rz.scp.css */
/* ===========================
   ContactCreate / ContactEdit - Shared Form Styles
   Flat Industrial Minimal
   =========================== */

/* Page Container */
.page-container[b-spwhpastex] {
    max-width: 900px;
    margin: 0 auto;
    padding: var(--space-6) var(--space-4);
}

/* Header */
.page-header[b-spwhpastex] {
    display: flex;
    align-items: center;
    gap: var(--space-4);
    margin-bottom: var(--space-6);
}

.btn-back[b-spwhpastex] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    color: var(--text-muted);
    border: var(--border-width-thin) solid var(--border-color-light);
    text-decoration: none;
    transition: all var(--transition-fast) var(--transition-ease);
    flex-shrink: 0;
}

.btn-back:hover[b-spwhpastex] {
    color: var(--color-primary);
    border-color: var(--color-primary);
    background-color: var(--color-gray-50);
    text-decoration: none;
}

.page-header-text[b-spwhpastex] {
    flex: 1;
}

.page-title[b-spwhpastex] {
    font-size: var(--font-size-xl);
    font-weight: var(--font-weight-bold);
    color: var(--color-primary);
    display: flex;
    align-items: center;
    gap: var(--space-2);
    margin: 0;
}

.page-title svg[b-spwhpastex] {
    color: var(--color-primary);
    flex-shrink: 0;
}

.page-subtitle[b-spwhpastex] {
    color: var(--text-muted);
    font-size: var(--font-size-sm);
    margin: 2px 0 0 0;
}

/* Alert Bar */
.alert-bar[b-spwhpastex] {
    display: flex;
    align-items: center;
    gap: var(--space-2);
    padding: var(--space-3) var(--space-4);
    margin-bottom: var(--space-4);
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-medium);
    border-left: var(--border-width-thick) solid;
}

.alert-bar-danger[b-spwhpastex] {
    background-color: #fdeded;
    border-left-color: var(--color-danger);
    color: #5f2120;
}

.alert-bar-close[b-spwhpastex] {
    margin-left: auto;
    background: none;
    border: none;
    font-size: var(--font-size-lg);
    cursor: pointer;
    color: inherit;
    opacity: 0.6;
    line-height: 1;
}

.alert-bar-close:hover[b-spwhpastex] {
    opacity: 1;
}

/* Form Sections */
.form-section[b-spwhpastex] {
    margin-bottom: var(--space-6);
    padding: var(--space-5);
    background-color: var(--color-white);
    border: var(--border-width-thin) solid var(--border-color-light);
}

.section-title[b-spwhpastex] {
    display: flex;
    align-items: center;
    gap: var(--space-2);
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-semibold);
    color: var(--color-primary);
    text-transform: uppercase;
    letter-spacing: 0.5px;
    margin: 0 0 var(--space-4) 0;
    padding-bottom: var(--space-3);
    border-bottom: var(--border-width-thin) solid var(--border-color-light);
}

.section-title svg[b-spwhpastex] {
    color: var(--color-primary);
    opacity: 0.6;
    flex-shrink: 0;
}

/* Form Grid */
.form-grid[b-spwhpastex] {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: var(--space-4);
}

.form-group[b-spwhpastex] {
    display: flex;
    flex-direction: column;
}

.form-group-wide[b-spwhpastex] {
    grid-column: span 2;
}

.form-group-checkbox[b-spwhpastex] {
    display: flex;
    align-items: center;
    padding-top: var(--space-6);
}

.form-group-checkbox .form-check-label[b-spwhpastex] {
    display: flex;
    align-items: center;
    gap: var(--space-2);
    font-size: var(--font-size-sm);
    color: var(--text-secondary);
    cursor: pointer;
}

.form-group-checkbox .form-check-input[b-spwhpastex] {
    width: 18px;
    height: 18px;
    accent-color: var(--color-primary);
    cursor: pointer;
}

/* Form Controls */
.form-label[b-spwhpastex] {
    font-size: var(--font-size-xs);
    font-weight: var(--font-weight-medium);
    color: var(--text-secondary);
    text-transform: uppercase;
    letter-spacing: 0.3px;
    margin-bottom: var(--space-1);
}

.form-control[b-spwhpastex] {
    padding: var(--space-2) var(--space-3);
    font-size: var(--font-size-sm);
    color: var(--color-gray-700);
    border: var(--border-width-thin) solid var(--border-color-light);
    background-color: var(--color-white);
    transition: border-color var(--transition-fast) var(--transition-ease);
}

.form-control:focus[b-spwhpastex] {
    border-color: var(--color-primary);
    outline: none;
    box-shadow: none;
}

.form-control[b-spwhpastex]::placeholder {
    color: var(--color-gray-400);
}

/* Form Actions */
.form-actions[b-spwhpastex] {
    display: flex;
    justify-content: flex-end;
    gap: var(--space-3);
    padding-top: var(--space-4);
    border-top: var(--border-width-thin) solid var(--border-color-light);
}

.form-actions .btn[b-spwhpastex] {
    display: inline-flex;
    align-items: center;
    gap: var(--space-2);
    padding: var(--space-2) var(--space-5);
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-medium);
    cursor: pointer;
    text-decoration: none;
}

.btn-action[b-spwhpastex] {
    background-color: var(--color-action);
    color: var(--text-on-action);
    border: var(--border-width-thin) solid var(--color-action);
    transition: background-color var(--transition-fast) var(--transition-ease);
}

.btn-action:hover[b-spwhpastex] {
    background-color: var(--color-action-hover);
    border-color: var(--color-action-hover);
    color: var(--text-on-action);
}

.btn-action:disabled[b-spwhpastex] {
    opacity: 0.65;
    cursor: not-allowed;
}

.btn-outline-primary[b-spwhpastex] {
    background: transparent;
    color: var(--color-primary);
    border: var(--border-width-thin) solid var(--color-primary);
}

.btn-outline-primary:hover[b-spwhpastex] {
    background-color: var(--color-primary);
    color: var(--text-on-primary);
    text-decoration: none;
}

/* Validation */
[b-spwhpastex] .validation-message {
    color: var(--color-danger);
    font-size: var(--font-size-xs);
    margin-top: 2px;
}

/* Responsive */
@media (max-width: 768px) {
    .form-grid[b-spwhpastex] {
        grid-template-columns: 1fr;
    }

    .form-group-wide[b-spwhpastex] {
        grid-column: span 1;
    }

    .form-actions[b-spwhpastex] {
        flex-direction: column-reverse;
    }

    .form-actions .btn[b-spwhpastex] {
        justify-content: center;
    }
}
/* /Components/Pages/Common/SupplierEdit.razor.rz.scp.css */
/* ===========================
   ContactEdit - Scoped Styles
   Reuses same patterns as ContactCreate
   =========================== */

/* Page Container */
.page-container[b-hmmc1cz8kc] {
    max-width: 900px;
    margin: 0 auto;
    padding: var(--space-6) var(--space-4);
}

/* Header */
.page-header[b-hmmc1cz8kc] {
    display: flex;
    align-items: center;
    gap: var(--space-4);
    margin-bottom: var(--space-6);
}

.btn-back[b-hmmc1cz8kc] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    color: var(--text-muted);
    border: var(--border-width-thin) solid var(--border-color-light);
    text-decoration: none;
    transition: all var(--transition-fast) var(--transition-ease);
    flex-shrink: 0;
}

.btn-back:hover[b-hmmc1cz8kc] {
    color: var(--color-primary);
    border-color: var(--color-primary);
    background-color: var(--color-gray-50);
    text-decoration: none;
}

.page-header-text[b-hmmc1cz8kc] {
    flex: 1;
}

.page-title[b-hmmc1cz8kc] {
    font-size: var(--font-size-xl);
    font-weight: var(--font-weight-bold);
    color: var(--color-primary);
    display: flex;
    align-items: center;
    gap: var(--space-2);
    margin: 0;
}

.page-title svg[b-hmmc1cz8kc] {
    color: var(--color-primary);
    flex-shrink: 0;
}

.page-subtitle[b-hmmc1cz8kc] {
    color: var(--text-muted);
    font-size: var(--font-size-sm);
    margin: 2px 0 0 0;
    display: flex;
    align-items: center;
    gap: var(--space-2);
}

.subtitle-code[b-hmmc1cz8kc] {
    font-family: var(--font-mono);
    font-size: var(--font-size-xs);
    color: var(--color-primary);
    opacity: 0.6;
    padding: 1px var(--space-2);
    background-color: var(--color-gray-100);
}

/* Alert Bar */
.alert-bar[b-hmmc1cz8kc] {
    display: flex;
    align-items: center;
    gap: var(--space-2);
    padding: var(--space-3) var(--space-4);
    margin-bottom: var(--space-4);
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-medium);
    border-left: var(--border-width-thick) solid;
}

.alert-bar-danger[b-hmmc1cz8kc] {
    background-color: #fdeded;
    border-left-color: var(--color-danger);
    color: #5f2120;
}

.alert-bar-close[b-hmmc1cz8kc] {
    margin-left: auto;
    background: none;
    border: none;
    font-size: var(--font-size-lg);
    cursor: pointer;
    color: inherit;
    opacity: 0.6;
    line-height: 1;
}

.alert-bar-close:hover[b-hmmc1cz8kc] {
    opacity: 1;
}

/* Loading / Empty States */
.loading-state[b-hmmc1cz8kc] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: var(--space-16) 0;
    color: var(--text-muted);
    gap: var(--space-4);
}

.empty-state[b-hmmc1cz8kc] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: var(--space-16) 0;
    color: var(--text-muted);
    gap: var(--space-3);
}

.empty-state svg[b-hmmc1cz8kc] {
    opacity: 0.4;
}

.empty-state-text[b-hmmc1cz8kc] {
    font-size: var(--font-size-base);
    margin: 0;
}

/* Form Sections */
.form-section[b-hmmc1cz8kc] {
    margin-bottom: var(--space-6);
    padding: var(--space-5);
    background-color: var(--color-white);
    border: var(--border-width-thin) solid var(--border-color-light);
}

.section-title[b-hmmc1cz8kc] {
    display: flex;
    align-items: center;
    gap: var(--space-2);
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-semibold);
    color: var(--color-primary);
    text-transform: uppercase;
    letter-spacing: 0.5px;
    margin: 0 0 var(--space-4) 0;
    padding-bottom: var(--space-3);
    border-bottom: var(--border-width-thin) solid var(--border-color-light);
}

.section-title svg[b-hmmc1cz8kc] {
    color: var(--color-primary);
    opacity: 0.6;
    flex-shrink: 0;
}

/* Form Grid */
.form-grid[b-hmmc1cz8kc] {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: var(--space-4);
}

.form-group[b-hmmc1cz8kc] {
    display: flex;
    flex-direction: column;
}

.form-group-wide[b-hmmc1cz8kc] {
    grid-column: span 2;
}

/* Form Controls */
.form-label[b-hmmc1cz8kc] {
    font-size: var(--font-size-xs);
    font-weight: var(--font-weight-medium);
    color: var(--text-secondary);
    text-transform: uppercase;
    letter-spacing: 0.3px;
    margin-bottom: var(--space-1);
}

.form-control[b-hmmc1cz8kc] {
    padding: var(--space-2) var(--space-3);
    font-size: var(--font-size-sm);
    color: var(--color-gray-700);
    border: var(--border-width-thin) solid var(--border-color-light);
    background-color: var(--color-white);
    transition: border-color var(--transition-fast) var(--transition-ease);
}

.form-control:focus[b-hmmc1cz8kc] {
    border-color: var(--color-primary);
    outline: none;
    box-shadow: none;
}

.form-control[b-hmmc1cz8kc]::placeholder {
    color: var(--color-gray-400);
}

.form-control-static[b-hmmc1cz8kc] {
    padding: var(--space-2) var(--space-3);
    font-size: var(--font-size-sm);
    color: var(--text-muted);
    background-color: var(--color-gray-50);
    border: var(--border-width-thin) solid var(--border-color-light);
    font-family: var(--font-mono);
}

/* Form Actions */
.form-actions[b-hmmc1cz8kc] {
    display: flex;
    justify-content: flex-end;
    gap: var(--space-3);
    padding-top: var(--space-4);
    border-top: var(--border-width-thin) solid var(--border-color-light);
}

.form-actions .btn[b-hmmc1cz8kc] {
    display: inline-flex;
    align-items: center;
    gap: var(--space-2);
    padding: var(--space-2) var(--space-5);
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-medium);
    cursor: pointer;
    text-decoration: none;
}

.btn-action[b-hmmc1cz8kc] {
    background-color: var(--color-action);
    color: var(--text-on-action);
    border: var(--border-width-thin) solid var(--color-action);
    transition: background-color var(--transition-fast) var(--transition-ease);
}

.btn-action:hover[b-hmmc1cz8kc] {
    background-color: var(--color-action-hover);
    border-color: var(--color-action-hover);
    color: var(--text-on-action);
}

.btn-action:disabled[b-hmmc1cz8kc] {
    opacity: 0.65;
    cursor: not-allowed;
}

.btn-outline-primary[b-hmmc1cz8kc] {
    background: transparent;
    color: var(--color-primary);
    border: var(--border-width-thin) solid var(--color-primary);
}

.btn-outline-primary:hover[b-hmmc1cz8kc] {
    background-color: var(--color-primary);
    color: var(--text-on-primary);
    text-decoration: none;
}

/* Validation */
[b-hmmc1cz8kc] .validation-message {
    color: var(--color-danger);
    font-size: var(--font-size-xs);
    margin-top: 2px;
}

/* Responsive */
@media (max-width: 768px) {
    .form-grid[b-hmmc1cz8kc] {
        grid-template-columns: 1fr;
    }

    .form-group-wide[b-hmmc1cz8kc] {
        grid-column: span 1;
    }

    .form-actions[b-hmmc1cz8kc] {
        flex-direction: column-reverse;
    }

    .form-actions .btn[b-hmmc1cz8kc] {
        justify-content: center;
    }
}
/* /Components/Pages/Common/SupplierList.razor.rz.scp.css */
/* ===========================
   ContactList - Scoped Styles
   Flat Industrial Minimal
   =========================== */

/* Page Container */
.page-container[b-badse3xjjw] {
    max-width: 1200px;
    margin: 0 auto;
    padding: var(--space-6) var(--space-4);
}

/* Header */
.page-header[b-badse3xjjw] {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    margin-bottom: var(--space-6);
    gap: var(--space-4);
}

.page-header-left[b-badse3xjjw] {
    flex: 1;
}

.page-header-right[b-badse3xjjw] {
    flex-shrink: 0;
}

.page-title[b-badse3xjjw] {
    font-size: var(--font-size-2xl);
    font-weight: var(--font-weight-bold);
    color: var(--color-primary);
    display: flex;
    align-items: center;
    gap: var(--space-2);
    margin: 0;
}

.page-title svg[b-badse3xjjw] {
    color: var(--color-primary);
    flex-shrink: 0;
}

.page-subtitle[b-badse3xjjw] {
    color: var(--text-muted);
    font-size: var(--font-size-sm);
    margin: var(--space-1) 0 0 0;
}

/* Action Button */
.btn-action[b-badse3xjjw] {
    display: inline-flex;
    align-items: center;
    gap: var(--space-2);
    padding: var(--space-2) var(--space-4);
    background-color: var(--color-action);
    color: var(--text-on-action);
    border: var(--border-width-thin) solid var(--color-action);
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-medium);
    text-decoration: none;
    cursor: pointer;
    transition: background-color var(--transition-fast) var(--transition-ease),
                box-shadow var(--transition-fast) var(--transition-ease);
}

.btn-action:hover[b-badse3xjjw] {
    background-color: var(--color-action-hover);
    border-color: var(--color-action-hover);
    color: var(--text-on-action);
    text-decoration: none;
    box-shadow: var(--shadow-sm);
}

.btn-action:active[b-badse3xjjw] {
    background-color: var(--color-action-active);
}

/* Alert Bars */
.alert-bar[b-badse3xjjw] {
    display: flex;
    align-items: center;
    gap: var(--space-2);
    padding: var(--space-3) var(--space-4);
    margin-bottom: var(--space-4);
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-medium);
    border-left: var(--border-width-thick) solid;
}

.alert-bar-success[b-badse3xjjw] {
    background-color: #edf7ed;
    border-left-color: var(--color-success);
    color: #1e4620;
}

.alert-bar-danger[b-badse3xjjw] {
    background-color: #fdeded;
    border-left-color: var(--color-danger);
    color: #5f2120;
}

.alert-bar-close[b-badse3xjjw] {
    margin-left: auto;
    background: none;
    border: none;
    font-size: var(--font-size-lg);
    cursor: pointer;
    color: inherit;
    opacity: 0.6;
    line-height: 1;
}

.alert-bar-close:hover[b-badse3xjjw] {
    opacity: 1;
}

/* Search Bar */
.search-bar[b-badse3xjjw] {
    display: flex;
    align-items: center;
    gap: var(--space-4);
    margin-bottom: var(--space-4);
    padding: var(--space-3) var(--space-4);
    background-color: var(--bg-secondary);
    border: var(--border-width-thin) solid var(--border-color-light);
}

.search-input-wrapper[b-badse3xjjw] {
    display: flex;
    align-items: center;
    flex: 1;
    position: relative;
}

.search-icon[b-badse3xjjw] {
    color: var(--text-muted);
    flex-shrink: 0;
    margin-right: var(--space-2);
}

.search-input[b-badse3xjjw] {
    flex: 1;
    border: none;
    background: transparent;
    font-size: var(--font-size-sm);
    color: var(--color-gray-700);
    outline: none;
    padding: var(--space-1) 0;
}

.search-input[b-badse3xjjw]::placeholder {
    color: var(--text-muted);
}

.search-clear[b-badse3xjjw] {
    background: none;
    border: none;
    cursor: pointer;
    color: var(--text-muted);
    padding: var(--space-1);
    display: flex;
    align-items: center;
}

.search-clear:hover[b-badse3xjjw] {
    color: var(--color-primary);
}

.search-count[b-badse3xjjw] {
    flex-shrink: 0;
    font-size: var(--font-size-xs);
    color: var(--text-muted);
    font-weight: var(--font-weight-medium);
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

/* Loading / Empty States */
.loading-state[b-badse3xjjw] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: var(--space-16) 0;
    color: var(--text-muted);
    gap: var(--space-4);
}

.empty-state[b-badse3xjjw] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: var(--space-16) 0;
    color: var(--text-muted);
    gap: var(--space-3);
}

.empty-state svg[b-badse3xjjw] {
    opacity: 0.4;
}

.empty-state-text[b-badse3xjjw] {
    font-size: var(--font-size-base);
    margin: 0;
}

/* Contact List */
.contact-list[b-badse3xjjw] {
    display: flex;
    flex-direction: column;
    border: var(--border-width-thin) solid var(--border-color-light);
}

/* Contact Row */
.contact-row[b-badse3xjjw] {
    display: flex;
    align-items: center;
    gap: var(--space-4);
    padding: var(--space-4);
    border-bottom: var(--border-width-thin) solid var(--border-color-light);
    transition: background-color var(--transition-fast) var(--transition-ease);
}

.contact-row:last-child[b-badse3xjjw] {
    border-bottom: none;
}

.contact-row:hover[b-badse3xjjw] {
    background-color: rgba(11, 36, 62, 0.03);
}

/* Avatar */
.contact-avatar[b-badse3xjjw] {
    flex-shrink: 0;
    width: 40px;
    height: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: var(--color-gray-100);
    color: var(--color-primary);
}

/* Contact Info */
.contact-info[b-badse3xjjw] {
    flex: 1;
    min-width: 0;
}

.contact-name[b-badse3xjjw] {
    font-size: var(--font-size-base);
    font-weight: var(--font-weight-semibold);
    color: var(--color-primary);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.contact-meta[b-badse3xjjw] {
    display: flex;
    align-items: center;
    gap: var(--space-1);
    flex-wrap: wrap;
    font-size: var(--font-size-xs);
    color: var(--text-secondary);
    margin-top: 2px;
}

.contact-code[b-badse3xjjw] {
    font-family: var(--font-mono);
    font-weight: var(--font-weight-medium);
    color: var(--color-primary);
    opacity: 0.7;
}

.meta-separator[b-badse3xjjw] {
    color: var(--color-gray-300);
}

.contact-details[b-badse3xjjw] {
    display: flex;
    align-items: center;
    gap: var(--space-4);
    margin-top: var(--space-1);
}

.contact-detail-item[b-badse3xjjw] {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    font-size: var(--font-size-xs);
    color: var(--text-muted);
}

.contact-detail-item svg[b-badse3xjjw] {
    flex-shrink: 0;
}

/* Badges */
.contact-badges[b-badse3xjjw] {
    flex-shrink: 0;
    display: flex;
    gap: var(--space-2);
}

.badge[b-badse3xjjw] {
    display: inline-flex;
    align-items: center;
    padding: 3px var(--space-2);
    font-size: var(--font-size-xs);
    font-weight: var(--font-weight-medium);
    letter-spacing: 0.3px;
    text-transform: uppercase;
}

.badge-primary[b-badse3xjjw] {
    background-color: rgba(11, 36, 62, 0.1);
    color: var(--color-primary);
}

.badge-info[b-badse3xjjw] {
    background-color: rgba(23, 162, 184, 0.1);
    color: var(--color-info);
}

.badge-danger[b-badse3xjjw] {
    background-color: rgba(178, 34, 34, 0.1);
    color: var(--color-action);
}

/* Action Buttons */
.contact-actions[b-badse3xjjw] {
    flex-shrink: 0;
    display: flex;
    align-items: center;
    gap: var(--space-1);
}

.actions-separator[b-badse3xjjw] {
    width: 1px;
    height: 20px;
    background-color: var(--border-color-light);
    margin: 0 var(--space-1);
}

.btn-icon[b-badse3xjjw] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 36px;
    background: none;
    border: var(--border-width-thin) solid transparent;
    cursor: pointer;
    color: var(--text-muted);
    text-decoration: none;
    transition: all var(--transition-fast) var(--transition-ease);
}

.btn-icon:hover[b-badse3xjjw] {
    color: var(--color-primary);
    background-color: var(--color-gray-100);
    border-color: var(--border-color-light);
    text-decoration: none;
}

.btn-icon-danger:hover[b-badse3xjjw] {
    color: var(--color-action);
    background-color: rgba(178, 34, 34, 0.06);
    border-color: rgba(178, 34, 34, 0.2);
}

/* Overlay & Dialog */
.overlay[b-badse3xjjw] {
    position: fixed;
    inset: 0;
    background-color: rgba(0, 0, 0, 0.4);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: var(--z-modal-backdrop);
}

.confirm-dialog[b-badse3xjjw] {
    background-color: var(--color-white);
    padding: var(--space-8);
    max-width: 420px;
    width: 90%;
    box-shadow: var(--shadow-xl);
    text-align: center;
    z-index: var(--z-modal);
}

.confirm-icon[b-badse3xjjw] {
    color: var(--color-action);
    margin-bottom: var(--space-4);
}

.confirm-dialog h3[b-badse3xjjw] {
    font-size: var(--font-size-lg);
    font-weight: var(--font-weight-semibold);
    color: var(--color-primary);
    margin: 0 0 var(--space-2) 0;
}

.confirm-dialog p[b-badse3xjjw] {
    font-size: var(--font-size-sm);
    color: var(--text-secondary);
    margin: 0 0 var(--space-2) 0;
}

.confirm-warning[b-badse3xjjw] {
    font-size: var(--font-size-xs) !important;
    color: var(--color-action) !important;
    font-weight: var(--font-weight-medium);
}

.confirm-actions[b-badse3xjjw] {
    display: flex;
    gap: var(--space-3);
    justify-content: center;
    margin-top: var(--space-6);
}

.confirm-actions .btn[b-badse3xjjw] {
    min-width: 100px;
    padding: var(--space-2) var(--space-4);
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-medium);
    cursor: pointer;
}

/* Outline Primary Button (used in confirm dialog) */
.btn-outline-primary[b-badse3xjjw] {
    background: transparent;
    color: var(--color-primary);
    border: var(--border-width-thin) solid var(--color-primary);
}

.btn-outline-primary:hover[b-badse3xjjw] {
    background-color: var(--color-primary);
    color: var(--text-on-primary);
}

/* Responsive */
@media (max-width: 768px) {
    .page-header[b-badse3xjjw] {
        flex-direction: column;
        gap: var(--space-3);
    }

    .contact-row[b-badse3xjjw] {
        flex-wrap: wrap;
    }

    .contact-badges[b-badse3xjjw] {
        order: 5;
    }

    .contact-actions[b-badse3xjjw] {
        order: 6;
        margin-left: auto;
    }

    .contact-details[b-badse3xjjw] {
        flex-wrap: wrap;
    }
}
/* /Components/Pages/Common/TaxRateCreate.razor.rz.scp.css */
/* ===========================
   TaxRateCreate - Scoped Styles
   Flat Industrial Minimal
   =========================== */

/* Page Container */
.page-container[b-hpvqxsisad] {
    max-width: 900px;
    margin: 0 auto;
    padding: var(--space-6) var(--space-4);
}

/* Header */
.page-header[b-hpvqxsisad] {
    display: flex;
    align-items: center;
    gap: var(--space-4);
    margin-bottom: var(--space-6);
}

.btn-back[b-hpvqxsisad] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    color: var(--text-muted);
    border: var(--border-width-thin) solid var(--border-color-light);
    text-decoration: none;
    transition: all var(--transition-fast) var(--transition-ease);
    flex-shrink: 0;
}

.btn-back:hover[b-hpvqxsisad] {
    color: var(--color-primary);
    border-color: var(--color-primary);
    background-color: var(--color-gray-50);
    text-decoration: none;
}

.page-header-text[b-hpvqxsisad] {
    flex: 1;
}

.page-title[b-hpvqxsisad] {
    font-size: var(--font-size-xl);
    font-weight: var(--font-weight-bold);
    color: var(--color-primary);
    display: flex;
    align-items: center;
    gap: var(--space-2);
    margin: 0;
}

.page-title svg[b-hpvqxsisad] {
    color: var(--color-primary);
    flex-shrink: 0;
}

.page-subtitle[b-hpvqxsisad] {
    color: var(--text-muted);
    font-size: var(--font-size-sm);
    margin: 2px 0 0 0;
}

/* Alert Bar */
.alert-bar[b-hpvqxsisad] {
    display: flex;
    align-items: center;
    gap: var(--space-2);
    padding: var(--space-3) var(--space-4);
    margin-bottom: var(--space-4);
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-medium);
    border-left: var(--border-width-thick) solid;
}

.alert-bar-danger[b-hpvqxsisad] {
    background-color: #fdeded;
    border-left-color: var(--color-danger);
    color: #5f2120;
}

.alert-bar-close[b-hpvqxsisad] {
    margin-left: auto;
    background: none;
    border: none;
    font-size: var(--font-size-lg);
    cursor: pointer;
    color: inherit;
    opacity: 0.6;
    line-height: 1;
}

.alert-bar-close:hover[b-hpvqxsisad] {
    opacity: 1;
}

/* Form Sections */
.form-section[b-hpvqxsisad] {
    margin-bottom: var(--space-6);
    padding: var(--space-5);
    background-color: var(--color-white);
    border: var(--border-width-thin) solid var(--border-color-light);
}

.section-title[b-hpvqxsisad] {
    display: flex;
    align-items: center;
    gap: var(--space-2);
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-semibold);
    color: var(--color-primary);
    text-transform: uppercase;
    letter-spacing: 0.5px;
    margin: 0 0 var(--space-4) 0;
    padding-bottom: var(--space-3);
    border-bottom: var(--border-width-thin) solid var(--border-color-light);
}

.section-title svg[b-hpvqxsisad] {
    color: var(--color-primary);
    opacity: 0.6;
    flex-shrink: 0;
}

/* Form Grid */
.form-grid[b-hpvqxsisad] {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: var(--space-4);
}

.form-group[b-hpvqxsisad] {
    display: flex;
    flex-direction: column;
}

.form-group-wide[b-hpvqxsisad] {
    grid-column: span 2;
}

/* Form Controls */
.form-label[b-hpvqxsisad] {
    font-size: var(--font-size-xs);
    font-weight: var(--font-weight-medium);
    color: var(--text-secondary);
    text-transform: uppercase;
    letter-spacing: 0.3px;
    margin-bottom: var(--space-1);
}

.form-control[b-hpvqxsisad] {
    padding: var(--space-2) var(--space-3);
    font-size: var(--font-size-sm);
    color: var(--color-gray-700);
    border: var(--border-width-thin) solid var(--border-color-light);
    background-color: var(--color-white);
    transition: border-color var(--transition-fast) var(--transition-ease);
}

.form-control:focus[b-hpvqxsisad] {
    border-color: var(--color-primary);
    outline: none;
    box-shadow: none;
}

.form-control[b-hpvqxsisad]::placeholder {
    color: var(--color-gray-400);
}

/* Form Actions */
.form-actions[b-hpvqxsisad] {
    display: flex;
    justify-content: flex-end;
    gap: var(--space-3);
    padding-top: var(--space-4);
    border-top: var(--border-width-thin) solid var(--border-color-light);
}

.form-actions .btn[b-hpvqxsisad] {
    display: inline-flex;
    align-items: center;
    gap: var(--space-2);
    padding: var(--space-2) var(--space-5);
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-medium);
    cursor: pointer;
    text-decoration: none;
}

.btn-action[b-hpvqxsisad] {
    background-color: var(--color-action);
    color: var(--text-on-action);
    border: var(--border-width-thin) solid var(--color-action);
    transition: background-color var(--transition-fast) var(--transition-ease);
}

.btn-action:hover[b-hpvqxsisad] {
    background-color: var(--color-action-hover);
    border-color: var(--color-action-hover);
    color: var(--text-on-action);
}

.btn-action:disabled[b-hpvqxsisad] {
    opacity: 0.65;
    cursor: not-allowed;
}

.btn-outline-primary[b-hpvqxsisad] {
    background: transparent;
    color: var(--color-primary);
    border: var(--border-width-thin) solid var(--color-primary);
}

.btn-outline-primary:hover[b-hpvqxsisad] {
    background-color: var(--color-primary);
    color: var(--text-on-primary);
    text-decoration: none;
}

/* Validation */
[b-hpvqxsisad] .validation-message {
    color: var(--color-danger);
    font-size: var(--font-size-xs);
    margin-top: 2px;
}

/* Responsive */
@media (max-width: 768px) {
    .form-grid[b-hpvqxsisad] {
        grid-template-columns: 1fr;
    }

    .form-group-wide[b-hpvqxsisad] {
        grid-column: span 1;
    }

    .form-actions[b-hpvqxsisad] {
        flex-direction: column-reverse;
    }

    .form-actions .btn[b-hpvqxsisad] {
        justify-content: center;
    }
}
/* /Components/Pages/Common/TaxRateEdit.razor.rz.scp.css */
/* ===========================
   TaxRateEdit - Scoped Styles
   Flat Industrial Minimal
   =========================== */

/* Page Container */
.page-container[b-ngyk60ikus] {
    max-width: 900px;
    margin: 0 auto;
    padding: var(--space-6) var(--space-4);
}

/* Header */
.page-header[b-ngyk60ikus] {
    display: flex;
    align-items: center;
    gap: var(--space-4);
    margin-bottom: var(--space-6);
}

.btn-back[b-ngyk60ikus] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    color: var(--text-muted);
    border: var(--border-width-thin) solid var(--border-color-light);
    text-decoration: none;
    transition: all var(--transition-fast) var(--transition-ease);
    flex-shrink: 0;
}

.btn-back:hover[b-ngyk60ikus] {
    color: var(--color-primary);
    border-color: var(--color-primary);
    background-color: var(--color-gray-50);
    text-decoration: none;
}

.page-header-text[b-ngyk60ikus] {
    flex: 1;
}

.page-title[b-ngyk60ikus] {
    font-size: var(--font-size-xl);
    font-weight: var(--font-weight-bold);
    color: var(--color-primary);
    display: flex;
    align-items: center;
    gap: var(--space-2);
    margin: 0;
}

.page-title svg[b-ngyk60ikus] {
    color: var(--color-primary);
    flex-shrink: 0;
}

.page-subtitle[b-ngyk60ikus] {
    color: var(--text-muted);
    font-size: var(--font-size-sm);
    margin: 2px 0 0 0;
    display: flex;
    align-items: center;
    gap: var(--space-2);
}

.subtitle-code[b-ngyk60ikus] {
    font-family: var(--font-mono);
    font-size: var(--font-size-xs);
    color: var(--color-primary);
    opacity: 0.6;
    padding: 1px var(--space-2);
    background-color: var(--color-gray-100);
}

/* Alert Bar */
.alert-bar[b-ngyk60ikus] {
    display: flex;
    align-items: center;
    gap: var(--space-2);
    padding: var(--space-3) var(--space-4);
    margin-bottom: var(--space-4);
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-medium);
    border-left: var(--border-width-thick) solid;
}

.alert-bar-danger[b-ngyk60ikus] {
    background-color: #fdeded;
    border-left-color: var(--color-danger);
    color: #5f2120;
}

.alert-bar-close[b-ngyk60ikus] {
    margin-left: auto;
    background: none;
    border: none;
    font-size: var(--font-size-lg);
    cursor: pointer;
    color: inherit;
    opacity: 0.6;
    line-height: 1;
}

.alert-bar-close:hover[b-ngyk60ikus] {
    opacity: 1;
}

/* Loading / Empty States */
.loading-state[b-ngyk60ikus] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: var(--space-16) 0;
    color: var(--text-muted);
    gap: var(--space-4);
}

.empty-state[b-ngyk60ikus] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: var(--space-16) 0;
    color: var(--text-muted);
    gap: var(--space-3);
}

.empty-state svg[b-ngyk60ikus] {
    opacity: 0.4;
}

.empty-state-text[b-ngyk60ikus] {
    font-size: var(--font-size-base);
    margin: 0;
}

/* Form Sections */
.form-section[b-ngyk60ikus] {
    margin-bottom: var(--space-6);
    padding: var(--space-5);
    background-color: var(--color-white);
    border: var(--border-width-thin) solid var(--border-color-light);
}

.section-title[b-ngyk60ikus] {
    display: flex;
    align-items: center;
    gap: var(--space-2);
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-semibold);
    color: var(--color-primary);
    text-transform: uppercase;
    letter-spacing: 0.5px;
    margin: 0 0 var(--space-4) 0;
    padding-bottom: var(--space-3);
    border-bottom: var(--border-width-thin) solid var(--border-color-light);
}

.section-title svg[b-ngyk60ikus] {
    color: var(--color-primary);
    opacity: 0.6;
    flex-shrink: 0;
}

/* Form Grid */
.form-grid[b-ngyk60ikus] {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: var(--space-4);
}

.form-group[b-ngyk60ikus] {
    display: flex;
    flex-direction: column;
}

.form-group-wide[b-ngyk60ikus] {
    grid-column: span 2;
}

/* Form Controls */
.form-label[b-ngyk60ikus] {
    font-size: var(--font-size-xs);
    font-weight: var(--font-weight-medium);
    color: var(--text-secondary);
    text-transform: uppercase;
    letter-spacing: 0.3px;
    margin-bottom: var(--space-1);
}

.form-control[b-ngyk60ikus] {
    padding: var(--space-2) var(--space-3);
    font-size: var(--font-size-sm);
    color: var(--color-gray-700);
    border: var(--border-width-thin) solid var(--border-color-light);
    background-color: var(--color-white);
    transition: border-color var(--transition-fast) var(--transition-ease);
}

.form-control:focus[b-ngyk60ikus] {
    border-color: var(--color-primary);
    outline: none;
    box-shadow: none;
}

.form-control[b-ngyk60ikus]::placeholder {
    color: var(--color-gray-400);
}

.form-control-static[b-ngyk60ikus] {
    padding: var(--space-2) var(--space-3);
    font-size: var(--font-size-sm);
    color: var(--text-muted);
    background-color: var(--color-gray-50);
    border: var(--border-width-thin) solid var(--border-color-light);
    font-family: var(--font-mono);
}

/* Form Actions */
.form-actions[b-ngyk60ikus] {
    display: flex;
    justify-content: flex-end;
    gap: var(--space-3);
    padding-top: var(--space-4);
    border-top: var(--border-width-thin) solid var(--border-color-light);
}

.form-actions .btn[b-ngyk60ikus] {
    display: inline-flex;
    align-items: center;
    gap: var(--space-2);
    padding: var(--space-2) var(--space-5);
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-medium);
    cursor: pointer;
    text-decoration: none;
}

.btn-action[b-ngyk60ikus] {
    background-color: var(--color-action);
    color: var(--text-on-action);
    border: var(--border-width-thin) solid var(--color-action);
    transition: background-color var(--transition-fast) var(--transition-ease);
}

.btn-action:hover[b-ngyk60ikus] {
    background-color: var(--color-action-hover);
    border-color: var(--color-action-hover);
    color: var(--text-on-action);
}

.btn-action:disabled[b-ngyk60ikus] {
    opacity: 0.65;
    cursor: not-allowed;
}

.btn-outline-primary[b-ngyk60ikus] {
    background: transparent;
    color: var(--color-primary);
    border: var(--border-width-thin) solid var(--color-primary);
}

.btn-outline-primary:hover[b-ngyk60ikus] {
    background-color: var(--color-primary);
    color: var(--text-on-primary);
    text-decoration: none;
}

/* Validation */
[b-ngyk60ikus] .validation-message {
    color: var(--color-danger);
    font-size: var(--font-size-xs);
    margin-top: 2px;
}

/* Responsive */
@media (max-width: 768px) {
    .form-grid[b-ngyk60ikus] {
        grid-template-columns: 1fr;
    }

    .form-group-wide[b-ngyk60ikus] {
        grid-column: span 1;
    }

    .form-actions[b-ngyk60ikus] {
        flex-direction: column-reverse;
    }

    .form-actions .btn[b-ngyk60ikus] {
        justify-content: center;
    }
}
/* /Components/Pages/Common/TaxRateList.razor.rz.scp.css */
/* ===========================
   TaxRateList - Scoped Styles
   Flat Industrial Minimal
   =========================== */

/* Page Container */
.page-container[b-u61y6nzzmq] {
    max-width: 1200px;
    margin: 0 auto;
    padding: var(--space-6) var(--space-4);
}

/* Header */
.page-header[b-u61y6nzzmq] {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    margin-bottom: var(--space-6);
    gap: var(--space-4);
}

.page-header-left[b-u61y6nzzmq] {
    flex: 1;
}

.page-header-right[b-u61y6nzzmq] {
    flex-shrink: 0;
}

.page-title[b-u61y6nzzmq] {
    font-size: var(--font-size-2xl);
    font-weight: var(--font-weight-bold);
    color: var(--color-primary);
    display: flex;
    align-items: center;
    gap: var(--space-2);
    margin: 0;
}

.page-title svg[b-u61y6nzzmq] {
    color: var(--color-primary);
    flex-shrink: 0;
}

.page-subtitle[b-u61y6nzzmq] {
    color: var(--text-muted);
    font-size: var(--font-size-sm);
    margin: var(--space-1) 0 0 0;
}

/* Action Button */
.btn-action[b-u61y6nzzmq] {
    display: inline-flex;
    align-items: center;
    gap: var(--space-2);
    padding: var(--space-2) var(--space-4);
    background-color: var(--color-action);
    color: var(--text-on-action);
    border: var(--border-width-thin) solid var(--color-action);
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-medium);
    text-decoration: none;
    cursor: pointer;
    transition: background-color var(--transition-fast) var(--transition-ease),
                box-shadow var(--transition-fast) var(--transition-ease);
}

.btn-action:hover[b-u61y6nzzmq] {
    background-color: var(--color-action-hover);
    border-color: var(--color-action-hover);
    color: var(--text-on-action);
    text-decoration: none;
    box-shadow: var(--shadow-sm);
}

.btn-action:active[b-u61y6nzzmq] {
    background-color: var(--color-action-active);
}

/* Alert Bars */
.alert-bar[b-u61y6nzzmq] {
    display: flex;
    align-items: center;
    gap: var(--space-2);
    padding: var(--space-3) var(--space-4);
    margin-bottom: var(--space-4);
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-medium);
    border-left: var(--border-width-thick) solid;
}

.alert-bar-success[b-u61y6nzzmq] {
    background-color: #edf7ed;
    border-left-color: var(--color-success);
    color: #1e4620;
}

.alert-bar-danger[b-u61y6nzzmq] {
    background-color: #fdeded;
    border-left-color: var(--color-danger);
    color: #5f2120;
}

.alert-bar-close[b-u61y6nzzmq] {
    margin-left: auto;
    background: none;
    border: none;
    font-size: var(--font-size-lg);
    cursor: pointer;
    color: inherit;
    opacity: 0.6;
    line-height: 1;
}

.alert-bar-close:hover[b-u61y6nzzmq] {
    opacity: 1;
}

/* Search Bar */
.search-bar[b-u61y6nzzmq] {
    display: flex;
    align-items: center;
    gap: var(--space-4);
    margin-bottom: var(--space-4);
    padding: var(--space-3) var(--space-4);
    background-color: var(--bg-secondary);
    border: var(--border-width-thin) solid var(--border-color-light);
}

.search-input-wrapper[b-u61y6nzzmq] {
    display: flex;
    align-items: center;
    flex: 1;
    position: relative;
}

.search-icon[b-u61y6nzzmq] {
    color: var(--text-muted);
    flex-shrink: 0;
    margin-right: var(--space-2);
}

.search-input[b-u61y6nzzmq] {
    flex: 1;
    border: none;
    background: transparent;
    font-size: var(--font-size-sm);
    color: var(--color-gray-700);
    outline: none;
    padding: var(--space-1) 0;
}

.search-input[b-u61y6nzzmq]::placeholder {
    color: var(--text-muted);
}

.search-clear[b-u61y6nzzmq] {
    background: none;
    border: none;
    cursor: pointer;
    color: var(--text-muted);
    padding: var(--space-1);
    display: flex;
    align-items: center;
}

.search-clear:hover[b-u61y6nzzmq] {
    color: var(--color-primary);
}

.search-count[b-u61y6nzzmq] {
    flex-shrink: 0;
    font-size: var(--font-size-xs);
    color: var(--text-muted);
    font-weight: var(--font-weight-medium);
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

/* Loading / Empty States */
.loading-state[b-u61y6nzzmq] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: var(--space-16) 0;
    color: var(--text-muted);
    gap: var(--space-4);
}

.empty-state[b-u61y6nzzmq] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: var(--space-16) 0;
    color: var(--text-muted);
    gap: var(--space-3);
}

.empty-state svg[b-u61y6nzzmq] {
    opacity: 0.4;
}

.empty-state-text[b-u61y6nzzmq] {
    font-size: var(--font-size-base);
    margin: 0;
}

/* Item List */
.item-list[b-u61y6nzzmq] {
    display: flex;
    flex-direction: column;
    border: var(--border-width-thin) solid var(--border-color-light);
}

/* Item Row */
.item-row[b-u61y6nzzmq] {
    display: flex;
    align-items: center;
    gap: var(--space-4);
    padding: var(--space-4);
    border-bottom: var(--border-width-thin) solid var(--border-color-light);
    transition: background-color var(--transition-fast) var(--transition-ease);
}

.item-row:last-child[b-u61y6nzzmq] {
    border-bottom: none;
}

.item-row:hover[b-u61y6nzzmq] {
    background-color: rgba(11, 36, 62, 0.03);
}

/* Avatar */
.item-avatar[b-u61y6nzzmq] {
    flex-shrink: 0;
    width: 40px;
    height: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: var(--color-gray-100);
    color: var(--color-primary);
}

/* Item Info */
.item-info[b-u61y6nzzmq] {
    flex: 1;
    min-width: 0;
}

.item-name[b-u61y6nzzmq] {
    font-size: var(--font-size-base);
    font-weight: var(--font-weight-semibold);
    color: var(--color-primary);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.item-meta[b-u61y6nzzmq] {
    display: flex;
    align-items: center;
    gap: var(--space-1);
    flex-wrap: wrap;
    font-size: var(--font-size-xs);
    color: var(--text-secondary);
    margin-top: 2px;
}

.item-code[b-u61y6nzzmq] {
    font-family: var(--font-mono);
    font-weight: var(--font-weight-medium);
    color: var(--color-primary);
    opacity: 0.7;
}

.item-percentage[b-u61y6nzzmq] {
    font-family: var(--font-mono);
    font-weight: var(--font-weight-medium);
}

.meta-separator[b-u61y6nzzmq] {
    color: var(--color-gray-300);
}

/* Action Buttons */
.item-actions[b-u61y6nzzmq] {
    flex-shrink: 0;
    display: flex;
    align-items: center;
    gap: var(--space-1);
}

.btn-icon[b-u61y6nzzmq] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 36px;
    background: none;
    border: var(--border-width-thin) solid transparent;
    cursor: pointer;
    color: var(--text-muted);
    text-decoration: none;
    transition: all var(--transition-fast) var(--transition-ease);
}

.btn-icon:hover[b-u61y6nzzmq] {
    color: var(--color-primary);
    background-color: var(--color-gray-100);
    border-color: var(--border-color-light);
    text-decoration: none;
}

.btn-icon-danger:hover[b-u61y6nzzmq] {
    color: var(--color-action);
    background-color: rgba(178, 34, 34, 0.06);
    border-color: rgba(178, 34, 34, 0.2);
}

/* Overlay & Dialog */
.overlay[b-u61y6nzzmq] {
    position: fixed;
    inset: 0;
    background-color: rgba(0, 0, 0, 0.4);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: var(--z-modal-backdrop);
}

.confirm-dialog[b-u61y6nzzmq] {
    background-color: var(--color-white);
    padding: var(--space-8);
    max-width: 420px;
    width: 90%;
    box-shadow: var(--shadow-xl);
    text-align: center;
    z-index: var(--z-modal);
}

.confirm-icon[b-u61y6nzzmq] {
    color: var(--color-action);
    margin-bottom: var(--space-4);
}

.confirm-dialog h3[b-u61y6nzzmq] {
    font-size: var(--font-size-lg);
    font-weight: var(--font-weight-semibold);
    color: var(--color-primary);
    margin: 0 0 var(--space-2) 0;
}

.confirm-dialog p[b-u61y6nzzmq] {
    font-size: var(--font-size-sm);
    color: var(--text-secondary);
    margin: 0 0 var(--space-2) 0;
}

.confirm-warning[b-u61y6nzzmq] {
    font-size: var(--font-size-xs) !important;
    color: var(--color-action) !important;
    font-weight: var(--font-weight-medium);
}

.confirm-actions[b-u61y6nzzmq] {
    display: flex;
    gap: var(--space-3);
    justify-content: center;
    margin-top: var(--space-6);
}

.confirm-actions .btn[b-u61y6nzzmq] {
    min-width: 100px;
    padding: var(--space-2) var(--space-4);
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-medium);
    cursor: pointer;
}

/* Outline Primary Button */
.btn-outline-primary[b-u61y6nzzmq] {
    background: transparent;
    color: var(--color-primary);
    border: var(--border-width-thin) solid var(--color-primary);
}

.btn-outline-primary:hover[b-u61y6nzzmq] {
    background-color: var(--color-primary);
    color: var(--text-on-primary);
}

/* Responsive */
@media (max-width: 768px) {
    .page-header[b-u61y6nzzmq] {
        flex-direction: column;
        gap: var(--space-3);
    }

    .item-row[b-u61y6nzzmq] {
        flex-wrap: wrap;
    }

    .item-actions[b-u61y6nzzmq] {
        order: 6;
        margin-left: auto;
    }
}
/* /Components/Pages/Common/ZoneCreate.razor.rz.scp.css */
/* ===========================
   ZoneCreate - Scoped Styles
   Flat Industrial Minimal
   =========================== */

/* Page Container */
.page-container[b-cg7wd8h2ab] {
    max-width: 900px;
    margin: 0 auto;
    padding: var(--space-6) var(--space-4);
}

/* Header */
.page-header[b-cg7wd8h2ab] {
    display: flex;
    align-items: center;
    gap: var(--space-4);
    margin-bottom: var(--space-6);
}

.btn-back[b-cg7wd8h2ab] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    color: var(--text-muted);
    border: var(--border-width-thin) solid var(--border-color-light);
    text-decoration: none;
    transition: all var(--transition-fast) var(--transition-ease);
    flex-shrink: 0;
}

.btn-back:hover[b-cg7wd8h2ab] {
    color: var(--color-primary);
    border-color: var(--color-primary);
    background-color: var(--color-gray-50);
    text-decoration: none;
}

.page-header-text[b-cg7wd8h2ab] {
    flex: 1;
}

.page-title[b-cg7wd8h2ab] {
    font-size: var(--font-size-xl);
    font-weight: var(--font-weight-bold);
    color: var(--color-primary);
    display: flex;
    align-items: center;
    gap: var(--space-2);
    margin: 0;
}

.page-title svg[b-cg7wd8h2ab] {
    color: var(--color-primary);
    flex-shrink: 0;
}

.page-subtitle[b-cg7wd8h2ab] {
    color: var(--text-muted);
    font-size: var(--font-size-sm);
    margin: 2px 0 0 0;
}

/* Alert Bar */
.alert-bar[b-cg7wd8h2ab] {
    display: flex;
    align-items: center;
    gap: var(--space-2);
    padding: var(--space-3) var(--space-4);
    margin-bottom: var(--space-4);
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-medium);
    border-left: var(--border-width-thick) solid;
}

.alert-bar-danger[b-cg7wd8h2ab] {
    background-color: #fdeded;
    border-left-color: var(--color-danger);
    color: #5f2120;
}

.alert-bar-close[b-cg7wd8h2ab] {
    margin-left: auto;
    background: none;
    border: none;
    font-size: var(--font-size-lg);
    cursor: pointer;
    color: inherit;
    opacity: 0.6;
    line-height: 1;
}

.alert-bar-close:hover[b-cg7wd8h2ab] {
    opacity: 1;
}

/* Form Sections */
.form-section[b-cg7wd8h2ab] {
    margin-bottom: var(--space-6);
    padding: var(--space-5);
    background-color: var(--color-white);
    border: var(--border-width-thin) solid var(--border-color-light);
}

.section-title[b-cg7wd8h2ab] {
    display: flex;
    align-items: center;
    gap: var(--space-2);
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-semibold);
    color: var(--color-primary);
    text-transform: uppercase;
    letter-spacing: 0.5px;
    margin: 0 0 var(--space-4) 0;
    padding-bottom: var(--space-3);
    border-bottom: var(--border-width-thin) solid var(--border-color-light);
}

.section-title svg[b-cg7wd8h2ab] {
    color: var(--color-primary);
    opacity: 0.6;
    flex-shrink: 0;
}

/* Form Grid */
.form-grid[b-cg7wd8h2ab] {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: var(--space-4);
}

.form-group[b-cg7wd8h2ab] {
    display: flex;
    flex-direction: column;
}

.form-group-wide[b-cg7wd8h2ab] {
    grid-column: span 2;
}

/* Form Controls */
.form-label[b-cg7wd8h2ab] {
    font-size: var(--font-size-xs);
    font-weight: var(--font-weight-medium);
    color: var(--text-secondary);
    text-transform: uppercase;
    letter-spacing: 0.3px;
    margin-bottom: var(--space-1);
}

.form-control[b-cg7wd8h2ab] {
    padding: var(--space-2) var(--space-3);
    font-size: var(--font-size-sm);
    color: var(--color-gray-700);
    border: var(--border-width-thin) solid var(--border-color-light);
    background-color: var(--color-white);
    transition: border-color var(--transition-fast) var(--transition-ease);
}

.form-control:focus[b-cg7wd8h2ab] {
    border-color: var(--color-primary);
    outline: none;
    box-shadow: none;
}

.form-control[b-cg7wd8h2ab]::placeholder {
    color: var(--color-gray-400);
}

.form-control-sm[b-cg7wd8h2ab] {
    padding: var(--space-1) var(--space-2);
    font-size: var(--font-size-xs);
}

/* Lines Section */
.btn-add-line[b-cg7wd8h2ab] {
    display: inline-flex;
    align-items: center;
    gap: var(--space-1);
    margin-left: auto;
    padding: var(--space-1) var(--space-3);
    font-size: var(--font-size-xs);
    font-weight: var(--font-weight-medium);
    color: var(--color-action);
    background: transparent;
    border: var(--border-width-thin) solid var(--color-action);
    cursor: pointer;
    text-transform: uppercase;
    letter-spacing: 0.3px;
    transition: all var(--transition-fast) var(--transition-ease);
}

.btn-add-line:hover[b-cg7wd8h2ab] {
    background-color: var(--color-action);
    color: var(--text-on-action);
}

.lines-empty[b-cg7wd8h2ab] {
    text-align: center;
    padding: var(--space-8) 0;
    color: var(--text-muted);
    font-size: var(--font-size-sm);
}

.lines-table-wrapper[b-cg7wd8h2ab] {
    overflow-x: auto;
}

.lines-table[b-cg7wd8h2ab] {
    width: 100%;
    border-collapse: collapse;
    font-size: var(--font-size-xs);
}

.lines-table th[b-cg7wd8h2ab] {
    padding: var(--space-2) var(--space-2);
    text-align: left;
    font-weight: var(--font-weight-semibold);
    color: var(--text-secondary);
    text-transform: uppercase;
    letter-spacing: 0.3px;
    border-bottom: var(--border-width-thin) solid var(--border-color-light);
    white-space: nowrap;
}

.lines-table td[b-cg7wd8h2ab] {
    padding: var(--space-2) var(--space-2);
    border-bottom: var(--border-width-thin) solid var(--border-color-light);
    vertical-align: middle;
}

.lines-table tr:last-child td[b-cg7wd8h2ab] {
    border-bottom: none;
}

.col-num[b-cg7wd8h2ab] {
    width: 40px;
    text-align: center;
    font-family: var(--font-mono);
    font-weight: var(--font-weight-medium);
    color: var(--text-muted);
}

.col-code[b-cg7wd8h2ab] {
    width: 180px;
}

.col-desc[b-cg7wd8h2ab] {
    min-width: 200px;
}

.col-action[b-cg7wd8h2ab] {
    width: 40px;
    text-align: center;
}

.btn-icon[b-cg7wd8h2ab] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 28px;
    height: 28px;
    background: none;
    border: var(--border-width-thin) solid transparent;
    cursor: pointer;
    color: var(--text-muted);
    transition: all var(--transition-fast) var(--transition-ease);
}

.btn-icon:hover[b-cg7wd8h2ab] {
    color: var(--color-primary);
    background-color: var(--color-gray-100);
    border-color: var(--border-color-light);
}

.btn-icon-danger:hover[b-cg7wd8h2ab] {
    color: var(--color-action);
    background-color: rgba(178, 34, 34, 0.06);
    border-color: rgba(178, 34, 34, 0.2);
}

/* Form Actions */
.form-actions[b-cg7wd8h2ab] {
    display: flex;
    justify-content: flex-end;
    gap: var(--space-3);
    padding-top: var(--space-4);
    border-top: var(--border-width-thin) solid var(--border-color-light);
}

.form-actions .btn[b-cg7wd8h2ab] {
    display: inline-flex;
    align-items: center;
    gap: var(--space-2);
    padding: var(--space-2) var(--space-5);
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-medium);
    cursor: pointer;
    text-decoration: none;
}

.btn-action[b-cg7wd8h2ab] {
    background-color: var(--color-action);
    color: var(--text-on-action);
    border: var(--border-width-thin) solid var(--color-action);
    transition: background-color var(--transition-fast) var(--transition-ease);
}

.btn-action:hover[b-cg7wd8h2ab] {
    background-color: var(--color-action-hover);
    border-color: var(--color-action-hover);
    color: var(--text-on-action);
}

.btn-action:disabled[b-cg7wd8h2ab] {
    opacity: 0.65;
    cursor: not-allowed;
}

.btn-outline-primary[b-cg7wd8h2ab] {
    background: transparent;
    color: var(--color-primary);
    border: var(--border-width-thin) solid var(--color-primary);
}

.btn-outline-primary:hover[b-cg7wd8h2ab] {
    background-color: var(--color-primary);
    color: var(--text-on-primary);
    text-decoration: none;
}

/* Validation */
[b-cg7wd8h2ab] .validation-message {
    color: var(--color-danger);
    font-size: var(--font-size-xs);
    margin-top: 2px;
}

/* Responsive */
@media (max-width: 768px) {
    .form-grid[b-cg7wd8h2ab] {
        grid-template-columns: 1fr;
    }

    .form-group-wide[b-cg7wd8h2ab] {
        grid-column: span 1;
    }

    .form-actions[b-cg7wd8h2ab] {
        flex-direction: column-reverse;
    }

    .form-actions .btn[b-cg7wd8h2ab] {
        justify-content: center;
    }
}
/* /Components/Pages/Common/ZoneEdit.razor.rz.scp.css */
/* ===========================
   ZoneEdit - Scoped Styles
   Flat Industrial Minimal
   =========================== */

/* Page Container */
.page-container[b-9xindz46cy] {
    max-width: 900px;
    margin: 0 auto;
    padding: var(--space-6) var(--space-4);
}

/* Header */
.page-header[b-9xindz46cy] {
    display: flex;
    align-items: center;
    gap: var(--space-4);
    margin-bottom: var(--space-6);
}

.btn-back[b-9xindz46cy] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    color: var(--text-muted);
    border: var(--border-width-thin) solid var(--border-color-light);
    text-decoration: none;
    transition: all var(--transition-fast) var(--transition-ease);
    flex-shrink: 0;
}

.btn-back:hover[b-9xindz46cy] {
    color: var(--color-primary);
    border-color: var(--color-primary);
    background-color: var(--color-gray-50);
    text-decoration: none;
}

.page-header-text[b-9xindz46cy] {
    flex: 1;
}

.page-title[b-9xindz46cy] {
    font-size: var(--font-size-xl);
    font-weight: var(--font-weight-bold);
    color: var(--color-primary);
    display: flex;
    align-items: center;
    gap: var(--space-2);
    margin: 0;
}

.page-title svg[b-9xindz46cy] {
    color: var(--color-primary);
    flex-shrink: 0;
}

.page-subtitle[b-9xindz46cy] {
    color: var(--text-muted);
    font-size: var(--font-size-sm);
    margin: 2px 0 0 0;
    display: flex;
    align-items: center;
    gap: var(--space-2);
}

.subtitle-code[b-9xindz46cy] {
    font-family: var(--font-mono);
    font-size: var(--font-size-xs);
    color: var(--color-primary);
    opacity: 0.6;
    padding: 1px var(--space-2);
    background-color: var(--color-gray-100);
}

/* Alert Bar */
.alert-bar[b-9xindz46cy] {
    display: flex;
    align-items: center;
    gap: var(--space-2);
    padding: var(--space-3) var(--space-4);
    margin-bottom: var(--space-4);
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-medium);
    border-left: var(--border-width-thick) solid;
}

.alert-bar-danger[b-9xindz46cy] {
    background-color: #fdeded;
    border-left-color: var(--color-danger);
    color: #5f2120;
}

.alert-bar-close[b-9xindz46cy] {
    margin-left: auto;
    background: none;
    border: none;
    font-size: var(--font-size-lg);
    cursor: pointer;
    color: inherit;
    opacity: 0.6;
    line-height: 1;
}

.alert-bar-close:hover[b-9xindz46cy] {
    opacity: 1;
}

/* Loading / Empty States */
.loading-state[b-9xindz46cy] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: var(--space-16) 0;
    color: var(--text-muted);
    gap: var(--space-4);
}

.empty-state[b-9xindz46cy] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: var(--space-16) 0;
    color: var(--text-muted);
    gap: var(--space-3);
}

.empty-state svg[b-9xindz46cy] {
    opacity: 0.4;
}

.empty-state-text[b-9xindz46cy] {
    font-size: var(--font-size-base);
    margin: 0;
}

/* Form Sections */
.form-section[b-9xindz46cy] {
    margin-bottom: var(--space-6);
    padding: var(--space-5);
    background-color: var(--color-white);
    border: var(--border-width-thin) solid var(--border-color-light);
}

.section-title[b-9xindz46cy] {
    display: flex;
    align-items: center;
    gap: var(--space-2);
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-semibold);
    color: var(--color-primary);
    text-transform: uppercase;
    letter-spacing: 0.5px;
    margin: 0 0 var(--space-4) 0;
    padding-bottom: var(--space-3);
    border-bottom: var(--border-width-thin) solid var(--border-color-light);
}

.section-title svg[b-9xindz46cy] {
    color: var(--color-primary);
    opacity: 0.6;
    flex-shrink: 0;
}

/* Form Grid */
.form-grid[b-9xindz46cy] {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: var(--space-4);
}

.form-group[b-9xindz46cy] {
    display: flex;
    flex-direction: column;
}

.form-group-wide[b-9xindz46cy] {
    grid-column: span 2;
}

/* Form Controls */
.form-label[b-9xindz46cy] {
    font-size: var(--font-size-xs);
    font-weight: var(--font-weight-medium);
    color: var(--text-secondary);
    text-transform: uppercase;
    letter-spacing: 0.3px;
    margin-bottom: var(--space-1);
}

.form-control[b-9xindz46cy] {
    padding: var(--space-2) var(--space-3);
    font-size: var(--font-size-sm);
    color: var(--color-gray-700);
    border: var(--border-width-thin) solid var(--border-color-light);
    background-color: var(--color-white);
    transition: border-color var(--transition-fast) var(--transition-ease);
}

.form-control:focus[b-9xindz46cy] {
    border-color: var(--color-primary);
    outline: none;
    box-shadow: none;
}

.form-control[b-9xindz46cy]::placeholder {
    color: var(--color-gray-400);
}

.form-control-sm[b-9xindz46cy] {
    padding: var(--space-1) var(--space-2);
    font-size: var(--font-size-xs);
}

.form-control-static[b-9xindz46cy] {
    padding: var(--space-2) var(--space-3);
    font-size: var(--font-size-sm);
    color: var(--text-muted);
    background-color: var(--color-gray-50);
    border: var(--border-width-thin) solid var(--border-color-light);
    font-family: var(--font-mono);
}

/* Lines Section */
.btn-add-line[b-9xindz46cy] {
    display: inline-flex;
    align-items: center;
    gap: var(--space-1);
    margin-left: auto;
    padding: var(--space-1) var(--space-3);
    font-size: var(--font-size-xs);
    font-weight: var(--font-weight-medium);
    color: var(--color-action);
    background: transparent;
    border: var(--border-width-thin) solid var(--color-action);
    cursor: pointer;
    text-transform: uppercase;
    letter-spacing: 0.3px;
    transition: all var(--transition-fast) var(--transition-ease);
}

.btn-add-line:hover[b-9xindz46cy] {
    background-color: var(--color-action);
    color: var(--text-on-action);
}

.lines-empty[b-9xindz46cy] {
    text-align: center;
    padding: var(--space-8) 0;
    color: var(--text-muted);
    font-size: var(--font-size-sm);
}

.lines-table-wrapper[b-9xindz46cy] {
    overflow-x: auto;
}

.lines-table[b-9xindz46cy] {
    width: 100%;
    border-collapse: collapse;
    font-size: var(--font-size-xs);
}

.lines-table th[b-9xindz46cy] {
    padding: var(--space-2) var(--space-2);
    text-align: left;
    font-weight: var(--font-weight-semibold);
    color: var(--text-secondary);
    text-transform: uppercase;
    letter-spacing: 0.3px;
    border-bottom: var(--border-width-thin) solid var(--border-color-light);
    white-space: nowrap;
}

.lines-table td[b-9xindz46cy] {
    padding: var(--space-2) var(--space-2);
    border-bottom: var(--border-width-thin) solid var(--border-color-light);
    vertical-align: middle;
}

.lines-table tr:last-child td[b-9xindz46cy] {
    border-bottom: none;
}

.col-num[b-9xindz46cy] {
    width: 40px;
    text-align: center;
    font-family: var(--font-mono);
    font-weight: var(--font-weight-medium);
    color: var(--text-muted);
}

.col-code[b-9xindz46cy] {
    width: 180px;
}

.col-desc[b-9xindz46cy] {
    min-width: 200px;
}

.col-action[b-9xindz46cy] {
    width: 40px;
    text-align: center;
}

.btn-icon[b-9xindz46cy] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 28px;
    height: 28px;
    background: none;
    border: var(--border-width-thin) solid transparent;
    cursor: pointer;
    color: var(--text-muted);
    transition: all var(--transition-fast) var(--transition-ease);
}

.btn-icon:hover[b-9xindz46cy] {
    color: var(--color-primary);
    background-color: var(--color-gray-100);
    border-color: var(--border-color-light);
}

.btn-icon-danger:hover[b-9xindz46cy] {
    color: var(--color-action);
    background-color: rgba(178, 34, 34, 0.06);
    border-color: rgba(178, 34, 34, 0.2);
}

/* Form Actions */
.form-actions[b-9xindz46cy] {
    display: flex;
    justify-content: flex-end;
    gap: var(--space-3);
    padding-top: var(--space-4);
    border-top: var(--border-width-thin) solid var(--border-color-light);
}

.form-actions .btn[b-9xindz46cy] {
    display: inline-flex;
    align-items: center;
    gap: var(--space-2);
    padding: var(--space-2) var(--space-5);
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-medium);
    cursor: pointer;
    text-decoration: none;
}

.btn-action[b-9xindz46cy] {
    background-color: var(--color-action);
    color: var(--text-on-action);
    border: var(--border-width-thin) solid var(--color-action);
    transition: background-color var(--transition-fast) var(--transition-ease);
}

.btn-action:hover[b-9xindz46cy] {
    background-color: var(--color-action-hover);
    border-color: var(--color-action-hover);
    color: var(--text-on-action);
}

.btn-action:disabled[b-9xindz46cy] {
    opacity: 0.65;
    cursor: not-allowed;
}

.btn-outline-primary[b-9xindz46cy] {
    background: transparent;
    color: var(--color-primary);
    border: var(--border-width-thin) solid var(--color-primary);
}

.btn-outline-primary:hover[b-9xindz46cy] {
    background-color: var(--color-primary);
    color: var(--text-on-primary);
    text-decoration: none;
}

/* Validation */
[b-9xindz46cy] .validation-message {
    color: var(--color-danger);
    font-size: var(--font-size-xs);
    margin-top: 2px;
}

/* Responsive */
@media (max-width: 768px) {
    .form-grid[b-9xindz46cy] {
        grid-template-columns: 1fr;
    }

    .form-group-wide[b-9xindz46cy] {
        grid-column: span 1;
    }

    .form-actions[b-9xindz46cy] {
        flex-direction: column-reverse;
    }

    .form-actions .btn[b-9xindz46cy] {
        justify-content: center;
    }
}
/* /Components/Pages/Common/ZoneList.razor.rz.scp.css */
/* ===========================
   ZoneList - Scoped Styles
   Flat Industrial Minimal
   =========================== */

/* Page Container */
.page-container[b-z8v32dj5j0] {
    max-width: 1200px;
    margin: 0 auto;
    padding: var(--space-6) var(--space-4);
}

/* Header */
.page-header[b-z8v32dj5j0] {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    margin-bottom: var(--space-6);
    gap: var(--space-4);
}

.page-header-left[b-z8v32dj5j0] {
    flex: 1;
}

.page-header-right[b-z8v32dj5j0] {
    flex-shrink: 0;
}

.page-title[b-z8v32dj5j0] {
    font-size: var(--font-size-2xl);
    font-weight: var(--font-weight-bold);
    color: var(--color-primary);
    display: flex;
    align-items: center;
    gap: var(--space-2);
    margin: 0;
}

.page-title svg[b-z8v32dj5j0] {
    color: var(--color-primary);
    flex-shrink: 0;
}

.page-subtitle[b-z8v32dj5j0] {
    color: var(--text-muted);
    font-size: var(--font-size-sm);
    margin: var(--space-1) 0 0 0;
}

/* Action Button */
.btn-action[b-z8v32dj5j0] {
    display: inline-flex;
    align-items: center;
    gap: var(--space-2);
    padding: var(--space-2) var(--space-4);
    background-color: var(--color-action);
    color: var(--text-on-action);
    border: var(--border-width-thin) solid var(--color-action);
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-medium);
    text-decoration: none;
    cursor: pointer;
    transition: background-color var(--transition-fast) var(--transition-ease),
                box-shadow var(--transition-fast) var(--transition-ease);
}

.btn-action:hover[b-z8v32dj5j0] {
    background-color: var(--color-action-hover);
    border-color: var(--color-action-hover);
    color: var(--text-on-action);
    text-decoration: none;
    box-shadow: var(--shadow-sm);
}

.btn-action:active[b-z8v32dj5j0] {
    background-color: var(--color-action-active);
}

/* Alert Bars */
.alert-bar[b-z8v32dj5j0] {
    display: flex;
    align-items: center;
    gap: var(--space-2);
    padding: var(--space-3) var(--space-4);
    margin-bottom: var(--space-4);
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-medium);
    border-left: var(--border-width-thick) solid;
}

.alert-bar-success[b-z8v32dj5j0] {
    background-color: #edf7ed;
    border-left-color: var(--color-success);
    color: #1e4620;
}

.alert-bar-danger[b-z8v32dj5j0] {
    background-color: #fdeded;
    border-left-color: var(--color-danger);
    color: #5f2120;
}

.alert-bar-close[b-z8v32dj5j0] {
    margin-left: auto;
    background: none;
    border: none;
    font-size: var(--font-size-lg);
    cursor: pointer;
    color: inherit;
    opacity: 0.6;
    line-height: 1;
}

.alert-bar-close:hover[b-z8v32dj5j0] {
    opacity: 1;
}

/* Search Bar */
.search-bar[b-z8v32dj5j0] {
    display: flex;
    align-items: center;
    gap: var(--space-4);
    margin-bottom: var(--space-4);
    padding: var(--space-3) var(--space-4);
    background-color: var(--bg-secondary);
    border: var(--border-width-thin) solid var(--border-color-light);
}

.search-input-wrapper[b-z8v32dj5j0] {
    display: flex;
    align-items: center;
    flex: 1;
    position: relative;
}

.search-icon[b-z8v32dj5j0] {
    color: var(--text-muted);
    flex-shrink: 0;
    margin-right: var(--space-2);
}

.search-input[b-z8v32dj5j0] {
    flex: 1;
    border: none;
    background: transparent;
    font-size: var(--font-size-sm);
    color: var(--color-gray-700);
    outline: none;
    padding: var(--space-1) 0;
}

.search-input[b-z8v32dj5j0]::placeholder {
    color: var(--text-muted);
}

.search-clear[b-z8v32dj5j0] {
    background: none;
    border: none;
    cursor: pointer;
    color: var(--text-muted);
    padding: var(--space-1);
    display: flex;
    align-items: center;
}

.search-clear:hover[b-z8v32dj5j0] {
    color: var(--color-primary);
}

.search-count[b-z8v32dj5j0] {
    flex-shrink: 0;
    font-size: var(--font-size-xs);
    color: var(--text-muted);
    font-weight: var(--font-weight-medium);
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

/* Loading / Empty States */
.loading-state[b-z8v32dj5j0] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: var(--space-16) 0;
    color: var(--text-muted);
    gap: var(--space-4);
}

.empty-state[b-z8v32dj5j0] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: var(--space-16) 0;
    color: var(--text-muted);
    gap: var(--space-3);
}

.empty-state svg[b-z8v32dj5j0] {
    opacity: 0.4;
}

.empty-state-text[b-z8v32dj5j0] {
    font-size: var(--font-size-base);
    margin: 0;
}

/* Item List */
.item-list[b-z8v32dj5j0] {
    display: flex;
    flex-direction: column;
    border: var(--border-width-thin) solid var(--border-color-light);
}

/* Item Row */
.item-row[b-z8v32dj5j0] {
    display: flex;
    align-items: center;
    gap: var(--space-4);
    padding: var(--space-4);
    border-bottom: var(--border-width-thin) solid var(--border-color-light);
    transition: background-color var(--transition-fast) var(--transition-ease);
}

.item-row:last-child[b-z8v32dj5j0] {
    border-bottom: none;
}

.item-row:hover[b-z8v32dj5j0] {
    background-color: rgba(11, 36, 62, 0.03);
}

/* Avatar */
.item-avatar[b-z8v32dj5j0] {
    flex-shrink: 0;
    width: 40px;
    height: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: var(--color-gray-100);
    color: var(--color-primary);
}

/* Item Info */
.item-info[b-z8v32dj5j0] {
    flex: 1;
    min-width: 0;
}

.item-name[b-z8v32dj5j0] {
    font-size: var(--font-size-base);
    font-weight: var(--font-weight-semibold);
    color: var(--color-primary);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.item-meta[b-z8v32dj5j0] {
    display: flex;
    align-items: center;
    gap: var(--space-1);
    flex-wrap: wrap;
    font-size: var(--font-size-xs);
    color: var(--text-secondary);
    margin-top: 2px;
}

.item-code[b-z8v32dj5j0] {
    font-family: var(--font-mono);
    font-weight: var(--font-weight-medium);
    color: var(--color-primary);
    opacity: 0.7;
}

.meta-separator[b-z8v32dj5j0] {
    color: var(--color-gray-300);
}

/* Action Buttons */
.item-actions[b-z8v32dj5j0] {
    flex-shrink: 0;
    display: flex;
    align-items: center;
    gap: var(--space-1);
}

.btn-icon[b-z8v32dj5j0] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 36px;
    background: none;
    border: var(--border-width-thin) solid transparent;
    cursor: pointer;
    color: var(--text-muted);
    text-decoration: none;
    transition: all var(--transition-fast) var(--transition-ease);
}

.btn-icon:hover[b-z8v32dj5j0] {
    color: var(--color-primary);
    background-color: var(--color-gray-100);
    border-color: var(--border-color-light);
    text-decoration: none;
}

.btn-icon-danger:hover[b-z8v32dj5j0] {
    color: var(--color-action);
    background-color: rgba(178, 34, 34, 0.06);
    border-color: rgba(178, 34, 34, 0.2);
}

/* Overlay & Dialog */
.overlay[b-z8v32dj5j0] {
    position: fixed;
    inset: 0;
    background-color: rgba(0, 0, 0, 0.4);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: var(--z-modal-backdrop);
}

.confirm-dialog[b-z8v32dj5j0] {
    background-color: var(--color-white);
    padding: var(--space-8);
    max-width: 420px;
    width: 90%;
    box-shadow: var(--shadow-xl);
    text-align: center;
    z-index: var(--z-modal);
}

.confirm-icon[b-z8v32dj5j0] {
    color: var(--color-action);
    margin-bottom: var(--space-4);
}

.confirm-dialog h3[b-z8v32dj5j0] {
    font-size: var(--font-size-lg);
    font-weight: var(--font-weight-semibold);
    color: var(--color-primary);
    margin: 0 0 var(--space-2) 0;
}

.confirm-dialog p[b-z8v32dj5j0] {
    font-size: var(--font-size-sm);
    color: var(--text-secondary);
    margin: 0 0 var(--space-2) 0;
}

.confirm-warning[b-z8v32dj5j0] {
    font-size: var(--font-size-xs) !important;
    color: var(--color-action) !important;
    font-weight: var(--font-weight-medium);
}

.confirm-actions[b-z8v32dj5j0] {
    display: flex;
    gap: var(--space-3);
    justify-content: center;
    margin-top: var(--space-6);
}

.confirm-actions .btn[b-z8v32dj5j0] {
    min-width: 100px;
    padding: var(--space-2) var(--space-4);
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-medium);
    cursor: pointer;
}

/* Outline Primary Button */
.btn-outline-primary[b-z8v32dj5j0] {
    background: transparent;
    color: var(--color-primary);
    border: var(--border-width-thin) solid var(--color-primary);
}

.btn-outline-primary:hover[b-z8v32dj5j0] {
    background-color: var(--color-primary);
    color: var(--text-on-primary);
}

/* Responsive */
@media (max-width: 768px) {
    .page-header[b-z8v32dj5j0] {
        flex-direction: column;
        gap: var(--space-3);
    }

    .item-row[b-z8v32dj5j0] {
        flex-wrap: wrap;
    }

    .item-actions[b-z8v32dj5j0] {
        order: 6;
        margin-left: auto;
    }
}
/* /Components/Pages/Login.razor.rz.scp.css */
/* Login Page Container */
.login-page[b-h75qmzpnln] {
    min-height: 100vh;
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 1rem;
    position: relative;
    /* Background with gradient overlay and custom image */
    background: 
        linear-gradient(135deg, rgba(11, 36, 62, 0.85) 0%, rgba(30, 77, 123, 0.85) 100%),
        url('/images/AdobeStock_138850596.jpeg');
    background-size: cover;
    background-position: center;
    background-attachment: fixed;
}

/* Company Logo */
.company-logo[b-h75qmzpnln] {
    position: absolute;
    top: 2rem;
    left: 2rem;
    width: 220px;
    max-width: 30vw;
    z-index: 10;
}

.company-logo svg[b-h75qmzpnln] {
    width: 100%;
    height: auto;
    filter: drop-shadow(0 2px 8px rgba(0, 0, 0, 0.3));
}

/* Login Card */
.login-card[b-h75qmzpnln] {
    width: 100%;
    max-width: 400px;
    border: none;
    border-radius: 12px;
    overflow: hidden;
    backdrop-filter: blur(10px);
    background: rgba(255, 255, 255, 0.95);
}

.login-card .card-header[b-h75qmzpnln] {
    background: linear-gradient(135deg, #0B243E 0%, #1e4d7b 100%) !important;
    border-bottom: none;
    padding: 1.5rem;
}

.login-card .card-header h4[b-h75qmzpnln] {
    font-weight: 700;
    letter-spacing: 0.5px;
}

.login-card .card-header small[b-h75qmzpnln] {
    opacity: 0.9;
    font-size: 0.875rem;
}

/* Form Styling */
.login-card .form-label[b-h75qmzpnln] {
    font-weight: 600;
    color: #0B243E;
    font-size: 0.9rem;
}

.login-card .form-control[b-h75qmzpnln] {
    border-radius: 8px;
    border: 1px solid #dee2e6;
    padding: 0.75rem 1rem;
    transition: border-color 0.2s ease, box-shadow 0.2s ease;
}

.login-card .form-control:focus[b-h75qmzpnln] {
    border-color: #0B243E;
    box-shadow: 0 0 0 0.2rem rgba(11, 36, 62, 0.15);
}

/* Button Styling */
.login-card .btn-primary[b-h75qmzpnln] {
    background: linear-gradient(135deg, #0B243E 0%, #1e4d7b 100%);
    border: none;
    border-radius: 8px;
    padding: 0.75rem 1.5rem;
    font-weight: 600;
    letter-spacing: 0.5px;
    transition: transform 0.2s ease, box-shadow 0.2s ease;
}

.login-card .btn-primary svg[b-h75qmzpnln] {
    stroke: white;
    flex-shrink: 0;
}

.login-card .btn-primary:hover:not(:disabled)[b-h75qmzpnln] {
    transform: translateY(-2px);
    box-shadow: 0 6px 20px rgba(11, 36, 62, 0.3);
}

.login-card .btn-primary:disabled[b-h75qmzpnln] {
    opacity: 0.65;
    cursor: not-allowed;
}

/* Alert Styling */
.login-card .alert[b-h75qmzpnln] {
    border-radius: 8px;
    border: none;
}

/* Responsive adjustments */
@media (max-width: 576px) {
    .login-card[b-h75qmzpnln] {
        max-width: 100%;
        border-radius: 0;
    }

    .login-page[b-h75qmzpnln] {
        padding: 0;
    }

    /* Smaller logo on mobile */
    .company-logo[b-h75qmzpnln] {
        top: 1rem;
        left: 1rem;
        width: 150px;
        max-width: 40vw;
    }
}
/* /Components/Pages/MenuGroupPage.razor.rz.scp.css */
/* Menu Card Styles - Clean White Cards with Blue Border */

.card.menu-card[b-g00lsqzykj] {
    border: 2px solid #0B243E !important;
    border-radius: 6px;
    transition: all 0.2s ease-in-out;
    cursor: pointer;
    background: white !important;
    background-color: white !important;
}

.card.menu-card:hover[b-g00lsqzykj] {
    border-color: #1e4d7b !important;
    box-shadow: 0 4px 12px rgba(11, 36, 62, 0.15);
    transform: translateY(-2px);
    background: #f8f9fa !important;
    background-color: #f8f9fa !important;
}

.card.menu-card .card-body[b-g00lsqzykj] {
    padding: 1.25rem;
}

.card.menu-card .card-title[b-g00lsqzykj] {
    font-size: 1rem;
    font-weight: 600;
    color: #1e2022 !important;
    margin-bottom: 0.5rem;
}

.card.menu-card .card-text[b-g00lsqzykj] {
    font-size: 0.875rem;
    line-height: 1.4;
    margin-bottom: 0.75rem;
    color: #495057 !important;
}

.card.menu-card .text-muted[b-g00lsqzykj] {
    color: #6c757d !important;
}

.card.menu-folder-card[b-g00lsqzykj] {
    border-left: 4px solid #0B243E !important;
    background: white !important;
    background-color: white !important;
}

.card.menu-folder-card:hover[b-g00lsqzykj] {
    background: #f8f9fa !important;
    background-color: #f8f9fa !important;
    border-left-color: #1e4d7b !important;
}

/* Badge styling */
.menu-card .badge[b-g00lsqzykj] {
    font-size: 0.75rem;
    font-weight: 500;
    padding: 0.25rem 0.5rem;
}

/* Folder icon styling */
.folder-icon[b-g00lsqzykj] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 24px;
    height: 24px;
    color: #0B243E;
}

.card.menu-folder-card:hover .folder-icon[b-g00lsqzykj] {
    color: #1e4d7b;
}

/* Loading and error states */
.alert[b-g00lsqzykj] {
    border-radius: 4px;
    border-left: 3px solid;
}

/* Search Bar */
.search-bar[b-g00lsqzykj] {
    display: flex;
    align-items: center;
    gap: 1rem;
    margin-bottom: 1rem;
    padding: 0.75rem 1rem;
    background-color: #f8f9fa;
    border: 1px solid #dee2e6;
    border-radius: 4px;
}

.search-input-wrapper[b-g00lsqzykj] {
    display: flex;
    align-items: center;
    flex: 1;
    position: relative;
}

.search-icon[b-g00lsqzykj] {
    color: #6c757d;
    flex-shrink: 0;
    margin-right: 0.5rem;
}

.search-input[b-g00lsqzykj] {
    flex: 1;
    border: none;
    background: transparent;
    font-size: 0.875rem;
    color: #495057;
    outline: none;
    padding: 0.25rem 0;
}

.search-input[b-g00lsqzykj]::placeholder {
    color: #6c757d;
}

.search-clear[b-g00lsqzykj] {
    background: none;
    border: none;
    cursor: pointer;
    color: #6c757d;
    padding: 0.25rem;
    display: flex;
    align-items: center;
}

.search-clear:hover[b-g00lsqzykj] {
    color: #0B243E;
}

.alert-danger[b-g00lsqzykj] {
    border-left-color: #fa5252;
}

.alert-info[b-g00lsqzykj] {
    border-left-color: #339af0;
}
/* /Components/Pages/Orders/DeliveryOrderByCustomerItemFishList.razor.rz.scp.css */
/* ===========================
   DeliveryOrderByCustomerItemFishList - Scoped Styles
   Flat Industrial Minimal
   =========================== */

.page-container[b-7ioxat2i7k] { max-width: 1200px; margin: 0 auto; padding: var(--space-6) var(--space-4); }
.page-header[b-7ioxat2i7k] { display: flex; justify-content: space-between; align-items: flex-start; margin-bottom: var(--space-6); gap: var(--space-4); }
.page-header-left[b-7ioxat2i7k] { flex: 1; }
.page-header-right[b-7ioxat2i7k] { flex-shrink: 0; display: flex; align-items: center; }
.page-title[b-7ioxat2i7k] { font-size: var(--font-size-2xl); font-weight: var(--font-weight-bold); color: var(--color-primary); display: flex; align-items: center; gap: var(--space-2); margin: 0; }
.page-title svg[b-7ioxat2i7k] { color: var(--color-primary); flex-shrink: 0; }
.page-subtitle[b-7ioxat2i7k] { color: var(--text-muted); font-size: var(--font-size-sm); margin: var(--space-1) 0 0 0; }
.btn-back[b-7ioxat2i7k] { display: inline-flex; align-items: center; gap: var(--space-2); padding: var(--space-2) var(--space-3); font-size: var(--font-size-sm); font-weight: var(--font-weight-medium); color: var(--color-primary); background: transparent; border: var(--border-width-thin) solid var(--border-color-light); cursor: pointer; text-decoration: none; transition: all var(--transition-fast) var(--transition-ease); }
.btn-back:hover[b-7ioxat2i7k] { background-color: var(--color-gray-100); border-color: var(--color-primary); text-decoration: none; }
.alert-bar-danger[b-7ioxat2i7k] { display: flex; align-items: center; gap: var(--space-2); padding: var(--space-3) var(--space-4); margin-bottom: var(--space-4); font-size: var(--font-size-sm); font-weight: var(--font-weight-medium); border-left: var(--border-width-thick) solid var(--color-danger); background-color: #fdeded; color: #5f2120; }
.alert-bar-close[b-7ioxat2i7k] { margin-left: auto; background: none; border: none; font-size: var(--font-size-lg); cursor: pointer; color: inherit; opacity: 0.6; line-height: 1; }
.alert-bar-close:hover[b-7ioxat2i7k] { opacity: 1; }
.search-bar[b-7ioxat2i7k] { display: flex; align-items: center; gap: var(--space-4); margin-bottom: var(--space-4); padding: var(--space-3) var(--space-4); background-color: var(--bg-secondary); border: var(--border-width-thin) solid var(--border-color-light); }
.search-input-wrapper[b-7ioxat2i7k] { display: flex; align-items: center; flex: 1; position: relative; }
.search-icon[b-7ioxat2i7k] { color: var(--text-muted); flex-shrink: 0; margin-right: var(--space-2); }
.search-input[b-7ioxat2i7k] { flex: 1; border: none; background: transparent; font-size: var(--font-size-sm); color: var(--color-gray-700); outline: none; padding: var(--space-1) 0; }
.search-input[b-7ioxat2i7k]::placeholder { color: var(--text-muted); }
.search-clear[b-7ioxat2i7k] { background: none; border: none; cursor: pointer; color: var(--text-muted); padding: var(--space-1); display: flex; align-items: center; }
.search-clear:hover[b-7ioxat2i7k] { color: var(--color-primary); }
.search-count[b-7ioxat2i7k] { flex-shrink: 0; font-size: var(--font-size-xs); color: var(--text-muted); font-weight: var(--font-weight-medium); text-transform: uppercase; letter-spacing: 0.5px; }
.loading-state[b-7ioxat2i7k], .empty-state[b-7ioxat2i7k] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: var(--space-16) 0; color: var(--text-muted); gap: var(--space-3); }
.empty-state svg[b-7ioxat2i7k] { opacity: 0.4; }
.empty-state-text[b-7ioxat2i7k] { font-size: var(--font-size-base); margin: 0; }
.item-list[b-7ioxat2i7k] { display: flex; flex-direction: column; border: var(--border-width-thin) solid var(--border-color-light); }
.item-row[b-7ioxat2i7k] { display: flex; align-items: center; gap: var(--space-4); padding: var(--space-4); border-bottom: var(--border-width-thin) solid var(--border-color-light); transition: background-color var(--transition-fast) var(--transition-ease); }
.item-row:hover[b-7ioxat2i7k] { background-color: rgba(11, 36, 62, 0.03); }
.item-avatar[b-7ioxat2i7k] { flex-shrink: 0; width: 40px; height: 40px; display: flex; align-items: center; justify-content: center; background-color: var(--color-gray-100); color: var(--color-primary); }
.item-info[b-7ioxat2i7k] { flex: 1; min-width: 0; }
.item-name[b-7ioxat2i7k] { font-size: var(--font-size-sm); font-weight: var(--font-weight-bold); color: var(--color-primary); font-family: var(--font-mono); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.item-description[b-7ioxat2i7k] { font-size: var(--font-size-sm); font-weight: var(--font-weight-medium); color: var(--color-gray-700); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; margin-top: 1px; }
.item-meta[b-7ioxat2i7k] { display: flex; align-items: center; gap: var(--space-1); flex-wrap: wrap; font-size: var(--font-size-xs); color: var(--text-secondary); margin-top: 2px; }
.meta-separator[b-7ioxat2i7k] { color: var(--color-gray-300); }
.badge-um[b-7ioxat2i7k] { display: inline-flex; align-items: center; padding: 1px 6px; font-size: 10px; font-weight: var(--font-weight-bold); font-family: var(--font-mono); text-transform: uppercase; letter-spacing: 0.5px; background-color: var(--color-gray-100); color: var(--color-primary); border: var(--border-width-thin) solid var(--border-color-light); }
.badge-traceable[b-7ioxat2i7k] { display: inline-flex; align-items: center; padding: 1px 6px; font-size: 10px; font-weight: var(--font-weight-bold); text-transform: uppercase; letter-spacing: 0.5px; background-color: #e8f5e9; color: #2e7d32; border: var(--border-width-thin) solid #c8e6c9; }
.item-price[b-7ioxat2i7k] { flex-shrink: 0; display: flex; flex-direction: column; align-items: flex-end; min-width: 80px; }
.price-value[b-7ioxat2i7k] { font-size: var(--font-size-sm); font-weight: var(--font-weight-bold); font-family: var(--font-mono); color: var(--color-primary); }
.price-currency[b-7ioxat2i7k] { font-size: var(--font-size-xs); color: var(--text-muted); font-weight: var(--font-weight-medium); }
.item-quantities[b-7ioxat2i7k] { flex-shrink: 0; display: flex; gap: var(--space-4); align-items: center; }
.quantity-group[b-7ioxat2i7k] { display: flex; flex-direction: column; align-items: flex-end; min-width: 90px; }
.quantity-label[b-7ioxat2i7k] { font-size: var(--font-size-xs); color: var(--text-muted); text-transform: uppercase; letter-spacing: 0.5px; font-weight: var(--font-weight-medium); }
.quantity-value[b-7ioxat2i7k] { font-size: var(--font-size-sm); font-weight: var(--font-weight-semibold); color: var(--color-primary); font-family: var(--font-mono); }
.item-gauge[b-7ioxat2i7k] { flex-shrink: 0; display: flex; flex-direction: column; align-items: center; gap: 2px; }
.gauge-ring[b-7ioxat2i7k] { position: relative; width: 48px; height: 48px; }
.gauge-ring svg[b-7ioxat2i7k] { width: 100%; height: 100%; transform: rotate(-90deg); }
.gauge-bg[b-7ioxat2i7k] { fill: none; stroke: var(--color-gray-100); stroke-width: 3; }
.gauge-fill[b-7ioxat2i7k] { fill: none; stroke-width: 3; stroke-linecap: round; transition: stroke-dasharray 0.4s ease; }
.gauge-complete .gauge-fill[b-7ioxat2i7k] { stroke: var(--color-success); }
.gauge-partial .gauge-fill[b-7ioxat2i7k] { stroke: #e6a817; }
.gauge-low .gauge-fill[b-7ioxat2i7k] { stroke: var(--color-danger); }
.gauge-text[b-7ioxat2i7k] { position: absolute; inset: 0; display: flex; align-items: center; justify-content: center; font-size: 11px; font-weight: var(--font-weight-bold); font-family: var(--font-mono); color: var(--color-primary); }
.gauge-label[b-7ioxat2i7k] { font-size: 10px; color: var(--text-muted); text-transform: uppercase; letter-spacing: 0.5px; font-weight: var(--font-weight-medium); }
.actions-separator[b-7ioxat2i7k] { width: 1px; height: 32px; background-color: var(--border-color-light); flex-shrink: 0; }
.item-actions[b-7ioxat2i7k] { flex-shrink: 0; display: flex; align-items: center; gap: var(--space-1); }
.btn-icon[b-7ioxat2i7k] { display: inline-flex; align-items: center; justify-content: center; width: 36px; height: 36px; background: none; border: var(--border-width-thin) solid transparent; cursor: pointer; color: var(--text-muted); text-decoration: none; transition: all var(--transition-fast) var(--transition-ease); }
.btn-icon:hover[b-7ioxat2i7k] { color: var(--color-primary); background-color: var(--color-gray-100); border-color: var(--border-color-light); text-decoration: none; }

/* Traceability */
.traceability-row[b-7ioxat2i7k] { padding: var(--space-3) var(--space-4) var(--space-3) calc(40px + var(--space-4) + var(--space-4)); background-color: var(--color-gray-50, #f8f9fa); border-bottom: var(--border-width-thin) solid var(--border-color-light); }
.traceability-grid[b-7ioxat2i7k] { display: grid; grid-template-columns: repeat(auto-fill, minmax(160px, 1fr)); gap: var(--space-2) var(--space-4); }
.trace-field[b-7ioxat2i7k] { display: flex; flex-direction: column; gap: 1px; }
.trace-label[b-7ioxat2i7k] { font-size: 10px; color: var(--text-muted); text-transform: uppercase; letter-spacing: 0.5px; font-weight: var(--font-weight-medium); }
.trace-value[b-7ioxat2i7k] { font-size: var(--font-size-xs); font-weight: var(--font-weight-semibold); color: var(--color-primary); font-family: var(--font-mono); }
.trace-value-scientific[b-7ioxat2i7k] { font-style: italic; }

.btn-outline-primary[b-7ioxat2i7k] { background: transparent; color: var(--color-primary); border: var(--border-width-thin) solid var(--color-primary); }
.btn-outline-primary:hover[b-7ioxat2i7k] { background-color: var(--color-primary); color: var(--text-on-primary); }

@media (max-width: 768px) {
    .page-header[b-7ioxat2i7k] { flex-direction: column; gap: var(--space-3); }
    .item-row[b-7ioxat2i7k] { flex-wrap: wrap; }
    .item-quantities[b-7ioxat2i7k] { width: 100%; justify-content: flex-end; }
    .traceability-grid[b-7ioxat2i7k] { grid-template-columns: repeat(2, 1fr); }
}
/* /Components/Pages/Orders/DeliveryOrderByCustomerItemFruitList.razor.rz.scp.css */
/* ===========================
   DeliveryOrderByCustomerItemFruitList - Scoped Styles
   Flat Industrial Minimal
   =========================== */

.page-container[b-r3kdifm8b1] { max-width: 1200px; margin: 0 auto; padding: var(--space-6) var(--space-4); }
.page-header[b-r3kdifm8b1] { display: flex; justify-content: space-between; align-items: flex-start; margin-bottom: var(--space-6); gap: var(--space-4); }
.page-header-left[b-r3kdifm8b1] { flex: 1; }
.page-header-right[b-r3kdifm8b1] { flex-shrink: 0; display: flex; align-items: center; }
.page-title[b-r3kdifm8b1] { font-size: var(--font-size-2xl); font-weight: var(--font-weight-bold); color: var(--color-primary); display: flex; align-items: center; gap: var(--space-2); margin: 0; }
.page-title svg[b-r3kdifm8b1] { color: var(--color-primary); flex-shrink: 0; }
.page-subtitle[b-r3kdifm8b1] { color: var(--text-muted); font-size: var(--font-size-sm); margin: var(--space-1) 0 0 0; }
.btn-back[b-r3kdifm8b1] { display: inline-flex; align-items: center; gap: var(--space-2); padding: var(--space-2) var(--space-3); font-size: var(--font-size-sm); font-weight: var(--font-weight-medium); color: var(--color-primary); background: transparent; border: var(--border-width-thin) solid var(--border-color-light); cursor: pointer; text-decoration: none; transition: all var(--transition-fast) var(--transition-ease); }
.btn-back:hover[b-r3kdifm8b1] { background-color: var(--color-gray-100); border-color: var(--color-primary); text-decoration: none; }
.alert-bar-danger[b-r3kdifm8b1] { display: flex; align-items: center; gap: var(--space-2); padding: var(--space-3) var(--space-4); margin-bottom: var(--space-4); font-size: var(--font-size-sm); font-weight: var(--font-weight-medium); border-left: var(--border-width-thick) solid var(--color-danger); background-color: #fdeded; color: #5f2120; }
.alert-bar-close[b-r3kdifm8b1] { margin-left: auto; background: none; border: none; font-size: var(--font-size-lg); cursor: pointer; color: inherit; opacity: 0.6; line-height: 1; }
.alert-bar-close:hover[b-r3kdifm8b1] { opacity: 1; }
.search-bar[b-r3kdifm8b1] { display: flex; align-items: center; gap: var(--space-4); margin-bottom: var(--space-4); padding: var(--space-3) var(--space-4); background-color: var(--bg-secondary); border: var(--border-width-thin) solid var(--border-color-light); }
.search-input-wrapper[b-r3kdifm8b1] { display: flex; align-items: center; flex: 1; position: relative; }
.search-icon[b-r3kdifm8b1] { color: var(--text-muted); flex-shrink: 0; margin-right: var(--space-2); }
.search-input[b-r3kdifm8b1] { flex: 1; border: none; background: transparent; font-size: var(--font-size-sm); color: var(--color-gray-700); outline: none; padding: var(--space-1) 0; }
.search-input[b-r3kdifm8b1]::placeholder { color: var(--text-muted); }
.search-clear[b-r3kdifm8b1] { background: none; border: none; cursor: pointer; color: var(--text-muted); padding: var(--space-1); display: flex; align-items: center; }
.search-clear:hover[b-r3kdifm8b1] { color: var(--color-primary); }
.search-count[b-r3kdifm8b1] { flex-shrink: 0; font-size: var(--font-size-xs); color: var(--text-muted); font-weight: var(--font-weight-medium); text-transform: uppercase; letter-spacing: 0.5px; }
.loading-state[b-r3kdifm8b1], .empty-state[b-r3kdifm8b1] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: var(--space-16) 0; color: var(--text-muted); gap: var(--space-3); }
.empty-state svg[b-r3kdifm8b1] { opacity: 0.4; }
.empty-state-text[b-r3kdifm8b1] { font-size: var(--font-size-base); margin: 0; }
.item-list[b-r3kdifm8b1] { display: flex; flex-direction: column; border: var(--border-width-thin) solid var(--border-color-light); }
.item-row[b-r3kdifm8b1] { display: flex; align-items: center; gap: var(--space-4); padding: var(--space-4); border-bottom: var(--border-width-thin) solid var(--border-color-light); transition: background-color var(--transition-fast) var(--transition-ease); }
.item-row:hover[b-r3kdifm8b1] { background-color: rgba(11, 36, 62, 0.03); }
.item-avatar[b-r3kdifm8b1] { flex-shrink: 0; width: 40px; height: 40px; display: flex; align-items: center; justify-content: center; background-color: var(--color-gray-100); color: var(--color-primary); }
.item-info[b-r3kdifm8b1] { flex: 1; min-width: 0; }
.item-name[b-r3kdifm8b1] { font-size: var(--font-size-sm); font-weight: var(--font-weight-bold); color: var(--color-primary); font-family: var(--font-mono); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.item-description[b-r3kdifm8b1] { font-size: var(--font-size-sm); font-weight: var(--font-weight-medium); color: var(--color-gray-700); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; margin-top: 1px; }
.item-meta[b-r3kdifm8b1] { display: flex; align-items: center; gap: var(--space-1); flex-wrap: wrap; font-size: var(--font-size-xs); color: var(--text-secondary); margin-top: 2px; }
.meta-separator[b-r3kdifm8b1] { color: var(--color-gray-300); }
.badge-um[b-r3kdifm8b1] { display: inline-flex; align-items: center; padding: 1px 6px; font-size: 10px; font-weight: var(--font-weight-bold); font-family: var(--font-mono); text-transform: uppercase; letter-spacing: 0.5px; background-color: var(--color-gray-100); color: var(--color-primary); border: var(--border-width-thin) solid var(--border-color-light); }
.item-price[b-r3kdifm8b1] { flex-shrink: 0; display: flex; flex-direction: column; align-items: flex-end; min-width: 80px; }
.price-value[b-r3kdifm8b1] { font-size: var(--font-size-sm); font-weight: var(--font-weight-bold); font-family: var(--font-mono); color: var(--color-primary); }
.price-currency[b-r3kdifm8b1] { font-size: var(--font-size-xs); color: var(--text-muted); font-weight: var(--font-weight-medium); }
.item-quantities[b-r3kdifm8b1] { flex-shrink: 0; display: flex; gap: var(--space-4); align-items: center; }
.quantity-group[b-r3kdifm8b1] { display: flex; flex-direction: column; align-items: flex-end; min-width: 90px; }
.quantity-label[b-r3kdifm8b1] { font-size: var(--font-size-xs); color: var(--text-muted); text-transform: uppercase; letter-spacing: 0.5px; font-weight: var(--font-weight-medium); }
.quantity-value[b-r3kdifm8b1] { font-size: var(--font-size-sm); font-weight: var(--font-weight-semibold); color: var(--color-primary); font-family: var(--font-mono); }
.item-gauge[b-r3kdifm8b1] { flex-shrink: 0; display: flex; flex-direction: column; align-items: center; gap: 2px; }
.gauge-ring[b-r3kdifm8b1] { position: relative; width: 48px; height: 48px; }
.gauge-ring svg[b-r3kdifm8b1] { width: 100%; height: 100%; transform: rotate(-90deg); }
.gauge-bg[b-r3kdifm8b1] { fill: none; stroke: var(--color-gray-100); stroke-width: 3; }
.gauge-fill[b-r3kdifm8b1] { fill: none; stroke-width: 3; stroke-linecap: round; transition: stroke-dasharray 0.4s ease; }
.gauge-complete .gauge-fill[b-r3kdifm8b1] { stroke: var(--color-success); }
.gauge-partial .gauge-fill[b-r3kdifm8b1] { stroke: #e6a817; }
.gauge-low .gauge-fill[b-r3kdifm8b1] { stroke: var(--color-danger); }
.gauge-text[b-r3kdifm8b1] { position: absolute; inset: 0; display: flex; align-items: center; justify-content: center; font-size: 11px; font-weight: var(--font-weight-bold); font-family: var(--font-mono); color: var(--color-primary); }
.gauge-label[b-r3kdifm8b1] { font-size: 10px; color: var(--text-muted); text-transform: uppercase; letter-spacing: 0.5px; font-weight: var(--font-weight-medium); }
.actions-separator[b-r3kdifm8b1] { width: 1px; height: 32px; background-color: var(--border-color-light); flex-shrink: 0; }
.item-actions[b-r3kdifm8b1] { flex-shrink: 0; display: flex; align-items: center; gap: var(--space-1); }
.btn-icon[b-r3kdifm8b1] { display: inline-flex; align-items: center; justify-content: center; width: 36px; height: 36px; background: none; border: var(--border-width-thin) solid transparent; cursor: pointer; color: var(--text-muted); text-decoration: none; transition: all var(--transition-fast) var(--transition-ease); }
.btn-icon:hover[b-r3kdifm8b1] { color: var(--color-primary); background-color: var(--color-gray-100); border-color: var(--border-color-light); text-decoration: none; }

/* Traceability */
.traceability-row[b-r3kdifm8b1] { padding: var(--space-3) var(--space-4) var(--space-3) calc(40px + var(--space-4) + var(--space-4)); background-color: var(--color-gray-50, #f8f9fa); border-bottom: var(--border-width-thin) solid var(--border-color-light); }
.traceability-grid[b-r3kdifm8b1] { display: grid; grid-template-columns: repeat(auto-fill, minmax(160px, 1fr)); gap: var(--space-2) var(--space-4); }
.trace-field[b-r3kdifm8b1] { display: flex; flex-direction: column; gap: 1px; }
.trace-label[b-r3kdifm8b1] { font-size: 10px; color: var(--text-muted); text-transform: uppercase; letter-spacing: 0.5px; font-weight: var(--font-weight-medium); }
.trace-value[b-r3kdifm8b1] { font-size: var(--font-size-xs); font-weight: var(--font-weight-semibold); color: var(--color-primary); font-family: var(--font-mono); }

.btn-outline-primary[b-r3kdifm8b1] { background: transparent; color: var(--color-primary); border: var(--border-width-thin) solid var(--color-primary); }
.btn-outline-primary:hover[b-r3kdifm8b1] { background-color: var(--color-primary); color: var(--text-on-primary); }

@media (max-width: 768px) {
    .page-header[b-r3kdifm8b1] { flex-direction: column; gap: var(--space-3); }
    .item-row[b-r3kdifm8b1] { flex-wrap: wrap; }
    .item-quantities[b-r3kdifm8b1] { width: 100%; justify-content: flex-end; }
    .traceability-grid[b-r3kdifm8b1] { grid-template-columns: repeat(2, 1fr); }
}
/* /Components/Pages/Orders/DeliveryOrderByCustomerItemGroceryList.razor.rz.scp.css */
/* ===========================
   DeliveryOrderByCustomerItemGroceryList - Scoped Styles
   Flat Industrial Minimal
   =========================== */

.page-container[b-90w170atpz] { max-width: 1200px; margin: 0 auto; padding: var(--space-6) var(--space-4); }
.page-header[b-90w170atpz] { display: flex; justify-content: space-between; align-items: flex-start; margin-bottom: var(--space-6); gap: var(--space-4); }
.page-header-left[b-90w170atpz] { flex: 1; }
.page-header-right[b-90w170atpz] { flex-shrink: 0; display: flex; align-items: center; }
.page-title[b-90w170atpz] { font-size: var(--font-size-2xl); font-weight: var(--font-weight-bold); color: var(--color-primary); display: flex; align-items: center; gap: var(--space-2); margin: 0; }
.page-title svg[b-90w170atpz] { color: var(--color-primary); flex-shrink: 0; }
.page-subtitle[b-90w170atpz] { color: var(--text-muted); font-size: var(--font-size-sm); margin: var(--space-1) 0 0 0; }
.btn-back[b-90w170atpz] { display: inline-flex; align-items: center; gap: var(--space-2); padding: var(--space-2) var(--space-3); font-size: var(--font-size-sm); font-weight: var(--font-weight-medium); color: var(--color-primary); background: transparent; border: var(--border-width-thin) solid var(--border-color-light); cursor: pointer; text-decoration: none; transition: all var(--transition-fast) var(--transition-ease); }
.btn-back:hover[b-90w170atpz] { background-color: var(--color-gray-100); border-color: var(--color-primary); text-decoration: none; }
.alert-bar-danger[b-90w170atpz] { display: flex; align-items: center; gap: var(--space-2); padding: var(--space-3) var(--space-4); margin-bottom: var(--space-4); font-size: var(--font-size-sm); font-weight: var(--font-weight-medium); border-left: var(--border-width-thick) solid var(--color-danger); background-color: #fdeded; color: #5f2120; }
.alert-bar-close[b-90w170atpz] { margin-left: auto; background: none; border: none; font-size: var(--font-size-lg); cursor: pointer; color: inherit; opacity: 0.6; line-height: 1; }
.alert-bar-close:hover[b-90w170atpz] { opacity: 1; }
.search-bar[b-90w170atpz] { display: flex; align-items: center; gap: var(--space-4); margin-bottom: var(--space-4); padding: var(--space-3) var(--space-4); background-color: var(--bg-secondary); border: var(--border-width-thin) solid var(--border-color-light); }
.search-input-wrapper[b-90w170atpz] { display: flex; align-items: center; flex: 1; position: relative; }
.search-icon[b-90w170atpz] { color: var(--text-muted); flex-shrink: 0; margin-right: var(--space-2); }
.search-input[b-90w170atpz] { flex: 1; border: none; background: transparent; font-size: var(--font-size-sm); color: var(--color-gray-700); outline: none; padding: var(--space-1) 0; }
.search-input[b-90w170atpz]::placeholder { color: var(--text-muted); }
.search-clear[b-90w170atpz] { background: none; border: none; cursor: pointer; color: var(--text-muted); padding: var(--space-1); display: flex; align-items: center; }
.search-clear:hover[b-90w170atpz] { color: var(--color-primary); }
.search-count[b-90w170atpz] { flex-shrink: 0; font-size: var(--font-size-xs); color: var(--text-muted); font-weight: var(--font-weight-medium); text-transform: uppercase; letter-spacing: 0.5px; }
.loading-state[b-90w170atpz], .empty-state[b-90w170atpz] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: var(--space-16) 0; color: var(--text-muted); gap: var(--space-3); }
.empty-state svg[b-90w170atpz] { opacity: 0.4; }
.empty-state-text[b-90w170atpz] { font-size: var(--font-size-base); margin: 0; }
.item-list[b-90w170atpz] { display: flex; flex-direction: column; border: var(--border-width-thin) solid var(--border-color-light); }
.item-row[b-90w170atpz] { display: flex; align-items: center; gap: var(--space-4); padding: var(--space-4); border-bottom: var(--border-width-thin) solid var(--border-color-light); transition: background-color var(--transition-fast) var(--transition-ease); }
.item-row:last-child[b-90w170atpz] { border-bottom: none; }
.item-row:hover[b-90w170atpz] { background-color: rgba(11, 36, 62, 0.03); }
.item-avatar[b-90w170atpz] { flex-shrink: 0; width: 40px; height: 40px; display: flex; align-items: center; justify-content: center; background-color: var(--color-gray-100); color: var(--color-primary); }
.item-info[b-90w170atpz] { flex: 1; min-width: 0; }
.item-name[b-90w170atpz] { font-size: var(--font-size-sm); font-weight: var(--font-weight-bold); color: var(--color-primary); font-family: var(--font-mono); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.item-description[b-90w170atpz] { font-size: var(--font-size-sm); font-weight: var(--font-weight-medium); color: var(--color-gray-700); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; margin-top: 1px; }
.item-meta[b-90w170atpz] { display: flex; align-items: center; gap: var(--space-1); flex-wrap: wrap; font-size: var(--font-size-xs); color: var(--text-secondary); margin-top: 2px; }
.meta-separator[b-90w170atpz] { color: var(--color-gray-300); }
.badge-um[b-90w170atpz] { display: inline-flex; align-items: center; padding: 1px 6px; font-size: 10px; font-weight: var(--font-weight-bold); font-family: var(--font-mono); text-transform: uppercase; letter-spacing: 0.5px; background-color: var(--color-gray-100); color: var(--color-primary); border: var(--border-width-thin) solid var(--border-color-light); }

/* Grocery-specific: traceable badge & origin inline */
.badge-traceable[b-90w170atpz] { display: inline-flex; align-items: center; padding: 1px 6px; font-size: 10px; font-weight: var(--font-weight-bold); text-transform: uppercase; letter-spacing: 0.5px; background-color: #e8f5e9; color: #2e7d32; border: var(--border-width-thin) solid #c8e6c9; }
.trace-inline[b-90w170atpz] { font-weight: var(--font-weight-semibold); color: var(--color-primary); }

.item-price[b-90w170atpz] { flex-shrink: 0; display: flex; flex-direction: column; align-items: flex-end; min-width: 80px; }
.price-value[b-90w170atpz] { font-size: var(--font-size-sm); font-weight: var(--font-weight-bold); font-family: var(--font-mono); color: var(--color-primary); }
.price-currency[b-90w170atpz] { font-size: var(--font-size-xs); color: var(--text-muted); font-weight: var(--font-weight-medium); }
.item-quantities[b-90w170atpz] { flex-shrink: 0; display: flex; gap: var(--space-4); align-items: center; }
.quantity-group[b-90w170atpz] { display: flex; flex-direction: column; align-items: flex-end; min-width: 90px; }
.quantity-label[b-90w170atpz] { font-size: var(--font-size-xs); color: var(--text-muted); text-transform: uppercase; letter-spacing: 0.5px; font-weight: var(--font-weight-medium); }
.quantity-value[b-90w170atpz] { font-size: var(--font-size-sm); font-weight: var(--font-weight-semibold); color: var(--color-primary); font-family: var(--font-mono); }
.item-gauge[b-90w170atpz] { flex-shrink: 0; display: flex; flex-direction: column; align-items: center; gap: 2px; }
.gauge-ring[b-90w170atpz] { position: relative; width: 48px; height: 48px; }
.gauge-ring svg[b-90w170atpz] { width: 100%; height: 100%; transform: rotate(-90deg); }
.gauge-bg[b-90w170atpz] { fill: none; stroke: var(--color-gray-100); stroke-width: 3; }
.gauge-fill[b-90w170atpz] { fill: none; stroke-width: 3; stroke-linecap: round; transition: stroke-dasharray 0.4s ease; }
.gauge-complete .gauge-fill[b-90w170atpz] { stroke: var(--color-success); }
.gauge-partial .gauge-fill[b-90w170atpz] { stroke: #e6a817; }
.gauge-low .gauge-fill[b-90w170atpz] { stroke: var(--color-danger); }
.gauge-text[b-90w170atpz] { position: absolute; inset: 0; display: flex; align-items: center; justify-content: center; font-size: 11px; font-weight: var(--font-weight-bold); font-family: var(--font-mono); color: var(--color-primary); }
.gauge-label[b-90w170atpz] { font-size: 10px; color: var(--text-muted); text-transform: uppercase; letter-spacing: 0.5px; font-weight: var(--font-weight-medium); }
.actions-separator[b-90w170atpz] { width: 1px; height: 32px; background-color: var(--border-color-light); flex-shrink: 0; }
.item-actions[b-90w170atpz] { flex-shrink: 0; display: flex; align-items: center; gap: var(--space-1); }
.btn-icon[b-90w170atpz] { display: inline-flex; align-items: center; justify-content: center; width: 36px; height: 36px; background: none; border: var(--border-width-thin) solid transparent; cursor: pointer; color: var(--text-muted); text-decoration: none; transition: all var(--transition-fast) var(--transition-ease); }
.btn-icon:hover[b-90w170atpz] { color: var(--color-primary); background-color: var(--color-gray-100); border-color: var(--border-color-light); text-decoration: none; }
.btn-outline-primary[b-90w170atpz] { background: transparent; color: var(--color-primary); border: var(--border-width-thin) solid var(--color-primary); }
.btn-outline-primary:hover[b-90w170atpz] { background-color: var(--color-primary); color: var(--text-on-primary); }

@media (max-width: 768px) {
    .page-header[b-90w170atpz] { flex-direction: column; gap: var(--space-3); }
    .item-row[b-90w170atpz] { flex-wrap: wrap; }
    .item-quantities[b-90w170atpz] { width: 100%; justify-content: flex-end; }
}
/* /Components/Pages/Orders/DeliveryOrderByCustomerItemMeatList.razor.rz.scp.css */
/* ===========================
   DeliveryOrderByCustomerItemMeatList - Scoped Styles
   Flat Industrial Minimal
   =========================== */

.page-container[b-0jr77t38h3] { max-width: 1200px; margin: 0 auto; padding: var(--space-6) var(--space-4); }
.page-header[b-0jr77t38h3] { display: flex; justify-content: space-between; align-items: flex-start; margin-bottom: var(--space-6); gap: var(--space-4); }
.page-header-left[b-0jr77t38h3] { flex: 1; }
.page-header-right[b-0jr77t38h3] { flex-shrink: 0; display: flex; align-items: center; }
.page-title[b-0jr77t38h3] { font-size: var(--font-size-2xl); font-weight: var(--font-weight-bold); color: var(--color-primary); display: flex; align-items: center; gap: var(--space-2); margin: 0; }
.page-title svg[b-0jr77t38h3] { color: var(--color-primary); flex-shrink: 0; }
.page-subtitle[b-0jr77t38h3] { color: var(--text-muted); font-size: var(--font-size-sm); margin: var(--space-1) 0 0 0; }
.btn-back[b-0jr77t38h3] { display: inline-flex; align-items: center; gap: var(--space-2); padding: var(--space-2) var(--space-3); font-size: var(--font-size-sm); font-weight: var(--font-weight-medium); color: var(--color-primary); background: transparent; border: var(--border-width-thin) solid var(--border-color-light); cursor: pointer; text-decoration: none; transition: all var(--transition-fast) var(--transition-ease); }
.btn-back:hover[b-0jr77t38h3] { background-color: var(--color-gray-100); border-color: var(--color-primary); text-decoration: none; }
.alert-bar-danger[b-0jr77t38h3] { display: flex; align-items: center; gap: var(--space-2); padding: var(--space-3) var(--space-4); margin-bottom: var(--space-4); font-size: var(--font-size-sm); font-weight: var(--font-weight-medium); border-left: var(--border-width-thick) solid var(--color-danger); background-color: #fdeded; color: #5f2120; }
.alert-bar-close[b-0jr77t38h3] { margin-left: auto; background: none; border: none; font-size: var(--font-size-lg); cursor: pointer; color: inherit; opacity: 0.6; line-height: 1; }
.alert-bar-close:hover[b-0jr77t38h3] { opacity: 1; }
.search-bar[b-0jr77t38h3] { display: flex; align-items: center; gap: var(--space-4); margin-bottom: var(--space-4); padding: var(--space-3) var(--space-4); background-color: var(--bg-secondary); border: var(--border-width-thin) solid var(--border-color-light); }
.search-input-wrapper[b-0jr77t38h3] { display: flex; align-items: center; flex: 1; position: relative; }
.search-icon[b-0jr77t38h3] { color: var(--text-muted); flex-shrink: 0; margin-right: var(--space-2); }
.search-input[b-0jr77t38h3] { flex: 1; border: none; background: transparent; font-size: var(--font-size-sm); color: var(--color-gray-700); outline: none; padding: var(--space-1) 0; }
.search-input[b-0jr77t38h3]::placeholder { color: var(--text-muted); }
.search-clear[b-0jr77t38h3] { background: none; border: none; cursor: pointer; color: var(--text-muted); padding: var(--space-1); display: flex; align-items: center; }
.search-clear:hover[b-0jr77t38h3] { color: var(--color-primary); }
.search-count[b-0jr77t38h3] { flex-shrink: 0; font-size: var(--font-size-xs); color: var(--text-muted); font-weight: var(--font-weight-medium); text-transform: uppercase; letter-spacing: 0.5px; }
.loading-state[b-0jr77t38h3], .empty-state[b-0jr77t38h3] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: var(--space-16) 0; color: var(--text-muted); gap: var(--space-3); }
.empty-state svg[b-0jr77t38h3] { opacity: 0.4; }
.empty-state-text[b-0jr77t38h3] { font-size: var(--font-size-base); margin: 0; }
.item-list[b-0jr77t38h3] { display: flex; flex-direction: column; border: var(--border-width-thin) solid var(--border-color-light); }
.item-row[b-0jr77t38h3] { display: flex; align-items: center; gap: var(--space-4); padding: var(--space-4); border-bottom: var(--border-width-thin) solid var(--border-color-light); transition: background-color var(--transition-fast) var(--transition-ease); }
.item-row:hover[b-0jr77t38h3] { background-color: rgba(11, 36, 62, 0.03); }
.item-avatar[b-0jr77t38h3] { flex-shrink: 0; width: 40px; height: 40px; display: flex; align-items: center; justify-content: center; background-color: var(--color-gray-100); color: var(--color-primary); }
.item-info[b-0jr77t38h3] { flex: 1; min-width: 0; }
.item-name[b-0jr77t38h3] { font-size: var(--font-size-sm); font-weight: var(--font-weight-bold); color: var(--color-primary); font-family: var(--font-mono); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.item-description[b-0jr77t38h3] { font-size: var(--font-size-sm); font-weight: var(--font-weight-medium); color: var(--color-gray-700); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; margin-top: 1px; }
.item-meta[b-0jr77t38h3] { display: flex; align-items: center; gap: var(--space-1); flex-wrap: wrap; font-size: var(--font-size-xs); color: var(--text-secondary); margin-top: 2px; }
.meta-separator[b-0jr77t38h3] { color: var(--color-gray-300); }
.badge-um[b-0jr77t38h3] { display: inline-flex; align-items: center; padding: 1px 6px; font-size: 10px; font-weight: var(--font-weight-bold); font-family: var(--font-mono); text-transform: uppercase; letter-spacing: 0.5px; background-color: var(--color-gray-100); color: var(--color-primary); border: var(--border-width-thin) solid var(--border-color-light); }
.item-price[b-0jr77t38h3] { flex-shrink: 0; display: flex; flex-direction: column; align-items: flex-end; min-width: 80px; }
.price-value[b-0jr77t38h3] { font-size: var(--font-size-sm); font-weight: var(--font-weight-bold); font-family: var(--font-mono); color: var(--color-primary); }
.price-currency[b-0jr77t38h3] { font-size: var(--font-size-xs); color: var(--text-muted); font-weight: var(--font-weight-medium); }
.item-quantities[b-0jr77t38h3] { flex-shrink: 0; display: flex; gap: var(--space-4); align-items: center; }
.quantity-group[b-0jr77t38h3] { display: flex; flex-direction: column; align-items: flex-end; min-width: 90px; }
.quantity-label[b-0jr77t38h3] { font-size: var(--font-size-xs); color: var(--text-muted); text-transform: uppercase; letter-spacing: 0.5px; font-weight: var(--font-weight-medium); }
.quantity-value[b-0jr77t38h3] { font-size: var(--font-size-sm); font-weight: var(--font-weight-semibold); color: var(--color-primary); font-family: var(--font-mono); }
.item-gauge[b-0jr77t38h3] { flex-shrink: 0; display: flex; flex-direction: column; align-items: center; gap: 2px; }
.gauge-ring[b-0jr77t38h3] { position: relative; width: 48px; height: 48px; }
.gauge-ring svg[b-0jr77t38h3] { width: 100%; height: 100%; transform: rotate(-90deg); }
.gauge-bg[b-0jr77t38h3] { fill: none; stroke: var(--color-gray-100); stroke-width: 3; }
.gauge-fill[b-0jr77t38h3] { fill: none; stroke-width: 3; stroke-linecap: round; transition: stroke-dasharray 0.4s ease; }
.gauge-complete .gauge-fill[b-0jr77t38h3] { stroke: var(--color-success); }
.gauge-partial .gauge-fill[b-0jr77t38h3] { stroke: #e6a817; }
.gauge-low .gauge-fill[b-0jr77t38h3] { stroke: var(--color-danger); }
.gauge-text[b-0jr77t38h3] { position: absolute; inset: 0; display: flex; align-items: center; justify-content: center; font-size: 11px; font-weight: var(--font-weight-bold); font-family: var(--font-mono); color: var(--color-primary); }
.gauge-label[b-0jr77t38h3] { font-size: 10px; color: var(--text-muted); text-transform: uppercase; letter-spacing: 0.5px; font-weight: var(--font-weight-medium); }
.actions-separator[b-0jr77t38h3] { width: 1px; height: 32px; background-color: var(--border-color-light); flex-shrink: 0; }
.item-actions[b-0jr77t38h3] { flex-shrink: 0; display: flex; align-items: center; gap: var(--space-1); }
.btn-icon[b-0jr77t38h3] { display: inline-flex; align-items: center; justify-content: center; width: 36px; height: 36px; background: none; border: var(--border-width-thin) solid transparent; cursor: pointer; color: var(--text-muted); text-decoration: none; transition: all var(--transition-fast) var(--transition-ease); }
.btn-icon:hover[b-0jr77t38h3] { color: var(--color-primary); background-color: var(--color-gray-100); border-color: var(--border-color-light); text-decoration: none; }

/* Traceability */
.traceability-row[b-0jr77t38h3] { padding: var(--space-3) var(--space-4) var(--space-3) calc(40px + var(--space-4) + var(--space-4)); background-color: var(--color-gray-50, #f8f9fa); border-bottom: var(--border-width-thin) solid var(--border-color-light); }
.traceability-grid[b-0jr77t38h3] { display: grid; grid-template-columns: repeat(auto-fill, minmax(160px, 1fr)); gap: var(--space-2) var(--space-4); }
.trace-field[b-0jr77t38h3] { display: flex; flex-direction: column; gap: 1px; }
.trace-label[b-0jr77t38h3] { font-size: 10px; color: var(--text-muted); text-transform: uppercase; letter-spacing: 0.5px; font-weight: var(--font-weight-medium); }
.trace-value[b-0jr77t38h3] { font-size: var(--font-size-xs); font-weight: var(--font-weight-semibold); color: var(--color-primary); font-family: var(--font-mono); }

.btn-outline-primary[b-0jr77t38h3] { background: transparent; color: var(--color-primary); border: var(--border-width-thin) solid var(--color-primary); }
.btn-outline-primary:hover[b-0jr77t38h3] { background-color: var(--color-primary); color: var(--text-on-primary); }

@media (max-width: 768px) {
    .page-header[b-0jr77t38h3] { flex-direction: column; gap: var(--space-3); }
    .item-row[b-0jr77t38h3] { flex-wrap: wrap; }
    .item-quantities[b-0jr77t38h3] { width: 100%; justify-content: flex-end; }
    .traceability-grid[b-0jr77t38h3] { grid-template-columns: repeat(2, 1fr); }
}
/* /Components/Pages/Orders/DeliveryOrderByCustomerList.razor.rz.scp.css */
/* ===========================
   DeliveryOrderByCustomerList - Scoped Styles
   Flat Industrial Minimal
   =========================== */

/* Page Container */
.page-container[b-1ldwz6725m] {
    max-width: 1200px;
    margin: 0 auto;
    padding: var(--space-6) var(--space-4);
}

/* Header */
.page-header[b-1ldwz6725m] {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    margin-bottom: var(--space-6);
    gap: var(--space-4);
}

.page-header-left[b-1ldwz6725m] {
    flex: 1;
}

.page-header-right[b-1ldwz6725m] {
    flex-shrink: 0;
    display: flex;
    align-items: center;
}

.page-title[b-1ldwz6725m] {
    font-size: var(--font-size-2xl);
    font-weight: var(--font-weight-bold);
    color: var(--color-primary);
    display: flex;
    align-items: center;
    gap: var(--space-2);
    margin: 0;
}

.page-title svg[b-1ldwz6725m] {
    color: var(--color-primary);
    flex-shrink: 0;
}

.page-subtitle[b-1ldwz6725m] {
    color: var(--text-muted);
    font-size: var(--font-size-sm);
    margin: var(--space-1) 0 0 0;
}

/* Back Button */
.btn-back[b-1ldwz6725m] {
    display: inline-flex;
    align-items: center;
    gap: var(--space-2);
    padding: var(--space-2) var(--space-3);
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-medium);
    color: var(--color-primary);
    background: transparent;
    border: var(--border-width-thin) solid var(--border-color-light);
    cursor: pointer;
    text-decoration: none;
    transition: all var(--transition-fast) var(--transition-ease);
}

.btn-back:hover[b-1ldwz6725m] {
    background-color: var(--color-gray-100);
    border-color: var(--color-primary);
    text-decoration: none;
}

/* Alert Bars */
.alert-bar[b-1ldwz6725m] {
    display: flex;
    align-items: center;
    gap: var(--space-2);
    padding: var(--space-3) var(--space-4);
    margin-bottom: var(--space-4);
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-medium);
    border-left: var(--border-width-thick) solid;
}

.alert-bar-danger[b-1ldwz6725m] {
    background-color: #fdeded;
    border-left-color: var(--color-danger);
    color: #5f2120;
}

.alert-bar-close[b-1ldwz6725m] {
    margin-left: auto;
    background: none;
    border: none;
    font-size: var(--font-size-lg);
    cursor: pointer;
    color: inherit;
    opacity: 0.6;
    line-height: 1;
}

.alert-bar-close:hover[b-1ldwz6725m] {
    opacity: 1;
}

/* Search Bar */
.search-bar[b-1ldwz6725m] {
    display: flex;
    align-items: center;
    gap: var(--space-4);
    margin-bottom: var(--space-4);
    padding: var(--space-3) var(--space-4);
    background-color: var(--bg-secondary);
    border: var(--border-width-thin) solid var(--border-color-light);
}

.search-input-wrapper[b-1ldwz6725m] {
    display: flex;
    align-items: center;
    flex: 1;
    position: relative;
}

.search-icon[b-1ldwz6725m] {
    color: var(--text-muted);
    flex-shrink: 0;
    margin-right: var(--space-2);
}

.search-input[b-1ldwz6725m] {
    flex: 1;
    border: none;
    background: transparent;
    font-size: var(--font-size-sm);
    color: var(--color-gray-700);
    outline: none;
    padding: var(--space-1) 0;
}

.search-input[b-1ldwz6725m]::placeholder {
    color: var(--text-muted);
}

.search-clear[b-1ldwz6725m] {
    background: none;
    border: none;
    cursor: pointer;
    color: var(--text-muted);
    padding: var(--space-1);
    display: flex;
    align-items: center;
}

.search-clear:hover[b-1ldwz6725m] {
    color: var(--color-primary);
}

.search-count[b-1ldwz6725m] {
    flex-shrink: 0;
    font-size: var(--font-size-xs);
    color: var(--text-muted);
    font-weight: var(--font-weight-medium);
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

/* Loading / Empty States */
.loading-state[b-1ldwz6725m] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: var(--space-16) 0;
    color: var(--text-muted);
    gap: var(--space-4);
}

.empty-state[b-1ldwz6725m] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: var(--space-16) 0;
    color: var(--text-muted);
    gap: var(--space-3);
}

.empty-state svg[b-1ldwz6725m] {
    opacity: 0.4;
}

.empty-state-text[b-1ldwz6725m] {
    font-size: var(--font-size-base);
    margin: 0;
}

/* Item List */
.item-list[b-1ldwz6725m] {
    display: flex;
    flex-direction: column;
    border: var(--border-width-thin) solid var(--border-color-light);
}

/* Customer Group */
.customer-group[b-1ldwz6725m] {
    margin-bottom: var(--space-6);
}

.customer-group:last-child[b-1ldwz6725m] {
    margin-bottom: 0;
}

.customer-group-header[b-1ldwz6725m] {
    display: flex;
    align-items: center;
    gap: var(--space-2);
    padding: var(--space-3) var(--space-4);
    background-color: var(--color-primary);
    color: var(--text-on-primary);
    font-weight: var(--font-weight-semibold);
    font-size: var(--font-size-sm);
}

.customer-group-header svg[b-1ldwz6725m] {
    flex-shrink: 0;
    opacity: 0.8;
}

.customer-group-name[b-1ldwz6725m] {
    font-weight: var(--font-weight-bold);
}

.customer-group-code[b-1ldwz6725m] {
    font-family: var(--font-mono);
    font-weight: var(--font-weight-medium);
    opacity: 0.7;
    font-size: var(--font-size-xs);
}

.customer-group-count[b-1ldwz6725m] {
    margin-left: auto;
    font-size: var(--font-size-xs);
    font-weight: var(--font-weight-medium);
    opacity: 0.8;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

/* Item Row */
.item-row[b-1ldwz6725m] {
    display: flex;
    align-items: center;
    gap: var(--space-4);
    padding: var(--space-4);
    border-bottom: var(--border-width-thin) solid var(--border-color-light);
    transition: background-color var(--transition-fast) var(--transition-ease);
}

.item-row:last-child[b-1ldwz6725m] {
    border-bottom: none;
}

.item-row:hover[b-1ldwz6725m] {
    background-color: rgba(11, 36, 62, 0.03);
}

/* Avatar */
.item-avatar[b-1ldwz6725m] {
    flex-shrink: 0;
    width: 40px;
    height: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: var(--color-gray-100);
    color: var(--color-primary);
}

/* Item Info */
.item-info[b-1ldwz6725m] {
    flex: 1;
    min-width: 0;
}

.item-name[b-1ldwz6725m] {
    font-size: var(--font-size-base);
    font-weight: var(--font-weight-semibold);
    color: var(--color-primary);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.item-meta[b-1ldwz6725m] {
    display: flex;
    align-items: center;
    gap: var(--space-1);
    flex-wrap: wrap;
    font-size: var(--font-size-xs);
    color: var(--text-secondary);
    margin-top: 2px;
}

.meta-separator[b-1ldwz6725m] {
    color: var(--color-gray-300);
}

.delivery-state[b-1ldwz6725m] {
    font-weight: var(--font-weight-medium);
}

/* Flags */
.item-flags[b-1ldwz6725m] {
    flex-shrink: 0;
    display: flex;
    align-items: center;
    gap: var(--space-1);
}

.flag[b-1ldwz6725m] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 24px;
    height: 24px;
}

.flag-success[b-1ldwz6725m] {
    color: var(--color-success);
}

.flag-info[b-1ldwz6725m] {
    color: var(--color-info, #2563eb);
}

.flag-muted[b-1ldwz6725m] {
    color: var(--text-muted);
}

/* Gauge */
.item-gauge[b-1ldwz6725m] {
    flex-shrink: 0;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 2px;
}

.gauge-ring[b-1ldwz6725m] {
    position: relative;
    width: 48px;
    height: 48px;
}

.gauge-ring svg[b-1ldwz6725m] {
    width: 100%;
    height: 100%;
    transform: rotate(-90deg);
}

.gauge-bg[b-1ldwz6725m] {
    fill: none;
    stroke: var(--color-gray-100);
    stroke-width: 3;
}

.gauge-fill[b-1ldwz6725m] {
    fill: none;
    stroke-width: 3;
    stroke-linecap: round;
    transition: stroke-dasharray 0.4s ease;
}

.gauge-complete .gauge-fill[b-1ldwz6725m] {
    stroke: var(--color-success);
}

.gauge-partial .gauge-fill[b-1ldwz6725m] {
    stroke: #e6a817;
}

.gauge-low .gauge-fill[b-1ldwz6725m] {
    stroke: var(--color-danger);
}

.gauge-text[b-1ldwz6725m] {
    position: absolute;
    inset: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 11px;
    font-weight: var(--font-weight-bold);
    font-family: var(--font-mono);
    color: var(--color-primary);
}

.gauge-label[b-1ldwz6725m] {
    font-size: 10px;
    color: var(--text-muted);
    text-transform: uppercase;
    letter-spacing: 0.5px;
    font-weight: var(--font-weight-medium);
}

/* Quantities */
.item-quantities[b-1ldwz6725m] {
    flex-shrink: 0;
    display: flex;
    gap: var(--space-4);
    align-items: center;
}

.quantity-group[b-1ldwz6725m] {
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    min-width: 90px;
}

.quantity-label[b-1ldwz6725m] {
    font-size: var(--font-size-xs);
    color: var(--text-muted);
    text-transform: uppercase;
    letter-spacing: 0.5px;
    font-weight: var(--font-weight-medium);
}

.quantity-value[b-1ldwz6725m] {
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-semibold);
    color: var(--color-primary);
    font-family: var(--font-mono);
}

/* Actions Separator */
.actions-separator[b-1ldwz6725m] {
    width: 1px;
    height: 32px;
    background-color: var(--border-color-light);
    flex-shrink: 0;
}

/* Action Buttons */
.item-actions[b-1ldwz6725m] {
    flex-shrink: 0;
    display: flex;
    align-items: center;
    gap: var(--space-1);
}

.btn-icon[b-1ldwz6725m] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 36px;
    background: none;
    border: var(--border-width-thin) solid transparent;
    cursor: pointer;
    color: var(--text-muted);
    text-decoration: none;
    transition: all var(--transition-fast) var(--transition-ease);
}

.btn-icon:hover[b-1ldwz6725m] {
    color: var(--color-primary);
    background-color: var(--color-gray-100);
    border-color: var(--border-color-light);
    text-decoration: none;
}

/* Outline Primary Button */
.btn-outline-primary[b-1ldwz6725m] {
    background: transparent;
    color: var(--color-primary);
    border: var(--border-width-thin) solid var(--color-primary);
}

.btn-outline-primary:hover[b-1ldwz6725m] {
    background-color: var(--color-primary);
    color: var(--text-on-primary);
}

/* Responsive */
@media (max-width: 768px) {
    .page-header[b-1ldwz6725m] {
        flex-direction: column;
        gap: var(--space-3);
    }

    .item-row[b-1ldwz6725m] {
        flex-wrap: wrap;
    }

    .item-flags[b-1ldwz6725m] {
        order: -1;
    }

    .item-quantities[b-1ldwz6725m] {
        width: 100%;
        justify-content: flex-end;
    }

    .item-gauge[b-1ldwz6725m] {
        width: 100%;
        flex-direction: row;
        justify-content: center;
        gap: var(--space-2);
    }

    .actions-separator[b-1ldwz6725m] {
        display: none;
    }

    .item-actions[b-1ldwz6725m] {
        margin-left: auto;
    }

    .quantity-group[b-1ldwz6725m] {
        min-width: 70px;
    }
}
/* /Components/Pages/Orders/DeliveryOrderByItemCustomerList.razor.rz.scp.css */
/* ===========================
   DeliveryOrderByItemCustomerList - Scoped Styles
   Flat Industrial Minimal
   =========================== */

/* Page Container */
.page-container[b-14epa4msdv] {
    max-width: 1200px;
    margin: 0 auto;
    padding: var(--space-6) var(--space-4);
}

/* Header */
.page-header[b-14epa4msdv] {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    margin-bottom: var(--space-6);
    gap: var(--space-4);
}

.page-header-left[b-14epa4msdv] {
    flex: 1;
}

.page-header-right[b-14epa4msdv] {
    flex-shrink: 0;
    display: flex;
    align-items: center;
}

.page-title[b-14epa4msdv] {
    font-size: var(--font-size-2xl);
    font-weight: var(--font-weight-bold);
    color: var(--color-primary);
    display: flex;
    align-items: center;
    gap: var(--space-2);
    margin: 0;
}

.page-title svg[b-14epa4msdv] {
    color: var(--color-primary);
    flex-shrink: 0;
}

.page-subtitle[b-14epa4msdv] {
    color: var(--text-muted);
    font-size: var(--font-size-sm);
    margin: var(--space-1) 0 0 0;
}

.btn-back[b-14epa4msdv] {
    display: inline-flex;
    align-items: center;
    gap: var(--space-2);
    padding: var(--space-2) var(--space-3);
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-medium);
    color: var(--color-primary);
    background: transparent;
    border: var(--border-width-thin) solid var(--border-color-light);
    cursor: pointer;
    text-decoration: none;
    transition: all var(--transition-fast) var(--transition-ease);
}

.btn-back:hover[b-14epa4msdv] {
    background-color: var(--color-gray-100);
    border-color: var(--color-primary);
    text-decoration: none;
}

/* Alert */
.alert-bar-danger[b-14epa4msdv] {
    display: flex;
    align-items: center;
    gap: var(--space-2);
    padding: var(--space-3) var(--space-4);
    margin-bottom: var(--space-4);
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-medium);
    border-left: var(--border-width-thick) solid var(--color-danger);
    background-color: #fdeded;
    color: #5f2120;
}

.alert-bar-close[b-14epa4msdv] {
    margin-left: auto;
    background: none;
    border: none;
    font-size: var(--font-size-lg);
    cursor: pointer;
    color: inherit;
    opacity: 0.6;
    line-height: 1;
}

.alert-bar-close:hover[b-14epa4msdv] {
    opacity: 1;
}

/* Search Bar */
.search-bar[b-14epa4msdv] {
    display: flex;
    align-items: center;
    gap: var(--space-4);
    margin-bottom: var(--space-4);
    padding: var(--space-3) var(--space-4);
    background-color: var(--bg-secondary);
    border: var(--border-width-thin) solid var(--border-color-light);
}

.search-input-wrapper[b-14epa4msdv] {
    display: flex;
    align-items: center;
    flex: 1;
    position: relative;
}

.search-icon[b-14epa4msdv] {
    color: var(--text-muted);
    flex-shrink: 0;
    margin-right: var(--space-2);
}

.search-input[b-14epa4msdv] {
    flex: 1;
    border: none;
    background: transparent;
    font-size: var(--font-size-sm);
    color: var(--color-gray-700);
    outline: none;
    padding: var(--space-1) 0;
}

.search-input[b-14epa4msdv]::placeholder {
    color: var(--text-muted);
}

.search-clear[b-14epa4msdv] {
    background: none;
    border: none;
    cursor: pointer;
    color: var(--text-muted);
    padding: var(--space-1);
    display: flex;
    align-items: center;
}

.search-clear:hover[b-14epa4msdv] {
    color: var(--color-primary);
}

.search-count[b-14epa4msdv] {
    flex-shrink: 0;
    font-size: var(--font-size-xs);
    color: var(--text-muted);
    font-weight: var(--font-weight-medium);
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

/* Loading / Empty */
.loading-state[b-14epa4msdv],
.empty-state[b-14epa4msdv] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: var(--space-16) 0;
    color: var(--text-muted);
    gap: var(--space-3);
}

.empty-state svg[b-14epa4msdv] {
    opacity: 0.4;
}

.empty-state-text[b-14epa4msdv] {
    font-size: var(--font-size-base);
    margin: 0;
}

/* Item List */
.item-list[b-14epa4msdv] {
    display: flex;
    flex-direction: column;
    border: var(--border-width-thin) solid var(--border-color-light);
}

/* Item Row */
.item-row[b-14epa4msdv] {
    display: flex;
    align-items: center;
    gap: var(--space-4);
    padding: var(--space-4);
    border-bottom: var(--border-width-thin) solid var(--border-color-light);
    transition: background-color var(--transition-fast) var(--transition-ease);
}

.item-row:hover[b-14epa4msdv] {
    background-color: rgba(11, 36, 62, 0.03);
}

.item-avatar[b-14epa4msdv] {
    flex-shrink: 0;
    width: 40px;
    height: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: var(--color-gray-100);
    color: var(--color-primary);
}

.item-info[b-14epa4msdv] {
    flex: 1;
    min-width: 0;
}

.item-name[b-14epa4msdv] {
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-bold);
    color: var(--color-primary);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.item-description[b-14epa4msdv] {
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-medium);
    color: var(--color-gray-700);
    font-family: var(--font-mono);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    margin-top: 1px;
}

.item-meta[b-14epa4msdv] {
    display: flex;
    align-items: center;
    gap: var(--space-1);
    flex-wrap: wrap;
    font-size: var(--font-size-xs);
    color: var(--text-secondary);
    margin-top: 2px;
}

.meta-separator[b-14epa4msdv] {
    color: var(--color-gray-300);
}

.badge-doc[b-14epa4msdv] {
    display: inline-flex;
    align-items: center;
    padding: 1px 6px;
    font-size: 10px;
    font-weight: var(--font-weight-bold);
    font-family: var(--font-mono);
    text-transform: uppercase;
    letter-spacing: 0.5px;
    background-color: var(--color-gray-100);
    color: var(--color-primary);
    border: var(--border-width-thin) solid var(--border-color-light);
}

.badge-state[b-14epa4msdv] {
    display: inline-flex;
    align-items: center;
    padding: 1px 6px;
    font-size: 10px;
    font-weight: var(--font-weight-bold);
    text-transform: uppercase;
    letter-spacing: 0.5px;
    background-color: var(--color-gray-100);
    color: var(--text-muted);
    border: var(--border-width-thin) solid var(--border-color-light);
}

/* Quantities */
.item-quantities[b-14epa4msdv] {
    flex-shrink: 0;
    display: flex;
    gap: var(--space-4);
    align-items: center;
}

.quantity-group[b-14epa4msdv] {
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    min-width: 90px;
}

.quantity-label[b-14epa4msdv] {
    font-size: var(--font-size-xs);
    color: var(--text-muted);
    text-transform: uppercase;
    letter-spacing: 0.5px;
    font-weight: var(--font-weight-medium);
}

.quantity-value[b-14epa4msdv] {
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-semibold);
    color: var(--color-primary);
    font-family: var(--font-mono);
}

/* Gauge */
.item-gauge[b-14epa4msdv] {
    flex-shrink: 0;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 2px;
}

.gauge-ring[b-14epa4msdv] {
    position: relative;
    width: 48px;
    height: 48px;
}

.gauge-ring svg[b-14epa4msdv] {
    width: 100%;
    height: 100%;
    transform: rotate(-90deg);
}

.gauge-bg[b-14epa4msdv] {
    fill: none;
    stroke: var(--color-gray-100);
    stroke-width: 3;
}

.gauge-fill[b-14epa4msdv] {
    fill: none;
    stroke-width: 3;
    stroke-linecap: round;
    transition: stroke-dasharray 0.4s ease;
}

.gauge-complete .gauge-fill[b-14epa4msdv] {
    stroke: var(--color-success);
}

.gauge-partial .gauge-fill[b-14epa4msdv] {
    stroke: #e6a817;
}

.gauge-low .gauge-fill[b-14epa4msdv] {
    stroke: var(--color-danger);
}

.gauge-text[b-14epa4msdv] {
    position: absolute;
    inset: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 11px;
    font-weight: var(--font-weight-bold);
    font-family: var(--font-mono);
    color: var(--color-primary);
}

.gauge-label[b-14epa4msdv] {
    font-size: 10px;
    color: var(--text-muted);
    text-transform: uppercase;
    letter-spacing: 0.5px;
    font-weight: var(--font-weight-medium);
}

/* Actions Separator */
.actions-separator[b-14epa4msdv] {
    width: 1px;
    height: 32px;
    background-color: var(--border-color-light);
    flex-shrink: 0;
}

/* Action Buttons */
.item-actions[b-14epa4msdv] {
    flex-shrink: 0;
    display: flex;
    align-items: center;
    gap: var(--space-1);
}

.btn-icon[b-14epa4msdv] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 36px;
    background: none;
    border: var(--border-width-thin) solid transparent;
    cursor: pointer;
    color: var(--text-muted);
    text-decoration: none;
    transition: all var(--transition-fast) var(--transition-ease);
}

.btn-icon:hover[b-14epa4msdv] {
    color: var(--color-primary);
    background-color: var(--color-gray-100);
    border-color: var(--border-color-light);
    text-decoration: none;
}

/* Outline Primary Button */
.btn-outline-primary[b-14epa4msdv] {
    background: transparent;
    color: var(--color-primary);
    border: var(--border-width-thin) solid var(--color-primary);
}

.btn-outline-primary:hover[b-14epa4msdv] {
    background-color: var(--color-primary);
    color: var(--text-on-primary);
}

/* Responsive */
@media (max-width: 768px) {
    .page-header[b-14epa4msdv] {
        flex-direction: column;
        gap: var(--space-3);
    }

    .item-row[b-14epa4msdv] {
        flex-wrap: wrap;
    }

    .item-quantities[b-14epa4msdv] {
        width: 100%;
        justify-content: flex-end;
    }

    .item-gauge[b-14epa4msdv] {
        width: 100%;
        flex-direction: row;
        justify-content: center;
        gap: var(--space-2);
    }

    .quantity-group[b-14epa4msdv] {
        min-width: 70px;
    }
}
/* /Components/Pages/Orders/DeliveryOrderByItemFishList.razor.rz.scp.css */
/* ===========================
   DeliveryOrderByItemFishList - Scoped Styles
   Flat Industrial Minimal
   =========================== */

.page-container[b-lhorh0btgx] { max-width: 1200px; margin: 0 auto; padding: var(--space-6) var(--space-4); }
.page-header[b-lhorh0btgx] { display: flex; justify-content: space-between; align-items: flex-start; margin-bottom: var(--space-6); gap: var(--space-4); }
.page-header-left[b-lhorh0btgx] { flex: 1; }
.page-header-right[b-lhorh0btgx] { flex-shrink: 0; display: flex; align-items: center; }
.page-title[b-lhorh0btgx] { font-size: var(--font-size-2xl); font-weight: var(--font-weight-bold); color: var(--color-primary); display: flex; align-items: center; gap: var(--space-2); margin: 0; }
.page-title svg[b-lhorh0btgx] { color: var(--color-primary); flex-shrink: 0; }
.page-subtitle[b-lhorh0btgx] { color: var(--text-muted); font-size: var(--font-size-sm); margin: var(--space-1) 0 0 0; }
.btn-back[b-lhorh0btgx] { display: inline-flex; align-items: center; gap: var(--space-2); padding: var(--space-2) var(--space-3); font-size: var(--font-size-sm); font-weight: var(--font-weight-medium); color: var(--color-primary); background: transparent; border: var(--border-width-thin) solid var(--border-color-light); cursor: pointer; text-decoration: none; transition: all var(--transition-fast) var(--transition-ease); }
.btn-back:hover[b-lhorh0btgx] { background-color: var(--color-gray-100); border-color: var(--color-primary); text-decoration: none; }
.alert-bar-danger[b-lhorh0btgx] { display: flex; align-items: center; gap: var(--space-2); padding: var(--space-3) var(--space-4); margin-bottom: var(--space-4); font-size: var(--font-size-sm); font-weight: var(--font-weight-medium); border-left: var(--border-width-thick) solid var(--color-danger); background-color: #fdeded; color: #5f2120; }
.alert-bar-close[b-lhorh0btgx] { margin-left: auto; background: none; border: none; font-size: var(--font-size-lg); cursor: pointer; color: inherit; opacity: 0.6; line-height: 1; }
.alert-bar-close:hover[b-lhorh0btgx] { opacity: 1; }
.search-bar[b-lhorh0btgx] { display: flex; align-items: center; gap: var(--space-4); margin-bottom: var(--space-4); padding: var(--space-3) var(--space-4); background-color: var(--bg-secondary); border: var(--border-width-thin) solid var(--border-color-light); }
.search-input-wrapper[b-lhorh0btgx] { display: flex; align-items: center; flex: 1; position: relative; }
.search-icon[b-lhorh0btgx] { color: var(--text-muted); flex-shrink: 0; margin-right: var(--space-2); }
.search-input[b-lhorh0btgx] { flex: 1; border: none; background: transparent; font-size: var(--font-size-sm); color: var(--color-gray-700); outline: none; padding: var(--space-1) 0; }
.search-input[b-lhorh0btgx]::placeholder { color: var(--text-muted); }
.search-clear[b-lhorh0btgx] { background: none; border: none; cursor: pointer; color: var(--text-muted); padding: var(--space-1); display: flex; align-items: center; }
.search-clear:hover[b-lhorh0btgx] { color: var(--color-primary); }
.search-count[b-lhorh0btgx] { flex-shrink: 0; font-size: var(--font-size-xs); color: var(--text-muted); font-weight: var(--font-weight-medium); text-transform: uppercase; letter-spacing: 0.5px; }
.loading-state[b-lhorh0btgx], .empty-state[b-lhorh0btgx] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: var(--space-16) 0; color: var(--text-muted); gap: var(--space-3); }
.empty-state svg[b-lhorh0btgx] { opacity: 0.4; }
.empty-state-text[b-lhorh0btgx] { font-size: var(--font-size-base); margin: 0; }
.item-list[b-lhorh0btgx] { display: flex; flex-direction: column; border: var(--border-width-thin) solid var(--border-color-light); }
.item-row[b-lhorh0btgx] { display: flex; align-items: center; gap: var(--space-4); padding: var(--space-4); border-bottom: var(--border-width-thin) solid var(--border-color-light); transition: background-color var(--transition-fast) var(--transition-ease); }
.item-row:hover[b-lhorh0btgx] { background-color: rgba(11, 36, 62, 0.03); }
.item-avatar[b-lhorh0btgx] { flex-shrink: 0; width: 40px; height: 40px; display: flex; align-items: center; justify-content: center; background-color: var(--color-gray-100); color: var(--color-primary); }
.item-info[b-lhorh0btgx] { flex: 1; min-width: 0; }
.item-name[b-lhorh0btgx] { font-size: var(--font-size-sm); font-weight: var(--font-weight-bold); color: var(--color-primary); font-family: var(--font-mono); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.item-description[b-lhorh0btgx] { font-size: var(--font-size-sm); font-weight: var(--font-weight-medium); color: var(--color-gray-700); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; margin-top: 1px; }
.item-meta[b-lhorh0btgx] { display: flex; align-items: center; gap: var(--space-1); flex-wrap: wrap; font-size: var(--font-size-xs); color: var(--text-secondary); margin-top: 2px; }
.meta-separator[b-lhorh0btgx] { color: var(--color-gray-300); }
.badge-um[b-lhorh0btgx] { display: inline-flex; align-items: center; padding: 1px 6px; font-size: 10px; font-weight: var(--font-weight-bold); font-family: var(--font-mono); text-transform: uppercase; letter-spacing: 0.5px; background-color: var(--color-gray-100); color: var(--color-primary); border: var(--border-width-thin) solid var(--border-color-light); }
.badge-traceable[b-lhorh0btgx] { display: inline-flex; align-items: center; padding: 1px 6px; font-size: 10px; font-weight: var(--font-weight-bold); text-transform: uppercase; letter-spacing: 0.5px; background-color: #e8f5e9; color: #2e7d32; border: var(--border-width-thin) solid #c8e6c9; }
.item-price[b-lhorh0btgx] { flex-shrink: 0; display: flex; flex-direction: column; align-items: flex-end; min-width: 80px; }
.price-value[b-lhorh0btgx] { font-size: var(--font-size-sm); font-weight: var(--font-weight-bold); font-family: var(--font-mono); color: var(--color-primary); }
.price-currency[b-lhorh0btgx] { font-size: var(--font-size-xs); color: var(--text-muted); font-weight: var(--font-weight-medium); }
.item-quantities[b-lhorh0btgx] { flex-shrink: 0; display: flex; gap: var(--space-4); align-items: center; }
.quantity-group[b-lhorh0btgx] { display: flex; flex-direction: column; align-items: flex-end; min-width: 90px; }
.quantity-label[b-lhorh0btgx] { font-size: var(--font-size-xs); color: var(--text-muted); text-transform: uppercase; letter-spacing: 0.5px; font-weight: var(--font-weight-medium); }
.quantity-value[b-lhorh0btgx] { font-size: var(--font-size-sm); font-weight: var(--font-weight-semibold); color: var(--color-primary); font-family: var(--font-mono); }
.item-gauge[b-lhorh0btgx] { flex-shrink: 0; display: flex; flex-direction: column; align-items: center; gap: 2px; }
.gauge-ring[b-lhorh0btgx] { position: relative; width: 48px; height: 48px; }
.gauge-ring svg[b-lhorh0btgx] { width: 100%; height: 100%; transform: rotate(-90deg); }
.gauge-bg[b-lhorh0btgx] { fill: none; stroke: var(--color-gray-100); stroke-width: 3; }
.gauge-fill[b-lhorh0btgx] { fill: none; stroke-width: 3; stroke-linecap: round; transition: stroke-dasharray 0.4s ease; }
.gauge-complete .gauge-fill[b-lhorh0btgx] { stroke: var(--color-success); }
.gauge-partial .gauge-fill[b-lhorh0btgx] { stroke: #e6a817; }
.gauge-low .gauge-fill[b-lhorh0btgx] { stroke: var(--color-danger); }
.gauge-text[b-lhorh0btgx] { position: absolute; inset: 0; display: flex; align-items: center; justify-content: center; font-size: 11px; font-weight: var(--font-weight-bold); font-family: var(--font-mono); color: var(--color-primary); }
.gauge-label[b-lhorh0btgx] { font-size: 10px; color: var(--text-muted); text-transform: uppercase; letter-spacing: 0.5px; font-weight: var(--font-weight-medium); }

/* Traceability */
.traceability-row[b-lhorh0btgx] { padding: var(--space-3) var(--space-4) var(--space-3) calc(40px + var(--space-4) + var(--space-4)); background-color: var(--color-gray-50, #f8f9fa); border-bottom: var(--border-width-thin) solid var(--border-color-light); }
.traceability-grid[b-lhorh0btgx] { display: grid; grid-template-columns: repeat(auto-fill, minmax(160px, 1fr)); gap: var(--space-2) var(--space-4); }
.trace-field[b-lhorh0btgx] { display: flex; flex-direction: column; gap: 1px; }
.trace-label[b-lhorh0btgx] { font-size: 10px; color: var(--text-muted); text-transform: uppercase; letter-spacing: 0.5px; font-weight: var(--font-weight-medium); }
.trace-value[b-lhorh0btgx] { font-size: var(--font-size-xs); font-weight: var(--font-weight-semibold); color: var(--color-primary); font-family: var(--font-mono); }
.trace-value-scientific[b-lhorh0btgx] { font-style: italic; }

/* Actions */
.actions-separator[b-lhorh0btgx] { width: 1px; height: 32px; background-color: var(--border-color-light); flex-shrink: 0; }
.item-actions[b-lhorh0btgx] { flex-shrink: 0; display: flex; align-items: center; gap: var(--space-1); }
.btn-icon[b-lhorh0btgx] { display: inline-flex; align-items: center; justify-content: center; width: 36px; height: 36px; background: none; border: var(--border-width-thin) solid transparent; cursor: pointer; color: var(--text-muted); text-decoration: none; transition: all var(--transition-fast) var(--transition-ease); }
.btn-icon:hover[b-lhorh0btgx] { color: var(--color-primary); background-color: var(--color-gray-100); border-color: var(--border-color-light); text-decoration: none; }

.btn-outline-primary[b-lhorh0btgx] { background: transparent; color: var(--color-primary); border: var(--border-width-thin) solid var(--color-primary); }
.btn-outline-primary:hover[b-lhorh0btgx] { background-color: var(--color-primary); color: var(--text-on-primary); }

@media (max-width: 768px) {
    .page-header[b-lhorh0btgx] { flex-direction: column; gap: var(--space-3); }
    .item-row[b-lhorh0btgx] { flex-wrap: wrap; }
    .item-quantities[b-lhorh0btgx] { width: 100%; justify-content: flex-end; }
    .actions-separator[b-lhorh0btgx] { display: none; }
    .item-actions[b-lhorh0btgx] { margin-left: auto; }
    .traceability-grid[b-lhorh0btgx] { grid-template-columns: repeat(2, 1fr); }
}
/* /Components/Pages/Orders/DeliveryOrderByItemFruitList.razor.rz.scp.css */
/* ===========================
   DeliveryOrderByItemFruitList - Scoped Styles
   Flat Industrial Minimal
   =========================== */

.page-container[b-fxtsa44ixm] { max-width: 1200px; margin: 0 auto; padding: var(--space-6) var(--space-4); }
.page-header[b-fxtsa44ixm] { display: flex; justify-content: space-between; align-items: flex-start; margin-bottom: var(--space-6); gap: var(--space-4); }
.page-header-left[b-fxtsa44ixm] { flex: 1; }
.page-header-right[b-fxtsa44ixm] { flex-shrink: 0; display: flex; align-items: center; }
.page-title[b-fxtsa44ixm] { font-size: var(--font-size-2xl); font-weight: var(--font-weight-bold); color: var(--color-primary); display: flex; align-items: center; gap: var(--space-2); margin: 0; }
.page-title svg[b-fxtsa44ixm] { color: var(--color-primary); flex-shrink: 0; }
.page-subtitle[b-fxtsa44ixm] { color: var(--text-muted); font-size: var(--font-size-sm); margin: var(--space-1) 0 0 0; }
.btn-back[b-fxtsa44ixm] { display: inline-flex; align-items: center; gap: var(--space-2); padding: var(--space-2) var(--space-3); font-size: var(--font-size-sm); font-weight: var(--font-weight-medium); color: var(--color-primary); background: transparent; border: var(--border-width-thin) solid var(--border-color-light); cursor: pointer; text-decoration: none; transition: all var(--transition-fast) var(--transition-ease); }
.btn-back:hover[b-fxtsa44ixm] { background-color: var(--color-gray-100); border-color: var(--color-primary); text-decoration: none; }
.alert-bar-danger[b-fxtsa44ixm] { display: flex; align-items: center; gap: var(--space-2); padding: var(--space-3) var(--space-4); margin-bottom: var(--space-4); font-size: var(--font-size-sm); font-weight: var(--font-weight-medium); border-left: var(--border-width-thick) solid var(--color-danger); background-color: #fdeded; color: #5f2120; }
.alert-bar-close[b-fxtsa44ixm] { margin-left: auto; background: none; border: none; font-size: var(--font-size-lg); cursor: pointer; color: inherit; opacity: 0.6; line-height: 1; }
.alert-bar-close:hover[b-fxtsa44ixm] { opacity: 1; }
.search-bar[b-fxtsa44ixm] { display: flex; align-items: center; gap: var(--space-4); margin-bottom: var(--space-4); padding: var(--space-3) var(--space-4); background-color: var(--bg-secondary); border: var(--border-width-thin) solid var(--border-color-light); }
.search-input-wrapper[b-fxtsa44ixm] { display: flex; align-items: center; flex: 1; position: relative; }
.search-icon[b-fxtsa44ixm] { color: var(--text-muted); flex-shrink: 0; margin-right: var(--space-2); }
.search-input[b-fxtsa44ixm] { flex: 1; border: none; background: transparent; font-size: var(--font-size-sm); color: var(--color-gray-700); outline: none; padding: var(--space-1) 0; }
.search-input[b-fxtsa44ixm]::placeholder { color: var(--text-muted); }
.search-clear[b-fxtsa44ixm] { background: none; border: none; cursor: pointer; color: var(--text-muted); padding: var(--space-1); display: flex; align-items: center; }
.search-clear:hover[b-fxtsa44ixm] { color: var(--color-primary); }
.search-count[b-fxtsa44ixm] { flex-shrink: 0; font-size: var(--font-size-xs); color: var(--text-muted); font-weight: var(--font-weight-medium); text-transform: uppercase; letter-spacing: 0.5px; }
.loading-state[b-fxtsa44ixm], .empty-state[b-fxtsa44ixm] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: var(--space-16) 0; color: var(--text-muted); gap: var(--space-3); }
.empty-state svg[b-fxtsa44ixm] { opacity: 0.4; }
.empty-state-text[b-fxtsa44ixm] { font-size: var(--font-size-base); margin: 0; }
.item-list[b-fxtsa44ixm] { display: flex; flex-direction: column; border: var(--border-width-thin) solid var(--border-color-light); }
.item-row[b-fxtsa44ixm] { display: flex; align-items: center; gap: var(--space-4); padding: var(--space-4); border-bottom: var(--border-width-thin) solid var(--border-color-light); transition: background-color var(--transition-fast) var(--transition-ease); }
.item-row:hover[b-fxtsa44ixm] { background-color: rgba(11, 36, 62, 0.03); }
.item-avatar[b-fxtsa44ixm] { flex-shrink: 0; width: 40px; height: 40px; display: flex; align-items: center; justify-content: center; background-color: var(--color-gray-100); color: var(--color-primary); }
.item-info[b-fxtsa44ixm] { flex: 1; min-width: 0; }
.item-name[b-fxtsa44ixm] { font-size: var(--font-size-sm); font-weight: var(--font-weight-bold); color: var(--color-primary); font-family: var(--font-mono); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.item-description[b-fxtsa44ixm] { font-size: var(--font-size-sm); font-weight: var(--font-weight-medium); color: var(--color-gray-700); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; margin-top: 1px; }
.item-meta[b-fxtsa44ixm] { display: flex; align-items: center; gap: var(--space-1); flex-wrap: wrap; font-size: var(--font-size-xs); color: var(--text-secondary); margin-top: 2px; }
.meta-separator[b-fxtsa44ixm] { color: var(--color-gray-300); }
.badge-um[b-fxtsa44ixm] { display: inline-flex; align-items: center; padding: 1px 6px; font-size: 10px; font-weight: var(--font-weight-bold); font-family: var(--font-mono); text-transform: uppercase; letter-spacing: 0.5px; background-color: var(--color-gray-100); color: var(--color-primary); border: var(--border-width-thin) solid var(--border-color-light); }
.item-price[b-fxtsa44ixm] { flex-shrink: 0; display: flex; flex-direction: column; align-items: flex-end; min-width: 80px; }
.price-value[b-fxtsa44ixm] { font-size: var(--font-size-sm); font-weight: var(--font-weight-bold); font-family: var(--font-mono); color: var(--color-primary); }
.price-currency[b-fxtsa44ixm] { font-size: var(--font-size-xs); color: var(--text-muted); font-weight: var(--font-weight-medium); }
.item-quantities[b-fxtsa44ixm] { flex-shrink: 0; display: flex; gap: var(--space-4); align-items: center; }
.quantity-group[b-fxtsa44ixm] { display: flex; flex-direction: column; align-items: flex-end; min-width: 90px; }
.quantity-label[b-fxtsa44ixm] { font-size: var(--font-size-xs); color: var(--text-muted); text-transform: uppercase; letter-spacing: 0.5px; font-weight: var(--font-weight-medium); }
.quantity-value[b-fxtsa44ixm] { font-size: var(--font-size-sm); font-weight: var(--font-weight-semibold); color: var(--color-primary); font-family: var(--font-mono); }
.item-gauge[b-fxtsa44ixm] { flex-shrink: 0; display: flex; flex-direction: column; align-items: center; gap: 2px; }
.gauge-ring[b-fxtsa44ixm] { position: relative; width: 48px; height: 48px; }
.gauge-ring svg[b-fxtsa44ixm] { width: 100%; height: 100%; transform: rotate(-90deg); }
.gauge-bg[b-fxtsa44ixm] { fill: none; stroke: var(--color-gray-100); stroke-width: 3; }
.gauge-fill[b-fxtsa44ixm] { fill: none; stroke-width: 3; stroke-linecap: round; transition: stroke-dasharray 0.4s ease; }
.gauge-complete .gauge-fill[b-fxtsa44ixm] { stroke: var(--color-success); }
.gauge-partial .gauge-fill[b-fxtsa44ixm] { stroke: #e6a817; }
.gauge-low .gauge-fill[b-fxtsa44ixm] { stroke: var(--color-danger); }
.gauge-text[b-fxtsa44ixm] { position: absolute; inset: 0; display: flex; align-items: center; justify-content: center; font-size: 11px; font-weight: var(--font-weight-bold); font-family: var(--font-mono); color: var(--color-primary); }
.gauge-label[b-fxtsa44ixm] { font-size: 10px; color: var(--text-muted); text-transform: uppercase; letter-spacing: 0.5px; font-weight: var(--font-weight-medium); }

/* Actions */
.actions-separator[b-fxtsa44ixm] { width: 1px; height: 32px; background-color: var(--border-color-light); flex-shrink: 0; }
.item-actions[b-fxtsa44ixm] { flex-shrink: 0; display: flex; align-items: center; gap: var(--space-1); }
.btn-icon[b-fxtsa44ixm] { display: inline-flex; align-items: center; justify-content: center; width: 36px; height: 36px; background: none; border: var(--border-width-thin) solid transparent; cursor: pointer; color: var(--text-muted); text-decoration: none; transition: all var(--transition-fast) var(--transition-ease); }
.btn-icon:hover[b-fxtsa44ixm] { color: var(--color-primary); background-color: var(--color-gray-100); border-color: var(--border-color-light); text-decoration: none; }

/* Traceability */
.traceability-row[b-fxtsa44ixm] { padding: var(--space-3) var(--space-4) var(--space-3) calc(40px + var(--space-4) + var(--space-4)); background-color: var(--color-gray-50, #f8f9fa); border-bottom: var(--border-width-thin) solid var(--border-color-light); }
.traceability-grid[b-fxtsa44ixm] { display: grid; grid-template-columns: repeat(auto-fill, minmax(160px, 1fr)); gap: var(--space-2) var(--space-4); }
.trace-field[b-fxtsa44ixm] { display: flex; flex-direction: column; gap: 1px; }
.trace-label[b-fxtsa44ixm] { font-size: 10px; color: var(--text-muted); text-transform: uppercase; letter-spacing: 0.5px; font-weight: var(--font-weight-medium); }
.trace-value[b-fxtsa44ixm] { font-size: var(--font-size-xs); font-weight: var(--font-weight-semibold); color: var(--color-primary); font-family: var(--font-mono); }

.btn-outline-primary[b-fxtsa44ixm] { background: transparent; color: var(--color-primary); border: var(--border-width-thin) solid var(--color-primary); }
.btn-outline-primary:hover[b-fxtsa44ixm] { background-color: var(--color-primary); color: var(--text-on-primary); }

@media (max-width: 768px) {
    .page-header[b-fxtsa44ixm] { flex-direction: column; gap: var(--space-3); }
    .item-row[b-fxtsa44ixm] { flex-wrap: wrap; }
    .item-quantities[b-fxtsa44ixm] { width: 100%; justify-content: flex-end; }
    .actions-separator[b-fxtsa44ixm] { display: none; }
    .item-actions[b-fxtsa44ixm] { margin-left: auto; }
    .traceability-grid[b-fxtsa44ixm] { grid-template-columns: repeat(2, 1fr); }
}
/* /Components/Pages/Orders/DeliveryOrderByItemGroceryList.razor.rz.scp.css */
/* ===========================
   DeliveryOrderByItemGroceryList - Scoped Styles
   Flat Industrial Minimal
   =========================== */

.page-container[b-9lbl336lj3] { max-width: 1200px; margin: 0 auto; padding: var(--space-6) var(--space-4); }
.page-header[b-9lbl336lj3] { display: flex; justify-content: space-between; align-items: flex-start; margin-bottom: var(--space-6); gap: var(--space-4); }
.page-header-left[b-9lbl336lj3] { flex: 1; }
.page-header-right[b-9lbl336lj3] { flex-shrink: 0; display: flex; align-items: center; }
.page-title[b-9lbl336lj3] { font-size: var(--font-size-2xl); font-weight: var(--font-weight-bold); color: var(--color-primary); display: flex; align-items: center; gap: var(--space-2); margin: 0; }
.page-title svg[b-9lbl336lj3] { color: var(--color-primary); flex-shrink: 0; }
.page-subtitle[b-9lbl336lj3] { color: var(--text-muted); font-size: var(--font-size-sm); margin: var(--space-1) 0 0 0; }
.btn-back[b-9lbl336lj3] { display: inline-flex; align-items: center; gap: var(--space-2); padding: var(--space-2) var(--space-3); font-size: var(--font-size-sm); font-weight: var(--font-weight-medium); color: var(--color-primary); background: transparent; border: var(--border-width-thin) solid var(--border-color-light); cursor: pointer; text-decoration: none; transition: all var(--transition-fast) var(--transition-ease); }
.btn-back:hover[b-9lbl336lj3] { background-color: var(--color-gray-100); border-color: var(--color-primary); text-decoration: none; }
.alert-bar-danger[b-9lbl336lj3] { display: flex; align-items: center; gap: var(--space-2); padding: var(--space-3) var(--space-4); margin-bottom: var(--space-4); font-size: var(--font-size-sm); font-weight: var(--font-weight-medium); border-left: var(--border-width-thick) solid var(--color-danger); background-color: #fdeded; color: #5f2120; }
.alert-bar-close[b-9lbl336lj3] { margin-left: auto; background: none; border: none; font-size: var(--font-size-lg); cursor: pointer; color: inherit; opacity: 0.6; line-height: 1; }
.alert-bar-close:hover[b-9lbl336lj3] { opacity: 1; }
.search-bar[b-9lbl336lj3] { display: flex; align-items: center; gap: var(--space-4); margin-bottom: var(--space-4); padding: var(--space-3) var(--space-4); background-color: var(--bg-secondary); border: var(--border-width-thin) solid var(--border-color-light); }
.search-input-wrapper[b-9lbl336lj3] { display: flex; align-items: center; flex: 1; position: relative; }
.search-icon[b-9lbl336lj3] { color: var(--text-muted); flex-shrink: 0; margin-right: var(--space-2); }
.search-input[b-9lbl336lj3] { flex: 1; border: none; background: transparent; font-size: var(--font-size-sm); color: var(--color-gray-700); outline: none; padding: var(--space-1) 0; }
.search-input[b-9lbl336lj3]::placeholder { color: var(--text-muted); }
.search-clear[b-9lbl336lj3] { background: none; border: none; cursor: pointer; color: var(--text-muted); padding: var(--space-1); display: flex; align-items: center; }
.search-clear:hover[b-9lbl336lj3] { color: var(--color-primary); }
.search-count[b-9lbl336lj3] { flex-shrink: 0; font-size: var(--font-size-xs); color: var(--text-muted); font-weight: var(--font-weight-medium); text-transform: uppercase; letter-spacing: 0.5px; }
.loading-state[b-9lbl336lj3], .empty-state[b-9lbl336lj3] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: var(--space-16) 0; color: var(--text-muted); gap: var(--space-3); }
.empty-state svg[b-9lbl336lj3] { opacity: 0.4; }
.empty-state-text[b-9lbl336lj3] { font-size: var(--font-size-base); margin: 0; }
.item-list[b-9lbl336lj3] { display: flex; flex-direction: column; border: var(--border-width-thin) solid var(--border-color-light); }
.item-row[b-9lbl336lj3] { display: flex; align-items: center; gap: var(--space-4); padding: var(--space-4); border-bottom: var(--border-width-thin) solid var(--border-color-light); transition: background-color var(--transition-fast) var(--transition-ease); }
.item-row:last-child[b-9lbl336lj3] { border-bottom: none; }
.item-row:hover[b-9lbl336lj3] { background-color: rgba(11, 36, 62, 0.03); }
.item-avatar[b-9lbl336lj3] { flex-shrink: 0; width: 40px; height: 40px; display: flex; align-items: center; justify-content: center; background-color: var(--color-gray-100); color: var(--color-primary); }
.item-info[b-9lbl336lj3] { flex: 1; min-width: 0; }
.item-name[b-9lbl336lj3] { font-size: var(--font-size-sm); font-weight: var(--font-weight-bold); color: var(--color-primary); font-family: var(--font-mono); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.item-description[b-9lbl336lj3] { font-size: var(--font-size-sm); font-weight: var(--font-weight-medium); color: var(--color-gray-700); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; margin-top: 1px; }
.item-meta[b-9lbl336lj3] { display: flex; align-items: center; gap: var(--space-1); flex-wrap: wrap; font-size: var(--font-size-xs); color: var(--text-secondary); margin-top: 2px; }
.meta-separator[b-9lbl336lj3] { color: var(--color-gray-300); }
.badge-um[b-9lbl336lj3] { display: inline-flex; align-items: center; padding: 1px 6px; font-size: 10px; font-weight: var(--font-weight-bold); font-family: var(--font-mono); text-transform: uppercase; letter-spacing: 0.5px; background-color: var(--color-gray-100); color: var(--color-primary); border: var(--border-width-thin) solid var(--border-color-light); }

/* Grocery-specific: traceable badge & origin inline */
.badge-traceable[b-9lbl336lj3] { display: inline-flex; align-items: center; padding: 1px 6px; font-size: 10px; font-weight: var(--font-weight-bold); text-transform: uppercase; letter-spacing: 0.5px; background-color: #e8f5e9; color: #2e7d32; border: var(--border-width-thin) solid #c8e6c9; }
.trace-inline[b-9lbl336lj3] { font-weight: var(--font-weight-semibold); color: var(--color-primary); }

.item-price[b-9lbl336lj3] { flex-shrink: 0; display: flex; flex-direction: column; align-items: flex-end; min-width: 80px; }
.price-value[b-9lbl336lj3] { font-size: var(--font-size-sm); font-weight: var(--font-weight-bold); font-family: var(--font-mono); color: var(--color-primary); }
.price-currency[b-9lbl336lj3] { font-size: var(--font-size-xs); color: var(--text-muted); font-weight: var(--font-weight-medium); }
.item-quantities[b-9lbl336lj3] { flex-shrink: 0; display: flex; gap: var(--space-4); align-items: center; }
.quantity-group[b-9lbl336lj3] { display: flex; flex-direction: column; align-items: flex-end; min-width: 90px; }
.quantity-label[b-9lbl336lj3] { font-size: var(--font-size-xs); color: var(--text-muted); text-transform: uppercase; letter-spacing: 0.5px; font-weight: var(--font-weight-medium); }
.quantity-value[b-9lbl336lj3] { font-size: var(--font-size-sm); font-weight: var(--font-weight-semibold); color: var(--color-primary); font-family: var(--font-mono); }
.item-gauge[b-9lbl336lj3] { flex-shrink: 0; display: flex; flex-direction: column; align-items: center; gap: 2px; }
.gauge-ring[b-9lbl336lj3] { position: relative; width: 48px; height: 48px; }
.gauge-ring svg[b-9lbl336lj3] { width: 100%; height: 100%; transform: rotate(-90deg); }
.gauge-bg[b-9lbl336lj3] { fill: none; stroke: var(--color-gray-100); stroke-width: 3; }
.gauge-fill[b-9lbl336lj3] { fill: none; stroke-width: 3; stroke-linecap: round; transition: stroke-dasharray 0.4s ease; }
.gauge-complete .gauge-fill[b-9lbl336lj3] { stroke: var(--color-success); }
.gauge-partial .gauge-fill[b-9lbl336lj3] { stroke: #e6a817; }
.gauge-low .gauge-fill[b-9lbl336lj3] { stroke: var(--color-danger); }
.gauge-text[b-9lbl336lj3] { position: absolute; inset: 0; display: flex; align-items: center; justify-content: center; font-size: 11px; font-weight: var(--font-weight-bold); font-family: var(--font-mono); color: var(--color-primary); }
.gauge-label[b-9lbl336lj3] { font-size: 10px; color: var(--text-muted); text-transform: uppercase; letter-spacing: 0.5px; font-weight: var(--font-weight-medium); }

/* Actions */
.actions-separator[b-9lbl336lj3] { width: 1px; height: 32px; background-color: var(--border-color-light); flex-shrink: 0; }
.item-actions[b-9lbl336lj3] { flex-shrink: 0; display: flex; align-items: center; gap: var(--space-1); }
.btn-icon[b-9lbl336lj3] { display: inline-flex; align-items: center; justify-content: center; width: 36px; height: 36px; background: none; border: var(--border-width-thin) solid transparent; cursor: pointer; color: var(--text-muted); text-decoration: none; transition: all var(--transition-fast) var(--transition-ease); }
.btn-icon:hover[b-9lbl336lj3] { color: var(--color-primary); background-color: var(--color-gray-100); border-color: var(--border-color-light); text-decoration: none; }

.btn-outline-primary[b-9lbl336lj3] { background: transparent; color: var(--color-primary); border: var(--border-width-thin) solid var(--color-primary); }
.btn-outline-primary:hover[b-9lbl336lj3] { background-color: var(--color-primary); color: var(--text-on-primary); }

@media (max-width: 768px) {
    .page-header[b-9lbl336lj3] { flex-direction: column; gap: var(--space-3); }
    .item-row[b-9lbl336lj3] { flex-wrap: wrap; }
    .item-quantities[b-9lbl336lj3] { width: 100%; justify-content: flex-end; }
    .actions-separator[b-9lbl336lj3] { display: none; }
    .item-actions[b-9lbl336lj3] { margin-left: auto; }
}
/* /Components/Pages/Orders/DeliveryOrderByItemMeatList.razor.rz.scp.css */
/* ===========================
   DeliveryOrderByItemMeatList - Scoped Styles
   Flat Industrial Minimal
   =========================== */

/* Page Container */
.page-container[b-nxh10irmb7] {
    max-width: 1200px;
    margin: 0 auto;
    padding: var(--space-6) var(--space-4);
}

/* Header */
.page-header[b-nxh10irmb7] {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    margin-bottom: var(--space-6);
    gap: var(--space-4);
}

.page-header-left[b-nxh10irmb7] {
    flex: 1;
}

.page-header-right[b-nxh10irmb7] {
    flex-shrink: 0;
    display: flex;
    align-items: center;
}

.page-title[b-nxh10irmb7] {
    font-size: var(--font-size-2xl);
    font-weight: var(--font-weight-bold);
    color: var(--color-primary);
    display: flex;
    align-items: center;
    gap: var(--space-2);
    margin: 0;
}

.page-title svg[b-nxh10irmb7] {
    color: var(--color-primary);
    flex-shrink: 0;
}

.page-subtitle[b-nxh10irmb7] {
    color: var(--text-muted);
    font-size: var(--font-size-sm);
    margin: var(--space-1) 0 0 0;
}

.btn-back[b-nxh10irmb7] {
    display: inline-flex;
    align-items: center;
    gap: var(--space-2);
    padding: var(--space-2) var(--space-3);
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-medium);
    color: var(--color-primary);
    background: transparent;
    border: var(--border-width-thin) solid var(--border-color-light);
    cursor: pointer;
    text-decoration: none;
    transition: all var(--transition-fast) var(--transition-ease);
}

.btn-back:hover[b-nxh10irmb7] {
    background-color: var(--color-gray-100);
    border-color: var(--color-primary);
    text-decoration: none;
}

/* Alert */
.alert-bar-danger[b-nxh10irmb7] {
    display: flex;
    align-items: center;
    gap: var(--space-2);
    padding: var(--space-3) var(--space-4);
    margin-bottom: var(--space-4);
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-medium);
    border-left: var(--border-width-thick) solid var(--color-danger);
    background-color: #fdeded;
    color: #5f2120;
}

.alert-bar-close[b-nxh10irmb7] {
    margin-left: auto;
    background: none;
    border: none;
    font-size: var(--font-size-lg);
    cursor: pointer;
    color: inherit;
    opacity: 0.6;
    line-height: 1;
}

.alert-bar-close:hover[b-nxh10irmb7] {
    opacity: 1;
}

/* Search Bar */
.search-bar[b-nxh10irmb7] {
    display: flex;
    align-items: center;
    gap: var(--space-4);
    margin-bottom: var(--space-4);
    padding: var(--space-3) var(--space-4);
    background-color: var(--bg-secondary);
    border: var(--border-width-thin) solid var(--border-color-light);
}

.search-input-wrapper[b-nxh10irmb7] {
    display: flex;
    align-items: center;
    flex: 1;
    position: relative;
}

.search-icon[b-nxh10irmb7] {
    color: var(--text-muted);
    flex-shrink: 0;
    margin-right: var(--space-2);
}

.search-input[b-nxh10irmb7] {
    flex: 1;
    border: none;
    background: transparent;
    font-size: var(--font-size-sm);
    color: var(--color-gray-700);
    outline: none;
    padding: var(--space-1) 0;
}

.search-input[b-nxh10irmb7]::placeholder {
    color: var(--text-muted);
}

.search-clear[b-nxh10irmb7] {
    background: none;
    border: none;
    cursor: pointer;
    color: var(--text-muted);
    padding: var(--space-1);
    display: flex;
    align-items: center;
}

.search-clear:hover[b-nxh10irmb7] {
    color: var(--color-primary);
}

.search-count[b-nxh10irmb7] {
    flex-shrink: 0;
    font-size: var(--font-size-xs);
    color: var(--text-muted);
    font-weight: var(--font-weight-medium);
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

/* Loading / Empty */
.loading-state[b-nxh10irmb7],
.empty-state[b-nxh10irmb7] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: var(--space-16) 0;
    color: var(--text-muted);
    gap: var(--space-3);
}

.empty-state svg[b-nxh10irmb7] {
    opacity: 0.4;
}

.empty-state-text[b-nxh10irmb7] {
    font-size: var(--font-size-base);
    margin: 0;
}

/* Item List */
.item-list[b-nxh10irmb7] {
    display: flex;
    flex-direction: column;
    border: var(--border-width-thin) solid var(--border-color-light);
}

/* Item Row */
.item-row[b-nxh10irmb7] {
    display: flex;
    align-items: center;
    gap: var(--space-4);
    padding: var(--space-4);
    border-bottom: var(--border-width-thin) solid var(--border-color-light);
    transition: background-color var(--transition-fast) var(--transition-ease);
}

.item-row:hover[b-nxh10irmb7] {
    background-color: rgba(11, 36, 62, 0.03);
}

.item-avatar[b-nxh10irmb7] {
    flex-shrink: 0;
    width: 40px;
    height: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: var(--color-gray-100);
    color: var(--color-primary);
}

.item-info[b-nxh10irmb7] {
    flex: 1;
    min-width: 0;
}

.item-name[b-nxh10irmb7] {
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-bold);
    color: var(--color-primary);
    font-family: var(--font-mono);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.item-description[b-nxh10irmb7] {
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-medium);
    color: var(--color-gray-700);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    margin-top: 1px;
}

.item-meta[b-nxh10irmb7] {
    display: flex;
    align-items: center;
    gap: var(--space-1);
    flex-wrap: wrap;
    font-size: var(--font-size-xs);
    color: var(--text-secondary);
    margin-top: 2px;
}

.meta-separator[b-nxh10irmb7] {
    color: var(--color-gray-300);
}

.badge-um[b-nxh10irmb7] {
    display: inline-flex;
    align-items: center;
    padding: 1px 6px;
    font-size: 10px;
    font-weight: var(--font-weight-bold);
    font-family: var(--font-mono);
    text-transform: uppercase;
    letter-spacing: 0.5px;
    background-color: var(--color-gray-100);
    color: var(--color-primary);
    border: var(--border-width-thin) solid var(--border-color-light);
}

/* Price */
.item-price[b-nxh10irmb7] {
    flex-shrink: 0;
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    min-width: 80px;
}

.price-value[b-nxh10irmb7] {
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-bold);
    font-family: var(--font-mono);
    color: var(--color-primary);
}

.price-currency[b-nxh10irmb7] {
    font-size: var(--font-size-xs);
    color: var(--text-muted);
    font-weight: var(--font-weight-medium);
}

/* Quantities */
.item-quantities[b-nxh10irmb7] {
    flex-shrink: 0;
    display: flex;
    gap: var(--space-4);
    align-items: center;
}

.quantity-group[b-nxh10irmb7] {
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    min-width: 90px;
}

.quantity-label[b-nxh10irmb7] {
    font-size: var(--font-size-xs);
    color: var(--text-muted);
    text-transform: uppercase;
    letter-spacing: 0.5px;
    font-weight: var(--font-weight-medium);
}

.quantity-value[b-nxh10irmb7] {
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-semibold);
    color: var(--color-primary);
    font-family: var(--font-mono);
}

/* Gauge */
.item-gauge[b-nxh10irmb7] {
    flex-shrink: 0;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 2px;
}

.gauge-ring[b-nxh10irmb7] {
    position: relative;
    width: 48px;
    height: 48px;
}

.gauge-ring svg[b-nxh10irmb7] {
    width: 100%;
    height: 100%;
    transform: rotate(-90deg);
}

.gauge-bg[b-nxh10irmb7] {
    fill: none;
    stroke: var(--color-gray-100);
    stroke-width: 3;
}

.gauge-fill[b-nxh10irmb7] {
    fill: none;
    stroke-width: 3;
    stroke-linecap: round;
    transition: stroke-dasharray 0.4s ease;
}

.gauge-complete .gauge-fill[b-nxh10irmb7] {
    stroke: var(--color-success);
}

.gauge-partial .gauge-fill[b-nxh10irmb7] {
    stroke: #e6a817;
}

.gauge-low .gauge-fill[b-nxh10irmb7] {
    stroke: var(--color-danger);
}

.gauge-text[b-nxh10irmb7] {
    position: absolute;
    inset: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 11px;
    font-weight: var(--font-weight-bold);
    font-family: var(--font-mono);
    color: var(--color-primary);
}

.gauge-label[b-nxh10irmb7] {
    font-size: 10px;
    color: var(--text-muted);
    text-transform: uppercase;
    letter-spacing: 0.5px;
    font-weight: var(--font-weight-medium);
}

/* === Traceability Section === */
.traceability-row[b-nxh10irmb7] {
    padding: var(--space-3) var(--space-4) var(--space-3) calc(40px + var(--space-4) + var(--space-4));
    background-color: var(--color-gray-50, #f8f9fa);
    border-bottom: var(--border-width-thin) solid var(--border-color-light);
}

.traceability-grid[b-nxh10irmb7] {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(160px, 1fr));
    gap: var(--space-2) var(--space-4);
}

.trace-field[b-nxh10irmb7] {
    display: flex;
    flex-direction: column;
    gap: 1px;
}

.trace-label[b-nxh10irmb7] {
    font-size: 10px;
    color: var(--text-muted);
    text-transform: uppercase;
    letter-spacing: 0.5px;
    font-weight: var(--font-weight-medium);
}

.trace-value[b-nxh10irmb7] {
    font-size: var(--font-size-xs);
    font-weight: var(--font-weight-semibold);
    color: var(--color-primary);
    font-family: var(--font-mono);
}

/* Actions Separator */
.actions-separator[b-nxh10irmb7] {
    width: 1px;
    height: 32px;
    background-color: var(--border-color-light);
    flex-shrink: 0;
}

/* Action Buttons */
.item-actions[b-nxh10irmb7] {
    flex-shrink: 0;
    display: flex;
    align-items: center;
    gap: var(--space-1);
}

.btn-icon[b-nxh10irmb7] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 36px;
    background: none;
    border: var(--border-width-thin) solid transparent;
    cursor: pointer;
    color: var(--text-muted);
    text-decoration: none;
    transition: all var(--transition-fast) var(--transition-ease);
}

.btn-icon:hover[b-nxh10irmb7] {
    color: var(--color-primary);
    background-color: var(--color-gray-100);
    border-color: var(--border-color-light);
    text-decoration: none;
}

/* Outline Primary Button */
.btn-outline-primary[b-nxh10irmb7] {
    background: transparent;
    color: var(--color-primary);
    border: var(--border-width-thin) solid var(--color-primary);
}

.btn-outline-primary:hover[b-nxh10irmb7] {
    background-color: var(--color-primary);
    color: var(--text-on-primary);
}

/* Responsive */
@media (max-width: 768px) {
    .page-header[b-nxh10irmb7] {
        flex-direction: column;
        gap: var(--space-3);
    }

    .item-row[b-nxh10irmb7] {
        flex-wrap: wrap;
    }

    .item-quantities[b-nxh10irmb7] {
        width: 100%;
        justify-content: flex-end;
    }

    .actions-separator[b-nxh10irmb7] {
        display: none;
    }

    .item-actions[b-nxh10irmb7] {
        margin-left: auto;
    }

    .traceability-grid[b-nxh10irmb7] {
        grid-template-columns: repeat(2, 1fr);
    }
}
/* /Components/Pages/Orders/DeliveryOrderList.razor.rz.scp.css */
/* ===========================
   DeliveryOrderList - Scoped Styles
   Flat Industrial Minimal
   =========================== */

/* Page Container */
.page-container[b-7q7sje2tba] {
    max-width: 1200px;
    margin: 0 auto;
    padding: var(--space-6) var(--space-4);
}

/* Header */
.page-header[b-7q7sje2tba] {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    margin-bottom: var(--space-6);
    gap: var(--space-4);
}

.page-header-left[b-7q7sje2tba] {
    flex: 1;
}

.page-title[b-7q7sje2tba] {
    font-size: var(--font-size-2xl);
    font-weight: var(--font-weight-bold);
    color: var(--color-primary);
    display: flex;
    align-items: center;
    gap: var(--space-2);
    margin: 0;
}

.page-title svg[b-7q7sje2tba] {
    color: var(--color-primary);
    flex-shrink: 0;
}

.page-subtitle[b-7q7sje2tba] {
    color: var(--text-muted);
    font-size: var(--font-size-sm);
    margin: var(--space-1) 0 0 0;
}

/* Alert Bars */
.alert-bar[b-7q7sje2tba] {
    display: flex;
    align-items: center;
    gap: var(--space-2);
    padding: var(--space-3) var(--space-4);
    margin-bottom: var(--space-4);
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-medium);
    border-left: var(--border-width-thick) solid;
}

.alert-bar-danger[b-7q7sje2tba] {
    background-color: #fdeded;
    border-left-color: var(--color-danger);
    color: #5f2120;
}

.alert-bar-close[b-7q7sje2tba] {
    margin-left: auto;
    background: none;
    border: none;
    font-size: var(--font-size-lg);
    cursor: pointer;
    color: inherit;
    opacity: 0.6;
    line-height: 1;
}

.alert-bar-close:hover[b-7q7sje2tba] {
    opacity: 1;
}

/* Search Bar */
.search-bar[b-7q7sje2tba] {
    display: flex;
    align-items: center;
    gap: var(--space-4);
    margin-bottom: var(--space-4);
    padding: var(--space-3) var(--space-4);
    background-color: var(--bg-secondary);
    border: var(--border-width-thin) solid var(--border-color-light);
}

.search-input-wrapper[b-7q7sje2tba] {
    display: flex;
    align-items: center;
    flex: 1;
    position: relative;
}

.search-icon[b-7q7sje2tba] {
    color: var(--text-muted);
    flex-shrink: 0;
    margin-right: var(--space-2);
}

.search-input[b-7q7sje2tba] {
    flex: 1;
    border: none;
    background: transparent;
    font-size: var(--font-size-sm);
    color: var(--color-gray-700);
    outline: none;
    padding: var(--space-1) 0;
}

.search-input[b-7q7sje2tba]::placeholder {
    color: var(--text-muted);
}

.search-clear[b-7q7sje2tba] {
    background: none;
    border: none;
    cursor: pointer;
    color: var(--text-muted);
    padding: var(--space-1);
    display: flex;
    align-items: center;
}

.search-clear:hover[b-7q7sje2tba] {
    color: var(--color-primary);
}

.search-count[b-7q7sje2tba] {
    flex-shrink: 0;
    font-size: var(--font-size-xs);
    color: var(--text-muted);
    font-weight: var(--font-weight-medium);
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

/* Loading / Empty States */
.loading-state[b-7q7sje2tba] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: var(--space-16) 0;
    color: var(--text-muted);
    gap: var(--space-4);
}

.empty-state[b-7q7sje2tba] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: var(--space-16) 0;
    color: var(--text-muted);
    gap: var(--space-3);
}

.empty-state svg[b-7q7sje2tba] {
    opacity: 0.4;
}

.empty-state-text[b-7q7sje2tba] {
    font-size: var(--font-size-base);
    margin: 0;
}

/* Delivery List */
.delivery-list[b-7q7sje2tba] {
    display: flex;
    flex-direction: column;
    border: var(--border-width-thin) solid var(--border-color-light);
}

/* Date Group */
.date-group[b-7q7sje2tba] {
    margin-bottom: var(--space-6);
}

.date-group:last-child[b-7q7sje2tba] {
    margin-bottom: 0;
}

.date-group-header[b-7q7sje2tba] {
    display: flex;
    align-items: center;
    gap: var(--space-2);
    padding: var(--space-3) var(--space-4);
    background-color: var(--color-primary);
    color: var(--text-on-primary);
    font-weight: var(--font-weight-semibold);
    font-size: var(--font-size-sm);
}

.date-group-header svg[b-7q7sje2tba] {
    flex-shrink: 0;
    opacity: 0.8;
}

.date-group-name[b-7q7sje2tba] {
    font-weight: var(--font-weight-bold);
    text-transform: capitalize;
}

.date-group-count[b-7q7sje2tba] {
    margin-left: auto;
    font-size: var(--font-size-xs);
    font-weight: var(--font-weight-medium);
    opacity: 0.8;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

/* Delivery Row */
.delivery-row[b-7q7sje2tba] {
    display: flex;
    align-items: center;
    gap: var(--space-4);
    padding: var(--space-4);
    border-bottom: var(--border-width-thin) solid var(--border-color-light);
    transition: background-color var(--transition-fast) var(--transition-ease);
}

.delivery-row:last-child[b-7q7sje2tba] {
    border-bottom: none;
}

.delivery-row:hover[b-7q7sje2tba] {
    background-color: rgba(11, 36, 62, 0.03);
}

/* Avatar */
.delivery-avatar[b-7q7sje2tba] {
    flex-shrink: 0;
    width: 40px;
    height: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: var(--color-gray-100);
    color: var(--color-primary);
}

/* Delivery Info */
.delivery-info[b-7q7sje2tba] {
    flex: 1;
    min-width: 0;
}

.delivery-name[b-7q7sje2tba] {
    font-size: var(--font-size-base);
    font-weight: var(--font-weight-semibold);
    color: var(--color-primary);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.delivery-meta[b-7q7sje2tba] {
    display: flex;
    align-items: center;
    gap: var(--space-1);
    flex-wrap: wrap;
    font-size: var(--font-size-xs);
    color: var(--text-secondary);
    margin-top: 2px;
}

.delivery-code[b-7q7sje2tba] {
    font-family: var(--font-mono);
    font-weight: var(--font-weight-medium);
    color: var(--color-primary);
    opacity: 0.7;
}

.meta-separator[b-7q7sje2tba] {
    color: var(--color-gray-300);
}

.delivery-details[b-7q7sje2tba] {
    display: flex;
    align-items: center;
    gap: var(--space-4);
    margin-top: var(--space-1);
}

.delivery-detail-item[b-7q7sje2tba] {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    font-size: var(--font-size-xs);
    color: var(--text-muted);
}

.delivery-detail-item svg[b-7q7sje2tba] {
    flex-shrink: 0;
}

/* Gauge */
.delivery-gauge[b-7q7sje2tba] {
    flex-shrink: 0;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 2px;
}

.gauge-ring[b-7q7sje2tba] {
    position: relative;
    width: 48px;
    height: 48px;
}

.gauge-ring svg[b-7q7sje2tba] {
    width: 100%;
    height: 100%;
    transform: rotate(-90deg);
}

.gauge-bg[b-7q7sje2tba] {
    fill: none;
    stroke: var(--color-gray-100);
    stroke-width: 3;
}

.gauge-fill[b-7q7sje2tba] {
    fill: none;
    stroke-width: 3;
    stroke-linecap: round;
    transition: stroke-dasharray 0.4s ease;
}

.gauge-complete .gauge-fill[b-7q7sje2tba] {
    stroke: var(--color-success);
}

.gauge-partial .gauge-fill[b-7q7sje2tba] {
    stroke: #e6a817;
}

.gauge-low .gauge-fill[b-7q7sje2tba] {
    stroke: var(--color-danger);
}

.gauge-text[b-7q7sje2tba] {
    position: absolute;
    inset: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 11px;
    font-weight: var(--font-weight-bold);
    font-family: var(--font-mono);
    color: var(--color-primary);
}

.gauge-label[b-7q7sje2tba] {
    font-size: 10px;
    color: var(--text-muted);
    text-transform: uppercase;
    letter-spacing: 0.5px;
    font-weight: var(--font-weight-medium);
}

/* Actions Separator */
.actions-separator[b-7q7sje2tba] {
    width: 1px;
    height: 32px;
    background-color: var(--border-color-light);
    flex-shrink: 0;
}

/* Action Buttons */
.delivery-actions[b-7q7sje2tba] {
    flex-shrink: 0;
    display: flex;
    align-items: center;
    gap: var(--space-1);
}

.btn-icon[b-7q7sje2tba] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 36px;
    background: none;
    border: var(--border-width-thin) solid transparent;
    cursor: pointer;
    color: var(--text-muted);
    text-decoration: none;
    transition: all var(--transition-fast) var(--transition-ease);
}

.btn-icon:hover[b-7q7sje2tba] {
    color: var(--color-primary);
    background-color: var(--color-gray-100);
    border-color: var(--border-color-light);
    text-decoration: none;
}

/* Outline Primary Button */
.btn-outline-primary[b-7q7sje2tba] {
    background: transparent;
    color: var(--color-primary);
    border: var(--border-width-thin) solid var(--color-primary);
}

.btn-outline-primary:hover[b-7q7sje2tba] {
    background-color: var(--color-primary);
    color: var(--text-on-primary);
}

/* Responsive */
@media (max-width: 768px) {
    .page-header[b-7q7sje2tba] {
        flex-direction: column;
        gap: var(--space-3);
    }

    .delivery-row[b-7q7sje2tba] {
        flex-wrap: wrap;
    }

    .delivery-gauge[b-7q7sje2tba] {
        order: 5;
    }

    .actions-separator[b-7q7sje2tba] {
        order: 6;
        display: none;
    }

    .delivery-actions[b-7q7sje2tba] {
        order: 7;
        margin-left: auto;
    }

    .delivery-details[b-7q7sje2tba] {
        flex-wrap: wrap;
    }
}
/* /Components/Pages/Orders/DeliveryOrderRowList.razor.rz.scp.css */
/* ===========================
   DeliveryOrderRowList - Scoped Styles
   Flat Industrial Minimal
   =========================== */

.page-container[b-usqqatvzus] { max-width: 1200px; margin: 0 auto; padding: var(--space-6) var(--space-4); }
.page-header[b-usqqatvzus] { display: flex; justify-content: space-between; align-items: flex-start; margin-bottom: var(--space-6); gap: var(--space-4); }
.page-header-left[b-usqqatvzus] { flex: 1; }
.page-header-right[b-usqqatvzus] { flex-shrink: 0; display: flex; align-items: center; }
.page-title[b-usqqatvzus] { font-size: var(--font-size-2xl); font-weight: var(--font-weight-bold); color: var(--color-primary); display: flex; align-items: center; gap: var(--space-2); margin: 0; }
.page-title svg[b-usqqatvzus] { color: var(--color-primary); flex-shrink: 0; }
.page-subtitle[b-usqqatvzus] { color: var(--text-muted); font-size: var(--font-size-sm); margin: var(--space-1) 0 0 0; }
.btn-back[b-usqqatvzus] { display: inline-flex; align-items: center; gap: var(--space-2); padding: var(--space-2) var(--space-3); font-size: var(--font-size-sm); font-weight: var(--font-weight-medium); color: var(--color-primary); background: transparent; border: var(--border-width-thin) solid var(--border-color-light); cursor: pointer; text-decoration: none; transition: all var(--transition-fast) var(--transition-ease); }
.btn-back:hover[b-usqqatvzus] { background-color: var(--color-gray-100); border-color: var(--color-primary); text-decoration: none; }
.alert-bar-danger[b-usqqatvzus] { display: flex; align-items: center; gap: var(--space-2); padding: var(--space-3) var(--space-4); margin-bottom: var(--space-4); font-size: var(--font-size-sm); font-weight: var(--font-weight-medium); border-left: var(--border-width-thick) solid var(--color-danger); background-color: #fdeded; color: #5f2120; }
.alert-bar-close[b-usqqatvzus] { margin-left: auto; background: none; border: none; font-size: var(--font-size-lg); cursor: pointer; color: inherit; opacity: 0.6; line-height: 1; }
.alert-bar-close:hover[b-usqqatvzus] { opacity: 1; }
.search-bar[b-usqqatvzus] { display: flex; align-items: center; gap: var(--space-4); margin-bottom: var(--space-4); padding: var(--space-3) var(--space-4); background-color: var(--bg-secondary); border: var(--border-width-thin) solid var(--border-color-light); }
.search-input-wrapper[b-usqqatvzus] { display: flex; align-items: center; flex: 1; position: relative; }
.search-icon[b-usqqatvzus] { color: var(--text-muted); flex-shrink: 0; margin-right: var(--space-2); }
.search-input[b-usqqatvzus] { flex: 1; border: none; background: transparent; font-size: var(--font-size-sm); color: var(--color-gray-700); outline: none; padding: var(--space-1) 0; }
.search-input[b-usqqatvzus]::placeholder { color: var(--text-muted); }
.search-clear[b-usqqatvzus] { background: none; border: none; cursor: pointer; color: var(--text-muted); padding: var(--space-1); display: flex; align-items: center; }
.search-clear:hover[b-usqqatvzus] { color: var(--color-primary); }
.search-count[b-usqqatvzus] { flex-shrink: 0; font-size: var(--font-size-xs); color: var(--text-muted); font-weight: var(--font-weight-medium); text-transform: uppercase; letter-spacing: 0.5px; }
.loading-state[b-usqqatvzus], .empty-state[b-usqqatvzus] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: var(--space-16) 0; color: var(--text-muted); gap: var(--space-3); }
.empty-state svg[b-usqqatvzus] { opacity: 0.4; }
.empty-state-text[b-usqqatvzus] { font-size: var(--font-size-base); margin: 0; }
.item-list[b-usqqatvzus] { display: flex; flex-direction: column; border: var(--border-width-thin) solid var(--border-color-light); }
.item-row[b-usqqatvzus] { display: flex; align-items: center; gap: var(--space-4); padding: var(--space-4); border-bottom: var(--border-width-thin) solid var(--border-color-light); transition: background-color var(--transition-fast) var(--transition-ease); }
.item-row:hover[b-usqqatvzus] { background-color: rgba(11, 36, 62, 0.03); }

/* Row Number */
.item-row-number[b-usqqatvzus] { flex-shrink: 0; width: 36px; height: 36px; display: flex; align-items: center; justify-content: center; background-color: var(--color-gray-100); color: var(--color-primary); font-weight: var(--font-weight-bold); font-family: var(--font-mono); font-size: var(--font-size-sm); }

/* Article Info */
.item-info[b-usqqatvzus] { flex: 1; min-width: 0; }
.item-articles[b-usqqatvzus] { display: flex; flex-direction: column; gap: 2px; }
.article-ordered[b-usqqatvzus], .article-fulfilled[b-usqqatvzus] { display: flex; align-items: baseline; gap: var(--space-2); }
.article-label[b-usqqatvzus] { font-size: 10px; color: var(--text-muted); text-transform: uppercase; letter-spacing: 0.5px; font-weight: var(--font-weight-medium); min-width: 52px; }
.article-code[b-usqqatvzus] { font-size: var(--font-size-sm); font-weight: var(--font-weight-bold); color: var(--color-primary); font-family: var(--font-mono); white-space: nowrap; }
.article-desc[b-usqqatvzus] { font-size: var(--font-size-sm); color: var(--color-gray-700); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.article-fulfilled .article-code[b-usqqatvzus] { color: var(--color-success); }
.item-meta[b-usqqatvzus] { display: flex; align-items: center; gap: var(--space-1); flex-wrap: wrap; font-size: var(--font-size-xs); color: var(--text-secondary); margin-top: 2px; }
.meta-separator[b-usqqatvzus] { color: var(--color-gray-300); }
.badge-um[b-usqqatvzus] { display: inline-flex; align-items: center; padding: 1px 6px; font-size: 10px; font-weight: var(--font-weight-bold); font-family: var(--font-mono); text-transform: uppercase; letter-spacing: 0.5px; background-color: var(--color-gray-100); color: var(--color-primary); border: var(--border-width-thin) solid var(--border-color-light); }

/* Price */
.item-price[b-usqqatvzus] { flex-shrink: 0; display: flex; flex-direction: column; align-items: flex-end; min-width: 80px; }
.price-value[b-usqqatvzus] { font-size: var(--font-size-sm); font-weight: var(--font-weight-bold); font-family: var(--font-mono); color: var(--color-primary); }
.price-label[b-usqqatvzus] { font-size: var(--font-size-xs); color: var(--text-muted); font-family: var(--font-mono); }

/* Quantities */
.item-quantities[b-usqqatvzus] { flex-shrink: 0; display: flex; gap: var(--space-4); align-items: center; }
.quantity-group[b-usqqatvzus] { display: flex; flex-direction: column; align-items: flex-end; min-width: 90px; }
.quantity-label[b-usqqatvzus] { font-size: var(--font-size-xs); color: var(--text-muted); text-transform: uppercase; letter-spacing: 0.5px; font-weight: var(--font-weight-medium); }
.quantity-value[b-usqqatvzus] { font-size: var(--font-size-sm); font-weight: var(--font-weight-semibold); color: var(--color-primary); font-family: var(--font-mono); }

/* Gauge */
.item-gauge[b-usqqatvzus] { flex-shrink: 0; display: flex; flex-direction: column; align-items: center; gap: 2px; }
.gauge-ring[b-usqqatvzus] { position: relative; width: 48px; height: 48px; }
.gauge-ring svg[b-usqqatvzus] { width: 100%; height: 100%; transform: rotate(-90deg); }
.gauge-bg[b-usqqatvzus] { fill: none; stroke: var(--color-gray-100); stroke-width: 3; }
.gauge-fill[b-usqqatvzus] { fill: none; stroke-width: 3; stroke-linecap: round; transition: stroke-dasharray 0.4s ease; }
.gauge-complete .gauge-fill[b-usqqatvzus] { stroke: var(--color-success); }
.gauge-partial .gauge-fill[b-usqqatvzus] { stroke: #e6a817; }
.gauge-low .gauge-fill[b-usqqatvzus] { stroke: var(--color-danger); }
.gauge-text[b-usqqatvzus] { position: absolute; inset: 0; display: flex; align-items: center; justify-content: center; font-size: 11px; font-weight: var(--font-weight-bold); font-family: var(--font-mono); color: var(--color-primary); }
.gauge-label[b-usqqatvzus] { font-size: 10px; color: var(--text-muted); text-transform: uppercase; letter-spacing: 0.5px; font-weight: var(--font-weight-medium); }

/* Details Row */
.details-row[b-usqqatvzus] { padding: var(--space-3) var(--space-4) var(--space-3) calc(36px + var(--space-4) + var(--space-4)); background-color: var(--color-gray-50, #f8f9fa); border-bottom: var(--border-width-thin) solid var(--border-color-light); }
.details-grid[b-usqqatvzus] { display: grid; grid-template-columns: repeat(auto-fill, minmax(140px, 1fr)); gap: var(--space-2) var(--space-4); }
.detail-field[b-usqqatvzus] { display: flex; flex-direction: column; gap: 1px; }
.detail-label[b-usqqatvzus] { font-size: 10px; color: var(--text-muted); text-transform: uppercase; letter-spacing: 0.5px; font-weight: var(--font-weight-medium); }
.detail-value[b-usqqatvzus] { font-size: var(--font-size-xs); font-weight: var(--font-weight-semibold); color: var(--color-primary); font-family: var(--font-mono); }

.btn-outline-primary[b-usqqatvzus] { background: transparent; color: var(--color-primary); border: var(--border-width-thin) solid var(--color-primary); }
.btn-outline-primary:hover[b-usqqatvzus] { background-color: var(--color-primary); color: var(--text-on-primary); }

@media (max-width: 768px) {
    .page-header[b-usqqatvzus] { flex-direction: column; gap: var(--space-3); }
    .item-row[b-usqqatvzus] { flex-wrap: wrap; }
    .item-quantities[b-usqqatvzus] { width: 100%; justify-content: flex-end; }
    .details-grid[b-usqqatvzus] { grid-template-columns: repeat(2, 1fr); }
    .article-ordered[b-usqqatvzus], .article-fulfilled[b-usqqatvzus] { flex-wrap: wrap; }
}
/* /Components/Pages/SelectTenant.razor.rz.scp.css */
/* Tenant Selection Page Container */
.tenant-selection-page[b-atpboj1dge] {
    min-height: 100vh;
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 1rem;
    position: relative;
    /* Background with gradient overlay and custom image - same as login */
    background: 
        linear-gradient(135deg, rgba(11, 36, 62, 0.85) 0%, rgba(30, 77, 123, 0.85) 100%),
        url('/images/AdobeStock_138850596.jpeg');
    background-size: cover;
    background-position: center;
    background-attachment: fixed;
}

/* Company Logo - same positioning as login */
.company-logo[b-atpboj1dge] {
    position: absolute;
    top: 2rem;
    left: 2rem;
    width: 220px;
    max-width: 30vw;
    z-index: 10;
}

.company-logo svg[b-atpboj1dge] {
    width: 100%;
    height: auto;
    filter: drop-shadow(0 2px 8px rgba(0, 0, 0, 0.3));
}

/* Tenant Card - similar to login card but wider for tenant list */
.tenant-card[b-atpboj1dge] {
    width: 100%;
    max-width: 600px;
    border: none;
    border-radius: 12px;
    overflow: hidden;
    backdrop-filter: blur(10px);
    background: rgba(255, 255, 255, 0.95);
}

.tenant-card .card-header[b-atpboj1dge] {
    background: linear-gradient(135deg, #0B243E 0%, #1e4d7b 100%) !important;
    border-bottom: none;
    padding: 1.5rem;
}

.tenant-card .card-header h4[b-atpboj1dge] {
    font-weight: 700;
    letter-spacing: 0.5px;
}

.tenant-card .card-header small[b-atpboj1dge] {
    opacity: 0.9;
    font-size: 0.875rem;
}

/* Admin Button in Header */
.tenant-card .card-header .btn[b-atpboj1dge] {
    border-radius: 6px;
    padding: 0.4rem 1rem;
    font-weight: 500;
    transition: all 0.3s ease;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
}

.tenant-card .card-header .btn:hover[b-atpboj1dge] {
    transform: translateY(-2px);
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2);
}

.tenant-card .card-header .btn svg[b-atpboj1dge] {
    vertical-align: middle;
}

/* Tenant List Items */
.list-group-item[b-atpboj1dge] {
    border-radius: 8px !important;
    border: 1px solid #dee2e6 !important;
    transition: all 0.2s ease;
}

.list-group-item-action:hover:not(.disabled)[b-atpboj1dge] {
    background-color: #f8f9fa !important;
    transform: translateX(5px);
    border-color: #0B243E !important;
}

.list-group-item h5[b-atpboj1dge] {
    color: #0B243E;
    font-weight: 600;
}

/* Badge Styling */
.badge[b-atpboj1dge] {
    border-radius: 6px;
    padding: 0.35rem 0.65rem;
    font-weight: 500;
}

/* Alert Styling - consistent with login */
.alert[b-atpboj1dge] {
    border-radius: 8px;
    border: none;
}

/* Spinner Styling */
.spinner-border[b-atpboj1dge] {
    border-width: 0.25em;
}

/* Responsive adjustments */
@media (max-width: 576px) {
    .tenant-card[b-atpboj1dge] {
        max-width: 100%;
        border-radius: 0;
    }

    .tenant-selection-page[b-atpboj1dge] {
        padding: 0;
    }

    /* Smaller logo on mobile */
    .company-logo[b-atpboj1dge] {
        top: 1rem;
        left: 1rem;
        width: 150px;
        max-width: 40vw;
    }

    .list-group-item-action:hover:not(.disabled)[b-atpboj1dge] {
        transform: none;
    }
}
/* /Components/Pages/Shipping/CarrierCreate.razor.rz.scp.css */
/* ===========================
   CarrierCreate - Scoped Styles
   Flat Industrial Minimal
   =========================== */

/* Page Container */
.page-container[b-xmztrc1kjf] {
    max-width: 1100px;
    margin: 0 auto;
    padding: var(--space-6) var(--space-4);
}

/* Header */
.page-header[b-xmztrc1kjf] {
    display: flex;
    align-items: center;
    gap: var(--space-4);
    margin-bottom: var(--space-6);
}

.btn-back[b-xmztrc1kjf] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    color: var(--text-muted);
    border: var(--border-width-thin) solid var(--border-color-light);
    text-decoration: none;
    transition: all var(--transition-fast) var(--transition-ease);
    flex-shrink: 0;
}

.btn-back:hover[b-xmztrc1kjf] {
    color: var(--color-primary);
    border-color: var(--color-primary);
    background-color: var(--color-gray-50);
    text-decoration: none;
}

.page-header-text[b-xmztrc1kjf] {
    flex: 1;
}

.page-title[b-xmztrc1kjf] {
    font-size: var(--font-size-xl);
    font-weight: var(--font-weight-bold);
    color: var(--color-primary);
    display: flex;
    align-items: center;
    gap: var(--space-2);
    margin: 0;
}

.page-title svg[b-xmztrc1kjf] {
    color: var(--color-primary);
    flex-shrink: 0;
}

.page-subtitle[b-xmztrc1kjf] {
    color: var(--text-muted);
    font-size: var(--font-size-sm);
    margin: 2px 0 0 0;
}

/* Alert Bar */
.alert-bar[b-xmztrc1kjf] {
    display: flex;
    align-items: center;
    gap: var(--space-2);
    padding: var(--space-3) var(--space-4);
    margin-bottom: var(--space-4);
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-medium);
    border-left: var(--border-width-thick) solid;
}

.alert-bar-danger[b-xmztrc1kjf] {
    background-color: #fdeded;
    border-left-color: var(--color-danger);
    color: #5f2120;
}

.alert-bar-close[b-xmztrc1kjf] {
    margin-left: auto;
    background: none;
    border: none;
    font-size: var(--font-size-lg);
    cursor: pointer;
    color: inherit;
    opacity: 0.6;
    line-height: 1;
}

.alert-bar-close:hover[b-xmztrc1kjf] {
    opacity: 1;
}

/* Form Sections */
.form-section[b-xmztrc1kjf] {
    margin-bottom: var(--space-6);
    padding: var(--space-5);
    background-color: var(--color-white);
    border: var(--border-width-thin) solid var(--border-color-light);
}

.section-title[b-xmztrc1kjf] {
    display: flex;
    align-items: center;
    gap: var(--space-2);
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-semibold);
    color: var(--color-primary);
    text-transform: uppercase;
    letter-spacing: 0.5px;
    margin: 0 0 var(--space-4) 0;
    padding-bottom: var(--space-3);
    border-bottom: var(--border-width-thin) solid var(--border-color-light);
}

.section-title svg[b-xmztrc1kjf] {
    color: var(--color-primary);
    opacity: 0.6;
    flex-shrink: 0;
}

/* Form Grid */
.form-grid[b-xmztrc1kjf] {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: var(--space-4);
}

.form-group[b-xmztrc1kjf] {
    display: flex;
    flex-direction: column;
}

.form-group-wide[b-xmztrc1kjf] {
    grid-column: span 2;
}

/* Form Controls */
.form-label[b-xmztrc1kjf] {
    font-size: var(--font-size-xs);
    font-weight: var(--font-weight-medium);
    color: var(--text-secondary);
    text-transform: uppercase;
    letter-spacing: 0.3px;
    margin-bottom: var(--space-1);
}

.form-control[b-xmztrc1kjf] {
    padding: var(--space-2) var(--space-3);
    font-size: var(--font-size-sm);
    color: var(--color-gray-700);
    border: var(--border-width-thin) solid var(--border-color-light);
    background-color: var(--color-white);
    transition: border-color var(--transition-fast) var(--transition-ease);
}

.form-control:focus[b-xmztrc1kjf] {
    border-color: var(--color-primary);
    outline: none;
    box-shadow: none;
}

.form-control[b-xmztrc1kjf]::placeholder {
    color: var(--color-gray-400);
}

.form-control-sm[b-xmztrc1kjf] {
    padding: var(--space-1) var(--space-2);
    font-size: var(--font-size-xs);
}

/* Detail Table */
.detail-table[b-xmztrc1kjf] {
    display: flex;
    flex-direction: column;
    border: var(--border-width-thin) solid var(--border-color-light);
}

.detail-header[b-xmztrc1kjf] {
    display: flex;
    gap: var(--space-2);
    padding: var(--space-2) var(--space-3);
    background-color: var(--color-gray-50);
    border-bottom: var(--border-width-thin) solid var(--border-color-light);
    font-size: var(--font-size-xs);
    font-weight: var(--font-weight-semibold);
    color: var(--text-secondary);
    text-transform: uppercase;
    letter-spacing: 0.3px;
}

.detail-row[b-xmztrc1kjf] {
    display: flex;
    gap: var(--space-2);
    padding: var(--space-2) var(--space-3);
    border-bottom: var(--border-width-thin) solid var(--border-color-light);
    align-items: center;
}

.detail-row:last-child[b-xmztrc1kjf] {
    border-bottom: none;
}

.detail-cell[b-xmztrc1kjf] {
    display: flex;
    align-items: center;
}

.detail-cell-seq[b-xmztrc1kjf] {
    width: 60px;
    flex-shrink: 0;
}

.detail-cell-sm[b-xmztrc1kjf] {
    width: 100px;
    flex-shrink: 0;
}

.detail-cell-md[b-xmztrc1kjf] {
    width: 160px;
    flex-shrink: 0;
}

.detail-cell-grow[b-xmztrc1kjf] {
    flex: 1;
    min-width: 0;
}

.detail-cell-action[b-xmztrc1kjf] {
    width: 36px;
    flex-shrink: 0;
    display: flex;
    justify-content: center;
}

.row-number[b-xmztrc1kjf] {
    font-size: var(--font-size-xs);
    font-weight: var(--font-weight-medium);
    color: var(--text-muted);
    font-family: var(--font-mono);
}

.detail-empty[b-xmztrc1kjf] {
    text-align: center;
    color: var(--text-muted);
    font-size: var(--font-size-sm);
    padding: var(--space-4) 0;
    margin: 0;
}

.btn-add-detail[b-xmztrc1kjf] {
    margin-left: auto;
    display: inline-flex;
    align-items: center;
    gap: var(--space-1);
    padding: 2px var(--space-2);
    background: none;
    border: var(--border-width-thin) solid var(--color-primary);
    color: var(--color-primary);
    font-size: var(--font-size-xs);
    font-weight: var(--font-weight-medium);
    cursor: pointer;
    text-transform: none;
    letter-spacing: normal;
    transition: all var(--transition-fast) var(--transition-ease);
}

.btn-add-detail:hover[b-xmztrc1kjf] {
    background-color: var(--color-primary);
    color: var(--text-on-primary);
}

/* Action Buttons */
.btn-icon[b-xmztrc1kjf] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 28px;
    height: 28px;
    background: none;
    border: var(--border-width-thin) solid transparent;
    cursor: pointer;
    color: var(--text-muted);
    transition: all var(--transition-fast) var(--transition-ease);
}

.btn-icon:hover[b-xmztrc1kjf] {
    color: var(--color-primary);
    background-color: var(--color-gray-100);
    border-color: var(--border-color-light);
}

.btn-icon-danger:hover[b-xmztrc1kjf] {
    color: var(--color-action);
    background-color: rgba(178, 34, 34, 0.06);
    border-color: rgba(178, 34, 34, 0.2);
}

/* Form Actions */
.form-actions[b-xmztrc1kjf] {
    display: flex;
    justify-content: flex-end;
    gap: var(--space-3);
    padding-top: var(--space-4);
    border-top: var(--border-width-thin) solid var(--border-color-light);
}

.form-actions .btn[b-xmztrc1kjf] {
    display: inline-flex;
    align-items: center;
    gap: var(--space-2);
    padding: var(--space-2) var(--space-5);
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-medium);
    cursor: pointer;
    text-decoration: none;
}

.btn-action[b-xmztrc1kjf] {
    background-color: var(--color-action);
    color: var(--text-on-action);
    border: var(--border-width-thin) solid var(--color-action);
    transition: background-color var(--transition-fast) var(--transition-ease);
}

.btn-action:hover[b-xmztrc1kjf] {
    background-color: var(--color-action-hover);
    border-color: var(--color-action-hover);
    color: var(--text-on-action);
}

.btn-action:disabled[b-xmztrc1kjf] {
    opacity: 0.65;
    cursor: not-allowed;
}

.btn-outline-primary[b-xmztrc1kjf] {
    background: transparent;
    color: var(--color-primary);
    border: var(--border-width-thin) solid var(--color-primary);
}

.btn-outline-primary:hover[b-xmztrc1kjf] {
    background-color: var(--color-primary);
    color: var(--text-on-primary);
    text-decoration: none;
}

/* Responsive */
@media (max-width: 768px) {
    .form-grid[b-xmztrc1kjf] {
        grid-template-columns: 1fr;
    }

    .form-group-wide[b-xmztrc1kjf] {
        grid-column: span 1;
    }

    .detail-header[b-xmztrc1kjf] {
        display: none;
    }

    .detail-row[b-xmztrc1kjf] {
        flex-wrap: wrap;
    }

    .detail-cell-seq[b-xmztrc1kjf],
    .detail-cell-sm[b-xmztrc1kjf],
    .detail-cell-md[b-xmztrc1kjf] {
        width: 100%;
    }
}
/* /Components/Pages/Shipping/CarrierEdit.razor.rz.scp.css */
/* ===========================
   CarrierEdit - Scoped Styles
   Flat Industrial Minimal
   =========================== */

/* Page Container */
.page-container[b-5j2mvlm7vt] {
    max-width: 1100px;
    margin: 0 auto;
    padding: var(--space-6) var(--space-4);
}

/* Header */
.page-header[b-5j2mvlm7vt] {
    display: flex;
    align-items: center;
    gap: var(--space-4);
    margin-bottom: var(--space-6);
}

.btn-back[b-5j2mvlm7vt] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    color: var(--text-muted);
    border: var(--border-width-thin) solid var(--border-color-light);
    text-decoration: none;
    transition: all var(--transition-fast) var(--transition-ease);
    flex-shrink: 0;
}

.btn-back:hover[b-5j2mvlm7vt] {
    color: var(--color-primary);
    border-color: var(--color-primary);
    background-color: var(--color-gray-50);
    text-decoration: none;
}

.page-header-text[b-5j2mvlm7vt] {
    flex: 1;
}

.page-title[b-5j2mvlm7vt] {
    font-size: var(--font-size-xl);
    font-weight: var(--font-weight-bold);
    color: var(--color-primary);
    display: flex;
    align-items: center;
    gap: var(--space-2);
    margin: 0;
}

.page-title svg[b-5j2mvlm7vt] {
    color: var(--color-primary);
    flex-shrink: 0;
}

.page-subtitle[b-5j2mvlm7vt] {
    color: var(--text-muted);
    font-size: var(--font-size-sm);
    margin: 2px 0 0 0;
    display: flex;
    align-items: center;
    gap: var(--space-2);
}

.subtitle-code[b-5j2mvlm7vt] {
    font-family: var(--font-mono);
    font-size: var(--font-size-xs);
    color: var(--color-primary);
    opacity: 0.6;
    background-color: var(--color-gray-100);
    padding: 1px 6px;
}

/* Alert Bar */
.alert-bar[b-5j2mvlm7vt] {
    display: flex;
    align-items: center;
    gap: var(--space-2);
    padding: var(--space-3) var(--space-4);
    margin-bottom: var(--space-4);
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-medium);
    border-left: var(--border-width-thick) solid;
}

.alert-bar-danger[b-5j2mvlm7vt] {
    background-color: #fdeded;
    border-left-color: var(--color-danger);
    color: #5f2120;
}

.alert-bar-close[b-5j2mvlm7vt] {
    margin-left: auto;
    background: none;
    border: none;
    font-size: var(--font-size-lg);
    cursor: pointer;
    color: inherit;
    opacity: 0.6;
    line-height: 1;
}

.alert-bar-close:hover[b-5j2mvlm7vt] {
    opacity: 1;
}

/* Loading / Empty States */
.loading-state[b-5j2mvlm7vt] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: var(--space-16) 0;
    color: var(--text-muted);
    gap: var(--space-4);
}

.empty-state[b-5j2mvlm7vt] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: var(--space-16) 0;
    color: var(--text-muted);
    gap: var(--space-3);
}

.empty-state svg[b-5j2mvlm7vt] {
    opacity: 0.4;
}

.empty-state-text[b-5j2mvlm7vt] {
    font-size: var(--font-size-base);
    margin: 0;
}

/* Form Sections */
.form-section[b-5j2mvlm7vt] {
    margin-bottom: var(--space-6);
    padding: var(--space-5);
    background-color: var(--color-white);
    border: var(--border-width-thin) solid var(--border-color-light);
}

.section-title[b-5j2mvlm7vt] {
    display: flex;
    align-items: center;
    gap: var(--space-2);
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-semibold);
    color: var(--color-primary);
    text-transform: uppercase;
    letter-spacing: 0.5px;
    margin: 0 0 var(--space-4) 0;
    padding-bottom: var(--space-3);
    border-bottom: var(--border-width-thin) solid var(--border-color-light);
}

.section-title svg[b-5j2mvlm7vt] {
    color: var(--color-primary);
    opacity: 0.6;
    flex-shrink: 0;
}

/* Form Grid */
.form-grid[b-5j2mvlm7vt] {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: var(--space-4);
}

.form-group[b-5j2mvlm7vt] {
    display: flex;
    flex-direction: column;
}

.form-group-wide[b-5j2mvlm7vt] {
    grid-column: span 2;
}

/* Form Controls */
.form-label[b-5j2mvlm7vt] {
    font-size: var(--font-size-xs);
    font-weight: var(--font-weight-medium);
    color: var(--text-secondary);
    text-transform: uppercase;
    letter-spacing: 0.3px;
    margin-bottom: var(--space-1);
}

.form-control[b-5j2mvlm7vt] {
    padding: var(--space-2) var(--space-3);
    font-size: var(--font-size-sm);
    color: var(--color-gray-700);
    border: var(--border-width-thin) solid var(--border-color-light);
    background-color: var(--color-white);
    transition: border-color var(--transition-fast) var(--transition-ease);
}

.form-control:focus[b-5j2mvlm7vt] {
    border-color: var(--color-primary);
    outline: none;
    box-shadow: none;
}

.form-control[b-5j2mvlm7vt]::placeholder {
    color: var(--color-gray-400);
}

.form-control-sm[b-5j2mvlm7vt] {
    padding: var(--space-1) var(--space-2);
    font-size: var(--font-size-xs);
}

.form-control-static[b-5j2mvlm7vt] {
    padding: var(--space-2) var(--space-3);
    font-size: var(--font-size-sm);
    color: var(--color-gray-700);
    background-color: var(--color-gray-50);
    border: var(--border-width-thin) solid var(--border-color-light);
    font-family: var(--font-mono);
    font-weight: var(--font-weight-medium);
}

/* Detail Table */
.detail-table[b-5j2mvlm7vt] {
    display: flex;
    flex-direction: column;
    border: var(--border-width-thin) solid var(--border-color-light);
}

.detail-header[b-5j2mvlm7vt] {
    display: flex;
    gap: var(--space-2);
    padding: var(--space-2) var(--space-3);
    background-color: var(--color-gray-50);
    border-bottom: var(--border-width-thin) solid var(--border-color-light);
    font-size: var(--font-size-xs);
    font-weight: var(--font-weight-semibold);
    color: var(--text-secondary);
    text-transform: uppercase;
    letter-spacing: 0.3px;
}

.detail-row[b-5j2mvlm7vt] {
    display: flex;
    gap: var(--space-2);
    padding: var(--space-2) var(--space-3);
    border-bottom: var(--border-width-thin) solid var(--border-color-light);
    align-items: center;
}

.detail-row:last-child[b-5j2mvlm7vt] {
    border-bottom: none;
}

.detail-cell[b-5j2mvlm7vt] {
    display: flex;
    align-items: center;
}

.detail-cell-seq[b-5j2mvlm7vt] {
    width: 60px;
    flex-shrink: 0;
}

.detail-cell-sm[b-5j2mvlm7vt] {
    width: 100px;
    flex-shrink: 0;
}

.detail-cell-md[b-5j2mvlm7vt] {
    width: 160px;
    flex-shrink: 0;
}

.detail-cell-grow[b-5j2mvlm7vt] {
    flex: 1;
    min-width: 0;
}

.detail-cell-action[b-5j2mvlm7vt] {
    width: 36px;
    flex-shrink: 0;
    display: flex;
    justify-content: center;
}

.row-number[b-5j2mvlm7vt] {
    font-size: var(--font-size-xs);
    font-weight: var(--font-weight-medium);
    color: var(--text-muted);
    font-family: var(--font-mono);
}

.detail-empty[b-5j2mvlm7vt] {
    text-align: center;
    color: var(--text-muted);
    font-size: var(--font-size-sm);
    padding: var(--space-4) 0;
    margin: 0;
}

.btn-add-detail[b-5j2mvlm7vt] {
    margin-left: auto;
    display: inline-flex;
    align-items: center;
    gap: var(--space-1);
    padding: 2px var(--space-2);
    background: none;
    border: var(--border-width-thin) solid var(--color-primary);
    color: var(--color-primary);
    font-size: var(--font-size-xs);
    font-weight: var(--font-weight-medium);
    cursor: pointer;
    text-transform: none;
    letter-spacing: normal;
    transition: all var(--transition-fast) var(--transition-ease);
}

.btn-add-detail:hover[b-5j2mvlm7vt] {
    background-color: var(--color-primary);
    color: var(--text-on-primary);
}

/* Action Buttons */
.btn-icon[b-5j2mvlm7vt] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 28px;
    height: 28px;
    background: none;
    border: var(--border-width-thin) solid transparent;
    cursor: pointer;
    color: var(--text-muted);
    transition: all var(--transition-fast) var(--transition-ease);
}

.btn-icon:hover[b-5j2mvlm7vt] {
    color: var(--color-primary);
    background-color: var(--color-gray-100);
    border-color: var(--border-color-light);
}

.btn-icon-danger:hover[b-5j2mvlm7vt] {
    color: var(--color-action);
    background-color: rgba(178, 34, 34, 0.06);
    border-color: rgba(178, 34, 34, 0.2);
}

/* Form Actions */
.form-actions[b-5j2mvlm7vt] {
    display: flex;
    justify-content: flex-end;
    gap: var(--space-3);
    padding-top: var(--space-4);
    border-top: var(--border-width-thin) solid var(--border-color-light);
}

.form-actions .btn[b-5j2mvlm7vt] {
    display: inline-flex;
    align-items: center;
    gap: var(--space-2);
    padding: var(--space-2) var(--space-5);
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-medium);
    cursor: pointer;
    text-decoration: none;
}

.btn-action[b-5j2mvlm7vt] {
    background-color: var(--color-action);
    color: var(--text-on-action);
    border: var(--border-width-thin) solid var(--color-action);
    transition: background-color var(--transition-fast) var(--transition-ease);
}

.btn-action:hover[b-5j2mvlm7vt] {
    background-color: var(--color-action-hover);
    border-color: var(--color-action-hover);
    color: var(--text-on-action);
}

.btn-action:disabled[b-5j2mvlm7vt] {
    opacity: 0.65;
    cursor: not-allowed;
}

.btn-outline-primary[b-5j2mvlm7vt] {
    background: transparent;
    color: var(--color-primary);
    border: var(--border-width-thin) solid var(--color-primary);
}

.btn-outline-primary:hover[b-5j2mvlm7vt] {
    background-color: var(--color-primary);
    color: var(--text-on-primary);
    text-decoration: none;
}

/* Responsive */
@media (max-width: 768px) {
    .form-grid[b-5j2mvlm7vt] {
        grid-template-columns: 1fr;
    }

    .form-group-wide[b-5j2mvlm7vt] {
        grid-column: span 1;
    }

    .detail-header[b-5j2mvlm7vt] {
        display: none;
    }

    .detail-row[b-5j2mvlm7vt] {
        flex-wrap: wrap;
    }

    .detail-cell-seq[b-5j2mvlm7vt],
    .detail-cell-sm[b-5j2mvlm7vt],
    .detail-cell-md[b-5j2mvlm7vt] {
        width: 100%;
    }
}
/* /Components/Pages/Shipping/CarrierList.razor.rz.scp.css */
/* ===========================
   CarrierList - Scoped Styles
   Flat Industrial Minimal
   =========================== */

/* Page Container */
.page-container[b-sxq3rbf9ns] {
    max-width: 1200px;
    margin: 0 auto;
    padding: var(--space-6) var(--space-4);
}

/* Header */
.page-header[b-sxq3rbf9ns] {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    margin-bottom: var(--space-6);
    gap: var(--space-4);
}

.page-header-left[b-sxq3rbf9ns] {
    flex: 1;
}

.page-header-right[b-sxq3rbf9ns] {
    flex-shrink: 0;
}

.page-title[b-sxq3rbf9ns] {
    font-size: var(--font-size-2xl);
    font-weight: var(--font-weight-bold);
    color: var(--color-primary);
    display: flex;
    align-items: center;
    gap: var(--space-2);
    margin: 0;
}

.page-title svg[b-sxq3rbf9ns] {
    color: var(--color-primary);
    flex-shrink: 0;
}

.page-subtitle[b-sxq3rbf9ns] {
    color: var(--text-muted);
    font-size: var(--font-size-sm);
    margin: var(--space-1) 0 0 0;
}

/* Action Button */
.btn-action[b-sxq3rbf9ns] {
    display: inline-flex;
    align-items: center;
    gap: var(--space-2);
    padding: var(--space-2) var(--space-4);
    background-color: var(--color-action);
    color: var(--text-on-action);
    border: var(--border-width-thin) solid var(--color-action);
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-medium);
    text-decoration: none;
    cursor: pointer;
    transition: background-color var(--transition-fast) var(--transition-ease),
                box-shadow var(--transition-fast) var(--transition-ease);
}

.btn-action:hover[b-sxq3rbf9ns] {
    background-color: var(--color-action-hover);
    border-color: var(--color-action-hover);
    color: var(--text-on-action);
    text-decoration: none;
    box-shadow: var(--shadow-sm);
}

.btn-action:active[b-sxq3rbf9ns] {
    background-color: var(--color-action-active);
}

/* Alert Bars */
.alert-bar[b-sxq3rbf9ns] {
    display: flex;
    align-items: center;
    gap: var(--space-2);
    padding: var(--space-3) var(--space-4);
    margin-bottom: var(--space-4);
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-medium);
    border-left: var(--border-width-thick) solid;
}

.alert-bar-success[b-sxq3rbf9ns] {
    background-color: #edf7ed;
    border-left-color: var(--color-success);
    color: #1e4620;
}

.alert-bar-danger[b-sxq3rbf9ns] {
    background-color: #fdeded;
    border-left-color: var(--color-danger);
    color: #5f2120;
}

.alert-bar-close[b-sxq3rbf9ns] {
    margin-left: auto;
    background: none;
    border: none;
    font-size: var(--font-size-lg);
    cursor: pointer;
    color: inherit;
    opacity: 0.6;
    line-height: 1;
}

.alert-bar-close:hover[b-sxq3rbf9ns] {
    opacity: 1;
}

/* Search Bar */
.search-bar[b-sxq3rbf9ns] {
    display: flex;
    align-items: center;
    gap: var(--space-4);
    margin-bottom: var(--space-4);
    padding: var(--space-3) var(--space-4);
    background-color: var(--bg-secondary);
    border: var(--border-width-thin) solid var(--border-color-light);
}

.search-input-wrapper[b-sxq3rbf9ns] {
    display: flex;
    align-items: center;
    flex: 1;
    position: relative;
}

.search-icon[b-sxq3rbf9ns] {
    color: var(--text-muted);
    flex-shrink: 0;
    margin-right: var(--space-2);
}

.search-input[b-sxq3rbf9ns] {
    flex: 1;
    border: none;
    background: transparent;
    font-size: var(--font-size-sm);
    color: var(--color-gray-700);
    outline: none;
    padding: var(--space-1) 0;
}

.search-input[b-sxq3rbf9ns]::placeholder {
    color: var(--text-muted);
}

.search-clear[b-sxq3rbf9ns] {
    background: none;
    border: none;
    cursor: pointer;
    color: var(--text-muted);
    padding: var(--space-1);
    display: flex;
    align-items: center;
}

.search-clear:hover[b-sxq3rbf9ns] {
    color: var(--color-primary);
}

.search-count[b-sxq3rbf9ns] {
    flex-shrink: 0;
    font-size: var(--font-size-xs);
    color: var(--text-muted);
    font-weight: var(--font-weight-medium);
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

/* Loading / Empty States */
.loading-state[b-sxq3rbf9ns] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: var(--space-16) 0;
    color: var(--text-muted);
    gap: var(--space-4);
}

.empty-state[b-sxq3rbf9ns] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: var(--space-16) 0;
    color: var(--text-muted);
    gap: var(--space-3);
}

.empty-state svg[b-sxq3rbf9ns] {
    opacity: 0.4;
}

.empty-state-text[b-sxq3rbf9ns] {
    font-size: var(--font-size-base);
    margin: 0;
}

/* Item List */
.item-list[b-sxq3rbf9ns] {
    display: flex;
    flex-direction: column;
    border: var(--border-width-thin) solid var(--border-color-light);
}

/* Item Row */
.item-row[b-sxq3rbf9ns] {
    display: flex;
    align-items: center;
    gap: var(--space-4);
    padding: var(--space-4);
    border-bottom: var(--border-width-thin) solid var(--border-color-light);
    transition: background-color var(--transition-fast) var(--transition-ease);
}

.item-row:last-child[b-sxq3rbf9ns] {
    border-bottom: none;
}

.item-row:hover[b-sxq3rbf9ns] {
    background-color: rgba(11, 36, 62, 0.03);
}

/* Avatar */
.item-avatar[b-sxq3rbf9ns] {
    flex-shrink: 0;
    width: 40px;
    height: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: var(--color-gray-100);
    color: var(--color-primary);
}

/* Item Info */
.item-info[b-sxq3rbf9ns] {
    flex: 1;
    min-width: 0;
}

.item-name[b-sxq3rbf9ns] {
    font-size: var(--font-size-base);
    font-weight: var(--font-weight-semibold);
    color: var(--color-primary);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.item-meta[b-sxq3rbf9ns] {
    display: flex;
    align-items: center;
    gap: var(--space-1);
    flex-wrap: wrap;
    font-size: var(--font-size-xs);
    color: var(--text-secondary);
    margin-top: 2px;
}

.item-code[b-sxq3rbf9ns] {
    font-family: var(--font-mono);
    font-weight: var(--font-weight-medium);
    color: var(--color-primary);
    opacity: 0.7;
}

.meta-separator[b-sxq3rbf9ns] {
    color: var(--color-gray-300);
}

/* Action Buttons */
.item-actions[b-sxq3rbf9ns] {
    flex-shrink: 0;
    display: flex;
    align-items: center;
    gap: var(--space-1);
}

.btn-icon[b-sxq3rbf9ns] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 36px;
    background: none;
    border: var(--border-width-thin) solid transparent;
    cursor: pointer;
    color: var(--text-muted);
    text-decoration: none;
    transition: all var(--transition-fast) var(--transition-ease);
}

.btn-icon:hover[b-sxq3rbf9ns] {
    color: var(--color-primary);
    background-color: var(--color-gray-100);
    border-color: var(--border-color-light);
    text-decoration: none;
}

.btn-icon-danger:hover[b-sxq3rbf9ns] {
    color: var(--color-action);
    background-color: rgba(178, 34, 34, 0.06);
    border-color: rgba(178, 34, 34, 0.2);
}

/* Overlay & Dialog */
.overlay[b-sxq3rbf9ns] {
    position: fixed;
    inset: 0;
    background-color: rgba(0, 0, 0, 0.4);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: var(--z-modal-backdrop);
}

.confirm-dialog[b-sxq3rbf9ns] {
    background-color: var(--color-white);
    padding: var(--space-8);
    max-width: 420px;
    width: 90%;
    box-shadow: var(--shadow-xl);
    text-align: center;
    z-index: var(--z-modal);
}

.confirm-icon[b-sxq3rbf9ns] {
    color: var(--color-action);
    margin-bottom: var(--space-4);
}

.confirm-dialog h3[b-sxq3rbf9ns] {
    font-size: var(--font-size-lg);
    font-weight: var(--font-weight-semibold);
    color: var(--color-primary);
    margin: 0 0 var(--space-2) 0;
}

.confirm-dialog p[b-sxq3rbf9ns] {
    font-size: var(--font-size-sm);
    color: var(--text-secondary);
    margin: 0 0 var(--space-2) 0;
}

.confirm-warning[b-sxq3rbf9ns] {
    font-size: var(--font-size-xs) !important;
    color: var(--color-action) !important;
    font-weight: var(--font-weight-medium);
}

.confirm-actions[b-sxq3rbf9ns] {
    display: flex;
    gap: var(--space-3);
    justify-content: center;
    margin-top: var(--space-6);
}

.confirm-actions .btn[b-sxq3rbf9ns] {
    min-width: 100px;
    padding: var(--space-2) var(--space-4);
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-medium);
    cursor: pointer;
}

/* Outline Primary Button */
.btn-outline-primary[b-sxq3rbf9ns] {
    background: transparent;
    color: var(--color-primary);
    border: var(--border-width-thin) solid var(--color-primary);
}

.btn-outline-primary:hover[b-sxq3rbf9ns] {
    background-color: var(--color-primary);
    color: var(--text-on-primary);
}

/* Responsive */
@media (max-width: 768px) {
    .page-header[b-sxq3rbf9ns] {
        flex-direction: column;
        gap: var(--space-3);
    }

    .item-row[b-sxq3rbf9ns] {
        flex-wrap: wrap;
    }

    .item-actions[b-sxq3rbf9ns] {
        width: 100%;
        justify-content: flex-end;
    }
}
/* /Components/Pages/Shipping/DeliveryRouteCreate.razor.rz.scp.css */
/* ===========================
   DeliveryRouteCreate - Scoped Styles
   Flat Industrial Minimal
   =========================== */

/* Page Container */
.page-container[b-lhuqina6le] {
    max-width: 1100px;
    margin: 0 auto;
    padding: var(--space-6) var(--space-4);
}

/* Header */
.page-header[b-lhuqina6le] {
    display: flex;
    align-items: center;
    gap: var(--space-4);
    margin-bottom: var(--space-6);
}

.btn-back[b-lhuqina6le] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    color: var(--text-muted);
    border: var(--border-width-thin) solid var(--border-color-light);
    text-decoration: none;
    transition: all var(--transition-fast) var(--transition-ease);
    flex-shrink: 0;
}

.btn-back:hover[b-lhuqina6le] {
    color: var(--color-primary);
    border-color: var(--color-primary);
    background-color: var(--color-gray-50);
    text-decoration: none;
}

.page-header-text[b-lhuqina6le] {
    flex: 1;
}

.page-title[b-lhuqina6le] {
    font-size: var(--font-size-xl);
    font-weight: var(--font-weight-bold);
    color: var(--color-primary);
    display: flex;
    align-items: center;
    gap: var(--space-2);
    margin: 0;
}

.page-title svg[b-lhuqina6le] {
    color: var(--color-primary);
    flex-shrink: 0;
}

.page-subtitle[b-lhuqina6le] {
    color: var(--text-muted);
    font-size: var(--font-size-sm);
    margin: 2px 0 0 0;
}

/* Alert Bar */
.alert-bar[b-lhuqina6le] {
    display: flex;
    align-items: center;
    gap: var(--space-2);
    padding: var(--space-3) var(--space-4);
    margin-bottom: var(--space-4);
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-medium);
    border-left: var(--border-width-thick) solid;
}

.alert-bar-danger[b-lhuqina6le] {
    background-color: #fdeded;
    border-left-color: var(--color-danger);
    color: #5f2120;
}

.alert-bar-close[b-lhuqina6le] {
    margin-left: auto;
    background: none;
    border: none;
    font-size: var(--font-size-lg);
    cursor: pointer;
    color: inherit;
    opacity: 0.6;
    line-height: 1;
}

.alert-bar-close:hover[b-lhuqina6le] {
    opacity: 1;
}

/* Form Sections */
.form-section[b-lhuqina6le] {
    margin-bottom: var(--space-6);
    padding: var(--space-5);
    background-color: var(--color-white);
    border: var(--border-width-thin) solid var(--border-color-light);
}

.section-title[b-lhuqina6le] {
    display: flex;
    align-items: center;
    gap: var(--space-2);
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-semibold);
    color: var(--color-primary);
    text-transform: uppercase;
    letter-spacing: 0.5px;
    margin: 0 0 var(--space-4) 0;
    padding-bottom: var(--space-3);
    border-bottom: var(--border-width-thin) solid var(--border-color-light);
}

.section-title svg[b-lhuqina6le] {
    color: var(--color-primary);
    opacity: 0.6;
    flex-shrink: 0;
}

/* Form Grid */
.form-grid[b-lhuqina6le] {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: var(--space-4);
}

.form-group[b-lhuqina6le] {
    display: flex;
    flex-direction: column;
}

.form-group-wide[b-lhuqina6le] {
    grid-column: span 2;
}

.form-group-checkbox[b-lhuqina6le] {
    display: flex;
    align-items: center;
    padding-top: var(--space-5);
}

.form-check-label[b-lhuqina6le] {
    display: flex;
    align-items: center;
    gap: var(--space-2);
    font-size: var(--font-size-sm);
    color: var(--color-gray-700);
    cursor: pointer;
}

.form-check-input[b-lhuqina6le] {
    width: 16px;
    height: 16px;
    cursor: pointer;
}

/* Form Controls */
.form-label[b-lhuqina6le] {
    font-size: var(--font-size-xs);
    font-weight: var(--font-weight-medium);
    color: var(--text-secondary);
    text-transform: uppercase;
    letter-spacing: 0.3px;
    margin-bottom: var(--space-1);
}

.form-control[b-lhuqina6le] {
    padding: var(--space-2) var(--space-3);
    font-size: var(--font-size-sm);
    color: var(--color-gray-700);
    border: var(--border-width-thin) solid var(--border-color-light);
    background-color: var(--color-white);
    transition: border-color var(--transition-fast) var(--transition-ease);
}

.form-control:focus[b-lhuqina6le] {
    border-color: var(--color-primary);
    outline: none;
    box-shadow: none;
}

.form-control[b-lhuqina6le]::placeholder {
    color: var(--color-gray-400);
}

.form-control-sm[b-lhuqina6le] {
    padding: var(--space-1) var(--space-2);
    font-size: var(--font-size-xs);
}

/* Detail Table */
.detail-table[b-lhuqina6le] {
    display: flex;
    flex-direction: column;
    border: var(--border-width-thin) solid var(--border-color-light);
}

.detail-header[b-lhuqina6le] {
    display: flex;
    gap: var(--space-2);
    padding: var(--space-2) var(--space-3);
    background-color: var(--color-gray-50);
    border-bottom: var(--border-width-thin) solid var(--border-color-light);
    font-size: var(--font-size-xs);
    font-weight: var(--font-weight-semibold);
    color: var(--text-secondary);
    text-transform: uppercase;
    letter-spacing: 0.3px;
}

.detail-row[b-lhuqina6le] {
    display: flex;
    gap: var(--space-2);
    padding: var(--space-2) var(--space-3);
    border-bottom: var(--border-width-thin) solid var(--border-color-light);
    align-items: center;
}

.detail-row:last-child[b-lhuqina6le] {
    border-bottom: none;
}

.detail-cell[b-lhuqina6le] {
    display: flex;
    align-items: center;
}

.detail-cell-seq[b-lhuqina6le] {
    width: 60px;
    flex-shrink: 0;
}

.detail-cell-sm[b-lhuqina6le] {
    width: 90px;
    flex-shrink: 0;
}

.detail-cell-md[b-lhuqina6le] {
    width: 200px;
    flex-shrink: 0;
}

.detail-cell-grow[b-lhuqina6le] {
    flex: 1;
    min-width: 0;
}

.detail-cell-action[b-lhuqina6le] {
    width: 36px;
    flex-shrink: 0;
    display: flex;
    justify-content: center;
}

.detail-empty[b-lhuqina6le] {
    text-align: center;
    color: var(--text-muted);
    font-size: var(--font-size-sm);
    padding: var(--space-4) 0;
    margin: 0;
}

.btn-add-detail[b-lhuqina6le] {
    margin-left: auto;
    display: inline-flex;
    align-items: center;
    gap: var(--space-1);
    padding: 2px var(--space-2);
    background: none;
    border: var(--border-width-thin) solid var(--color-primary);
    color: var(--color-primary);
    font-size: var(--font-size-xs);
    font-weight: var(--font-weight-medium);
    cursor: pointer;
    text-transform: none;
    letter-spacing: normal;
    transition: all var(--transition-fast) var(--transition-ease);
}

.btn-add-detail:hover[b-lhuqina6le] {
    background-color: var(--color-primary);
    color: var(--text-on-primary);
}

/* Action Buttons */
.btn-icon[b-lhuqina6le] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 28px;
    height: 28px;
    background: none;
    border: var(--border-width-thin) solid transparent;
    cursor: pointer;
    color: var(--text-muted);
    transition: all var(--transition-fast) var(--transition-ease);
}

.btn-icon:hover[b-lhuqina6le] {
    color: var(--color-primary);
    background-color: var(--color-gray-100);
    border-color: var(--border-color-light);
}

.btn-icon-danger:hover[b-lhuqina6le] {
    color: var(--color-action);
    background-color: rgba(178, 34, 34, 0.06);
    border-color: rgba(178, 34, 34, 0.2);
}

/* Form Actions */
.form-actions[b-lhuqina6le] {
    display: flex;
    justify-content: flex-end;
    gap: var(--space-3);
    padding-top: var(--space-4);
    border-top: var(--border-width-thin) solid var(--border-color-light);
}

.form-actions .btn[b-lhuqina6le] {
    display: inline-flex;
    align-items: center;
    gap: var(--space-2);
    padding: var(--space-2) var(--space-5);
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-medium);
    cursor: pointer;
    text-decoration: none;
}

.btn-action[b-lhuqina6le] {
    background-color: var(--color-action);
    color: var(--text-on-action);
    border: var(--border-width-thin) solid var(--color-action);
    transition: background-color var(--transition-fast) var(--transition-ease);
}

.btn-action:hover[b-lhuqina6le] {
    background-color: var(--color-action-hover);
    border-color: var(--color-action-hover);
    color: var(--text-on-action);
}

.btn-action:disabled[b-lhuqina6le] {
    opacity: 0.65;
    cursor: not-allowed;
}

.btn-outline-primary[b-lhuqina6le] {
    background: transparent;
    color: var(--color-primary);
    border: var(--border-width-thin) solid var(--color-primary);
}

.btn-outline-primary:hover[b-lhuqina6le] {
    background-color: var(--color-primary);
    color: var(--text-on-primary);
    text-decoration: none;
}

/* Responsive */
@media (max-width: 768px) {
    .form-grid[b-lhuqina6le] {
        grid-template-columns: 1fr;
    }

    .form-group-wide[b-lhuqina6le] {
        grid-column: span 1;
    }

    .detail-header[b-lhuqina6le] {
        display: none;
    }

    .detail-row[b-lhuqina6le] {
        flex-wrap: wrap;
    }

    .detail-cell-seq[b-lhuqina6le],
    .detail-cell-sm[b-lhuqina6le],
    .detail-cell-md[b-lhuqina6le] {
        width: 100%;
    }
}
/* /Components/Pages/Shipping/DeliveryRouteEdit.razor.rz.scp.css */
/* ===========================
   DeliveryRouteEdit - Scoped Styles
   Flat Industrial Minimal
   =========================== */

/* Page Container */
.page-container[b-dws0h4kur0] {
    max-width: 1100px;
    margin: 0 auto;
    padding: var(--space-6) var(--space-4);
}

/* Header */
.page-header[b-dws0h4kur0] {
    display: flex;
    align-items: center;
    gap: var(--space-4);
    margin-bottom: var(--space-6);
}

.btn-back[b-dws0h4kur0] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    color: var(--text-muted);
    border: var(--border-width-thin) solid var(--border-color-light);
    text-decoration: none;
    transition: all var(--transition-fast) var(--transition-ease);
    flex-shrink: 0;
}

.btn-back:hover[b-dws0h4kur0] {
    color: var(--color-primary);
    border-color: var(--color-primary);
    background-color: var(--color-gray-50);
    text-decoration: none;
}

.page-header-text[b-dws0h4kur0] {
    flex: 1;
}

.page-title[b-dws0h4kur0] {
    font-size: var(--font-size-xl);
    font-weight: var(--font-weight-bold);
    color: var(--color-primary);
    display: flex;
    align-items: center;
    gap: var(--space-2);
    margin: 0;
}

.page-title svg[b-dws0h4kur0] {
    color: var(--color-primary);
    flex-shrink: 0;
}

.page-subtitle[b-dws0h4kur0] {
    color: var(--text-muted);
    font-size: var(--font-size-sm);
    margin: 2px 0 0 0;
}

.subtitle-code[b-dws0h4kur0] {
    font-family: var(--font-mono);
    font-size: var(--font-size-xs);
    color: var(--color-primary);
    opacity: 0.6;
    margin-left: var(--space-2);
}

/* Alert Bar */
.alert-bar[b-dws0h4kur0] {
    display: flex;
    align-items: center;
    gap: var(--space-2);
    padding: var(--space-3) var(--space-4);
    margin-bottom: var(--space-4);
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-medium);
    border-left: var(--border-width-thick) solid;
}

.alert-bar-danger[b-dws0h4kur0] {
    background-color: #fdeded;
    border-left-color: var(--color-danger);
    color: #5f2120;
}

.alert-bar-close[b-dws0h4kur0] {
    margin-left: auto;
    background: none;
    border: none;
    font-size: var(--font-size-lg);
    cursor: pointer;
    color: inherit;
    opacity: 0.6;
    line-height: 1;
}

.alert-bar-close:hover[b-dws0h4kur0] {
    opacity: 1;
}

/* Loading / Empty States */
.loading-state[b-dws0h4kur0] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: var(--space-16) 0;
    color: var(--text-muted);
    gap: var(--space-4);
}

.empty-state[b-dws0h4kur0] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: var(--space-16) 0;
    color: var(--text-muted);
    gap: var(--space-3);
}

.empty-state svg[b-dws0h4kur0] {
    opacity: 0.4;
}

.empty-state-text[b-dws0h4kur0] {
    font-size: var(--font-size-base);
    margin: 0;
}

/* Form Sections */
.form-section[b-dws0h4kur0] {
    margin-bottom: var(--space-6);
    padding: var(--space-5);
    background-color: var(--color-white);
    border: var(--border-width-thin) solid var(--border-color-light);
}

.section-title[b-dws0h4kur0] {
    display: flex;
    align-items: center;
    gap: var(--space-2);
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-semibold);
    color: var(--color-primary);
    text-transform: uppercase;
    letter-spacing: 0.5px;
    margin: 0 0 var(--space-4) 0;
    padding-bottom: var(--space-3);
    border-bottom: var(--border-width-thin) solid var(--border-color-light);
}

.section-title svg[b-dws0h4kur0] {
    color: var(--color-primary);
    opacity: 0.6;
    flex-shrink: 0;
}

/* Form Grid */
.form-grid[b-dws0h4kur0] {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: var(--space-4);
}

.form-group[b-dws0h4kur0] {
    display: flex;
    flex-direction: column;
}

.form-group-wide[b-dws0h4kur0] {
    grid-column: span 2;
}

.form-group-checkbox[b-dws0h4kur0] {
    display: flex;
    align-items: center;
    padding-top: var(--space-5);
}

.form-check-label[b-dws0h4kur0] {
    display: flex;
    align-items: center;
    gap: var(--space-2);
    font-size: var(--font-size-sm);
    color: var(--color-gray-700);
    cursor: pointer;
}

.form-check-input[b-dws0h4kur0] {
    width: 16px;
    height: 16px;
    cursor: pointer;
}

/* Form Controls */
.form-label[b-dws0h4kur0] {
    font-size: var(--font-size-xs);
    font-weight: var(--font-weight-medium);
    color: var(--text-secondary);
    text-transform: uppercase;
    letter-spacing: 0.3px;
    margin-bottom: var(--space-1);
}

.form-control[b-dws0h4kur0] {
    padding: var(--space-2) var(--space-3);
    font-size: var(--font-size-sm);
    color: var(--color-gray-700);
    border: var(--border-width-thin) solid var(--border-color-light);
    background-color: var(--color-white);
    transition: border-color var(--transition-fast) var(--transition-ease);
}

.form-control:focus[b-dws0h4kur0] {
    border-color: var(--color-primary);
    outline: none;
    box-shadow: none;
}

.form-control[b-dws0h4kur0]::placeholder {
    color: var(--color-gray-400);
}

.form-control-sm[b-dws0h4kur0] {
    padding: var(--space-1) var(--space-2);
    font-size: var(--font-size-xs);
}

.form-control-static[b-dws0h4kur0] {
    padding: var(--space-2) var(--space-3);
    font-size: var(--font-size-sm);
    color: var(--color-gray-700);
    background-color: var(--color-gray-50);
    border: var(--border-width-thin) solid var(--border-color-light);
    font-family: var(--font-mono);
    font-weight: var(--font-weight-medium);
}

/* Detail Table */
.detail-table[b-dws0h4kur0] {
    display: flex;
    flex-direction: column;
    border: var(--border-width-thin) solid var(--border-color-light);
}

.detail-header[b-dws0h4kur0] {
    display: flex;
    gap: var(--space-2);
    padding: var(--space-2) var(--space-3);
    background-color: var(--color-gray-50);
    border-bottom: var(--border-width-thin) solid var(--border-color-light);
    font-size: var(--font-size-xs);
    font-weight: var(--font-weight-semibold);
    color: var(--text-secondary);
    text-transform: uppercase;
    letter-spacing: 0.3px;
}

.detail-row[b-dws0h4kur0] {
    display: flex;
    gap: var(--space-2);
    padding: var(--space-2) var(--space-3);
    border-bottom: var(--border-width-thin) solid var(--border-color-light);
    align-items: center;
}

.detail-row:last-child[b-dws0h4kur0] {
    border-bottom: none;
}

.detail-cell[b-dws0h4kur0] {
    display: flex;
    align-items: center;
}

.detail-cell-seq[b-dws0h4kur0] {
    width: 60px;
    flex-shrink: 0;
}

.detail-cell-sm[b-dws0h4kur0] {
    width: 90px;
    flex-shrink: 0;
}

.detail-cell-md[b-dws0h4kur0] {
    width: 200px;
    flex-shrink: 0;
}

.detail-cell-grow[b-dws0h4kur0] {
    flex: 1;
    min-width: 0;
}

.detail-cell-action[b-dws0h4kur0] {
    width: 36px;
    flex-shrink: 0;
    display: flex;
    justify-content: center;
}

.detail-empty[b-dws0h4kur0] {
    text-align: center;
    color: var(--text-muted);
    font-size: var(--font-size-sm);
    padding: var(--space-4) 0;
    margin: 0;
}

.btn-add-detail[b-dws0h4kur0] {
    margin-left: auto;
    display: inline-flex;
    align-items: center;
    gap: var(--space-1);
    padding: 2px var(--space-2);
    background: none;
    border: var(--border-width-thin) solid var(--color-primary);
    color: var(--color-primary);
    font-size: var(--font-size-xs);
    font-weight: var(--font-weight-medium);
    cursor: pointer;
    text-transform: none;
    letter-spacing: normal;
    transition: all var(--transition-fast) var(--transition-ease);
}

.btn-add-detail:hover[b-dws0h4kur0] {
    background-color: var(--color-primary);
    color: var(--text-on-primary);
}

/* Action Buttons */
.btn-icon[b-dws0h4kur0] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 28px;
    height: 28px;
    background: none;
    border: var(--border-width-thin) solid transparent;
    cursor: pointer;
    color: var(--text-muted);
    transition: all var(--transition-fast) var(--transition-ease);
}

.btn-icon:hover[b-dws0h4kur0] {
    color: var(--color-primary);
    background-color: var(--color-gray-100);
    border-color: var(--border-color-light);
}

.btn-icon-danger:hover[b-dws0h4kur0] {
    color: var(--color-action);
    background-color: rgba(178, 34, 34, 0.06);
    border-color: rgba(178, 34, 34, 0.2);
}

/* Form Actions */
.form-actions[b-dws0h4kur0] {
    display: flex;
    justify-content: flex-end;
    gap: var(--space-3);
    padding-top: var(--space-4);
    border-top: var(--border-width-thin) solid var(--border-color-light);
}

.form-actions .btn[b-dws0h4kur0] {
    display: inline-flex;
    align-items: center;
    gap: var(--space-2);
    padding: var(--space-2) var(--space-5);
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-medium);
    cursor: pointer;
    text-decoration: none;
}

.btn-action[b-dws0h4kur0] {
    background-color: var(--color-action);
    color: var(--text-on-action);
    border: var(--border-width-thin) solid var(--color-action);
    transition: background-color var(--transition-fast) var(--transition-ease);
}

.btn-action:hover[b-dws0h4kur0] {
    background-color: var(--color-action-hover);
    border-color: var(--color-action-hover);
    color: var(--text-on-action);
}

.btn-action:disabled[b-dws0h4kur0] {
    opacity: 0.65;
    cursor: not-allowed;
}

.btn-outline-primary[b-dws0h4kur0] {
    background: transparent;
    color: var(--color-primary);
    border: var(--border-width-thin) solid var(--color-primary);
}

.btn-outline-primary:hover[b-dws0h4kur0] {
    background-color: var(--color-primary);
    color: var(--text-on-primary);
    text-decoration: none;
}

/* Responsive */
@media (max-width: 768px) {
    .form-grid[b-dws0h4kur0] {
        grid-template-columns: 1fr;
    }

    .form-group-wide[b-dws0h4kur0] {
        grid-column: span 1;
    }

    .detail-header[b-dws0h4kur0] {
        display: none;
    }

    .detail-row[b-dws0h4kur0] {
        flex-wrap: wrap;
    }

    .detail-cell-seq[b-dws0h4kur0],
    .detail-cell-sm[b-dws0h4kur0],
    .detail-cell-md[b-dws0h4kur0] {
        width: 100%;
    }
}
/* /Components/Pages/Shipping/DeliveryRouteList.razor.rz.scp.css */
/* ===========================
   DeliveryRouteList - Scoped Styles
   Flat Industrial Minimal
   =========================== */

/* Page Container */
.page-container[b-zbkc4b0mdv] {
    max-width: 1200px;
    margin: 0 auto;
    padding: var(--space-6) var(--space-4);
}

/* Header */
.page-header[b-zbkc4b0mdv] {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    margin-bottom: var(--space-6);
    gap: var(--space-4);
}

.page-header-left[b-zbkc4b0mdv] {
    flex: 1;
}

.page-header-right[b-zbkc4b0mdv] {
    flex-shrink: 0;
}

.page-title[b-zbkc4b0mdv] {
    font-size: var(--font-size-2xl);
    font-weight: var(--font-weight-bold);
    color: var(--color-primary);
    display: flex;
    align-items: center;
    gap: var(--space-2);
    margin: 0;
}

.page-title svg[b-zbkc4b0mdv] {
    color: var(--color-primary);
    flex-shrink: 0;
}

.page-subtitle[b-zbkc4b0mdv] {
    color: var(--text-muted);
    font-size: var(--font-size-sm);
    margin: var(--space-1) 0 0 0;
}

/* Action Button */
.btn-action[b-zbkc4b0mdv] {
    display: inline-flex;
    align-items: center;
    gap: var(--space-2);
    padding: var(--space-2) var(--space-4);
    background-color: var(--color-action);
    color: var(--text-on-action);
    border: var(--border-width-thin) solid var(--color-action);
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-medium);
    text-decoration: none;
    cursor: pointer;
    transition: background-color var(--transition-fast) var(--transition-ease),
                box-shadow var(--transition-fast) var(--transition-ease);
}

.btn-action:hover[b-zbkc4b0mdv] {
    background-color: var(--color-action-hover);
    border-color: var(--color-action-hover);
    color: var(--text-on-action);
    text-decoration: none;
    box-shadow: var(--shadow-sm);
}

.btn-action:active[b-zbkc4b0mdv] {
    background-color: var(--color-action-active);
}

/* Alert Bars */
.alert-bar[b-zbkc4b0mdv] {
    display: flex;
    align-items: center;
    gap: var(--space-2);
    padding: var(--space-3) var(--space-4);
    margin-bottom: var(--space-4);
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-medium);
    border-left: var(--border-width-thick) solid;
}

.alert-bar-success[b-zbkc4b0mdv] {
    background-color: #edf7ed;
    border-left-color: var(--color-success);
    color: #1e4620;
}

.alert-bar-danger[b-zbkc4b0mdv] {
    background-color: #fdeded;
    border-left-color: var(--color-danger);
    color: #5f2120;
}

.alert-bar-close[b-zbkc4b0mdv] {
    margin-left: auto;
    background: none;
    border: none;
    font-size: var(--font-size-lg);
    cursor: pointer;
    color: inherit;
    opacity: 0.6;
    line-height: 1;
}

.alert-bar-close:hover[b-zbkc4b0mdv] {
    opacity: 1;
}

/* Search Bar */
.search-bar[b-zbkc4b0mdv] {
    display: flex;
    align-items: center;
    gap: var(--space-4);
    margin-bottom: var(--space-4);
    padding: var(--space-3) var(--space-4);
    background-color: var(--bg-secondary);
    border: var(--border-width-thin) solid var(--border-color-light);
}

.search-input-wrapper[b-zbkc4b0mdv] {
    display: flex;
    align-items: center;
    flex: 1;
    position: relative;
}

.search-icon[b-zbkc4b0mdv] {
    color: var(--text-muted);
    flex-shrink: 0;
    margin-right: var(--space-2);
}

.search-input[b-zbkc4b0mdv] {
    flex: 1;
    border: none;
    background: transparent;
    font-size: var(--font-size-sm);
    color: var(--color-gray-700);
    outline: none;
    padding: var(--space-1) 0;
}

.search-input[b-zbkc4b0mdv]::placeholder {
    color: var(--text-muted);
}

.search-clear[b-zbkc4b0mdv] {
    background: none;
    border: none;
    cursor: pointer;
    color: var(--text-muted);
    padding: var(--space-1);
    display: flex;
    align-items: center;
}

.search-clear:hover[b-zbkc4b0mdv] {
    color: var(--color-primary);
}

.search-count[b-zbkc4b0mdv] {
    flex-shrink: 0;
    font-size: var(--font-size-xs);
    color: var(--text-muted);
    font-weight: var(--font-weight-medium);
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

/* Loading / Empty States */
.loading-state[b-zbkc4b0mdv] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: var(--space-16) 0;
    color: var(--text-muted);
    gap: var(--space-4);
}

.empty-state[b-zbkc4b0mdv] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: var(--space-16) 0;
    color: var(--text-muted);
    gap: var(--space-3);
}

.empty-state svg[b-zbkc4b0mdv] {
    opacity: 0.4;
}

.empty-state-text[b-zbkc4b0mdv] {
    font-size: var(--font-size-base);
    margin: 0;
}

/* Item List */
.item-list[b-zbkc4b0mdv] {
    display: flex;
    flex-direction: column;
    border: var(--border-width-thin) solid var(--border-color-light);
}

/* Item Row */
.item-row[b-zbkc4b0mdv] {
    display: flex;
    align-items: center;
    gap: var(--space-4);
    padding: var(--space-4);
    border-bottom: var(--border-width-thin) solid var(--border-color-light);
    transition: background-color var(--transition-fast) var(--transition-ease);
}

.item-row:last-child[b-zbkc4b0mdv] {
    border-bottom: none;
}

.item-row:hover[b-zbkc4b0mdv] {
    background-color: rgba(11, 36, 62, 0.03);
}

/* Avatar */
.item-avatar[b-zbkc4b0mdv] {
    flex-shrink: 0;
    width: 40px;
    height: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: var(--color-gray-100);
    color: var(--color-primary);
}

/* Color Indicator */
.color-indicator[b-zbkc4b0mdv] {
    width: 24px;
    height: 24px;
    border-radius: 50%;
    border: var(--border-width-thin) solid var(--border-color-light);
}

/* Item Info */
.item-info[b-zbkc4b0mdv] {
    flex: 1;
    min-width: 0;
}

.item-name[b-zbkc4b0mdv] {
    font-size: var(--font-size-base);
    font-weight: var(--font-weight-semibold);
    color: var(--color-primary);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.item-meta[b-zbkc4b0mdv] {
    display: flex;
    align-items: center;
    gap: var(--space-1);
    flex-wrap: wrap;
    font-size: var(--font-size-xs);
    color: var(--text-secondary);
    margin-top: 2px;
}

.item-code[b-zbkc4b0mdv] {
    font-family: var(--font-mono);
    font-weight: var(--font-weight-medium);
    color: var(--color-primary);
    opacity: 0.7;
}

.meta-separator[b-zbkc4b0mdv] {
    color: var(--color-gray-300);
}

.badge-obsolete[b-zbkc4b0mdv] {
    display: inline-block;
    padding: 1px 6px;
    font-size: var(--font-size-xs);
    font-weight: var(--font-weight-medium);
    color: var(--color-action);
    background-color: rgba(178, 34, 34, 0.08);
    border: var(--border-width-thin) solid rgba(178, 34, 34, 0.2);
}

/* Action Buttons */
.item-actions[b-zbkc4b0mdv] {
    flex-shrink: 0;
    display: flex;
    align-items: center;
    gap: var(--space-1);
}

.btn-icon[b-zbkc4b0mdv] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 36px;
    background: none;
    border: var(--border-width-thin) solid transparent;
    cursor: pointer;
    color: var(--text-muted);
    text-decoration: none;
    transition: all var(--transition-fast) var(--transition-ease);
}

.btn-icon:hover[b-zbkc4b0mdv] {
    color: var(--color-primary);
    background-color: var(--color-gray-100);
    border-color: var(--border-color-light);
    text-decoration: none;
}

.btn-icon-danger:hover[b-zbkc4b0mdv] {
    color: var(--color-action);
    background-color: rgba(178, 34, 34, 0.06);
    border-color: rgba(178, 34, 34, 0.2);
}

/* Overlay & Dialog */
.overlay[b-zbkc4b0mdv] {
    position: fixed;
    inset: 0;
    background-color: rgba(0, 0, 0, 0.4);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: var(--z-modal-backdrop);
}

.confirm-dialog[b-zbkc4b0mdv] {
    background-color: var(--color-white);
    padding: var(--space-8);
    max-width: 420px;
    width: 90%;
    box-shadow: var(--shadow-xl);
    text-align: center;
    z-index: var(--z-modal);
}

.confirm-icon[b-zbkc4b0mdv] {
    color: var(--color-action);
    margin-bottom: var(--space-4);
}

.confirm-dialog h3[b-zbkc4b0mdv] {
    font-size: var(--font-size-lg);
    font-weight: var(--font-weight-semibold);
    color: var(--color-primary);
    margin: 0 0 var(--space-2) 0;
}

.confirm-dialog p[b-zbkc4b0mdv] {
    font-size: var(--font-size-sm);
    color: var(--text-secondary);
    margin: 0 0 var(--space-2) 0;
}

.confirm-warning[b-zbkc4b0mdv] {
    font-size: var(--font-size-xs) !important;
    color: var(--color-action) !important;
    font-weight: var(--font-weight-medium);
}

.confirm-actions[b-zbkc4b0mdv] {
    display: flex;
    gap: var(--space-3);
    justify-content: center;
    margin-top: var(--space-6);
}

.confirm-actions .btn[b-zbkc4b0mdv] {
    min-width: 100px;
    padding: var(--space-2) var(--space-4);
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-medium);
    cursor: pointer;
}

/* Outline Primary Button */
.btn-outline-primary[b-zbkc4b0mdv] {
    background: transparent;
    color: var(--color-primary);
    border: var(--border-width-thin) solid var(--color-primary);
}

.btn-outline-primary:hover[b-zbkc4b0mdv] {
    background-color: var(--color-primary);
    color: var(--text-on-primary);
}

/* Responsive */
@media (max-width: 768px) {
    .page-header[b-zbkc4b0mdv] {
        flex-direction: column;
        gap: var(--space-3);
    }

    .item-row[b-zbkc4b0mdv] {
        flex-wrap: wrap;
    }

    .item-actions[b-zbkc4b0mdv] {
        width: 100%;
        justify-content: flex-end;
    }
}
/* /Components/Pages/Shipping/FreightCreate.razor.rz.scp.css */
/* ===========================
   FreightCreate - Scoped Styles
   Flat Industrial Minimal
   =========================== */

/* Page Container */
.page-container[b-fs37egmssv] {
    max-width: 900px;
    margin: 0 auto;
    padding: var(--space-6) var(--space-4);
}

/* Header */
.page-header[b-fs37egmssv] {
    display: flex;
    align-items: center;
    gap: var(--space-4);
    margin-bottom: var(--space-6);
}

.btn-back[b-fs37egmssv] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    color: var(--text-muted);
    border: var(--border-width-thin) solid var(--border-color-light);
    text-decoration: none;
    transition: all var(--transition-fast) var(--transition-ease);
    flex-shrink: 0;
}

.btn-back:hover[b-fs37egmssv] {
    color: var(--color-primary);
    border-color: var(--color-primary);
    background-color: var(--color-gray-50);
    text-decoration: none;
}

.page-header-text[b-fs37egmssv] {
    flex: 1;
}

.page-title[b-fs37egmssv] {
    font-size: var(--font-size-xl);
    font-weight: var(--font-weight-bold);
    color: var(--color-primary);
    display: flex;
    align-items: center;
    gap: var(--space-2);
    margin: 0;
}

.page-title svg[b-fs37egmssv] {
    color: var(--color-primary);
    flex-shrink: 0;
}

.page-subtitle[b-fs37egmssv] {
    color: var(--text-muted);
    font-size: var(--font-size-sm);
    margin: 2px 0 0 0;
}

/* Alert Bar */
.alert-bar[b-fs37egmssv] {
    display: flex;
    align-items: center;
    gap: var(--space-2);
    padding: var(--space-3) var(--space-4);
    margin-bottom: var(--space-4);
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-medium);
    border-left: var(--border-width-thick) solid;
}

.alert-bar-danger[b-fs37egmssv] {
    background-color: #fdeded;
    border-left-color: var(--color-danger);
    color: #5f2120;
}

.alert-bar-close[b-fs37egmssv] {
    margin-left: auto;
    background: none;
    border: none;
    font-size: var(--font-size-lg);
    cursor: pointer;
    color: inherit;
    opacity: 0.6;
    line-height: 1;
}

.alert-bar-close:hover[b-fs37egmssv] {
    opacity: 1;
}

/* Form Sections */
.form-section[b-fs37egmssv] {
    margin-bottom: var(--space-6);
    padding: var(--space-5);
    background-color: var(--color-white);
    border: var(--border-width-thin) solid var(--border-color-light);
}

.section-title[b-fs37egmssv] {
    display: flex;
    align-items: center;
    gap: var(--space-2);
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-semibold);
    color: var(--color-primary);
    text-transform: uppercase;
    letter-spacing: 0.5px;
    margin: 0 0 var(--space-4) 0;
    padding-bottom: var(--space-3);
    border-bottom: var(--border-width-thin) solid var(--border-color-light);
}

.section-title svg[b-fs37egmssv] {
    color: var(--color-primary);
    opacity: 0.6;
    flex-shrink: 0;
}

/* Form Grid */
.form-grid[b-fs37egmssv] {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: var(--space-4);
}

.form-group[b-fs37egmssv] {
    display: flex;
    flex-direction: column;
}

.form-group-wide[b-fs37egmssv] {
    grid-column: span 2;
}

/* Form Controls */
.form-label[b-fs37egmssv] {
    font-size: var(--font-size-xs);
    font-weight: var(--font-weight-medium);
    color: var(--text-secondary);
    text-transform: uppercase;
    letter-spacing: 0.3px;
    margin-bottom: var(--space-1);
}

.form-control[b-fs37egmssv] {
    padding: var(--space-2) var(--space-3);
    font-size: var(--font-size-sm);
    color: var(--color-gray-700);
    border: var(--border-width-thin) solid var(--border-color-light);
    background-color: var(--color-white);
    transition: border-color var(--transition-fast) var(--transition-ease);
}

.form-control:focus[b-fs37egmssv] {
    border-color: var(--color-primary);
    outline: none;
    box-shadow: none;
}

.form-control[b-fs37egmssv]::placeholder {
    color: var(--color-gray-400);
}

/* Form Actions */
.form-actions[b-fs37egmssv] {
    display: flex;
    justify-content: flex-end;
    gap: var(--space-3);
    padding-top: var(--space-4);
    border-top: var(--border-width-thin) solid var(--border-color-light);
}

.form-actions .btn[b-fs37egmssv] {
    display: inline-flex;
    align-items: center;
    gap: var(--space-2);
    padding: var(--space-2) var(--space-5);
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-medium);
    cursor: pointer;
    text-decoration: none;
}

.btn-action[b-fs37egmssv] {
    background-color: var(--color-action);
    color: var(--text-on-action);
    border: var(--border-width-thin) solid var(--color-action);
    transition: background-color var(--transition-fast) var(--transition-ease);
}

.btn-action:hover[b-fs37egmssv] {
    background-color: var(--color-action-hover);
    border-color: var(--color-action-hover);
    color: var(--text-on-action);
}

.btn-action:disabled[b-fs37egmssv] {
    opacity: 0.65;
    cursor: not-allowed;
}

.btn-outline-primary[b-fs37egmssv] {
    background: transparent;
    color: var(--color-primary);
    border: var(--border-width-thin) solid var(--color-primary);
}

.btn-outline-primary:hover[b-fs37egmssv] {
    background-color: var(--color-primary);
    color: var(--text-on-primary);
    text-decoration: none;
}

/* Validation */
[b-fs37egmssv] .validation-message {
    color: var(--color-danger);
    font-size: var(--font-size-xs);
    margin-top: 2px;
}

/* Responsive */
@media (max-width: 768px) {
    .form-grid[b-fs37egmssv] {
        grid-template-columns: 1fr;
    }

    .form-group-wide[b-fs37egmssv] {
        grid-column: span 1;
    }

    .form-actions[b-fs37egmssv] {
        flex-direction: column-reverse;
    }

    .form-actions .btn[b-fs37egmssv] {
        justify-content: center;
    }
}
/* /Components/Pages/Shipping/FreightEdit.razor.rz.scp.css */
/* ===========================
   FreightEdit - Scoped Styles
   Flat Industrial Minimal
   =========================== */

/* Page Container */
.page-container[b-833ani1qtm] {
    max-width: 900px;
    margin: 0 auto;
    padding: var(--space-6) var(--space-4);
}

/* Header */
.page-header[b-833ani1qtm] {
    display: flex;
    align-items: center;
    gap: var(--space-4);
    margin-bottom: var(--space-6);
}

.btn-back[b-833ani1qtm] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    color: var(--text-muted);
    border: var(--border-width-thin) solid var(--border-color-light);
    text-decoration: none;
    transition: all var(--transition-fast) var(--transition-ease);
    flex-shrink: 0;
}

.btn-back:hover[b-833ani1qtm] {
    color: var(--color-primary);
    border-color: var(--color-primary);
    background-color: var(--color-gray-50);
    text-decoration: none;
}

.page-header-text[b-833ani1qtm] {
    flex: 1;
}

.page-title[b-833ani1qtm] {
    font-size: var(--font-size-xl);
    font-weight: var(--font-weight-bold);
    color: var(--color-primary);
    display: flex;
    align-items: center;
    gap: var(--space-2);
    margin: 0;
}

.page-title svg[b-833ani1qtm] {
    color: var(--color-primary);
    flex-shrink: 0;
}

.page-subtitle[b-833ani1qtm] {
    color: var(--text-muted);
    font-size: var(--font-size-sm);
    margin: 2px 0 0 0;
    display: flex;
    align-items: center;
    gap: var(--space-2);
}

.subtitle-code[b-833ani1qtm] {
    font-family: var(--font-mono);
    font-size: var(--font-size-xs);
    color: var(--color-primary);
    opacity: 0.6;
    padding: 1px var(--space-2);
    background-color: var(--color-gray-100);
}

/* Alert Bar */
.alert-bar[b-833ani1qtm] {
    display: flex;
    align-items: center;
    gap: var(--space-2);
    padding: var(--space-3) var(--space-4);
    margin-bottom: var(--space-4);
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-medium);
    border-left: var(--border-width-thick) solid;
}

.alert-bar-danger[b-833ani1qtm] {
    background-color: #fdeded;
    border-left-color: var(--color-danger);
    color: #5f2120;
}

.alert-bar-close[b-833ani1qtm] {
    margin-left: auto;
    background: none;
    border: none;
    font-size: var(--font-size-lg);
    cursor: pointer;
    color: inherit;
    opacity: 0.6;
    line-height: 1;
}

.alert-bar-close:hover[b-833ani1qtm] {
    opacity: 1;
}

/* Loading / Empty States */
.loading-state[b-833ani1qtm] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: var(--space-16) 0;
    color: var(--text-muted);
    gap: var(--space-4);
}

.empty-state[b-833ani1qtm] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: var(--space-16) 0;
    color: var(--text-muted);
    gap: var(--space-3);
}

.empty-state svg[b-833ani1qtm] {
    opacity: 0.4;
}

.empty-state-text[b-833ani1qtm] {
    font-size: var(--font-size-base);
    margin: 0;
}

/* Form Sections */
.form-section[b-833ani1qtm] {
    margin-bottom: var(--space-6);
    padding: var(--space-5);
    background-color: var(--color-white);
    border: var(--border-width-thin) solid var(--border-color-light);
}

.section-title[b-833ani1qtm] {
    display: flex;
    align-items: center;
    gap: var(--space-2);
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-semibold);
    color: var(--color-primary);
    text-transform: uppercase;
    letter-spacing: 0.5px;
    margin: 0 0 var(--space-4) 0;
    padding-bottom: var(--space-3);
    border-bottom: var(--border-width-thin) solid var(--border-color-light);
}

.section-title svg[b-833ani1qtm] {
    color: var(--color-primary);
    opacity: 0.6;
    flex-shrink: 0;
}

/* Form Grid */
.form-grid[b-833ani1qtm] {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: var(--space-4);
}

.form-group[b-833ani1qtm] {
    display: flex;
    flex-direction: column;
}

.form-group-wide[b-833ani1qtm] {
    grid-column: span 2;
}

/* Form Controls */
.form-label[b-833ani1qtm] {
    font-size: var(--font-size-xs);
    font-weight: var(--font-weight-medium);
    color: var(--text-secondary);
    text-transform: uppercase;
    letter-spacing: 0.3px;
    margin-bottom: var(--space-1);
}

.form-control[b-833ani1qtm] {
    padding: var(--space-2) var(--space-3);
    font-size: var(--font-size-sm);
    color: var(--color-gray-700);
    border: var(--border-width-thin) solid var(--border-color-light);
    background-color: var(--color-white);
    transition: border-color var(--transition-fast) var(--transition-ease);
}

.form-control:focus[b-833ani1qtm] {
    border-color: var(--color-primary);
    outline: none;
    box-shadow: none;
}

.form-control[b-833ani1qtm]::placeholder {
    color: var(--color-gray-400);
}

.form-control-static[b-833ani1qtm] {
    padding: var(--space-2) var(--space-3);
    font-size: var(--font-size-sm);
    color: var(--text-muted);
    background-color: var(--color-gray-50);
    border: var(--border-width-thin) solid var(--border-color-light);
    font-family: var(--font-mono);
}

/* Form Actions */
.form-actions[b-833ani1qtm] {
    display: flex;
    justify-content: flex-end;
    gap: var(--space-3);
    padding-top: var(--space-4);
    border-top: var(--border-width-thin) solid var(--border-color-light);
}

.form-actions .btn[b-833ani1qtm] {
    display: inline-flex;
    align-items: center;
    gap: var(--space-2);
    padding: var(--space-2) var(--space-5);
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-medium);
    cursor: pointer;
    text-decoration: none;
}

.btn-action[b-833ani1qtm] {
    background-color: var(--color-action);
    color: var(--text-on-action);
    border: var(--border-width-thin) solid var(--color-action);
    transition: background-color var(--transition-fast) var(--transition-ease);
}

.btn-action:hover[b-833ani1qtm] {
    background-color: var(--color-action-hover);
    border-color: var(--color-action-hover);
    color: var(--text-on-action);
}

.btn-action:disabled[b-833ani1qtm] {
    opacity: 0.65;
    cursor: not-allowed;
}

.btn-outline-primary[b-833ani1qtm] {
    background: transparent;
    color: var(--color-primary);
    border: var(--border-width-thin) solid var(--color-primary);
}

.btn-outline-primary:hover[b-833ani1qtm] {
    background-color: var(--color-primary);
    color: var(--text-on-primary);
    text-decoration: none;
}

/* Validation */
[b-833ani1qtm] .validation-message {
    color: var(--color-danger);
    font-size: var(--font-size-xs);
    margin-top: 2px;
}

/* Responsive */
@media (max-width: 768px) {
    .form-grid[b-833ani1qtm] {
        grid-template-columns: 1fr;
    }

    .form-group-wide[b-833ani1qtm] {
        grid-column: span 1;
    }

    .form-actions[b-833ani1qtm] {
        flex-direction: column-reverse;
    }

    .form-actions .btn[b-833ani1qtm] {
        justify-content: center;
    }
}
/* /Components/Pages/Shipping/FreightList.razor.rz.scp.css */
/* ===========================
   FreightList - Scoped Styles
   Flat Industrial Minimal
   =========================== */

/* Page Container */
.page-container[b-thsuvgwq15] {
    max-width: 1200px;
    margin: 0 auto;
    padding: var(--space-6) var(--space-4);
}

/* Header */
.page-header[b-thsuvgwq15] {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    margin-bottom: var(--space-6);
    gap: var(--space-4);
}

.page-header-left[b-thsuvgwq15] {
    flex: 1;
}

.page-header-right[b-thsuvgwq15] {
    flex-shrink: 0;
}

.page-title[b-thsuvgwq15] {
    font-size: var(--font-size-2xl);
    font-weight: var(--font-weight-bold);
    color: var(--color-primary);
    display: flex;
    align-items: center;
    gap: var(--space-2);
    margin: 0;
}

.page-title svg[b-thsuvgwq15] {
    color: var(--color-primary);
    flex-shrink: 0;
}

.page-subtitle[b-thsuvgwq15] {
    color: var(--text-muted);
    font-size: var(--font-size-sm);
    margin: var(--space-1) 0 0 0;
}

/* Action Button */
.btn-action[b-thsuvgwq15] {
    display: inline-flex;
    align-items: center;
    gap: var(--space-2);
    padding: var(--space-2) var(--space-4);
    background-color: var(--color-action);
    color: var(--text-on-action);
    border: var(--border-width-thin) solid var(--color-action);
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-medium);
    text-decoration: none;
    cursor: pointer;
    transition: background-color var(--transition-fast) var(--transition-ease),
                box-shadow var(--transition-fast) var(--transition-ease);
}

.btn-action:hover[b-thsuvgwq15] {
    background-color: var(--color-action-hover);
    border-color: var(--color-action-hover);
    color: var(--text-on-action);
    text-decoration: none;
    box-shadow: var(--shadow-sm);
}

.btn-action:active[b-thsuvgwq15] {
    background-color: var(--color-action-active);
}

/* Alert Bars */
.alert-bar[b-thsuvgwq15] {
    display: flex;
    align-items: center;
    gap: var(--space-2);
    padding: var(--space-3) var(--space-4);
    margin-bottom: var(--space-4);
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-medium);
    border-left: var(--border-width-thick) solid;
}

.alert-bar-success[b-thsuvgwq15] {
    background-color: #edf7ed;
    border-left-color: var(--color-success);
    color: #1e4620;
}

.alert-bar-danger[b-thsuvgwq15] {
    background-color: #fdeded;
    border-left-color: var(--color-danger);
    color: #5f2120;
}

.alert-bar-close[b-thsuvgwq15] {
    margin-left: auto;
    background: none;
    border: none;
    font-size: var(--font-size-lg);
    cursor: pointer;
    color: inherit;
    opacity: 0.6;
    line-height: 1;
}

.alert-bar-close:hover[b-thsuvgwq15] {
    opacity: 1;
}

/* Search Bar */
.search-bar[b-thsuvgwq15] {
    display: flex;
    align-items: center;
    gap: var(--space-4);
    margin-bottom: var(--space-4);
    padding: var(--space-3) var(--space-4);
    background-color: var(--bg-secondary);
    border: var(--border-width-thin) solid var(--border-color-light);
}

.search-input-wrapper[b-thsuvgwq15] {
    display: flex;
    align-items: center;
    flex: 1;
    position: relative;
}

.search-icon[b-thsuvgwq15] {
    color: var(--text-muted);
    flex-shrink: 0;
    margin-right: var(--space-2);
}

.search-input[b-thsuvgwq15] {
    flex: 1;
    border: none;
    background: transparent;
    font-size: var(--font-size-sm);
    color: var(--color-gray-700);
    outline: none;
    padding: var(--space-1) 0;
}

.search-input[b-thsuvgwq15]::placeholder {
    color: var(--text-muted);
}

.search-clear[b-thsuvgwq15] {
    background: none;
    border: none;
    cursor: pointer;
    color: var(--text-muted);
    padding: var(--space-1);
    display: flex;
    align-items: center;
}

.search-clear:hover[b-thsuvgwq15] {
    color: var(--color-primary);
}

.search-count[b-thsuvgwq15] {
    flex-shrink: 0;
    font-size: var(--font-size-xs);
    color: var(--text-muted);
    font-weight: var(--font-weight-medium);
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

/* Loading / Empty States */
.loading-state[b-thsuvgwq15] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: var(--space-16) 0;
    color: var(--text-muted);
    gap: var(--space-4);
}

.empty-state[b-thsuvgwq15] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: var(--space-16) 0;
    color: var(--text-muted);
    gap: var(--space-3);
}

.empty-state svg[b-thsuvgwq15] {
    opacity: 0.4;
}

.empty-state-text[b-thsuvgwq15] {
    font-size: var(--font-size-base);
    margin: 0;
}

/* Item List */
.item-list[b-thsuvgwq15] {
    display: flex;
    flex-direction: column;
    border: var(--border-width-thin) solid var(--border-color-light);
}

/* Item Row */
.item-row[b-thsuvgwq15] {
    display: flex;
    align-items: center;
    gap: var(--space-4);
    padding: var(--space-4);
    border-bottom: var(--border-width-thin) solid var(--border-color-light);
    transition: background-color var(--transition-fast) var(--transition-ease);
}

.item-row:last-child[b-thsuvgwq15] {
    border-bottom: none;
}

.item-row:hover[b-thsuvgwq15] {
    background-color: rgba(11, 36, 62, 0.03);
}

/* Avatar */
.item-avatar[b-thsuvgwq15] {
    flex-shrink: 0;
    width: 40px;
    height: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: var(--color-gray-100);
    color: var(--color-primary);
}

/* Item Info */
.item-info[b-thsuvgwq15] {
    flex: 1;
    min-width: 0;
}

.item-name[b-thsuvgwq15] {
    font-size: var(--font-size-base);
    font-weight: var(--font-weight-semibold);
    color: var(--color-primary);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.item-meta[b-thsuvgwq15] {
    display: flex;
    align-items: center;
    gap: var(--space-1);
    flex-wrap: wrap;
    font-size: var(--font-size-xs);
    color: var(--text-secondary);
    margin-top: 2px;
}

.item-code[b-thsuvgwq15] {
    font-family: var(--font-mono);
    font-weight: var(--font-weight-medium);
    color: var(--color-primary);
    opacity: 0.7;
}

.meta-separator[b-thsuvgwq15] {
    color: var(--color-gray-300);
}

/* Action Buttons */
.item-actions[b-thsuvgwq15] {
    flex-shrink: 0;
    display: flex;
    align-items: center;
    gap: var(--space-1);
}

.btn-icon[b-thsuvgwq15] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 36px;
    background: none;
    border: var(--border-width-thin) solid transparent;
    cursor: pointer;
    color: var(--text-muted);
    text-decoration: none;
    transition: all var(--transition-fast) var(--transition-ease);
}

.btn-icon:hover[b-thsuvgwq15] {
    color: var(--color-primary);
    background-color: var(--color-gray-100);
    border-color: var(--border-color-light);
    text-decoration: none;
}

.btn-icon-danger:hover[b-thsuvgwq15] {
    color: var(--color-action);
    background-color: rgba(178, 34, 34, 0.06);
    border-color: rgba(178, 34, 34, 0.2);
}

/* Overlay & Dialog */
.overlay[b-thsuvgwq15] {
    position: fixed;
    inset: 0;
    background-color: rgba(0, 0, 0, 0.4);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: var(--z-modal-backdrop);
}

.confirm-dialog[b-thsuvgwq15] {
    background-color: var(--color-white);
    padding: var(--space-8);
    max-width: 420px;
    width: 90%;
    box-shadow: var(--shadow-xl);
    text-align: center;
    z-index: var(--z-modal);
}

.confirm-icon[b-thsuvgwq15] {
    color: var(--color-action);
    margin-bottom: var(--space-4);
}

.confirm-dialog h3[b-thsuvgwq15] {
    font-size: var(--font-size-lg);
    font-weight: var(--font-weight-semibold);
    color: var(--color-primary);
    margin: 0 0 var(--space-2) 0;
}

.confirm-dialog p[b-thsuvgwq15] {
    font-size: var(--font-size-sm);
    color: var(--text-secondary);
    margin: 0 0 var(--space-2) 0;
}

.confirm-warning[b-thsuvgwq15] {
    font-size: var(--font-size-xs) !important;
    color: var(--color-action) !important;
    font-weight: var(--font-weight-medium);
}

.confirm-actions[b-thsuvgwq15] {
    display: flex;
    gap: var(--space-3);
    justify-content: center;
    margin-top: var(--space-6);
}

.confirm-actions .btn[b-thsuvgwq15] {
    min-width: 100px;
    padding: var(--space-2) var(--space-4);
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-medium);
    cursor: pointer;
}

/* Outline Primary Button */
.btn-outline-primary[b-thsuvgwq15] {
    background: transparent;
    color: var(--color-primary);
    border: var(--border-width-thin) solid var(--color-primary);
}

.btn-outline-primary:hover[b-thsuvgwq15] {
    background-color: var(--color-primary);
    color: var(--text-on-primary);
}

/* Responsive */
@media (max-width: 768px) {
    .page-header[b-thsuvgwq15] {
        flex-direction: column;
        gap: var(--space-3);
    }

    .item-row[b-thsuvgwq15] {
        flex-wrap: wrap;
    }

    .item-actions[b-thsuvgwq15] {
        width: 100%;
        justify-content: flex-end;
    }
}
/* /Components/Pages/Shipping/GoodsPresentationCreate.razor.rz.scp.css */
/* ===========================
   GoodsPresentationCreate - Scoped Styles
   Flat Industrial Minimal
   =========================== */

/* Page Container */
.page-container[b-jcqvlgsfh6] {
    max-width: 900px;
    margin: 0 auto;
    padding: var(--space-6) var(--space-4);
}

/* Header */
.page-header[b-jcqvlgsfh6] {
    display: flex;
    align-items: center;
    gap: var(--space-4);
    margin-bottom: var(--space-6);
}

.btn-back[b-jcqvlgsfh6] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    color: var(--text-muted);
    border: var(--border-width-thin) solid var(--border-color-light);
    text-decoration: none;
    transition: all var(--transition-fast) var(--transition-ease);
    flex-shrink: 0;
}

.btn-back:hover[b-jcqvlgsfh6] {
    color: var(--color-primary);
    border-color: var(--color-primary);
    background-color: var(--color-gray-50);
    text-decoration: none;
}

.page-header-text[b-jcqvlgsfh6] {
    flex: 1;
}

.page-title[b-jcqvlgsfh6] {
    font-size: var(--font-size-xl);
    font-weight: var(--font-weight-bold);
    color: var(--color-primary);
    display: flex;
    align-items: center;
    gap: var(--space-2);
    margin: 0;
}

.page-title svg[b-jcqvlgsfh6] {
    color: var(--color-primary);
    flex-shrink: 0;
}

.page-subtitle[b-jcqvlgsfh6] {
    color: var(--text-muted);
    font-size: var(--font-size-sm);
    margin: 2px 0 0 0;
}

/* Alert Bar */
.alert-bar[b-jcqvlgsfh6] {
    display: flex;
    align-items: center;
    gap: var(--space-2);
    padding: var(--space-3) var(--space-4);
    margin-bottom: var(--space-4);
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-medium);
    border-left: var(--border-width-thick) solid;
}

.alert-bar-danger[b-jcqvlgsfh6] {
    background-color: #fdeded;
    border-left-color: var(--color-danger);
    color: #5f2120;
}

.alert-bar-close[b-jcqvlgsfh6] {
    margin-left: auto;
    background: none;
    border: none;
    font-size: var(--font-size-lg);
    cursor: pointer;
    color: inherit;
    opacity: 0.6;
    line-height: 1;
}

.alert-bar-close:hover[b-jcqvlgsfh6] {
    opacity: 1;
}

/* Form Sections */
.form-section[b-jcqvlgsfh6] {
    margin-bottom: var(--space-6);
    padding: var(--space-5);
    background-color: var(--color-white);
    border: var(--border-width-thin) solid var(--border-color-light);
}

.section-title[b-jcqvlgsfh6] {
    display: flex;
    align-items: center;
    gap: var(--space-2);
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-semibold);
    color: var(--color-primary);
    text-transform: uppercase;
    letter-spacing: 0.5px;
    margin: 0 0 var(--space-4) 0;
    padding-bottom: var(--space-3);
    border-bottom: var(--border-width-thin) solid var(--border-color-light);
}

.section-title svg[b-jcqvlgsfh6] {
    color: var(--color-primary);
    opacity: 0.6;
    flex-shrink: 0;
}

/* Form Grid */
.form-grid[b-jcqvlgsfh6] {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: var(--space-4);
}

.form-group[b-jcqvlgsfh6] {
    display: flex;
    flex-direction: column;
}

.form-group-wide[b-jcqvlgsfh6] {
    grid-column: span 2;
}

/* Form Controls */
.form-label[b-jcqvlgsfh6] {
    font-size: var(--font-size-xs);
    font-weight: var(--font-weight-medium);
    color: var(--text-secondary);
    text-transform: uppercase;
    letter-spacing: 0.3px;
    margin-bottom: var(--space-1);
}

.form-control[b-jcqvlgsfh6] {
    padding: var(--space-2) var(--space-3);
    font-size: var(--font-size-sm);
    color: var(--color-gray-700);
    border: var(--border-width-thin) solid var(--border-color-light);
    background-color: var(--color-white);
    transition: border-color var(--transition-fast) var(--transition-ease);
}

.form-control:focus[b-jcqvlgsfh6] {
    border-color: var(--color-primary);
    outline: none;
    box-shadow: none;
}

.form-control[b-jcqvlgsfh6]::placeholder {
    color: var(--color-gray-400);
}

/* Form Actions */
.form-actions[b-jcqvlgsfh6] {
    display: flex;
    justify-content: flex-end;
    gap: var(--space-3);
    padding-top: var(--space-4);
    border-top: var(--border-width-thin) solid var(--border-color-light);
}

.form-actions .btn[b-jcqvlgsfh6] {
    display: inline-flex;
    align-items: center;
    gap: var(--space-2);
    padding: var(--space-2) var(--space-5);
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-medium);
    cursor: pointer;
    text-decoration: none;
}

.btn-action[b-jcqvlgsfh6] {
    background-color: var(--color-action);
    color: var(--text-on-action);
    border: var(--border-width-thin) solid var(--color-action);
    transition: background-color var(--transition-fast) var(--transition-ease);
}

.btn-action:hover[b-jcqvlgsfh6] {
    background-color: var(--color-action-hover);
    border-color: var(--color-action-hover);
    color: var(--text-on-action);
}

.btn-action:disabled[b-jcqvlgsfh6] {
    opacity: 0.65;
    cursor: not-allowed;
}

.btn-outline-primary[b-jcqvlgsfh6] {
    background: transparent;
    color: var(--color-primary);
    border: var(--border-width-thin) solid var(--color-primary);
}

.btn-outline-primary:hover[b-jcqvlgsfh6] {
    background-color: var(--color-primary);
    color: var(--text-on-primary);
    text-decoration: none;
}

/* Validation */
[b-jcqvlgsfh6] .validation-message {
    color: var(--color-danger);
    font-size: var(--font-size-xs);
    margin-top: 2px;
}

/* Responsive */
@media (max-width: 768px) {
    .form-grid[b-jcqvlgsfh6] {
        grid-template-columns: 1fr;
    }

    .form-group-wide[b-jcqvlgsfh6] {
        grid-column: span 1;
    }

    .form-actions[b-jcqvlgsfh6] {
        flex-direction: column-reverse;
    }

    .form-actions .btn[b-jcqvlgsfh6] {
        justify-content: center;
    }
}
/* /Components/Pages/Shipping/GoodsPresentationEdit.razor.rz.scp.css */
/* ===========================
   GoodsPresentationEdit - Scoped Styles
   Flat Industrial Minimal
   =========================== */

/* Page Container */
.page-container[b-nq0ocozx2v] {
    max-width: 900px;
    margin: 0 auto;
    padding: var(--space-6) var(--space-4);
}

/* Header */
.page-header[b-nq0ocozx2v] {
    display: flex;
    align-items: center;
    gap: var(--space-4);
    margin-bottom: var(--space-6);
}

.btn-back[b-nq0ocozx2v] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    color: var(--text-muted);
    border: var(--border-width-thin) solid var(--border-color-light);
    text-decoration: none;
    transition: all var(--transition-fast) var(--transition-ease);
    flex-shrink: 0;
}

.btn-back:hover[b-nq0ocozx2v] {
    color: var(--color-primary);
    border-color: var(--color-primary);
    background-color: var(--color-gray-50);
    text-decoration: none;
}

.page-header-text[b-nq0ocozx2v] {
    flex: 1;
}

.page-title[b-nq0ocozx2v] {
    font-size: var(--font-size-xl);
    font-weight: var(--font-weight-bold);
    color: var(--color-primary);
    display: flex;
    align-items: center;
    gap: var(--space-2);
    margin: 0;
}

.page-title svg[b-nq0ocozx2v] {
    color: var(--color-primary);
    flex-shrink: 0;
}

.page-subtitle[b-nq0ocozx2v] {
    color: var(--text-muted);
    font-size: var(--font-size-sm);
    margin: 2px 0 0 0;
    display: flex;
    align-items: center;
    gap: var(--space-2);
}

.subtitle-code[b-nq0ocozx2v] {
    font-family: var(--font-mono);
    font-size: var(--font-size-xs);
    color: var(--color-primary);
    opacity: 0.6;
    padding: 1px var(--space-2);
    background-color: var(--color-gray-100);
}

/* Alert Bar */
.alert-bar[b-nq0ocozx2v] {
    display: flex;
    align-items: center;
    gap: var(--space-2);
    padding: var(--space-3) var(--space-4);
    margin-bottom: var(--space-4);
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-medium);
    border-left: var(--border-width-thick) solid;
}

.alert-bar-danger[b-nq0ocozx2v] {
    background-color: #fdeded;
    border-left-color: var(--color-danger);
    color: #5f2120;
}

.alert-bar-close[b-nq0ocozx2v] {
    margin-left: auto;
    background: none;
    border: none;
    font-size: var(--font-size-lg);
    cursor: pointer;
    color: inherit;
    opacity: 0.6;
    line-height: 1;
}

.alert-bar-close:hover[b-nq0ocozx2v] {
    opacity: 1;
}

/* Loading / Empty States */
.loading-state[b-nq0ocozx2v] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: var(--space-16) 0;
    color: var(--text-muted);
    gap: var(--space-4);
}

.empty-state[b-nq0ocozx2v] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: var(--space-16) 0;
    color: var(--text-muted);
    gap: var(--space-3);
}

.empty-state svg[b-nq0ocozx2v] {
    opacity: 0.4;
}

.empty-state-text[b-nq0ocozx2v] {
    font-size: var(--font-size-base);
    margin: 0;
}

/* Form Sections */
.form-section[b-nq0ocozx2v] {
    margin-bottom: var(--space-6);
    padding: var(--space-5);
    background-color: var(--color-white);
    border: var(--border-width-thin) solid var(--border-color-light);
}

.section-title[b-nq0ocozx2v] {
    display: flex;
    align-items: center;
    gap: var(--space-2);
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-semibold);
    color: var(--color-primary);
    text-transform: uppercase;
    letter-spacing: 0.5px;
    margin: 0 0 var(--space-4) 0;
    padding-bottom: var(--space-3);
    border-bottom: var(--border-width-thin) solid var(--border-color-light);
}

.section-title svg[b-nq0ocozx2v] {
    color: var(--color-primary);
    opacity: 0.6;
    flex-shrink: 0;
}

/* Form Grid */
.form-grid[b-nq0ocozx2v] {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: var(--space-4);
}

.form-group[b-nq0ocozx2v] {
    display: flex;
    flex-direction: column;
}

.form-group-wide[b-nq0ocozx2v] {
    grid-column: span 2;
}

/* Form Controls */
.form-label[b-nq0ocozx2v] {
    font-size: var(--font-size-xs);
    font-weight: var(--font-weight-medium);
    color: var(--text-secondary);
    text-transform: uppercase;
    letter-spacing: 0.3px;
    margin-bottom: var(--space-1);
}

.form-control[b-nq0ocozx2v] {
    padding: var(--space-2) var(--space-3);
    font-size: var(--font-size-sm);
    color: var(--color-gray-700);
    border: var(--border-width-thin) solid var(--border-color-light);
    background-color: var(--color-white);
    transition: border-color var(--transition-fast) var(--transition-ease);
}

.form-control:focus[b-nq0ocozx2v] {
    border-color: var(--color-primary);
    outline: none;
    box-shadow: none;
}

.form-control[b-nq0ocozx2v]::placeholder {
    color: var(--color-gray-400);
}

.form-control-static[b-nq0ocozx2v] {
    padding: var(--space-2) var(--space-3);
    font-size: var(--font-size-sm);
    color: var(--text-muted);
    background-color: var(--color-gray-50);
    border: var(--border-width-thin) solid var(--border-color-light);
    font-family: var(--font-mono);
}

/* Form Actions */
.form-actions[b-nq0ocozx2v] {
    display: flex;
    justify-content: flex-end;
    gap: var(--space-3);
    padding-top: var(--space-4);
    border-top: var(--border-width-thin) solid var(--border-color-light);
}

.form-actions .btn[b-nq0ocozx2v] {
    display: inline-flex;
    align-items: center;
    gap: var(--space-2);
    padding: var(--space-2) var(--space-5);
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-medium);
    cursor: pointer;
    text-decoration: none;
}

.btn-action[b-nq0ocozx2v] {
    background-color: var(--color-action);
    color: var(--text-on-action);
    border: var(--border-width-thin) solid var(--color-action);
    transition: background-color var(--transition-fast) var(--transition-ease);
}

.btn-action:hover[b-nq0ocozx2v] {
    background-color: var(--color-action-hover);
    border-color: var(--color-action-hover);
    color: var(--text-on-action);
}

.btn-action:disabled[b-nq0ocozx2v] {
    opacity: 0.65;
    cursor: not-allowed;
}

.btn-outline-primary[b-nq0ocozx2v] {
    background: transparent;
    color: var(--color-primary);
    border: var(--border-width-thin) solid var(--color-primary);
}

.btn-outline-primary:hover[b-nq0ocozx2v] {
    background-color: var(--color-primary);
    color: var(--text-on-primary);
    text-decoration: none;
}

/* Validation */
[b-nq0ocozx2v] .validation-message {
    color: var(--color-danger);
    font-size: var(--font-size-xs);
    margin-top: 2px;
}

/* Responsive */
@media (max-width: 768px) {
    .form-grid[b-nq0ocozx2v] {
        grid-template-columns: 1fr;
    }

    .form-group-wide[b-nq0ocozx2v] {
        grid-column: span 1;
    }

    .form-actions[b-nq0ocozx2v] {
        flex-direction: column-reverse;
    }

    .form-actions .btn[b-nq0ocozx2v] {
        justify-content: center;
    }
}
/* /Components/Pages/Shipping/GoodsPresentationList.razor.rz.scp.css */
/* ===========================
   GoodsPresentationList - Scoped Styles
   Flat Industrial Minimal
   =========================== */

/* Page Container */
.page-container[b-ak2iltyzln] {
    max-width: 1200px;
    margin: 0 auto;
    padding: var(--space-6) var(--space-4);
}

/* Header */
.page-header[b-ak2iltyzln] {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    margin-bottom: var(--space-6);
    gap: var(--space-4);
}

.page-header-left[b-ak2iltyzln] {
    flex: 1;
}

.page-header-right[b-ak2iltyzln] {
    flex-shrink: 0;
}

.page-title[b-ak2iltyzln] {
    font-size: var(--font-size-2xl);
    font-weight: var(--font-weight-bold);
    color: var(--color-primary);
    display: flex;
    align-items: center;
    gap: var(--space-2);
    margin: 0;
}

.page-title svg[b-ak2iltyzln] {
    color: var(--color-primary);
    flex-shrink: 0;
}

.page-subtitle[b-ak2iltyzln] {
    color: var(--text-muted);
    font-size: var(--font-size-sm);
    margin: var(--space-1) 0 0 0;
}

/* Action Button */
.btn-action[b-ak2iltyzln] {
    display: inline-flex;
    align-items: center;
    gap: var(--space-2);
    padding: var(--space-2) var(--space-4);
    background-color: var(--color-action);
    color: var(--text-on-action);
    border: var(--border-width-thin) solid var(--color-action);
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-medium);
    text-decoration: none;
    cursor: pointer;
    transition: background-color var(--transition-fast) var(--transition-ease),
                box-shadow var(--transition-fast) var(--transition-ease);
}

.btn-action:hover[b-ak2iltyzln] {
    background-color: var(--color-action-hover);
    border-color: var(--color-action-hover);
    color: var(--text-on-action);
    text-decoration: none;
    box-shadow: var(--shadow-sm);
}

.btn-action:active[b-ak2iltyzln] {
    background-color: var(--color-action-active);
}

/* Alert Bars */
.alert-bar[b-ak2iltyzln] {
    display: flex;
    align-items: center;
    gap: var(--space-2);
    padding: var(--space-3) var(--space-4);
    margin-bottom: var(--space-4);
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-medium);
    border-left: var(--border-width-thick) solid;
}

.alert-bar-success[b-ak2iltyzln] {
    background-color: #edf7ed;
    border-left-color: var(--color-success);
    color: #1e4620;
}

.alert-bar-danger[b-ak2iltyzln] {
    background-color: #fdeded;
    border-left-color: var(--color-danger);
    color: #5f2120;
}

.alert-bar-close[b-ak2iltyzln] {
    margin-left: auto;
    background: none;
    border: none;
    font-size: var(--font-size-lg);
    cursor: pointer;
    color: inherit;
    opacity: 0.6;
    line-height: 1;
}

.alert-bar-close:hover[b-ak2iltyzln] {
    opacity: 1;
}

/* Search Bar */
.search-bar[b-ak2iltyzln] {
    display: flex;
    align-items: center;
    gap: var(--space-4);
    margin-bottom: var(--space-4);
    padding: var(--space-3) var(--space-4);
    background-color: var(--bg-secondary);
    border: var(--border-width-thin) solid var(--border-color-light);
}

.search-input-wrapper[b-ak2iltyzln] {
    display: flex;
    align-items: center;
    flex: 1;
    position: relative;
}

.search-icon[b-ak2iltyzln] {
    color: var(--text-muted);
    flex-shrink: 0;
    margin-right: var(--space-2);
}

.search-input[b-ak2iltyzln] {
    flex: 1;
    border: none;
    background: transparent;
    font-size: var(--font-size-sm);
    color: var(--color-gray-700);
    outline: none;
    padding: var(--space-1) 0;
}

.search-input[b-ak2iltyzln]::placeholder {
    color: var(--text-muted);
}

.search-clear[b-ak2iltyzln] {
    background: none;
    border: none;
    cursor: pointer;
    color: var(--text-muted);
    padding: var(--space-1);
    display: flex;
    align-items: center;
}

.search-clear:hover[b-ak2iltyzln] {
    color: var(--color-primary);
}

.search-count[b-ak2iltyzln] {
    flex-shrink: 0;
    font-size: var(--font-size-xs);
    color: var(--text-muted);
    font-weight: var(--font-weight-medium);
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

/* Loading / Empty States */
.loading-state[b-ak2iltyzln] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: var(--space-16) 0;
    color: var(--text-muted);
    gap: var(--space-4);
}

.empty-state[b-ak2iltyzln] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: var(--space-16) 0;
    color: var(--text-muted);
    gap: var(--space-3);
}

.empty-state svg[b-ak2iltyzln] {
    opacity: 0.4;
}

.empty-state-text[b-ak2iltyzln] {
    font-size: var(--font-size-base);
    margin: 0;
}

/* Item List */
.item-list[b-ak2iltyzln] {
    display: flex;
    flex-direction: column;
    border: var(--border-width-thin) solid var(--border-color-light);
}

/* Item Row */
.item-row[b-ak2iltyzln] {
    display: flex;
    align-items: center;
    gap: var(--space-4);
    padding: var(--space-4);
    border-bottom: var(--border-width-thin) solid var(--border-color-light);
    transition: background-color var(--transition-fast) var(--transition-ease);
}

.item-row:last-child[b-ak2iltyzln] {
    border-bottom: none;
}

.item-row:hover[b-ak2iltyzln] {
    background-color: rgba(11, 36, 62, 0.03);
}

/* Avatar */
.item-avatar[b-ak2iltyzln] {
    flex-shrink: 0;
    width: 40px;
    height: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: var(--color-gray-100);
    color: var(--color-primary);
}

/* Item Info */
.item-info[b-ak2iltyzln] {
    flex: 1;
    min-width: 0;
}

.item-name[b-ak2iltyzln] {
    font-size: var(--font-size-base);
    font-weight: var(--font-weight-semibold);
    color: var(--color-primary);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.item-meta[b-ak2iltyzln] {
    display: flex;
    align-items: center;
    gap: var(--space-1);
    flex-wrap: wrap;
    font-size: var(--font-size-xs);
    color: var(--text-secondary);
    margin-top: 2px;
}

.item-code[b-ak2iltyzln] {
    font-family: var(--font-mono);
    font-weight: var(--font-weight-medium);
    color: var(--color-primary);
    opacity: 0.7;
}

.meta-separator[b-ak2iltyzln] {
    color: var(--color-gray-300);
}

/* Action Buttons */
.item-actions[b-ak2iltyzln] {
    flex-shrink: 0;
    display: flex;
    align-items: center;
    gap: var(--space-1);
}

.btn-icon[b-ak2iltyzln] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 36px;
    background: none;
    border: var(--border-width-thin) solid transparent;
    cursor: pointer;
    color: var(--text-muted);
    text-decoration: none;
    transition: all var(--transition-fast) var(--transition-ease);
}

.btn-icon:hover[b-ak2iltyzln] {
    color: var(--color-primary);
    background-color: var(--color-gray-100);
    border-color: var(--border-color-light);
    text-decoration: none;
}

.btn-icon-danger:hover[b-ak2iltyzln] {
    color: var(--color-action);
    background-color: rgba(178, 34, 34, 0.06);
    border-color: rgba(178, 34, 34, 0.2);
}

/* Overlay & Dialog */
.overlay[b-ak2iltyzln] {
    position: fixed;
    inset: 0;
    background-color: rgba(0, 0, 0, 0.4);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: var(--z-modal-backdrop);
}

.confirm-dialog[b-ak2iltyzln] {
    background-color: var(--color-white);
    padding: var(--space-8);
    max-width: 420px;
    width: 90%;
    box-shadow: var(--shadow-xl);
    text-align: center;
    z-index: var(--z-modal);
}

.confirm-icon[b-ak2iltyzln] {
    color: var(--color-action);
    margin-bottom: var(--space-4);
}

.confirm-dialog h3[b-ak2iltyzln] {
    font-size: var(--font-size-lg);
    font-weight: var(--font-weight-semibold);
    color: var(--color-primary);
    margin: 0 0 var(--space-2) 0;
}

.confirm-dialog p[b-ak2iltyzln] {
    font-size: var(--font-size-sm);
    color: var(--text-secondary);
    margin: 0 0 var(--space-2) 0;
}

.confirm-warning[b-ak2iltyzln] {
    font-size: var(--font-size-xs) !important;
    color: var(--color-action) !important;
    font-weight: var(--font-weight-medium);
}

.confirm-actions[b-ak2iltyzln] {
    display: flex;
    gap: var(--space-3);
    justify-content: center;
    margin-top: var(--space-6);
}

.confirm-actions .btn[b-ak2iltyzln] {
    min-width: 100px;
    padding: var(--space-2) var(--space-4);
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-medium);
    cursor: pointer;
}

/* Outline Primary Button */
.btn-outline-primary[b-ak2iltyzln] {
    background: transparent;
    color: var(--color-primary);
    border: var(--border-width-thin) solid var(--color-primary);
}

.btn-outline-primary:hover[b-ak2iltyzln] {
    background-color: var(--color-primary);
    color: var(--text-on-primary);
}

/* Responsive */
@media (max-width: 768px) {
    .page-header[b-ak2iltyzln] {
        flex-direction: column;
        gap: var(--space-3);
    }

    .item-row[b-ak2iltyzln] {
        flex-wrap: wrap;
    }

    .item-actions[b-ak2iltyzln] {
        width: 100%;
        justify-content: flex-end;
    }
}
/* /Components/Pages/Shipping/LogisticsEquipmentCreate.razor.rz.scp.css */
/* ===========================
   LogisticsEquipmentCreate - Scoped Styles
   Flat Industrial Minimal
   =========================== */

/* Page Container */
.page-container[b-av5t0y0iwl] {
    max-width: 900px;
    margin: 0 auto;
    padding: var(--space-6) var(--space-4);
}

/* Header */
.page-header[b-av5t0y0iwl] {
    display: flex;
    align-items: center;
    gap: var(--space-4);
    margin-bottom: var(--space-6);
}

.btn-back[b-av5t0y0iwl] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    color: var(--text-muted);
    border: var(--border-width-thin) solid var(--border-color-light);
    text-decoration: none;
    transition: all var(--transition-fast) var(--transition-ease);
    flex-shrink: 0;
}

.btn-back:hover[b-av5t0y0iwl] {
    color: var(--color-primary);
    border-color: var(--color-primary);
    background-color: var(--color-gray-50);
    text-decoration: none;
}

.page-header-text[b-av5t0y0iwl] {
    flex: 1;
}

.page-title[b-av5t0y0iwl] {
    font-size: var(--font-size-xl);
    font-weight: var(--font-weight-bold);
    color: var(--color-primary);
    display: flex;
    align-items: center;
    gap: var(--space-2);
    margin: 0;
}

.page-title svg[b-av5t0y0iwl] {
    color: var(--color-primary);
    flex-shrink: 0;
}

.page-subtitle[b-av5t0y0iwl] {
    color: var(--text-muted);
    font-size: var(--font-size-sm);
    margin: 2px 0 0 0;
}

/* Alert Bar */
.alert-bar[b-av5t0y0iwl] {
    display: flex;
    align-items: center;
    gap: var(--space-2);
    padding: var(--space-3) var(--space-4);
    margin-bottom: var(--space-4);
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-medium);
    border-left: var(--border-width-thick) solid;
}

.alert-bar-danger[b-av5t0y0iwl] {
    background-color: #fdeded;
    border-left-color: var(--color-danger);
    color: #5f2120;
}

.alert-bar-close[b-av5t0y0iwl] {
    margin-left: auto;
    background: none;
    border: none;
    font-size: var(--font-size-lg);
    cursor: pointer;
    color: inherit;
    opacity: 0.6;
    line-height: 1;
}

.alert-bar-close:hover[b-av5t0y0iwl] {
    opacity: 1;
}

/* Form Sections */
.form-section[b-av5t0y0iwl] {
    margin-bottom: var(--space-6);
    padding: var(--space-5);
    background-color: var(--color-white);
    border: var(--border-width-thin) solid var(--border-color-light);
}

.section-title[b-av5t0y0iwl] {
    display: flex;
    align-items: center;
    gap: var(--space-2);
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-semibold);
    color: var(--color-primary);
    text-transform: uppercase;
    letter-spacing: 0.5px;
    margin: 0 0 var(--space-4) 0;
    padding-bottom: var(--space-3);
    border-bottom: var(--border-width-thin) solid var(--border-color-light);
}

.section-title svg[b-av5t0y0iwl] {
    color: var(--color-primary);
    opacity: 0.6;
    flex-shrink: 0;
}

/* Form Grid */
.form-grid[b-av5t0y0iwl] {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: var(--space-4);
}

.form-group[b-av5t0y0iwl] {
    display: flex;
    flex-direction: column;
}

.form-group-wide[b-av5t0y0iwl] {
    grid-column: span 2;
}

/* Form Controls */
.form-label[b-av5t0y0iwl] {
    font-size: var(--font-size-xs);
    font-weight: var(--font-weight-medium);
    color: var(--text-secondary);
    text-transform: uppercase;
    letter-spacing: 0.3px;
    margin-bottom: var(--space-1);
}

.form-control[b-av5t0y0iwl] {
    padding: var(--space-2) var(--space-3);
    font-size: var(--font-size-sm);
    color: var(--color-gray-700);
    border: var(--border-width-thin) solid var(--border-color-light);
    background-color: var(--color-white);
    transition: border-color var(--transition-fast) var(--transition-ease);
}

.form-control:focus[b-av5t0y0iwl] {
    border-color: var(--color-primary);
    outline: none;
    box-shadow: none;
}

.form-control[b-av5t0y0iwl]::placeholder {
    color: var(--color-gray-400);
}

/* Form Actions */
.form-actions[b-av5t0y0iwl] {
    display: flex;
    justify-content: flex-end;
    gap: var(--space-3);
    padding-top: var(--space-4);
    border-top: var(--border-width-thin) solid var(--border-color-light);
}

.form-actions .btn[b-av5t0y0iwl] {
    display: inline-flex;
    align-items: center;
    gap: var(--space-2);
    padding: var(--space-2) var(--space-5);
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-medium);
    cursor: pointer;
    text-decoration: none;
}

.btn-action[b-av5t0y0iwl] {
    background-color: var(--color-action);
    color: var(--text-on-action);
    border: var(--border-width-thin) solid var(--color-action);
    transition: background-color var(--transition-fast) var(--transition-ease);
}

.btn-action:hover[b-av5t0y0iwl] {
    background-color: var(--color-action-hover);
}
/* /Components/Pages/Shipping/LogisticsEquipmentEdit.razor.rz.scp.css */
/* ===========================
   LogisticsEquipmentEdit - Scoped Styles
   Flat Industrial Minimal
   =========================== */

/* Page Container */
.page-container[b-4idbgrr4a1] {
    max-width: 900px;
    margin: 0 auto;
    padding: var(--space-6) var(--space-4);
}

/* Header */
.page-header[b-4idbgrr4a1] {
    display: flex;
    align-items: center;
    gap: var(--space-4);
    margin-bottom: var(--space-6);
}

.btn-back[b-4idbgrr4a1] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    color: var(--text-muted);
    border: var(--border-width-thin) solid var(--border-color-light);
    text-decoration: none;
    transition: all var(--transition-fast) var(--transition-ease);
    flex-shrink: 0;
}

.btn-back:hover[b-4idbgrr4a1] {
    color: var(--color-primary);
    border-color: var(--color-primary);
    background-color: var(--color-gray-50);
    text-decoration: none;
}

.page-header-text[b-4idbgrr4a1] {
    flex: 1;
}

.page-title[b-4idbgrr4a1] {
    font-size: var(--font-size-xl);
    font-weight: var(--font-weight-bold);
    color: var(--color-primary);
    display: flex;
    align-items: center;
    gap: var(--space-2);
    margin: 0;
}

.page-title svg[b-4idbgrr4a1] {
    color: var(--color-primary);
    flex-shrink: 0;
}

.page-subtitle[b-4idbgrr4a1] {
    color: var(--text-muted);
    font-size: var(--font-size-sm);
    margin: 2px 0 0 0;
    display: flex;
    align-items: center;
    gap: var(--space-2);
}

.subtitle-code[b-4idbgrr4a1] {
    font-family: var(--font-mono);
    font-size: var(--font-size-xs);
    color: var(--color-primary);
    opacity: 0.6;
    padding: 1px var(--space-2);
    background-color: var(--color-gray-100);
}

/* Alert Bar */
.alert-bar[b-4idbgrr4a1] {
    display: flex;
    align-items: center;
    gap: var(--space-2);
    padding: var(--space-3) var(--space-4);
    margin-bottom: var(--space-4);
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-medium);
    border-left: var(--border-width-thick) solid;
}

.alert-bar-danger[b-4idbgrr4a1] {
    background-color: #fdeded;
    border-left-color: var(--color-danger);
    color: #5f2120;
}

.alert-bar-close[b-4idbgrr4a1] {
    margin-left: auto;
    background: none;
    border: none;
    font-size: var(--font-size-lg);
    cursor: pointer;
    color: inherit;
    opacity: 0.6;
    line-height: 1;
}

.alert-bar-close:hover[b-4idbgrr4a1] {
    opacity: 1;
}

/* Loading / Empty States */
.loading-state[b-4idbgrr4a1] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: var(--space-16) 0;
    color: var(--text-muted);
    gap: var(--space-4);
}

.empty-state[b-4idbgrr4a1] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: var(--space-16) 0;
    color: var(--text-muted);
    gap: var(--space-3);
}

.empty-state svg[b-4idbgrr4a1] {
    opacity: 0.4;
}

.empty-state-text[b-4idbgrr4a1] {
    font-size: var(--font-size-base);
    margin: 0;
}

/* Form Sections */
.form-section[b-4idbgrr4a1] {
    margin-bottom: var(--space-6);
    padding: var(--space-5);
    background-color: var(--color-white);
    border: var(--border-width-thin) solid var(--border-color-light);
}

.section-title[b-4idbgrr4a1] {
    display: flex;
    align-items: center;
    gap: var(--space-2);
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-semibold);
    color: var(--color-primary);
    text-transform: uppercase;
    letter-spacing: 0.5px;
    margin: 0 0 var(--space-4) 0;
    padding-bottom: var(--space-3);
    border-bottom: var(--border-width-thin) solid var(--border-color-light);
}

.section-title svg[b-4idbgrr4a1] {
    color: var(--color-primary);
    opacity: 0.6;
    flex-shrink: 0;
}

/* Form Grid */
.form-grid[b-4idbgrr4a1] {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: var(--space-4);
}

.form-group[b-4idbgrr4a1] {
    display: flex;
    flex-direction: column;
}

.form-group-wide[b-4idbgrr4a1] {
    grid-column: span 2;
}

/* Form Controls */
.form-label[b-4idbgrr4a1] {
    font-size: var(--font-size-xs);
    font-weight: var(--font-weight-medium);
    color: var(--text-secondary);
    text-transform: uppercase;
    letter-spacing: 0.3px;
    margin-bottom: var(--space-1);
}

.form-control[b-4idbgrr4a1] {
    padding: var(--space-2) var(--space-3);
    font-size: var(--font-size-sm);
    color: var(--color-gray-700);
    border: var(--border-width-thin) solid var(--border-color-light);
    background-color: var(--color-white);
    transition: border-color var(--transition-fast) var(--transition-ease);
}

.form-control:focus[b-4idbgrr4a1] {
    border-color: var(--color-primary);
    outline: none;
    box-shadow: none;
}

.form-control[b-4idbgrr4a1]::placeholder {
    color: var(--color-gray-400);
}

.form-control-static[b-4idbgrr4a1] {
    padding: var(--space-2) var(--space-3);
    font-size: var(--font-size-sm);
    color: var(--color-gray-500);
    background-color: var(--color-gray-50);
    border: var(--border-width-thin) solid var(--border-color-light);
    font-family: var(--font-mono);
}

/* Form Actions */
.form-actions[b-4idbgrr4a1] {
    display: flex;
    justify-content: flex-end;
    gap: var(--space-3);
    padding-top: var(--space-4);
    border-top: var(--border-width-thin) solid var(--border-color-light);
}

.form-actions .btn[b-4idbgrr4a1] {
    display: inline-flex;
    align-items: center;
    gap: var(--space-2);
    padding: var(--space-2) var(--space-5);
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-medium);
    cursor: pointer;
    text-decoration: none;
}

.btn-action[b-4idbgrr4a1] {
    background-color: var(--color-action);
    color: var(--text-on-action);
    border: var(--border-width-thin) solid var(--color-action);
    transition: background-color var(--transition-fast) var(--transition-ease);
}

.btn-action:hover[b-4idbgrr4a1] {
    background-color: var(--color-action-hover);
}
/* /Components/Pages/Shipping/LogisticsEquipmentList.razor.rz.scp.css */
/* ===========================
   LogisticsEquipmentList - Scoped Styles
   Flat Industrial Minimal
   =========================== */

/* Page Container */
.page-container[b-b6uqxehxw8] {
    max-width: 1200px;
    margin: 0 auto;
    padding: var(--space-6) var(--space-4);
}

/* Header */
.page-header[b-b6uqxehxw8] {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    margin-bottom: var(--space-6);
    gap: var(--space-4);
}

.page-header-left[b-b6uqxehxw8] {
    flex: 1;
}

.page-header-right[b-b6uqxehxw8] {
    flex-shrink: 0;
}

.page-title[b-b6uqxehxw8] {
    font-size: var(--font-size-2xl);
    font-weight: var(--font-weight-bold);
    color: var(--color-primary);
    display: flex;
    align-items: center;
    gap: var(--space-2);
    margin: 0;
}

.page-title svg[b-b6uqxehxw8] {
    color: var(--color-primary);
    flex-shrink: 0;
}

.page-subtitle[b-b6uqxehxw8] {
    color: var(--text-muted);
    font-size: var(--font-size-sm);
    margin: var(--space-1) 0 0 0;
}

/* Action Button */
.btn-action[b-b6uqxehxw8] {
    display: inline-flex;
    align-items: center;
    gap: var(--space-2);
    padding: var(--space-2) var(--space-4);
    background-color: var(--color-action);
    color: var(--text-on-action);
    border: var(--border-width-thin) solid var(--color-action);
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-medium);
    text-decoration: none;
    cursor: pointer;
    transition: background-color var(--transition-fast) var(--transition-ease);
}

.btn-action:hover[b-b6uqxehxw8] {
    background-color: var(--color-action-hover);
    color: var(--text-on-action);
    text-decoration: none;
}

/* Alert Bars */
.alert-bar[b-b6uqxehxw8] {
    display: flex;
    align-items: center;
    gap: var(--space-2);
    padding: var(--space-3) var(--space-4);
    margin-bottom: var(--space-4);
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-medium);
    border-left: var(--border-width-thick) solid;
}

.alert-bar-success[b-b6uqxehxw8] {
    background-color: #edf7ed;
    border-left-color: var(--color-success);
    color: #1e4620;
}

.alert-bar-danger[b-b6uqxehxw8] {
    background-color: #fdeded;
    border-left-color: var(--color-danger);
    color: #5f2120;
}

.alert-bar-close[b-b6uqxehxw8] {
    margin-left: auto;
    background: none;
    border: none;
    font-size: var(--font-size-lg);
    cursor: pointer;
    color: inherit;
    opacity: 0.6;
    line-height: 1;
}

.alert-bar-close:hover[b-b6uqxehxw8] {
    opacity: 1;
}

/* Search Bar */
.search-bar[b-b6uqxehxw8] {
    display: flex;
    align-items: center;
    gap: var(--space-4);
    margin-bottom: var(--space-4);
}

.search-input-wrapper[b-b6uqxehxw8] {
    flex: 1;
    position: relative;
    display: flex;
    align-items: center;
}

.search-icon[b-b6uqxehxw8] {
    position: absolute;
    left: var(--space-3);
    color: var(--text-muted);
    pointer-events: none;
}

.search-input[b-b6uqxehxw8] {
    width: 100%;
    padding: var(--space-2) var(--space-3) var(--space-2) calc(var(--space-3) + 24px);
    font-size: var(--font-size-sm);
    color: var(--color-gray-700);
    border: var(--border-width-thin) solid var(--border-color-light);
    background-color: var(--color-white);
    transition: border-color var(--transition-fast) var(--transition-ease);
}

.search-input:focus[b-b6uqxehxw8] {
    border-color: var(--color-primary);
    outline: none;
}

.search-input[b-b6uqxehxw8]::placeholder {
    color: var(--color-gray-400);
}

.search-clear[b-b6uqxehxw8] {
    position: absolute;
    right: var(--space-2);
    background: none;
    border: none;
    color: var(--text-muted);
    cursor: pointer;
    padding: var(--space-1);
    display: flex;
    align-items: center;
}

.search-clear:hover[b-b6uqxehxw8] {
    color: var(--color-danger);
}

.search-count[b-b6uqxehxw8] {
    font-size: var(--font-size-xs);
    color: var(--text-muted);
    white-space: nowrap;
}

/* Loading State */
.loading-state[b-b6uqxehxw8] {
    text-align: center;
    padding: var(--space-10) 0;
    color: var(--text-muted);
}

.loading-state p[b-b6uqxehxw8] {
    margin-top: var(--space-3);
    font-size: var(--font-size-sm);
}

/* Empty State */
.empty-state[b-b6uqxehxw8] {
    text-align: center;
    padding: var(--space-10) 0;
    color: var(--text-muted);
}

.empty-state svg[b-b6uqxehxw8] {
    opacity: 0.3;
    margin-bottom: var(--space-3);
}

.empty-state-text[b-b6uqxehxw8] {
    font-size: var(--font-size-sm);
    margin-bottom: var(--space-3);
}

/* Item List */
.item-list[b-b6uqxehxw8] {
    display: flex;
    flex-direction: column;
    border: var(--border-width-thin) solid var(--border-color-light);
}

.item-row[b-b6uqxehxw8] {
    display: flex;
    align-items: center;
    gap: var(--space-3);
    padding: var(--space-3) var(--space-4);
    background-color: var(--color-white);
    border-bottom: var(--border-width-thin) solid var(--border-color-light);
    transition: background-color var(--transition-fast) var(--transition-ease);
}

.item-row:last-child[b-b6uqxehxw8] {
    border-bottom: none;
}

.item-row:hover[b-b6uqxehxw8] {
    background-color: var(--color-gray-50);
}

.item-avatar[b-b6uqxehxw8] {
    width: 40px;
    height: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: var(--color-gray-100);
    color: var(--color-primary);
    flex-shrink: 0;
}

.item-info[b-b6uqxehxw8] {
    flex: 1;
    min-width: 0;
}

.item-name[b-b6uqxehxw8] {
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-medium);
    color: var(--color-gray-700);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.item-meta[b-b6uqxehxw8] {
    display: flex;
    align-items: center;
    gap: var(--space-1);
    font-size: var(--font-size-xs);
    color: var(--text-muted);
    margin-top: 2px;
}

.item-code[b-b6uqxehxw8] {
    font-family: var(--font-mono);
}

.item-separator[b-b6uqxehxw8] {
    color: var(--border-color-light);
}

.item-actions[b-b6uqxehxw8] {
    display: flex;
    align-items: center;
    gap: var(--space-1);
    flex-shrink: 0;
}

.btn-icon[b-b6uqxehxw8] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 32px;
    height: 32px;
    color: var(--text-muted);
    background: none;
    border: var(--border-width-thin) solid transparent;
    cursor: pointer;
    text-decoration: none;
    transition: all var(--transition-fast) var(--transition-ease);
}

.btn-icon:hover[b-b6uqxehxw8] {
    color: var(--color-primary);
    border-color: var(--border-color-light);
    background-color: var(--color-gray-50);
    text-decoration: none;
}

.btn-icon-danger:hover[b-b6uqxehxw8] {
    color: var(--color-danger);
    border-color: var(--color-danger);
    background-color: #fdeded;
}

/* Delete Confirmation Overlay */
.overlay[b-b6uqxehxw8] {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: rgba(0, 0, 0, 0.4);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 1000;
}

.confirm-dialog[b-b6uqxehxw8] {
    background-color: var(--color-white);
    padding: var(--space-6);
    max-width: 420px;
    width: 90%;
    text-align: center;
    border: var(--border-width-thin) solid var(--border-color-light);
    box-shadow: var(--shadow-lg);
}

.confirm-icon[b-b6uqxehxw8] {
    color: var(--color-warning);
    margin-bottom: var(--space-3);
}

.confirm-dialog h3[b-b6uqxehxw8] {
    font-size: var(--font-size-lg);
    font-weight: var(--font-weight-semibold);
    color: var(--color-gray-700);
    margin: 0 0 var(--space-2) 0;
}

.confirm-dialog p[b-b6uqxehxw8] {
    font-size: var(--font-size-sm);
    color: var(--text-secondary);
    margin: 0 0 var(--space-2) 0;
}

.confirm-warning[b-b6uqxehxw8] {
    font-size: var(--font-size-xs) !important;
    color: var(--color-danger) !important;
}

.confirm-actions[b-b6uqxehxw8] {
    display: flex;
    justify-content: center;
    gap: var(--space-3);
    margin-top: var(--space-4);
}

.confirm-actions .btn[b-b6uqxehxw8] {
    padding: var(--space-2) var(--space-5);
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-medium);
    cursor: pointer;
}
/* /Components/Pages/Shipping/MeansOfTransportationCreate.razor.rz.scp.css */
/* ===========================
   MeansOfTransportationCreate - Scoped Styles
   Flat Industrial Minimal
   =========================== */

/* Page Container */
.page-container[b-3rdvg7pqdq] {
    max-width: 900px;
    margin: 0 auto;
    padding: var(--space-6) var(--space-4);
}

/* Header */
.page-header[b-3rdvg7pqdq] {
    display: flex;
    align-items: center;
    gap: var(--space-4);
    margin-bottom: var(--space-6);
}

.btn-back[b-3rdvg7pqdq] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    color: var(--text-muted);
    border: var(--border-width-thin) solid var(--border-color-light);
    text-decoration: none;
    transition: all var(--transition-fast) var(--transition-ease);
    flex-shrink: 0;
}

.btn-back:hover[b-3rdvg7pqdq] {
    color: var(--color-primary);
    border-color: var(--color-primary);
    background-color: var(--color-gray-50);
    text-decoration: none;
}

.page-header-text[b-3rdvg7pqdq] {
    flex: 1;
}

.page-title[b-3rdvg7pqdq] {
    font-size: var(--font-size-xl);
    font-weight: var(--font-weight-bold);
    color: var(--color-primary);
    display: flex;
    align-items: center;
    gap: var(--space-2);
    margin: 0;
}

.page-title svg[b-3rdvg7pqdq] {
    color: var(--color-primary);
    flex-shrink: 0;
}

.page-subtitle[b-3rdvg7pqdq] {
    color: var(--text-muted);
    font-size: var(--font-size-sm);
    margin: 2px 0 0 0;
}

/* Alert Bar */
.alert-bar[b-3rdvg7pqdq] {
    display: flex;
    align-items: center;
    gap: var(--space-2);
    padding: var(--space-3) var(--space-4);
    margin-bottom: var(--space-4);
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-medium);
    border-left: var(--border-width-thick) solid;
}

.alert-bar-danger[b-3rdvg7pqdq] {
    background-color: #fdeded;
    border-left-color: var(--color-danger);
    color: #5f2120;
}

.alert-bar-close[b-3rdvg7pqdq] {
    margin-left: auto;
    background: none;
    border: none;
    font-size: var(--font-size-lg);
    cursor: pointer;
    color: inherit;
    opacity: 0.6;
    line-height: 1;
}

.alert-bar-close:hover[b-3rdvg7pqdq] {
    opacity: 1;
}

/* Form Sections */
.form-section[b-3rdvg7pqdq] {
    margin-bottom: var(--space-6);
    padding: var(--space-5);
    background-color: var(--color-white);
    border: var(--border-width-thin) solid var(--border-color-light);
}

.section-title[b-3rdvg7pqdq] {
    display: flex;
    align-items: center;
    gap: var(--space-2);
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-semibold);
    color: var(--color-primary);
    text-transform: uppercase;
    letter-spacing: 0.5px;
    margin: 0 0 var(--space-4) 0;
    padding-bottom: var(--space-3);
    border-bottom: var(--border-width-thin) solid var(--border-color-light);
}

.section-title svg[b-3rdvg7pqdq] {
    color: var(--color-primary);
    opacity: 0.6;
    flex-shrink: 0;
}

/* Form Grid */
.form-grid[b-3rdvg7pqdq] {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: var(--space-4);
}

.form-group[b-3rdvg7pqdq] {
    display: flex;
    flex-direction: column;
}

.form-group-wide[b-3rdvg7pqdq] {
    grid-column: span 2;
}

/* Form Controls */
.form-label[b-3rdvg7pqdq] {
    font-size: var(--font-size-xs);
    font-weight: var(--font-weight-medium);
    color: var(--text-secondary);
    text-transform: uppercase;
    letter-spacing: 0.3px;
    margin-bottom: var(--space-1);
}

.form-control[b-3rdvg7pqdq] {
    padding: var(--space-2) var(--space-3);
    font-size: var(--font-size-sm);
    color: var(--color-gray-700);
    border: var(--border-width-thin) solid var(--border-color-light);
    background-color: var(--color-white);
    transition: border-color var(--transition-fast) var(--transition-ease);
}

.form-control:focus[b-3rdvg7pqdq] {
    border-color: var(--color-primary);
    outline: none;
    box-shadow: none;
}

.form-control[b-3rdvg7pqdq]::placeholder {
    color: var(--color-gray-400);
}

/* Form Actions */
.form-actions[b-3rdvg7pqdq] {
    display: flex;
    justify-content: flex-end;
    gap: var(--space-3);
    padding-top: var(--space-4);
    border-top: var(--border-width-thin) solid var(--border-color-light);
}

.form-actions .btn[b-3rdvg7pqdq] {
    display: inline-flex;
    align-items: center;
    gap: var(--space-2);
    padding: var(--space-2) var(--space-5);
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-medium);
    cursor: pointer;
    text-decoration: none;
}

.btn-action[b-3rdvg7pqdq] {
    background-color: var(--color-action);
    color: var(--text-on-action);
    border: var(--border-width-thin) solid var(--color-action);
    transition: background-color var(--transition-fast) var(--transition-ease);
}

.btn-action:hover[b-3rdvg7pqdq] {
    background-color: var(--color-action-hover);
    border-color: var(--color-action-hover);
    color: var(--text-on-action);
}

.btn-action:disabled[b-3rdvg7pqdq] {
    opacity: 0.65;
    cursor: not-allowed;
}

.btn-outline-primary[b-3rdvg7pqdq] {
    background: transparent;
    color: var(--color-primary);
    border: var(--border-width-thin) solid var(--color-primary);
}

.btn-outline-primary:hover[b-3rdvg7pqdq] {
    background-color: var(--color-primary);
    color: var(--text-on-primary);
    text-decoration: none;
}

/* Validation */
[b-3rdvg7pqdq] .validation-message {
    color: var(--color-danger);
    font-size: var(--font-size-xs);
    margin-top: 2px;
}

/* Responsive */
@media (max-width: 768px) {
    .form-grid[b-3rdvg7pqdq] {
        grid-template-columns: 1fr;
    }

    .form-group-wide[b-3rdvg7pqdq] {
        grid-column: span 1;
    }

    .form-actions[b-3rdvg7pqdq] {
        flex-direction: column-reverse;
    }

    .form-actions .btn[b-3rdvg7pqdq] {
        justify-content: center;
    }
}
/* /Components/Pages/Shipping/MeansOfTransportationEdit.razor.rz.scp.css */
/* ===========================
   MeansOfTransportationEdit - Scoped Styles
   Flat Industrial Minimal
   =========================== */

/* Page Container */
.page-container[b-rzf3wllb53] {
    max-width: 900px;
    margin: 0 auto;
    padding: var(--space-6) var(--space-4);
}

/* Header */
.page-header[b-rzf3wllb53] {
    display: flex;
    align-items: center;
    gap: var(--space-4);
    margin-bottom: var(--space-6);
}

.btn-back[b-rzf3wllb53] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    color: var(--text-muted);
    border: var(--border-width-thin) solid var(--border-color-light);
    text-decoration: none;
    transition: all var(--transition-fast) var(--transition-ease);
    flex-shrink: 0;
}

.btn-back:hover[b-rzf3wllb53] {
    color: var(--color-primary);
    border-color: var(--color-primary);
    background-color: var(--color-gray-50);
    text-decoration: none;
}

.page-header-text[b-rzf3wllb53] {
    flex: 1;
}

.page-title[b-rzf3wllb53] {
    font-size: var(--font-size-xl);
    font-weight: var(--font-weight-bold);
    color: var(--color-primary);
    display: flex;
    align-items: center;
    gap: var(--space-2);
    margin: 0;
}

.page-title svg[b-rzf3wllb53] {
    color: var(--color-primary);
    flex-shrink: 0;
}

.page-subtitle[b-rzf3wllb53] {
    color: var(--text-muted);
    font-size: var(--font-size-sm);
    margin: 2px 0 0 0;
    display: flex;
    align-items: center;
    gap: var(--space-2);
}

.subtitle-code[b-rzf3wllb53] {
    font-family: var(--font-mono);
    font-size: var(--font-size-xs);
    color: var(--color-primary);
    opacity: 0.6;
    padding: 1px var(--space-2);
    background-color: var(--color-gray-100);
}

/* Alert Bar */
.alert-bar[b-rzf3wllb53] {
    display: flex;
    align-items: center;
    gap: var(--space-2);
    padding: var(--space-3) var(--space-4);
    margin-bottom: var(--space-4);
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-medium);
    border-left: var(--border-width-thick) solid;
}

.alert-bar-danger[b-rzf3wllb53] {
    background-color: #fdeded;
    border-left-color: var(--color-danger);
    color: #5f2120;
}

.alert-bar-close[b-rzf3wllb53] {
    margin-left: auto;
    background: none;
    border: none;
    font-size: var(--font-size-lg);
    cursor: pointer;
    color: inherit;
    opacity: 0.6;
    line-height: 1;
}

.alert-bar-close:hover[b-rzf3wllb53] {
    opacity: 1;
}

/* Loading / Empty States */
.loading-state[b-rzf3wllb53] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: var(--space-16) 0;
    color: var(--text-muted);
    gap: var(--space-4);
}

.empty-state[b-rzf3wllb53] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: var(--space-16) 0;
    color: var(--text-muted);
    gap: var(--space-3);
}

.empty-state svg[b-rzf3wllb53] {
    opacity: 0.4;
}

.empty-state-text[b-rzf3wllb53] {
    font-size: var(--font-size-base);
    margin: 0;
}

/* Form Sections */
.form-section[b-rzf3wllb53] {
    margin-bottom: var(--space-6);
    padding: var(--space-5);
    background-color: var(--color-white);
    border: var(--border-width-thin) solid var(--border-color-light);
}

.section-title[b-rzf3wllb53] {
    display: flex;
    align-items: center;
    gap: var(--space-2);
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-semibold);
    color: var(--color-primary);
    text-transform: uppercase;
    letter-spacing: 0.5px;
    margin: 0 0 var(--space-4) 0;
    padding-bottom: var(--space-3);
    border-bottom: var(--border-width-thin) solid var(--border-color-light);
}

.section-title svg[b-rzf3wllb53] {
    color: var(--color-primary);
    opacity: 0.6;
    flex-shrink: 0;
}

/* Form Grid */
.form-grid[b-rzf3wllb53] {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: var(--space-4);
}

.form-group[b-rzf3wllb53] {
    display: flex;
    flex-direction: column;
}

.form-group-wide[b-rzf3wllb53] {
    grid-column: span 2;
}

/* Form Controls */
.form-label[b-rzf3wllb53] {
    font-size: var(--font-size-xs);
    font-weight: var(--font-weight-medium);
    color: var(--text-secondary);
    text-transform: uppercase;
    letter-spacing: 0.3px;
    margin-bottom: var(--space-1);
}

.form-control[b-rzf3wllb53] {
    padding: var(--space-2) var(--space-3);
    font-size: var(--font-size-sm);
    color: var(--color-gray-700);
    border: var(--border-width-thin) solid var(--border-color-light);
    background-color: var(--color-white);
    transition: border-color var(--transition-fast) var(--transition-ease);
}

.form-control:focus[b-rzf3wllb53] {
    border-color: var(--color-primary);
    outline: none;
    box-shadow: none;
}

.form-control[b-rzf3wllb53]::placeholder {
    color: var(--color-gray-400);
}

.form-control-static[b-rzf3wllb53] {
    padding: var(--space-2) var(--space-3);
    font-size: var(--font-size-sm);
    color: var(--text-muted);
    background-color: var(--color-gray-50);
    border: var(--border-width-thin) solid var(--border-color-light);
    font-family: var(--font-mono);
}

/* Form Actions */
.form-actions[b-rzf3wllb53] {
    display: flex;
    justify-content: flex-end;
    gap: var(--space-3);
    padding-top: var(--space-4);
    border-top: var(--border-width-thin) solid var(--border-color-light);
}

.form-actions .btn[b-rzf3wllb53] {
    display: inline-flex;
    align-items: center;
    gap: var(--space-2);
    padding: var(--space-2) var(--space-5);
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-medium);
    cursor: pointer;
    text-decoration: none;
}

.btn-action[b-rzf3wllb53] {
    background-color: var(--color-action);
    color: var(--text-on-action);
    border: var(--border-width-thin) solid var(--color-action);
    transition: background-color var(--transition-fast) var(--transition-ease);
}

.btn-action:hover[b-rzf3wllb53] {
    background-color: var(--color-action-hover);
    border-color: var(--color-action-hover);
    color: var(--text-on-action);
}

.btn-action:disabled[b-rzf3wllb53] {
    opacity: 0.65;
    cursor: not-allowed;
}

.btn-outline-primary[b-rzf3wllb53] {
    background: transparent;
    color: var(--color-primary);
    border: var(--border-width-thin) solid var(--color-primary);
}

.btn-outline-primary:hover[b-rzf3wllb53] {
    background-color: var(--color-primary);
    color: var(--text-on-primary);
    text-decoration: none;
}

/* Validation */
[b-rzf3wllb53] .validation-message {
    color: var(--color-danger);
    font-size: var(--font-size-xs);
    margin-top: 2px;
}

/* Responsive */
@media (max-width: 768px) {
    .form-grid[b-rzf3wllb53] {
        grid-template-columns: 1fr;
    }

    .form-group-wide[b-rzf3wllb53] {
        grid-column: span 1;
    }

    .form-actions[b-rzf3wllb53] {
        flex-direction: column-reverse;
    }

    .form-actions .btn[b-rzf3wllb53] {
        justify-content: center;
    }
}
/* /Components/Pages/Shipping/MeansOfTransportationList.razor.rz.scp.css */
/* ===========================
   MeansOfTransportationList - Scoped Styles
   Flat Industrial Minimal
   =========================== */

/* Page Container */
.page-container[b-6tumyz7s0e] {
    max-width: 1200px;
    margin: 0 auto;
    padding: var(--space-6) var(--space-4);
}

/* Header */
.page-header[b-6tumyz7s0e] {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    margin-bottom: var(--space-6);
    gap: var(--space-4);
}

.page-header-left[b-6tumyz7s0e] {
    flex: 1;
}

.page-header-right[b-6tumyz7s0e] {
    flex-shrink: 0;
}

.page-title[b-6tumyz7s0e] {
    font-size: var(--font-size-2xl);
    font-weight: var(--font-weight-bold);
    color: var(--color-primary);
    display: flex;
    align-items: center;
    gap: var(--space-2);
    margin: 0;
}

.page-title svg[b-6tumyz7s0e] {
    color: var(--color-primary);
    flex-shrink: 0;
}

.page-subtitle[b-6tumyz7s0e] {
    color: var(--text-muted);
    font-size: var(--font-size-sm);
    margin: var(--space-1) 0 0 0;
}

/* Action Button */
.btn-action[b-6tumyz7s0e] {
    display: inline-flex;
    align-items: center;
    gap: var(--space-2);
    padding: var(--space-2) var(--space-4);
    background-color: var(--color-action);
    color: var(--text-on-action);
    border: var(--border-width-thin) solid var(--color-action);
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-medium);
    text-decoration: none;
    cursor: pointer;
    transition: background-color var(--transition-fast) var(--transition-ease),
                box-shadow var(--transition-fast) var(--transition-ease);
}

.btn-action:hover[b-6tumyz7s0e] {
    background-color: var(--color-action-hover);
    border-color: var(--color-action-hover);
    color: var(--text-on-action);
    text-decoration: none;
    box-shadow: var(--shadow-sm);
}

.btn-action:active[b-6tumyz7s0e] {
    background-color: var(--color-action-active);
}

/* Alert Bars */
.alert-bar[b-6tumyz7s0e] {
    display: flex;
    align-items: center;
    gap: var(--space-2);
    padding: var(--space-3) var(--space-4);
    margin-bottom: var(--space-4);
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-medium);
    border-left: var(--border-width-thick) solid;
}

.alert-bar-success[b-6tumyz7s0e] {
    background-color: #edf7ed;
    border-left-color: var(--color-success);
    color: #1e4620;
}

.alert-bar-danger[b-6tumyz7s0e] {
    background-color: #fdeded;
    border-left-color: var(--color-danger);
    color: #5f2120;
}

.alert-bar-close[b-6tumyz7s0e] {
    margin-left: auto;
    background: none;
    border: none;
    font-size: var(--font-size-lg);
    cursor: pointer;
    color: inherit;
    opacity: 0.6;
    line-height: 1;
}

.alert-bar-close:hover[b-6tumyz7s0e] {
    opacity: 1;
}

/* Search Bar */
.search-bar[b-6tumyz7s0e] {
    display: flex;
    align-items: center;
    gap: var(--space-4);
    margin-bottom: var(--space-4);
    padding: var(--space-3) var(--space-4);
    background-color: var(--bg-secondary);
    border: var(--border-width-thin) solid var(--border-color-light);
}

.search-input-wrapper[b-6tumyz7s0e] {
    display: flex;
    align-items: center;
    flex: 1;
    position: relative;
}

.search-icon[b-6tumyz7s0e] {
    color: var(--text-muted);
    flex-shrink: 0;
    margin-right: var(--space-2);
}

.search-input[b-6tumyz7s0e] {
    flex: 1;
    border: none;
    background: transparent;
    font-size: var(--font-size-sm);
    color: var(--color-gray-700);
    outline: none;
    padding: var(--space-1) 0;
}

.search-input[b-6tumyz7s0e]::placeholder {
    color: var(--text-muted);
}

.search-clear[b-6tumyz7s0e] {
    background: none;
    border: none;
    cursor: pointer;
    color: var(--text-muted);
    padding: var(--space-1);
    display: flex;
    align-items: center;
}

.search-clear:hover[b-6tumyz7s0e] {
    color: var(--color-primary);
}

.search-count[b-6tumyz7s0e] {
    flex-shrink: 0;
    font-size: var(--font-size-xs);
    color: var(--text-muted);
    font-weight: var(--font-weight-medium);
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

/* Loading / Empty States */
.loading-state[b-6tumyz7s0e] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: var(--space-16) 0;
    color: var(--text-muted);
    gap: var(--space-4);
}

.empty-state[b-6tumyz7s0e] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: var(--space-16) 0;
    color: var(--text-muted);
    gap: var(--space-3);
}

.empty-state svg[b-6tumyz7s0e] {
    opacity: 0.4;
}

.empty-state-text[b-6tumyz7s0e] {
    font-size: var(--font-size-base);
    margin: 0;
}

/* Item List */
.item-list[b-6tumyz7s0e] {
    display: flex;
    flex-direction: column;
    border: var(--border-width-thin) solid var(--border-color-light);
}

/* Item Row */
.item-row[b-6tumyz7s0e] {
    display: flex;
    align-items: center;
    gap: var(--space-4);
    padding: var(--space-4);
    border-bottom: var(--border-width-thin) solid var(--border-color-light);
    transition: background-color var(--transition-fast) var(--transition-ease);
}

.item-row:last-child[b-6tumyz7s0e] {
    border-bottom: none;
}

.item-row:hover[b-6tumyz7s0e] {
    background-color: rgba(11, 36, 62, 0.03);
}

/* Avatar */
.item-avatar[b-6tumyz7s0e] {
    flex-shrink: 0;
    width: 40px;
    height: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: var(--color-gray-100);
    color: var(--color-primary);
}

/* Item Info */
.item-info[b-6tumyz7s0e] {
    flex: 1;
    min-width: 0;
}

.item-name[b-6tumyz7s0e] {
    font-size: var(--font-size-base);
    font-weight: var(--font-weight-semibold);
    color: var(--color-primary);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.item-meta[b-6tumyz7s0e] {
    display: flex;
    align-items: center;
    gap: var(--space-1);
    flex-wrap: wrap;
    font-size: var(--font-size-xs);
    color: var(--text-secondary);
    margin-top: 2px;
}

.item-code[b-6tumyz7s0e] {
    font-family: var(--font-mono);
    font-weight: var(--font-weight-medium);
    color: var(--color-primary);
    opacity: 0.7;
}

.meta-separator[b-6tumyz7s0e] {
    color: var(--color-gray-300);
}

/* Action Buttons */
.item-actions[b-6tumyz7s0e] {
    flex-shrink: 0;
    display: flex;
    align-items: center;
    gap: var(--space-1);
}

.btn-icon[b-6tumyz7s0e] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 36px;
    background: none;
    border: var(--border-width-thin) solid transparent;
    cursor: pointer;
    color: var(--text-muted);
    text-decoration: none;
    transition: all var(--transition-fast) var(--transition-ease);
}

.btn-icon:hover[b-6tumyz7s0e] {
    color: var(--color-primary);
    background-color: var(--color-gray-100);
    border-color: var(--border-color-light);
    text-decoration: none;
}

.btn-icon-danger:hover[b-6tumyz7s0e] {
    color: var(--color-action);
    background-color: rgba(178, 34, 34, 0.06);
    border-color: rgba(178, 34, 34, 0.2);
}

/* Overlay & Dialog */
.overlay[b-6tumyz7s0e] {
    position: fixed;
    inset: 0;
    background-color: rgba(0, 0, 0, 0.4);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: var(--z-modal-backdrop);
}

.confirm-dialog[b-6tumyz7s0e] {
    background-color: var(--color-white);
    padding: var(--space-8);
    max-width: 420px;
    width: 90%;
    box-shadow: var(--shadow-xl);
    text-align: center;
    z-index: var(--z-modal);
}

.confirm-icon[b-6tumyz7s0e] {
    color: var(--color-action);
    margin-bottom: var(--space-4);
}

.confirm-dialog h3[b-6tumyz7s0e] {
    font-size: var(--font-size-lg);
    font-weight: var(--font-weight-semibold);
    color: var(--color-primary);
    margin: 0 0 var(--space-2) 0;
}

.confirm-dialog p[b-6tumyz7s0e] {
    font-size: var(--font-size-sm);
    color: var(--text-secondary);
    margin: 0 0 var(--space-2) 0;
}

.confirm-warning[b-6tumyz7s0e] {
    font-size: var(--font-size-xs) !important;
    color: var(--color-action) !important;
    font-weight: var(--font-weight-medium);
}

.confirm-actions[b-6tumyz7s0e] {
    display: flex;
    gap: var(--space-3);
    justify-content: center;
    margin-top: var(--space-6);
}

.confirm-actions .btn[b-6tumyz7s0e] {
    min-width: 100px;
    padding: var(--space-2) var(--space-4);
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-medium);
    cursor: pointer;
}

/* Outline Primary Button */
.btn-outline-primary[b-6tumyz7s0e] {
    background: transparent;
    color: var(--color-primary);
    border: var(--border-width-thin) solid var(--color-primary);
}

.btn-outline-primary:hover[b-6tumyz7s0e] {
    background-color: var(--color-primary);
    color: var(--text-on-primary);
}

/* Responsive */
@media (max-width: 768px) {
    .page-header[b-6tumyz7s0e] {
        flex-direction: column;
        gap: var(--space-3);
    }

    .item-row[b-6tumyz7s0e] {
        flex-wrap: wrap;
    }

    .item-actions[b-6tumyz7s0e] {
        order: 6;
        margin-left: auto;
    }
}
/* /Components/Pages/Shipping/TransportReasonCreate.razor.rz.scp.css */
/* ===========================
   TransportReasonCreate - Scoped Styles
   Flat Industrial Minimal
   =========================== */

/* Page Container */
.page-container[b-n2olmrxi6n] {
    max-width: 900px;
    margin: 0 auto;
    padding: var(--space-6) var(--space-4);
}

/* Header */
.page-header[b-n2olmrxi6n] {
    display: flex;
    align-items: center;
    gap: var(--space-4);
    margin-bottom: var(--space-6);
}

.btn-back[b-n2olmrxi6n] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    color: var(--text-muted);
    border: var(--border-width-thin) solid var(--border-color-light);
    text-decoration: none;
    transition: all var(--transition-fast) var(--transition-ease);
    flex-shrink: 0;
}

.btn-back:hover[b-n2olmrxi6n] {
    color: var(--color-primary);
    border-color: var(--color-primary);
    background-color: var(--color-gray-50);
    text-decoration: none;
}

.page-header-text[b-n2olmrxi6n] {
    flex: 1;
}

.page-title[b-n2olmrxi6n] {
    font-size: var(--font-size-xl);
    font-weight: var(--font-weight-bold);
    color: var(--color-primary);
    display: flex;
    align-items: center;
    gap: var(--space-2);
    margin: 0;
}

.page-title svg[b-n2olmrxi6n] {
    color: var(--color-primary);
    flex-shrink: 0;
}

.page-subtitle[b-n2olmrxi6n] {
    color: var(--text-muted);
    font-size: var(--font-size-sm);
    margin: 2px 0 0 0;
}

/* Alert Bar */
.alert-bar[b-n2olmrxi6n] {
    display: flex;
    align-items: center;
    gap: var(--space-2);
    padding: var(--space-3) var(--space-4);
    margin-bottom: var(--space-4);
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-medium);
    border-left: var(--border-width-thick) solid;
}

.alert-bar-danger[b-n2olmrxi6n] {
    background-color: #fdeded;
    border-left-color: var(--color-danger);
    color: #5f2120;
}

.alert-bar-close[b-n2olmrxi6n] {
    margin-left: auto;
    background: none;
    border: none;
    font-size: var(--font-size-lg);
    cursor: pointer;
    color: inherit;
    opacity: 0.6;
    line-height: 1;
}

.alert-bar-close:hover[b-n2olmrxi6n] {
    opacity: 1;
}

/* Form Sections */
.form-section[b-n2olmrxi6n] {
    margin-bottom: var(--space-6);
    padding: var(--space-5);
    background-color: var(--color-white);
    border: var(--border-width-thin) solid var(--border-color-light);
}

.section-title[b-n2olmrxi6n] {
    display: flex;
    align-items: center;
    gap: var(--space-2);
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-semibold);
    color: var(--color-primary);
    text-transform: uppercase;
    letter-spacing: 0.5px;
    margin: 0 0 var(--space-4) 0;
    padding-bottom: var(--space-3);
    border-bottom: var(--border-width-thin) solid var(--border-color-light);
}

.section-title svg[b-n2olmrxi6n] {
    color: var(--color-primary);
    opacity: 0.6;
    flex-shrink: 0;
}

/* Form Grid */
.form-grid[b-n2olmrxi6n] {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: var(--space-4);
}

.form-group[b-n2olmrxi6n] {
    display: flex;
    flex-direction: column;
}

.form-group-wide[b-n2olmrxi6n] {
    grid-column: span 2;
}

/* Form Controls */
.form-label[b-n2olmrxi6n] {
    font-size: var(--font-size-xs);
    font-weight: var(--font-weight-medium);
    color: var(--text-secondary);
    text-transform: uppercase;
    letter-spacing: 0.3px;
    margin-bottom: var(--space-1);
}

.form-control[b-n2olmrxi6n] {
    padding: var(--space-2) var(--space-3);
    font-size: var(--font-size-sm);
    color: var(--color-gray-700);
    border: var(--border-width-thin) solid var(--border-color-light);
    background-color: var(--color-white);
    transition: border-color var(--transition-fast) var(--transition-ease);
}

.form-control:focus[b-n2olmrxi6n] {
    border-color: var(--color-primary);
    outline: none;
    box-shadow: none;
}

.form-control[b-n2olmrxi6n]::placeholder {
    color: var(--color-gray-400);
}

/* Form Actions */
.form-actions[b-n2olmrxi6n] {
    display: flex;
    justify-content: flex-end;
    gap: var(--space-3);
    padding-top: var(--space-4);
    border-top: var(--border-width-thin) solid var(--border-color-light);
}

.form-actions .btn[b-n2olmrxi6n] {
    display: inline-flex;
    align-items: center;
    gap: var(--space-2);
    padding: var(--space-2) var(--space-5);
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-medium);
    cursor: pointer;
    text-decoration: none;
}

.btn-action[b-n2olmrxi6n] {
    background-color: var(--color-action);
    color: var(--text-on-action);
    border: var(--border-width-thin) solid var(--color-action);
    transition: background-color var(--transition-fast) var(--transition-ease);
}

.btn-action:hover[b-n2olmrxi6n] {
    background-color: var(--color-action-hover);
    border-color: var(--color-action-hover);
    color: var(--text-on-action);
}

.btn-action:disabled[b-n2olmrxi6n] {
    opacity: 0.65;
    cursor: not-allowed;
}
/* /Components/Pages/Shipping/TransportReasonEdit.razor.rz.scp.css */
/* ===========================
   TransportReasonEdit - Scoped Styles
   Flat Industrial Minimal
   =========================== */

/* Page Container */
.page-container[b-a2fogkmk13] {
    max-width: 900px;
    margin: 0 auto;
    padding: var(--space-6) var(--space-4);
}

/* Header */
.page-header[b-a2fogkmk13] {
    display: flex;
    align-items: center;
    gap: var(--space-4);
    margin-bottom: var(--space-6);
}

.btn-back[b-a2fogkmk13] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    color: var(--text-muted);
    border: var(--border-width-thin) solid var(--border-color-light);
    text-decoration: none;
    transition: all var(--transition-fast) var(--transition-ease);
    flex-shrink: 0;
}

.btn-back:hover[b-a2fogkmk13] {
    color: var(--color-primary);
    border-color: var(--color-primary);
    background-color: var(--color-gray-50);
    text-decoration: none;
}

.page-header-text[b-a2fogkmk13] {
    flex: 1;
}

.page-title[b-a2fogkmk13] {
    font-size: var(--font-size-xl);
    font-weight: var(--font-weight-bold);
    color: var(--color-primary);
    display: flex;
    align-items: center;
    gap: var(--space-2);
    margin: 0;
}

.page-title svg[b-a2fogkmk13] {
    color: var(--color-primary);
    flex-shrink: 0;
}

.page-subtitle[b-a2fogkmk13] {
    color: var(--text-muted);
    font-size: var(--font-size-sm);
    margin: 2px 0 0 0;
    display: flex;
    align-items: center;
    gap: var(--space-2);
}

.subtitle-code[b-a2fogkmk13] {
    font-family: var(--font-mono);
    font-size: var(--font-size-xs);
    color: var(--color-primary);
    opacity: 0.6;
    padding: 1px var(--space-2);
    background-color: var(--color-gray-100);
}

/* Alert Bar */
.alert-bar[b-a2fogkmk13] {
    display: flex;
    align-items: center;
    gap: var(--space-2);
    padding: var(--space-3) var(--space-4);
    margin-bottom: var(--space-4);
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-medium);
    border-left: var(--border-width-thick) solid;
}

.alert-bar-danger[b-a2fogkmk13] {
    background-color: #fdeded;
    border-left-color: var(--color-danger);
    color: #5f2120;
}

.alert-bar-close[b-a2fogkmk13] {
    margin-left: auto;
    background: none;
    border: none;
    font-size: var(--font-size-lg);
    cursor: pointer;
    color: inherit;
    opacity: 0.6;
    line-height: 1;
}

.alert-bar-close:hover[b-a2fogkmk13] {
    opacity: 1;
}

/* Loading / Empty States */
.loading-state[b-a2fogkmk13] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: var(--space-16) 0;
    color: var(--text-muted);
    gap: var(--space-4);
}

.empty-state[b-a2fogkmk13] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: var(--space-16) 0;
    color: var(--text-muted);
    gap: var(--space-3);
}

.empty-state svg[b-a2fogkmk13] {
    opacity: 0.4;
}

.empty-state-text[b-a2fogkmk13] {
    font-size: var(--font-size-base);
    margin: 0;
}

/* Form Sections */
.form-section[b-a2fogkmk13] {
    margin-bottom: var(--space-6);
    padding: var(--space-5);
    background-color: var(--color-white);
    border: var(--border-width-thin) solid var(--border-color-light);
}

.section-title[b-a2fogkmk13] {
    display: flex;
    align-items: center;
    gap: var(--space-2);
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-semibold);
    color: var(--color-primary);
    text-transform: uppercase;
    letter-spacing: 0.5px;
    margin: 0 0 var(--space-4) 0;
    padding-bottom: var(--space-3);
    border-bottom: var(--border-width-thin) solid var(--border-color-light);
}

.section-title svg[b-a2fogkmk13] {
    color: var(--color-primary);
    opacity: 0.6;
    flex-shrink: 0;
}

/* Form Grid */
.form-grid[b-a2fogkmk13] {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: var(--space-4);
}

.form-group[b-a2fogkmk13] {
    display: flex;
    flex-direction: column;
}

.form-group-wide[b-a2fogkmk13] {
    grid-column: span 2;
}

/* Form Controls */
.form-label[b-a2fogkmk13] {
    font-size: var(--font-size-xs);
    font-weight: var(--font-weight-medium);
    color: var(--text-secondary);
    text-transform: uppercase;
    letter-spacing: 0.3px;
    margin-bottom: var(--space-1);
}

.form-control[b-a2fogkmk13] {
    padding: var(--space-2) var(--space-3);
    font-size: var(--font-size-sm);
    color: var(--color-gray-700);
    border: var(--border-width-thin) solid var(--border-color-light);
    background-color: var(--color-white);
    transition: border-color var(--transition-fast) var(--transition-ease);
}

.form-control:focus[b-a2fogkmk13] {
    border-color: var(--color-primary);
    outline: none;
    box-shadow: none;
}

.form-control[b-a2fogkmk13]::placeholder {
    color: var(--color-gray-400);
}

.form-control-static[b-a2fogkmk13] {
    padding: var(--space-2) var(--space-3);
    font-size: var(--font-size-sm);
    color: var(--text-muted);
    background-color: var(--color-gray-50);
    border: var(--border-width-thin) solid var(--border-color-light);
    font-family: var(--font-mono);
}

/* Form Actions */
.form-actions[b-a2fogkmk13] {
    display: flex;
    justify-content: flex-end;
    gap: var(--space-3);
    padding-top: var(--space-4);
    border-top: var(--border-width-thin) solid var(--border-color-light);
}

.form-actions .btn[b-a2fogkmk13] {
    display: inline-flex;
    align-items: center;
    gap: var(--space-2);
    padding: var(--space-2) var(--space-5);
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-medium);
    cursor: pointer;
    text-decoration: none;
}

.btn-action[b-a2fogkmk13] {
    background-color: var(--color-action);
    color: var(--text-on-action);
    border: var(--border-width-thin) solid var(--color-action);
    transition: background-color var(--transition-fast) var(--transition-ease);
}

.btn-action:hover[b-a2fogkmk13] {
    background-color: var(--color-action-hover);
    border-color: var(--color-action-hover);
    color: var(--text-on-action);
}

.btn-action:disabled[b-a2fogkmk13] {
    opacity: 0.65;
    cursor: not-allowed;
}
/* /Components/Pages/Shipping/TransportReasonList.razor.rz.scp.css */
/* ===========================
   TransportReasonList - Scoped Styles
   Flat Industrial Minimal
   =========================== */

/* Page Container */
.page-container[b-djw7c0z5gp] {
    max-width: 1200px;
    margin: 0 auto;
    padding: var(--space-6) var(--space-4);
}

/* Header */
.page-header[b-djw7c0z5gp] {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    margin-bottom: var(--space-6);
    gap: var(--space-4);
}

.page-header-left[b-djw7c0z5gp] {
    flex: 1;
}

.page-header-right[b-djw7c0z5gp] {
    flex-shrink: 0;
}

.page-title[b-djw7c0z5gp] {
    font-size: var(--font-size-2xl);
    font-weight: var(--font-weight-bold);
    color: var(--color-primary);
    display: flex;
    align-items: center;
    gap: var(--space-2);
    margin: 0;
}

.page-title svg[b-djw7c0z5gp] {
    color: var(--color-primary);
    flex-shrink: 0;
}

.page-subtitle[b-djw7c0z5gp] {
    color: var(--text-muted);
    font-size: var(--font-size-sm);
    margin: var(--space-1) 0 0 0;
}

/* Action Button */
.btn-action[b-djw7c0z5gp] {
    display: inline-flex;
    align-items: center;
    gap: var(--space-2);
    padding: var(--space-2) var(--space-4);
    background-color: var(--color-action);
    color: var(--text-on-action);
    border: var(--border-width-thin) solid var(--color-action);
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-medium);
    text-decoration: none;
    cursor: pointer;
    transition: background-color var(--transition-fast) var(--transition-ease),
                box-shadow var(--transition-fast) var(--transition-ease);
}

.btn-action:hover[b-djw7c0z5gp] {
    background-color: var(--color-action-hover);
    border-color: var(--color-action-hover);
    color: var(--text-on-action);
    text-decoration: none;
    box-shadow: var(--shadow-sm);
}

.btn-action:active[b-djw7c0z5gp] {
    background-color: var(--color-action-active);
}

/* Alert Bars */
.alert-bar[b-djw7c0z5gp] {
    display: flex;
    align-items: center;
    gap: var(--space-2);
    padding: var(--space-3) var(--space-4);
    margin-bottom: var(--space-4);
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-medium);
    border-left: var(--border-width-thick) solid;
}

.alert-bar-success[b-djw7c0z5gp] {
    background-color: #edf7ed;
    border-left-color: var(--color-success);
    color: #1e4620;
}

.alert-bar-danger[b-djw7c0z5gp] {
    background-color: #fdeded;
    border-left-color: var(--color-danger);
    color: #5f2120;
}

.alert-bar-close[b-djw7c0z5gp] {
    margin-left: auto;
    background: none;
    border: none;
    font-size: var(--font-size-lg);
    cursor: pointer;
    color: inherit;
    opacity: 0.6;
    line-height: 1;
}

.alert-bar-close:hover[b-djw7c0z5gp] {
    opacity: 1;
}

/* Search Bar */
.search-bar[b-djw7c0z5gp] {
    display: flex;
    align-items: center;
    gap: var(--space-4);
    margin-bottom: var(--space-4);
    padding: var(--space-3) var(--space-4);
    background-color: var(--bg-secondary);
    border: var(--border-width-thin) solid var(--border-color-light);
}

.search-input-wrapper[b-djw7c0z5gp] {
    display: flex;
    align-items: center;
    flex: 1;
    position: relative;
}

.search-icon[b-djw7c0z5gp] {
    color: var(--text-muted);
    flex-shrink: 0;
    margin-right: var(--space-2);
}

.search-input[b-djw7c0z5gp] {
    flex: 1;
    border: none;
    background: transparent;
    font-size: var(--font-size-sm);
    color: var(--color-gray-700);
    outline: none;
    padding: var(--space-1) 0;
}

.search-input[b-djw7c0z5gp]::placeholder {
    color: var(--text-muted);
}

.search-clear[b-djw7c0z5gp] {
    background: none;
    border: none;
    cursor: pointer;
    color: var(--text-muted);
    padding: var(--space-1);
    display: flex;
    align-items: center;
}

.search-clear:hover[b-djw7c0z5gp] {
    color: var(--color-primary);
}

.search-count[b-djw7c0z5gp] {
    flex-shrink: 0;
    font-size: var(--font-size-xs);
    color: var(--text-muted);
    font-weight: var(--font-weight-medium);
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

/* Loading / Empty States */
.loading-state[b-djw7c0z5gp] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: var(--space-16) 0;
    color: var(--text-muted);
    gap: var(--space-4);
}

.empty-state[b-djw7c0z5gp] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: var(--space-16) 0;
    color: var(--text-muted);
    gap: var(--space-3);
}

.empty-state svg[b-djw7c0z5gp] {
    opacity: 0.4;
}

.empty-state-text[b-djw7c0z5gp] {
    font-size: var(--font-size-base);
    margin: 0;
}

/* Item List */
.item-list[b-djw7c0z5gp] {
    display: flex;
    flex-direction: column;
    border: var(--border-width-thin) solid var(--border-color-light);
}

/* Item Row */
.item-row[b-djw7c0z5gp] {
    display: flex;
    align-items: center;
    gap: var(--space-4);
    padding: var(--space-4);
    border-bottom: var(--border-width-thin) solid var(--border-color-light);
    transition: background-color var(--transition-fast) var(--transition-ease);
}

.item-row:last-child[b-djw7c0z5gp] {
    border-bottom: none;
}

.item-row:hover[b-djw7c0z5gp] {
    background-color: rgba(11, 36, 62, 0.03);
}

/* Avatar */
.item-avatar[b-djw7c0z5gp] {
    flex-shrink: 0;
    width: 40px;
    height: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: var(--color-gray-100);
    color: var(--color-primary);
}

/* Item Info */
.item-info[b-djw7c0z5gp] {
    flex: 1;
    min-width: 0;
}

.item-name[b-djw7c0z5gp] {
    font-size: var(--font-size-base);
    font-weight: var(--font-weight-semibold);
    color: var(--color-primary);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.item-meta[b-djw7c0z5gp] {
    display: flex;
    align-items: center;
    gap: var(--space-1);
    flex-wrap: wrap;
    font-size: var(--font-size-xs);
    color: var(--text-secondary);
    margin-top: 2px;
}

.item-code[b-djw7c0z5gp] {
    font-family: var(--font-mono);
    font-weight: var(--font-weight-medium);
    color: var(--color-primary);
    opacity: 0.7;
}

.meta-separator[b-djw7c0z5gp] {
    color: var(--color-gray-300);
}

/* Action Buttons */
.item-actions[b-djw7c0z5gp] {
    flex-shrink: 0;
    display: flex;
    align-items: center;
    gap: var(--space-1);
}

.btn-icon[b-djw7c0z5gp] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 36px;
    background: none;
    border: var(--border-width-thin) solid transparent;
    cursor: pointer;
    color: var(--text-muted);
    text-decoration: none;
    transition: all var(--transition-fast) var(--transition-ease);
}

.btn-icon:hover[b-djw7c0z5gp] {
    color: var(--color-primary);
    background-color: var(--color-gray-100);
    border-color: var(--border-color-light);
    text-decoration: none;
}

.btn-icon-danger:hover[b-djw7c0z5gp] {
    color: var(--color-action);
    background-color: rgba(178, 34, 34, 0.06);
    border-color: rgba(178, 34, 34, 0.2);
}

/* Overlay & Dialog */
.overlay[b-djw7c0z5gp] {
    position: fixed;
    inset: 0;
    background-color: rgba(0, 0, 0, 0.4);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: var(--z-modal-backdrop);
}

.confirm-dialog[b-djw7c0z5gp] {
    background-color: var(--color-white);
    padding: var(--space-8);
    max-width: 420px;
    width: 90%;
    box-shadow: var(--shadow-xl);
    text-align: center;
    z-index: var(--z-modal);
}

.confirm-icon[b-djw7c0z5gp] {
    color: var(--color-action);
    margin-bottom: var(--space-4);
}

.confirm-dialog h3[b-djw7c0z5gp] {
    font-size: var(--font-size-lg);
    font-weight: var(--font-weight-semibold);
    color: var(--color-primary);
    margin: 0 0 var(--space-2) 0;
}

.confirm-dialog p[b-djw7c0z5gp] {
    font-size: var(--font-size-sm);
    color: var(--text-secondary);
    margin: 0 0 var(--space-2) 0;
}

.confirm-warning[b-djw7c0z5gp] {
    font-size: var(--font-size-xs) !important;
    color: var(--color-action) !important;
    font-weight: var(--font-weight-medium);
}

.confirm-actions[b-djw7c0z5gp] {
    display: flex;
    gap: var(--space-3);
    justify-content: center;
    margin-top: var(--space-6);
}

.confirm-actions .btn[b-djw7c0z5gp] {
    min-width: 100px;
    padding: var(--space-2) var(--space-4);
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-medium);
    cursor: pointer;
}

/* Outline Primary Button */
.btn-outline-primary[b-djw7c0z5gp] {
    background: transparent;
    color: var(--color-primary);
    border: var(--border-width-thin) solid var(--color-primary);
}

.btn-outline-primary:hover[b-djw7c0z5gp] {
    background-color: var(--color-primary);
    color: var(--text-on-primary);
}

/* Responsive */
@media (max-width: 768px) {
    .page-header[b-djw7c0z5gp] {
        flex-direction: column;
        gap: var(--space-3);
    }

    .item-row[b-djw7c0z5gp] {
        flex-wrap: wrap;
    }

    .item-actions[b-djw7c0z5gp] {
        width: 100%;
        justify-content: flex-end;
    }
}
/* /Components/Pages/Shipping/VehicleCreate.razor.rz.scp.css */
/* ===========================
   VehicleCreate - Scoped Styles
   Flat Industrial Minimal
   =========================== */

/* Page Container */
.page-container[b-qwtchaltph] {
    max-width: 900px;
    margin: 0 auto;
    padding: var(--space-6) var(--space-4);
}

/* Header */
.page-header[b-qwtchaltph] {
    display: flex;
    align-items: center;
    gap: var(--space-4);
    margin-bottom: var(--space-6);
}

.btn-back[b-qwtchaltph] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    color: var(--text-muted);
    border: var(--border-width-thin) solid var(--border-color-light);
    text-decoration: none;
    transition: all var(--transition-fast) var(--transition-ease);
    flex-shrink: 0;
}

.btn-back:hover[b-qwtchaltph] {
    color: var(--color-primary);
    border-color: var(--color-primary);
    background-color: var(--color-gray-50);
    text-decoration: none;
}

.page-header-text[b-qwtchaltph] {
    flex: 1;
}

.page-title[b-qwtchaltph] {
    font-size: var(--font-size-xl);
    font-weight: var(--font-weight-bold);
    color: var(--color-primary);
    display: flex;
    align-items: center;
    gap: var(--space-2);
    margin: 0;
}

.page-title svg[b-qwtchaltph] {
    color: var(--color-primary);
    flex-shrink: 0;
}

.page-subtitle[b-qwtchaltph] {
    color: var(--text-muted);
    font-size: var(--font-size-sm);
    margin: 2px 0 0 0;
}

/* Alert Bar */
.alert-bar[b-qwtchaltph] {
    display: flex;
    align-items: center;
    gap: var(--space-2);
    padding: var(--space-3) var(--space-4);
    margin-bottom: var(--space-4);
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-medium);
    border-left: var(--border-width-thick) solid;
}

.alert-bar-danger[b-qwtchaltph] {
    background-color: #fdeded;
    border-left-color: var(--color-danger);
    color: #5f2120;
}

.alert-bar-close[b-qwtchaltph] {
    margin-left: auto;
    background: none;
    border: none;
    font-size: var(--font-size-lg);
    cursor: pointer;
    color: inherit;
    opacity: 0.6;
    line-height: 1;
}

.alert-bar-close:hover[b-qwtchaltph] {
    opacity: 1;
}

/* Form Sections */
.form-section[b-qwtchaltph] {
    margin-bottom: var(--space-6);
    padding: var(--space-5);
    background-color: var(--color-white);
    border: var(--border-width-thin) solid var(--border-color-light);
}

.section-title[b-qwtchaltph] {
    display: flex;
    align-items: center;
    gap: var(--space-2);
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-semibold);
    color: var(--color-primary);
    text-transform: uppercase;
    letter-spacing: 0.5px;
    margin: 0 0 var(--space-4) 0;
    padding-bottom: var(--space-3);
    border-bottom: var(--border-width-thin) solid var(--border-color-light);
}

.section-title svg[b-qwtchaltph] {
    color: var(--color-primary);
    opacity: 0.6;
    flex-shrink: 0;
}

/* Form Grid */
.form-grid[b-qwtchaltph] {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: var(--space-4);
}

.form-group[b-qwtchaltph] {
    display: flex;
    flex-direction: column;
}

.form-group-wide[b-qwtchaltph] {
    grid-column: span 2;
}

.form-group-checkbox[b-qwtchaltph] {
    display: flex;
    align-items: center;
    padding-top: var(--space-2);
}

.form-check-label[b-qwtchaltph] {
    display: flex;
    align-items: center;
    gap: var(--space-2);
    font-size: var(--font-size-sm);
    color: var(--color-gray-700);
    cursor: pointer;
}

.form-check-input[b-qwtchaltph] {
    width: 16px;
    height: 16px;
    cursor: pointer;
}

/* Form Controls */
.form-label[b-qwtchaltph] {
    font-size: var(--font-size-xs);
    font-weight: var(--font-weight-medium);
    color: var(--text-secondary);
    text-transform: uppercase;
    letter-spacing: 0.3px;
    margin-bottom: var(--space-1);
}

.form-control[b-qwtchaltph] {
    padding: var(--space-2) var(--space-3);
    font-size: var(--font-size-sm);
    color: var(--color-gray-700);
    border: var(--border-width-thin) solid var(--border-color-light);
    background-color: var(--color-white);
    transition: border-color var(--transition-fast) var(--transition-ease);
}

.form-control:focus[b-qwtchaltph] {
    border-color: var(--color-primary);
    outline: none;
    box-shadow: none;
}

.form-control[b-qwtchaltph]::placeholder {
    color: var(--color-gray-400);
}

/* Form Actions */
.form-actions[b-qwtchaltph] {
    display: flex;
    justify-content: flex-end;
    gap: var(--space-3);
    padding-top: var(--space-4);
    border-top: var(--border-width-thin) solid var(--border-color-light);
}

.form-actions .btn[b-qwtchaltph] {
    display: inline-flex;
    align-items: center;
    gap: var(--space-2);
    padding: var(--space-2) var(--space-5);
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-medium);
    cursor: pointer;
    text-decoration: none;
}

.btn-action[b-qwtchaltph] {
    background-color: var(--color-action);
    color: var(--text-on-action);
    border: var(--border-width-thin) solid var(--color-action);
    transition: background-color var(--transition-fast) var(--transition-ease);
}

.btn-action:hover[b-qwtchaltph] {
    background-color: var(--color-action-hover);
    border-color: var(--color-action-hover);
    color: var(--text-on-action);
}

.btn-action:disabled[b-qwtchaltph] {
    opacity: 0.65;
    cursor: not-allowed;
}

.btn-outline-primary[b-qwtchaltph] {
    background: transparent;
    color: var(--color-primary);
    border: var(--border-width-thin) solid var(--color-primary);
}

.btn-outline-primary:hover[b-qwtchaltph] {
    background-color: var(--color-primary);
    color: var(--text-on-primary);
    text-decoration: none;
}

/* Validation */
[b-qwtchaltph] .validation-message {
    color: var(--color-danger);
    font-size: var(--font-size-xs);
    margin-top: 2px;
}

/* Responsive */
@media (max-width: 768px) {
    .form-grid[b-qwtchaltph] {
        grid-template-columns: 1fr;
    }

    .form-group-wide[b-qwtchaltph] {
        grid-column: span 1;
    }

    .form-actions[b-qwtchaltph] {
        flex-direction: column-reverse;
    }

    .form-actions .btn[b-qwtchaltph] {
        justify-content: center;
    }
}
/* /Components/Pages/Shipping/VehicleEdit.razor.rz.scp.css */
/* ===========================
   VehicleEdit - Scoped Styles
   Flat Industrial Minimal
   =========================== */

/* Page Container */
.page-container[b-ka32gd3ztt] {
    max-width: 900px;
    margin: 0 auto;
    padding: var(--space-6) var(--space-4);
}

/* Header */
.page-header[b-ka32gd3ztt] {
    display: flex;
    align-items: center;
    gap: var(--space-4);
    margin-bottom: var(--space-6);
}

.btn-back[b-ka32gd3ztt] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    color: var(--text-muted);
    border: var(--border-width-thin) solid var(--border-color-light);
    text-decoration: none;
    transition: all var(--transition-fast) var(--transition-ease);
    flex-shrink: 0;
}

.btn-back:hover[b-ka32gd3ztt] {
    color: var(--color-primary);
    border-color: var(--color-primary);
    background-color: var(--color-gray-50);
    text-decoration: none;
}

.page-header-text[b-ka32gd3ztt] {
    flex: 1;
}

.page-title[b-ka32gd3ztt] {
    font-size: var(--font-size-xl);
    font-weight: var(--font-weight-bold);
    color: var(--color-primary);
    display: flex;
    align-items: center;
    gap: var(--space-2);
    margin: 0;
}

.page-title svg[b-ka32gd3ztt] {
    color: var(--color-primary);
    flex-shrink: 0;
}

.page-subtitle[b-ka32gd3ztt] {
    color: var(--text-muted);
    font-size: var(--font-size-sm);
    margin: 2px 0 0 0;
    display: flex;
    align-items: center;
    gap: var(--space-2);
}

.subtitle-code[b-ka32gd3ztt] {
    font-family: var(--font-mono);
    font-size: var(--font-size-xs);
    color: var(--color-primary);
    opacity: 0.6;
    padding: 1px var(--space-2);
    background-color: var(--color-gray-100);
}

/* Alert Bar */
.alert-bar[b-ka32gd3ztt] {
    display: flex;
    align-items: center;
    gap: var(--space-2);
    padding: var(--space-3) var(--space-4);
    margin-bottom: var(--space-4);
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-medium);
    border-left: var(--border-width-thick) solid;
}

.alert-bar-danger[b-ka32gd3ztt] {
    background-color: #fdeded;
    border-left-color: var(--color-danger);
    color: #5f2120;
}

.alert-bar-close[b-ka32gd3ztt] {
    margin-left: auto;
    background: none;
    border: none;
    font-size: var(--font-size-lg);
    cursor: pointer;
    color: inherit;
    opacity: 0.6;
    line-height: 1;
}

.alert-bar-close:hover[b-ka32gd3ztt] {
    opacity: 1;
}

/* Loading / Empty States */
.loading-state[b-ka32gd3ztt] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: var(--space-16) 0;
    color: var(--text-muted);
    gap: var(--space-4);
}

.empty-state[b-ka32gd3ztt] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: var(--space-16) 0;
    color: var(--text-muted);
    gap: var(--space-3);
}

.empty-state svg[b-ka32gd3ztt] {
    opacity: 0.4;
}

.empty-state-text[b-ka32gd3ztt] {
    font-size: var(--font-size-base);
    margin: 0;
}

/* Form Sections */
.form-section[b-ka32gd3ztt] {
    margin-bottom: var(--space-6);
    padding: var(--space-5);
    background-color: var(--color-white);
    border: var(--border-width-thin) solid var(--border-color-light);
}

.section-title[b-ka32gd3ztt] {
    display: flex;
    align-items: center;
    gap: var(--space-2);
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-semibold);
    color: var(--color-primary);
    text-transform: uppercase;
    letter-spacing: 0.5px;
    margin: 0 0 var(--space-4) 0;
    padding-bottom: var(--space-3);
    border-bottom: var(--border-width-thin) solid var(--border-color-light);
}

.section-title svg[b-ka32gd3ztt] {
    color: var(--color-primary);
    opacity: 0.6;
    flex-shrink: 0;
}

/* Form Grid */
.form-grid[b-ka32gd3ztt] {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: var(--space-4);
}

.form-group[b-ka32gd3ztt] {
    display: flex;
    flex-direction: column;
}

.form-group-wide[b-ka32gd3ztt] {
    grid-column: span 2;
}

.form-group-checkbox[b-ka32gd3ztt] {
    display: flex;
    align-items: center;
    padding-top: var(--space-2);
}

.form-check-label[b-ka32gd3ztt] {
    display: flex;
    align-items: center;
    gap: var(--space-2);
    font-size: var(--font-size-sm);
    color: var(--color-gray-700);
    cursor: pointer;
}

.form-check-input[b-ka32gd3ztt] {
    width: 16px;
    height: 16px;
    cursor: pointer;
}

/* Form Controls */
.form-label[b-ka32gd3ztt] {
    font-size: var(--font-size-xs);
    font-weight: var(--font-weight-medium);
    color: var(--text-secondary);
    text-transform: uppercase;
    letter-spacing: 0.3px;
    margin-bottom: var(--space-1);
}

.form-control[b-ka32gd3ztt] {
    padding: var(--space-2) var(--space-3);
    font-size: var(--font-size-sm);
    color: var(--color-gray-700);
    border: var(--border-width-thin) solid var(--border-color-light);
    background-color: var(--color-white);
    transition: border-color var(--transition-fast) var(--transition-ease);
}

.form-control:focus[b-ka32gd3ztt] {
    border-color: var(--color-primary);
    outline: none;
    box-shadow: none;
}

.form-control[b-ka32gd3ztt]::placeholder {
    color: var(--color-gray-400);
}

.form-control-static[b-ka32gd3ztt] {
    padding: var(--space-2) var(--space-3);
    font-size: var(--font-size-sm);
    color: var(--text-muted);
    background-color: var(--color-gray-50);
    border: var(--border-width-thin) solid var(--border-color-light);
    font-family: var(--font-mono);
}

/* Form Actions */
.form-actions[b-ka32gd3ztt] {
    display: flex;
    justify-content: flex-end;
    gap: var(--space-3);
    padding-top: var(--space-4);
    border-top: var(--border-width-thin) solid var(--border-color-light);
}

.form-actions .btn[b-ka32gd3ztt] {
    display: inline-flex;
    align-items: center;
    gap: var(--space-2);
    padding: var(--space-2) var(--space-5);
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-medium);
    cursor: pointer;
    text-decoration: none;
}

.btn-action[b-ka32gd3ztt] {
    background-color: var(--color-action);
    color: var(--text-on-action);
    border: var(--border-width-thin) solid var(--color-action);
    transition: background-color var(--transition-fast) var(--transition-ease);
}

.btn-action:hover[b-ka32gd3ztt] {
    background-color: var(--color-action-hover);
    border-color: var(--color-action-hover);
    color: var(--text-on-action);
}

.btn-action:disabled[b-ka32gd3ztt] {
    opacity: 0.65;
    cursor: not-allowed;
}

.btn-outline-primary[b-ka32gd3ztt] {
    background: transparent;
    color: var(--color-primary);
    border: var(--border-width-thin) solid var(--color-primary);
}

.btn-outline-primary:hover[b-ka32gd3ztt] {
    background-color: var(--color-primary);
    color: var(--text-on-primary);
    text-decoration: none;
}

/* Validation */
[b-ka32gd3ztt] .validation-message {
    color: var(--color-danger);
    font-size: var(--font-size-xs);
    margin-top: 2px;
}

/* Responsive */
@media (max-width: 768px) {
    .form-grid[b-ka32gd3ztt] {
        grid-template-columns: 1fr;
    }

    .form-group-wide[b-ka32gd3ztt] {
        grid-column: span 1;
    }

    .form-actions[b-ka32gd3ztt] {
        flex-direction: column-reverse;
    }

    .form-actions .btn[b-ka32gd3ztt] {
        justify-content: center;
    }
}
/* /Components/Pages/Shipping/VehicleList.razor.rz.scp.css */
/* ===========================
   VehicleList - Scoped Styles
   Flat Industrial Minimal
   =========================== */

/* Page Container */
.page-container[b-apmgyr7itx] {
    max-width: 1200px;
    margin: 0 auto;
    padding: var(--space-6) var(--space-4);
}

/* Header */
.page-header[b-apmgyr7itx] {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    margin-bottom: var(--space-6);
    gap: var(--space-4);
}

.page-header-left[b-apmgyr7itx] {
    flex: 1;
}

.page-header-right[b-apmgyr7itx] {
    flex-shrink: 0;
}

.page-title[b-apmgyr7itx] {
    font-size: var(--font-size-2xl);
    font-weight: var(--font-weight-bold);
    color: var(--color-primary);
    display: flex;
    align-items: center;
    gap: var(--space-2);
    margin: 0;
}

.page-title svg[b-apmgyr7itx] {
    color: var(--color-primary);
    flex-shrink: 0;
}

.page-subtitle[b-apmgyr7itx] {
    color: var(--text-muted);
    font-size: var(--font-size-sm);
    margin: var(--space-1) 0 0 0;
}

/* Action Button */
.btn-action[b-apmgyr7itx] {
    display: inline-flex;
    align-items: center;
    gap: var(--space-2);
    padding: var(--space-2) var(--space-4);
    background-color: var(--color-action);
    color: var(--text-on-action);
    border: var(--border-width-thin) solid var(--color-action);
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-medium);
    text-decoration: none;
    cursor: pointer;
    transition: background-color var(--transition-fast) var(--transition-ease),
                box-shadow var(--transition-fast) var(--transition-ease);
}

.btn-action:hover[b-apmgyr7itx] {
    background-color: var(--color-action-hover);
    border-color: var(--color-action-hover);
    color: var(--text-on-action);
    text-decoration: none;
    box-shadow: var(--shadow-sm);
}

.btn-action:active[b-apmgyr7itx] {
    background-color: var(--color-action-active);
}

/* Alert Bars */
.alert-bar[b-apmgyr7itx] {
    display: flex;
    align-items: center;
    gap: var(--space-2);
    padding: var(--space-3) var(--space-4);
    margin-bottom: var(--space-4);
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-medium);
    border-left: var(--border-width-thick) solid;
}

.alert-bar-success[b-apmgyr7itx] {
    background-color: #edf7ed;
    border-left-color: var(--color-success);
    color: #1e4620;
}

.alert-bar-danger[b-apmgyr7itx] {
    background-color: #fdeded;
    border-left-color: var(--color-danger);
    color: #5f2120;
}

.alert-bar-close[b-apmgyr7itx] {
    margin-left: auto;
    background: none;
    border: none;
    font-size: var(--font-size-lg);
    cursor: pointer;
    color: inherit;
    opacity: 0.6;
    line-height: 1;
}

.alert-bar-close:hover[b-apmgyr7itx] {
    opacity: 1;
}

/* Search Bar */
.search-bar[b-apmgyr7itx] {
    display: flex;
    align-items: center;
    gap: var(--space-4);
    margin-bottom: var(--space-4);
    padding: var(--space-3) var(--space-4);
    background-color: var(--bg-secondary);
    border: var(--border-width-thin) solid var(--border-color-light);
}

.search-input-wrapper[b-apmgyr7itx] {
    display: flex;
    align-items: center;
    flex: 1;
    position: relative;
}

.search-icon[b-apmgyr7itx] {
    color: var(--text-muted);
    flex-shrink: 0;
    margin-right: var(--space-2);
}

.search-input[b-apmgyr7itx] {
    flex: 1;
    border: none;
    background: transparent;
    font-size: var(--font-size-sm);
    color: var(--color-gray-700);
    outline: none;
    padding: var(--space-1) 0;
}

.search-input[b-apmgyr7itx]::placeholder {
    color: var(--text-muted);
}

.search-clear[b-apmgyr7itx] {
    background: none;
    border: none;
    cursor: pointer;
    color: var(--text-muted);
    padding: var(--space-1);
    display: flex;
    align-items: center;
}

.search-clear:hover[b-apmgyr7itx] {
    color: var(--color-primary);
}

.search-count[b-apmgyr7itx] {
    flex-shrink: 0;
    font-size: var(--font-size-xs);
    color: var(--text-muted);
    font-weight: var(--font-weight-medium);
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

/* Loading / Empty States */
.loading-state[b-apmgyr7itx] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: var(--space-16) 0;
    color: var(--text-muted);
    gap: var(--space-4);
}

.empty-state[b-apmgyr7itx] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: var(--space-16) 0;
    color: var(--text-muted);
    gap: var(--space-3);
}

.empty-state svg[b-apmgyr7itx] {
    opacity: 0.4;
}

.empty-state-text[b-apmgyr7itx] {
    font-size: var(--font-size-base);
    margin: 0;
}

/* Item List */
.item-list[b-apmgyr7itx] {
    display: flex;
    flex-direction: column;
    border: var(--border-width-thin) solid var(--border-color-light);
}

/* Item Row */
.item-row[b-apmgyr7itx] {
    display: flex;
    align-items: center;
    gap: var(--space-4);
    padding: var(--space-4);
    border-bottom: var(--border-width-thin) solid var(--border-color-light);
    transition: background-color var(--transition-fast) var(--transition-ease);
}

.item-row:last-child[b-apmgyr7itx] {
    border-bottom: none;
}

.item-row:hover[b-apmgyr7itx] {
    background-color: rgba(11, 36, 62, 0.03);
}

/* Avatar */
.item-avatar[b-apmgyr7itx] {
    flex-shrink: 0;
    width: 40px;
    height: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: var(--color-gray-100);
    color: var(--color-primary);
}

/* Item Info */
.item-info[b-apmgyr7itx] {
    flex: 1;
    min-width: 0;
}

.item-name[b-apmgyr7itx] {
    font-size: var(--font-size-base);
    font-weight: var(--font-weight-semibold);
    color: var(--color-primary);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.item-meta[b-apmgyr7itx] {
    display: flex;
    align-items: center;
    gap: var(--space-1);
    flex-wrap: wrap;
    font-size: var(--font-size-xs);
    color: var(--text-secondary);
    margin-top: 2px;
}

.item-code[b-apmgyr7itx] {
    font-family: var(--font-mono);
    font-weight: var(--font-weight-medium);
    color: var(--color-primary);
    opacity: 0.7;
}

.meta-separator[b-apmgyr7itx] {
    color: var(--color-gray-300);
}

/* Action Buttons */
.item-actions[b-apmgyr7itx] {
    flex-shrink: 0;
    display: flex;
    align-items: center;
    gap: var(--space-1);
}

.btn-icon[b-apmgyr7itx] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 36px;
    background: none;
    border: var(--border-width-thin) solid transparent;
    cursor: pointer;
    color: var(--text-muted);
    text-decoration: none;
    transition: all var(--transition-fast) var(--transition-ease);
}

.btn-icon:hover[b-apmgyr7itx] {
    color: var(--color-primary);
    background-color: var(--color-gray-100);
    border-color: var(--border-color-light);
    text-decoration: none;
}

.btn-icon-danger:hover[b-apmgyr7itx] {
    color: var(--color-action);
    background-color: rgba(178, 34, 34, 0.06);
    border-color: rgba(178, 34, 34, 0.2);
}

/* Overlay & Dialog */
.overlay[b-apmgyr7itx] {
    position: fixed;
    inset: 0;
    background-color: rgba(0, 0, 0, 0.4);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: var(--z-modal-backdrop);
}

.confirm-dialog[b-apmgyr7itx] {
    background-color: var(--color-white);
    padding: var(--space-8);
    max-width: 420px;
    width: 90%;
    box-shadow: var(--shadow-xl);
    text-align: center;
    z-index: var(--z-modal);
}

.confirm-icon[b-apmgyr7itx] {
    color: var(--color-action);
    margin-bottom: var(--space-4);
}

.confirm-dialog h3[b-apmgyr7itx] {
    font-size: var(--font-size-lg);
    font-weight: var(--font-weight-semibold);
    color: var(--color-primary);
    margin: 0 0 var(--space-2) 0;
}

.confirm-dialog p[b-apmgyr7itx] {
    font-size: var(--font-size-sm);
    color: var(--text-secondary);
    margin: 0 0 var(--space-2) 0;
}

.confirm-warning[b-apmgyr7itx] {
    font-size: var(--font-size-xs) !important;
    color: var(--color-action) !important;
    font-weight: var(--font-weight-medium);
}

.confirm-actions[b-apmgyr7itx] {
    display: flex;
    gap: var(--space-3);
    justify-content: center;
    margin-top: var(--space-6);
}

.confirm-actions .btn[b-apmgyr7itx] {
    min-width: 100px;
    padding: var(--space-2) var(--space-4);
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-medium);
    cursor: pointer;
}

/* Outline Primary Button */
.btn-outline-primary[b-apmgyr7itx] {
    background: transparent;
    color: var(--color-primary);
    border: var(--border-width-thin) solid var(--color-primary);
}

.btn-outline-primary:hover[b-apmgyr7itx] {
    background-color: var(--color-primary);
    color: var(--text-on-primary);
}

/* Responsive */
@media (max-width: 768px) {
    .page-header[b-apmgyr7itx] {
        flex-direction: column;
        gap: var(--space-3);
    }

    .item-row[b-apmgyr7itx] {
        flex-wrap: wrap;
    }

    .item-actions[b-apmgyr7itx] {
        width: 100%;
        justify-content: flex-end;
    }
}
/* /Components/Pages/SystemAdministration.razor.rz.scp.css */
/* SystemAdministration page styles */

.container-fluid[b-fes3ruy0vg] {
    max-width: 1400px;
    margin: 0 auto;
}

/* Tab styling */
.nav-tabs[b-fes3ruy0vg] {
    border-bottom: 2px solid #0B243E;
}

.nav-tabs .nav-link[b-fes3ruy0vg] {
    color: #6c757d;
    border: none;
    border-bottom: 3px solid transparent;
    padding: 0.75rem 1.5rem;
    transition: all 0.3s ease;
}

.nav-tabs .nav-link:hover[b-fes3ruy0vg] {
    color: #0B243E;
    border-bottom-color: rgba(11, 36, 62, 0.3);
}

.nav-tabs .nav-link.active[b-fes3ruy0vg] {
    color: #0B243E;
    background-color: transparent;
    border-bottom-color: #0B243E;
    font-weight: 600;
}

.nav-tabs .nav-link svg[b-fes3ruy0vg] {
    vertical-align: middle;
}

/* Card styling */
.card[b-fes3ruy0vg] {
    border: 1px solid #e0e0e0;
    border-radius: 8px;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.05);
    transition: box-shadow 0.3s ease;
}

.card:hover[b-fes3ruy0vg] {
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
}

.card-header[b-fes3ruy0vg] {
    border-radius: 8px 8px 0 0 !important;
    padding: 1rem 1.25rem;
    font-weight: 600;
}

.card-header.bg-primary[b-fes3ruy0vg] {
    background-color: #0B243E !important;
}

.card-header.bg-success[b-fes3ruy0vg] {
    background-color: #28a745 !important;
}

.card-header.bg-light[b-fes3ruy0vg] {
    background-color: #f8f9fa !important;
    color: #0B243E;
}

/* Form styling */
.form-label[b-fes3ruy0vg] {
    font-weight: 500;
    color: #495057;
    margin-bottom: 0.5rem;
}

.form-control:focus[b-fes3ruy0vg],
.form-select:focus[b-fes3ruy0vg] {
    border-color: #0B243E;
    box-shadow: 0 0 0 0.2rem rgba(11, 36, 62, 0.25);
}

/* Table styling */
.table[b-fes3ruy0vg] {
    margin-bottom: 0;
}

.table thead th[b-fes3ruy0vg] {
    background-color: #f8f9fa;
    border-bottom: 2px solid #0B243E;
    color: #0B243E;
    font-weight: 600;
    text-transform: uppercase;
    font-size: 0.85rem;
    letter-spacing: 0.5px;
}

.table tbody tr[b-fes3ruy0vg] {
    transition: background-color 0.2s ease;
}

.table tbody tr:hover[b-fes3ruy0vg] {
    background-color: rgba(11, 36, 62, 0.05);
}

.table tbody td[b-fes3ruy0vg] {
    vertical-align: middle;
    padding: 1rem 0.75rem;
}

.table tbody td code[b-fes3ruy0vg] {
    background-color: #f8f9fa;
    padding: 0.2rem 0.5rem;
    border-radius: 4px;
    font-size: 0.9rem;
    color: #0B243E;
}

/* Badge styling */
.badge[b-fes3ruy0vg] {
    padding: 0.4rem 0.8rem;
    font-weight: 500;
    font-size: 0.85rem;
}

.badge.bg-success[b-fes3ruy0vg] {
    background-color: #28a745 !important;
}

.badge.bg-danger[b-fes3ruy0vg] {
    background-color: #dc3545 !important;
}

.badge.bg-secondary[b-fes3ruy0vg] {
    background-color: #6c757d !important;
}

.badge.bg-info[b-fes3ruy0vg] {
    background-color: #17a2b8 !important;
}

.badge.bg-warning[b-fes3ruy0vg] {
    background-color: #ffc107 !important;
}

/* Alert styling */
.alert[b-fes3ruy0vg] {
    border-radius: 8px;
    border: none;
}

.alert-danger[b-fes3ruy0vg] {
    background-color: #f8d7da;
    color: #721c24;
}

.alert-success[b-fes3ruy0vg] {
    background-color: #d4edda;
    color: #155724;
}

.alert-info[b-fes3ruy0vg] {
    background-color: #d1ecf1;
    color: #0c5460;
}

/* Button styling */
.btn[b-fes3ruy0vg] {
    border-radius: 6px;
    padding: 0.5rem 1.25rem;
    font-weight: 500;
    transition: all 0.3s ease;
}

.btn-primary[b-fes3ruy0vg] {
    background-color: #0B243E;
    border-color: #0B243E;
}

.btn-primary:hover[b-fes3ruy0vg] {
    background-color: #1e4d7b;
    border-color: #1e4d7b;
    transform: translateY(-1px);
    box-shadow: 0 4px 8px rgba(11, 36, 62, 0.2);
}

.btn-success[b-fes3ruy0vg] {
    background-color: #28a745;
    border-color: #28a745;
}

.btn-success:hover[b-fes3ruy0vg] {
    background-color: #218838;
    border-color: #1e7e34;
    transform: translateY(-1px);
    box-shadow: 0 4px 8px rgba(40, 167, 69, 0.2);
}

.btn-outline-secondary:hover[b-fes3ruy0vg] {
    background-color: #0B243E;
    border-color: #0B243E;
}

.btn-outline-primary[b-fes3ruy0vg] {
    color: #0B243E;
    border-color: #0B243E;
}

.btn-outline-primary:hover[b-fes3ruy0vg] {
    background-color: #0B243E;
    border-color: #0B243E;
    color: white;
}

.btn svg[b-fes3ruy0vg] {
    vertical-align: middle;
}

/* Modal styling */
.modal-header.bg-primary[b-fes3ruy0vg] {
    background: linear-gradient(135deg, #0B243E 0%, #1e4d7b 100%) !important;
}

.modal-header.bg-success[b-fes3ruy0vg] {
    background: linear-gradient(135deg, #28a745 0%, #218838 100%) !important;
}

.modal-content[b-fes3ruy0vg] {
    border: none;
    border-radius: 12px;
    overflow: hidden;
    box-shadow: 0 10px 40px rgba(0, 0, 0, 0.3);
}

.modal-header[b-fes3ruy0vg] {
    padding: 1.25rem 1.5rem;
}

.modal-header .modal-title[b-fes3ruy0vg] {
    font-weight: 600;
}

.modal-body[b-fes3ruy0vg] {
    padding: 1.5rem;
}

.modal-footer[b-fes3ruy0vg] {
    border-top: 1px solid #e9ecef;
    padding: 1rem 1.5rem;
}

/* Loading spinner */
.spinner-border[b-fes3ruy0vg] {
    vertical-align: middle;
}

/* Responsive adjustments */
@media (max-width: 767.98px) {
    .container-fluid[b-fes3ruy0vg] {
        padding-left: 0.5rem;
        padding-right: 0.5rem;
    }

    .card-body[b-fes3ruy0vg] {
        padding: 1rem;
    }

    .table[b-fes3ruy0vg] {
        font-size: 0.875rem;
    }

    .table tbody td[b-fes3ruy0vg] {
        padding: 0.75rem 0.5rem;
    }

    .nav-tabs .nav-link[b-fes3ruy0vg] {
        padding: 0.5rem 1rem;
        font-size: 0.9rem;
    }
}
/* /Components/Pages/TenantAdministration.razor.rz.scp.css */
/* TenantAdministration page styles */

.container-fluid[b-8t297kdanv] {
    max-width: 1400px;
    margin: 0 auto;
}

/* Card styling */
.card[b-8t297kdanv] {
    border: 1px solid #e0e0e0;
    border-radius: 8px;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.05);
    transition: box-shadow 0.3s ease;
}

.card:hover[b-8t297kdanv] {
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
}

.card-header[b-8t297kdanv] {
    border-radius: 8px 8px 0 0 !important;
    padding: 1rem 1.25rem;
    font-weight: 600;
}

.card-header.bg-success[b-8t297kdanv] {
    background-color: #28a745 !important;
}

.card-header.bg-light[b-8t297kdanv] {
    background-color: #f8f9fa !important;
    color: #0B243E;
}

/* Form styling */
.form-label[b-8t297kdanv] {
    font-weight: 500;
    color: #495057;
    margin-bottom: 0.5rem;
}

.form-control:focus[b-8t297kdanv],
.form-select:focus[b-8t297kdanv] {
    border-color: #0B243E;
    box-shadow: 0 0 0 0.2rem rgba(11, 36, 62, 0.25);
}

.form-control:disabled[b-8t297kdanv] {
    background-color: #e9ecef;
    opacity: 0.7;
}

/* Statistics section */
.stat-item[b-8t297kdanv] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 0.75rem 0;
    border-bottom: 1px solid #e9ecef;
}

.stat-item:last-child[b-8t297kdanv] {
    border-bottom: none;
}

.stat-label[b-8t297kdanv] {
    font-weight: 500;
    color: #6c757d;
    font-size: 0.9rem;
}

.stat-value[b-8t297kdanv] {
    font-weight: 700;
    font-size: 1.5rem;
    color: #0B243E;
}

.stat-value.text-success[b-8t297kdanv] {
    color: #28a745 !important;
}

.stat-value.text-danger[b-8t297kdanv] {
    color: #dc3545 !important;
}

.stat-value.text-info[b-8t297kdanv] {
    color: #17a2b8 !important;
}

/* Table styling */
.table[b-8t297kdanv] {
    margin-bottom: 0;
}

.table thead th[b-8t297kdanv] {
    background-color: #f8f9fa;
    border-bottom: 2px solid #0B243E;
    color: #0B243E;
    font-weight: 600;
    text-transform: uppercase;
    font-size: 0.85rem;
    letter-spacing: 0.5px;
}

.table tbody tr[b-8t297kdanv] {
    transition: background-color 0.2s ease;
}

.table tbody tr:hover[b-8t297kdanv] {
    background-color: rgba(11, 36, 62, 0.05);
}

.table tbody td[b-8t297kdanv] {
    vertical-align: middle;
    padding: 1rem 0.75rem;
}

/* Badge styling */
.badge[b-8t297kdanv] {
    padding: 0.4rem 0.8rem;
    font-weight: 500;
    font-size: 0.85rem;
}

.badge.bg-success[b-8t297kdanv] {
    background-color: #28a745 !important;
}

.badge.bg-danger[b-8t297kdanv] {
    background-color: #dc3545 !important;
}

.badge.bg-info[b-8t297kdanv] {
    background-color: #17a2b8 !important;
}

.badge.bg-warning[b-8t297kdanv] {
    background-color: #ffc107 !important;
}

.badge.bg-secondary[b-8t297kdanv] {
    background-color: #6c757d !important;
}

/* Alert styling */
.alert[b-8t297kdanv] {
    border-radius: 8px;
    border: none;
}

.alert-danger[b-8t297kdanv] {
    background-color: #f8d7da;
    color: #721c24;
}

.alert-success[b-8t297kdanv] {
    background-color: #d4edda;
    color: #155724;
}

.alert-info[b-8t297kdanv] {
    background-color: #d1ecf1;
    color: #0c5460;
}

/* Button styling */
.btn[b-8t297kdanv] {
    border-radius: 6px;
    padding: 0.5rem 1.25rem;
    font-weight: 500;
    transition: all 0.3s ease;
}

.btn-success[b-8t297kdanv] {
    background-color: #28a745;
    border-color: #28a745;
}

.btn-success:hover[b-8t297kdanv] {
    background-color: #218838;
    border-color: #1e7e34;
    transform: translateY(-1px);
    box-shadow: 0 4px 8px rgba(40, 167, 69, 0.2);
}

.btn-outline-secondary:hover[b-8t297kdanv] {
    background-color: #0B243E;
    border-color: #0B243E;
}

.btn-outline-primary[b-8t297kdanv] {
    color: #0B243E;
    border-color: #0B243E;
}

.btn-outline-primary:hover[b-8t297kdanv] {
    background-color: #0B243E;
    border-color: #0B243E;
    color: white;
}

.btn svg[b-8t297kdanv] {
    vertical-align: middle;
}

/* Loading spinner */
.spinner-border[b-8t297kdanv] {
    vertical-align: middle;
}

/* Responsive adjustments */
@media (max-width: 767.98px) {
    .container-fluid[b-8t297kdanv] {
        padding-left: 0.5rem;
        padding-right: 0.5rem;
    }

    .card-body[b-8t297kdanv] {
        padding: 1rem;
    }

    .table[b-8t297kdanv] {
        font-size: 0.875rem;
    }

    .table tbody td[b-8t297kdanv] {
        padding: 0.75rem 0.5rem;
    }

    .stat-value[b-8t297kdanv] {
        font-size: 1.25rem;
    }
}
/* /Components/Pages/Warehouse/DocumentTextEdit.razor.rz.scp.css */
/* ===========================
   DocumentTextEdit - Scoped Styles
   Flat Industrial Minimal
   =========================== */

/* Page Container */
.page-container[b-dhyy20ki0e] {
    max-width: 900px;
    margin: 0 auto;
    padding: var(--space-6) var(--space-4);
}

/* Header */
.page-header[b-dhyy20ki0e] {
    display: flex;
    align-items: center;
    gap: var(--space-4);
    margin-bottom: var(--space-6);
}

.btn-back[b-dhyy20ki0e] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    color: var(--text-muted);
    border: var(--border-width-thin) solid var(--border-color-light);
    text-decoration: none;
    transition: all var(--transition-fast) var(--transition-ease);
    flex-shrink: 0;
}

.btn-back:hover[b-dhyy20ki0e] {
    color: var(--color-primary);
    border-color: var(--color-primary);
    background-color: var(--color-gray-50);
    text-decoration: none;
}

.page-header-text[b-dhyy20ki0e] {
    flex: 1;
}

.page-title[b-dhyy20ki0e] {
    font-size: var(--font-size-xl);
    font-weight: var(--font-weight-bold);
    color: var(--color-primary);
    display: flex;
    align-items: center;
    gap: var(--space-2);
    margin: 0;
}

.page-title svg[b-dhyy20ki0e] {
    color: var(--color-primary);
    flex-shrink: 0;
}

.page-subtitle[b-dhyy20ki0e] {
    color: var(--text-muted);
    font-size: var(--font-size-sm);
    margin: 2px 0 0 0;
    display: flex;
    align-items: center;
    gap: var(--space-2);
}

.subtitle-code[b-dhyy20ki0e] {
    font-family: var(--font-mono);
    font-size: var(--font-size-xs);
    color: var(--color-primary);
    opacity: 0.6;
    padding: 1px var(--space-2);
    background-color: var(--color-gray-100);
}

/* Alert Bar */
.alert-bar[b-dhyy20ki0e] {
    display: flex;
    align-items: center;
    gap: var(--space-2);
    padding: var(--space-3) var(--space-4);
    margin-bottom: var(--space-4);
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-medium);
    border-left: var(--border-width-thick) solid;
}

.alert-bar-danger[b-dhyy20ki0e] {
    background-color: #fdeded;
    border-left-color: var(--color-danger);
    color: #5f2120;
}

.alert-bar-close[b-dhyy20ki0e] {
    margin-left: auto;
    background: none;
    border: none;
    font-size: var(--font-size-lg);
    cursor: pointer;
    color: inherit;
    opacity: 0.6;
    line-height: 1;
}

.alert-bar-close:hover[b-dhyy20ki0e] {
    opacity: 1;
}

/* Loading / Empty States */
.loading-state[b-dhyy20ki0e] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: var(--space-16) 0;
    color: var(--text-muted);
    gap: var(--space-4);
}

.empty-state[b-dhyy20ki0e] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: var(--space-16) 0;
    color: var(--text-muted);
    gap: var(--space-3);
}

.empty-state svg[b-dhyy20ki0e] {
    opacity: 0.4;
}

.empty-state-text[b-dhyy20ki0e] {
    font-size: var(--font-size-base);
    margin: 0;
}

/* Form Sections */
.form-section[b-dhyy20ki0e] {
    margin-bottom: var(--space-6);
    padding: var(--space-5);
    background-color: var(--color-white);
    border: var(--border-width-thin) solid var(--border-color-light);
}

.section-title[b-dhyy20ki0e] {
    display: flex;
    align-items: center;
    gap: var(--space-2);
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-semibold);
    color: var(--color-primary);
    text-transform: uppercase;
    letter-spacing: 0.5px;
    margin: 0 0 var(--space-4) 0;
    padding-bottom: var(--space-3);
    border-bottom: var(--border-width-thin) solid var(--border-color-light);
}

.section-title svg[b-dhyy20ki0e] {
    color: var(--color-primary);
    opacity: 0.6;
    flex-shrink: 0;
}

/* Form Grid */
.form-grid[b-dhyy20ki0e] {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: var(--space-4);
}

.form-group[b-dhyy20ki0e] {
    display: flex;
    flex-direction: column;
}

.form-group-wide[b-dhyy20ki0e] {
    grid-column: span 2;
}

/* Form Controls */
.form-label[b-dhyy20ki0e] {
    font-size: var(--font-size-xs);
    font-weight: var(--font-weight-medium);
    color: var(--text-secondary);
    text-transform: uppercase;
    letter-spacing: 0.3px;
    margin-bottom: var(--space-1);
}

.form-control[b-dhyy20ki0e] {
    padding: var(--space-2) var(--space-3);
    font-size: var(--font-size-sm);
    color: var(--color-gray-700);
    border: var(--border-width-thin) solid var(--border-color-light);
    background-color: var(--color-white);
    transition: border-color var(--transition-fast) var(--transition-ease);
}

.form-control:focus[b-dhyy20ki0e] {
    border-color: var(--color-primary);
    outline: none;
    box-shadow: none;
}

.form-control[b-dhyy20ki0e]::placeholder {
    color: var(--color-gray-400);
}

.form-control-static[b-dhyy20ki0e] {
    padding: var(--space-2) var(--space-3);
    font-size: var(--font-size-sm);
    color: var(--text-muted);
    background-color: var(--color-gray-50);
    border: var(--border-width-thin) solid var(--border-color-light);
    font-family: var(--font-mono);
}

/* Form Actions */
.form-actions[b-dhyy20ki0e] {
    display: flex;
    justify-content: flex-end;
    gap: var(--space-3);
    padding-top: var(--space-4);
    border-top: var(--border-width-thin) solid var(--border-color-light);
}

.form-actions .btn[b-dhyy20ki0e] {
    display: inline-flex;
    align-items: center;
    gap: var(--space-2);
    padding: var(--space-2) var(--space-5);
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-medium);
    cursor: pointer;
    text-decoration: none;
}

.btn-action[b-dhyy20ki0e] {
    background-color: var(--color-action);
    color: var(--text-on-action);
    border: var(--border-width-thin) solid var(--color-action);
    transition: background-color var(--transition-fast) var(--transition-ease);
}

.btn-action:hover[b-dhyy20ki0e] {
    background-color: var(--color-action-hover);
    border-color: var(--color-action-hover);
    color: var(--text-on-action);
}

.btn-action:disabled[b-dhyy20ki0e] {
    opacity: 0.65;
    cursor: not-allowed;
}

.btn-outline-primary[b-dhyy20ki0e] {
    background: transparent;
    color: var(--color-primary);
    border: var(--border-width-thin) solid var(--color-primary);
}

.btn-outline-primary:hover[b-dhyy20ki0e] {
    background-color: var(--color-primary);
    color: var(--text-on-primary);
    text-decoration: none;
}

/* Validation */
[b-dhyy20ki0e] .validation-message {
    color: var(--color-danger);
    font-size: var(--font-size-xs);
    margin-top: 2px;
}

/* Responsive */
@media (max-width: 768px) {
    .form-grid[b-dhyy20ki0e] {
        grid-template-columns: 1fr;
    }

    .form-group-wide[b-dhyy20ki0e] {
        grid-column: span 1;
    }

    .form-actions[b-dhyy20ki0e] {
        flex-direction: column-reverse;
    }

    .form-actions .btn[b-dhyy20ki0e] {
        justify-content: center;
    }
}
/* /Components/Pages/Warehouse/DocumentTextList.razor.rz.scp.css */
/* ===========================
   DocumentTextList - Scoped Styles
   Flat Industrial Minimal
   =========================== */

/* Page Container */
.page-container[b-xq7cc43cc4] {
    max-width: 1200px;
    margin: 0 auto;
    padding: var(--space-6) var(--space-4);
}

/* Header */
.page-header[b-xq7cc43cc4] {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    margin-bottom: var(--space-6);
    gap: var(--space-4);
}

.page-header-left[b-xq7cc43cc4] {
    flex: 1;
}

.page-header-right[b-xq7cc43cc4] {
    flex-shrink: 0;
}

.page-title[b-xq7cc43cc4] {
    font-size: var(--font-size-2xl);
    font-weight: var(--font-weight-bold);
    color: var(--color-primary);
    display: flex;
    align-items: center;
    gap: var(--space-2);
    margin: 0;
}

.page-title svg[b-xq7cc43cc4] {
    color: var(--color-primary);
    flex-shrink: 0;
}

.page-subtitle[b-xq7cc43cc4] {
    color: var(--text-muted);
    font-size: var(--font-size-sm);
    margin: var(--space-1) 0 0 0;
}

/* Action Button */
.btn-action[b-xq7cc43cc4] {
    display: inline-flex;
    align-items: center;
    gap: var(--space-2);
    padding: var(--space-2) var(--space-4);
    background-color: var(--color-action);
    color: var(--text-on-action);
    border: var(--border-width-thin) solid var(--color-action);
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-medium);
    text-decoration: none;
    cursor: pointer;
    transition: background-color var(--transition-fast) var(--transition-ease),
                box-shadow var(--transition-fast) var(--transition-ease);
}

.btn-action:hover[b-xq7cc43cc4] {
    background-color: var(--color-action-hover);
    border-color: var(--color-action-hover);
    color: var(--text-on-action);
    text-decoration: none;
    box-shadow: var(--shadow-sm);
}

.btn-action:active[b-xq7cc43cc4] {
    background-color: var(--color-action-active);
}

/* Alert Bars */
.alert-bar[b-xq7cc43cc4] {
    display: flex;
    align-items: center;
    gap: var(--space-2);
    padding: var(--space-3) var(--space-4);
    margin-bottom: var(--space-4);
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-medium);
    border-left: var(--border-width-thick) solid;
}

.alert-bar-success[b-xq7cc43cc4] {
    background-color: #edf7ed;
    border-left-color: var(--color-success);
    color: #1e4620;
}

.alert-bar-danger[b-xq7cc43cc4] {
    background-color: #fdeded;
    border-left-color: var(--color-danger);
    color: #5f2120;
}

.alert-bar-close[b-xq7cc43cc4] {
    margin-left: auto;
    background: none;
    border: none;
    font-size: var(--font-size-lg);
    cursor: pointer;
    color: inherit;
    opacity: 0.6;
    line-height: 1;
}

.alert-bar-close:hover[b-xq7cc43cc4] {
    opacity: 1;
}

/* Search Bar */
.search-bar[b-xq7cc43cc4] {
    display: flex;
    align-items: center;
    gap: var(--space-4);
    margin-bottom: var(--space-4);
    padding: var(--space-3) var(--space-4);
    background-color: var(--bg-secondary);
    border: var(--border-width-thin) solid var(--border-color-light);
}

.search-input-wrapper[b-xq7cc43cc4] {
    display: flex;
    align-items: center;
    flex: 1;
    position: relative;
}

.search-icon[b-xq7cc43cc4] {
    color: var(--text-muted);
    flex-shrink: 0;
    margin-right: var(--space-2);
}

.search-input[b-xq7cc43cc4] {
    flex: 1;
    border: none;
    background: transparent;
    font-size: var(--font-size-sm);
    color: var(--color-gray-700);
    outline: none;
    padding: var(--space-1) 0;
}

.search-input[b-xq7cc43cc4]::placeholder {
    color: var(--text-muted);
}

.search-clear[b-xq7cc43cc4] {
    background: none;
    border: none;
    cursor: pointer;
    color: var(--text-muted);
    padding: var(--space-1);
    display: flex;
    align-items: center;
}

.search-clear:hover[b-xq7cc43cc4] {
    color: var(--color-primary);
}

.search-count[b-xq7cc43cc4] {
    flex-shrink: 0;
    font-size: var(--font-size-xs);
    color: var(--text-muted);
    font-weight: var(--font-weight-medium);
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

/* Loading / Empty States */
.loading-state[b-xq7cc43cc4] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: var(--space-16) 0;
    color: var(--text-muted);
    gap: var(--space-4);
}

.empty-state[b-xq7cc43cc4] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: var(--space-16) 0;
    color: var(--text-muted);
    gap: var(--space-3);
}

.empty-state svg[b-xq7cc43cc4] {
    opacity: 0.4;
}

.empty-state-text[b-xq7cc43cc4] {
    font-size: var(--font-size-base);
    margin: 0;
}

/* Item List */
.item-list[b-xq7cc43cc4] {
    display: flex;
    flex-direction: column;
    border: var(--border-width-thin) solid var(--border-color-light);
}

/* Item Row */
.item-row[b-xq7cc43cc4] {
    display: flex;
    align-items: center;
    gap: var(--space-4);
    padding: var(--space-4);
    border-bottom: var(--border-width-thin) solid var(--border-color-light);
    transition: background-color var(--transition-fast) var(--transition-ease);
}

.item-row:last-child[b-xq7cc43cc4] {
    border-bottom: none;
}

.item-row:hover[b-xq7cc43cc4] {
    background-color: rgba(11, 36, 62, 0.03);
}

/* Avatar */
.item-avatar[b-xq7cc43cc4] {
    flex-shrink: 0;
    width: 40px;
    height: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: var(--color-gray-100);
    color: var(--color-primary);
}

/* Item Info */
.item-info[b-xq7cc43cc4] {
    flex: 1;
    min-width: 0;
}

.item-name[b-xq7cc43cc4] {
    font-size: var(--font-size-base);
    font-weight: var(--font-weight-semibold);
    color: var(--color-primary);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.item-meta[b-xq7cc43cc4] {
    display: flex;
    align-items: center;
    gap: var(--space-1);
    flex-wrap: wrap;
    font-size: var(--font-size-xs);
    color: var(--text-secondary);
    margin-top: 2px;
}

.item-code[b-xq7cc43cc4] {
    font-family: var(--font-mono);
    font-weight: var(--font-weight-medium);
    color: var(--color-primary);
    opacity: 0.7;
}

.meta-separator[b-xq7cc43cc4] {
    color: var(--color-gray-300);
}

/* Action Buttons */
.item-actions[b-xq7cc43cc4] {
    flex-shrink: 0;
    display: flex;
    align-items: center;
    gap: var(--space-1);
}

.btn-icon[b-xq7cc43cc4] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 36px;
    background: none;
    border: var(--border-width-thin) solid transparent;
    cursor: pointer;
    color: var(--text-muted);
    text-decoration: none;
    transition: all var(--transition-fast) var(--transition-ease);
}

.btn-icon:hover[b-xq7cc43cc4] {
    color: var(--color-primary);
    background-color: var(--color-gray-100);
    border-color: var(--border-color-light);
    text-decoration: none;
}

.btn-icon-danger:hover[b-xq7cc43cc4] {
    color: var(--color-action);
    background-color: rgba(178, 34, 34, 0.06);
    border-color: rgba(178, 34, 34, 0.2);
}

/* Overlay & Dialog */
.overlay[b-xq7cc43cc4] {
    position: fixed;
    inset: 0;
    background-color: rgba(0, 0, 0, 0.4);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: var(--z-modal-backdrop);
}

.confirm-dialog[b-xq7cc43cc4] {
    background-color: var(--color-white);
    padding: var(--space-8);
    max-width: 420px;
    width: 90%;
    box-shadow: var(--shadow-xl);
    text-align: center;
    z-index: var(--z-modal);
}

.confirm-icon[b-xq7cc43cc4] {
    color: var(--color-action);
    margin-bottom: var(--space-4);
}

.confirm-dialog h3[b-xq7cc43cc4] {
    font-size: var(--font-size-lg);
    font-weight: var(--font-weight-semibold);
    color: var(--color-primary);
    margin: 0 0 var(--space-2) 0;
}

.confirm-dialog p[b-xq7cc43cc4] {
    font-size: var(--font-size-sm);
    color: var(--text-secondary);
    margin: 0 0 var(--space-2) 0;
}

.confirm-warning[b-xq7cc43cc4] {
    font-size: var(--font-size-xs) !important;
    color: var(--color-action) !important;
    font-weight: var(--font-weight-medium);
}

.confirm-actions[b-xq7cc43cc4] {
    display: flex;
    gap: var(--space-3);
    justify-content: center;
    margin-top: var(--space-6);
}

.confirm-actions .btn[b-xq7cc43cc4] {
    min-width: 100px;
    padding: var(--space-2) var(--space-4);
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-medium);
    cursor: pointer;
}

/* Outline Primary Button */
.btn-outline-primary[b-xq7cc43cc4] {
    background: transparent;
    color: var(--color-primary);
    border: var(--border-width-thin) solid var(--color-primary);
}

.btn-outline-primary:hover[b-xq7cc43cc4] {
    background-color: var(--color-primary);
    color: var(--text-on-primary);
}

/* Responsive */
@media (max-width: 768px) {
    .page-header[b-xq7cc43cc4] {
        flex-direction: column;
        gap: var(--space-3);
    }

    .item-row[b-xq7cc43cc4] {
        flex-wrap: wrap;
    }

    .item-actions[b-xq7cc43cc4] {
        order: 6;
        margin-left: auto;
    }
}
/* /Components/Pages/Warehouse/DocumentTypeCreate.razor.rz.scp.css */
/* ===========================
   DocumentTypeCreate - Scoped Styles
   Flat Industrial Minimal
   =========================== */

/* Page Container */
.page-container[b-dsggpuevj7] {
    max-width: 900px;
    margin: 0 auto;
    padding: var(--space-6) var(--space-4);
}

/* Header */
.page-header[b-dsggpuevj7] {
    display: flex;
    align-items: center;
    gap: var(--space-4);
    margin-bottom: var(--space-6);
}

.btn-back[b-dsggpuevj7] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    color: var(--text-muted);
    border: var(--border-width-thin) solid var(--border-color-light);
    text-decoration: none;
    transition: all var(--transition-fast) var(--transition-ease);
    flex-shrink: 0;
}

.btn-back:hover[b-dsggpuevj7] {
    color: var(--color-primary);
    border-color: var(--color-primary);
    background-color: var(--color-gray-50);
    text-decoration: none;
}

.page-header-text[b-dsggpuevj7] {
    flex: 1;
}

.page-title[b-dsggpuevj7] {
    font-size: var(--font-size-xl);
    font-weight: var(--font-weight-bold);
    color: var(--color-primary);
    display: flex;
    align-items: center;
    gap: var(--space-2);
    margin: 0;
}

.page-title svg[b-dsggpuevj7] {
    color: var(--color-primary);
    flex-shrink: 0;
}

.page-subtitle[b-dsggpuevj7] {
    color: var(--text-muted);
    font-size: var(--font-size-sm);
    margin: 2px 0 0 0;
}

/* Alert Bar */
.alert-bar[b-dsggpuevj7] {
    display: flex;
    align-items: center;
    gap: var(--space-2);
    padding: var(--space-3) var(--space-4);
    margin-bottom: var(--space-4);
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-medium);
    border-left: var(--border-width-thick) solid;
}

.alert-bar-danger[b-dsggpuevj7] {
    background-color: #fdeded;
    border-left-color: var(--color-danger);
    color: #5f2120;
}

.alert-bar-close[b-dsggpuevj7] {
    margin-left: auto;
    background: none;
    border: none;
    font-size: var(--font-size-lg);
    cursor: pointer;
    color: inherit;
    opacity: 0.6;
    line-height: 1;
}

.alert-bar-close:hover[b-dsggpuevj7] {
    opacity: 1;
}

/* Form Sections */
.form-section[b-dsggpuevj7] {
    margin-bottom: var(--space-6);
    padding: var(--space-5);
    background-color: var(--color-white);
    border: var(--border-width-thin) solid var(--border-color-light);
}

.section-title[b-dsggpuevj7] {
    display: flex;
    align-items: center;
    gap: var(--space-2);
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-semibold);
    color: var(--color-primary);
    text-transform: uppercase;
    letter-spacing: 0.5px;
    margin: 0 0 var(--space-4) 0;
    padding-bottom: var(--space-3);
    border-bottom: var(--border-width-thin) solid var(--border-color-light);
}

.section-title svg[b-dsggpuevj7] {
    color: var(--color-primary);
    opacity: 0.6;
    flex-shrink: 0;
}

/* Form Grid */
.form-grid[b-dsggpuevj7] {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: var(--space-4);
}

.form-group[b-dsggpuevj7] {
    display: flex;
    flex-direction: column;
}

.form-group-wide[b-dsggpuevj7] {
    grid-column: span 2;
}

/* Form Controls */
.form-label[b-dsggpuevj7] {
    font-size: var(--font-size-xs);
    font-weight: var(--font-weight-medium);
    color: var(--text-secondary);
    text-transform: uppercase;
    letter-spacing: 0.3px;
    margin-bottom: var(--space-1);
}

.form-control[b-dsggpuevj7] {
    padding: var(--space-2) var(--space-3);
    font-size: var(--font-size-sm);
    color: var(--color-gray-700);
    border: var(--border-width-thin) solid var(--border-color-light);
    background-color: var(--color-white);
    transition: border-color var(--transition-fast) var(--transition-ease);
}

.form-control:focus[b-dsggpuevj7] {
    border-color: var(--color-primary);
    outline: none;
    box-shadow: none;
}

.form-control[b-dsggpuevj7]::placeholder {
    color: var(--color-gray-400);
}

/* Checkbox */
.form-check-label[b-dsggpuevj7] {
    display: flex;
    align-items: center;
    gap: var(--space-2);
    font-size: var(--font-size-sm);
    color: var(--color-gray-700);
    cursor: pointer;
    padding: var(--space-2) 0;
}

.form-check-input[b-dsggpuevj7] {
    width: 16px;
    height: 16px;
    flex-shrink: 0;
}

/* Form Actions */
.form-actions[b-dsggpuevj7] {
    display: flex;
    justify-content: flex-end;
    gap: var(--space-3);
    padding-top: var(--space-4);
    border-top: var(--border-width-thin) solid var(--border-color-light);
}

.form-actions .btn[b-dsggpuevj7] {
    display: inline-flex;
    align-items: center;
    gap: var(--space-2);
    padding: var(--space-2) var(--space-5);
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-medium);
    cursor: pointer;
    text-decoration: none;
}

.btn-action[b-dsggpuevj7] {
    background-color: var(--color-action);
    color: var(--text-on-action);
    border: var(--border-width-thin) solid var(--color-action);
    transition: background-color var(--transition-fast) var(--transition-ease);
}

.btn-action:hover[b-dsggpuevj7] {
    background-color: var(--color-action-hover);
    border-color: var(--color-action-hover);
    color: var(--text-on-action);
}

.btn-action:disabled[b-dsggpuevj7] {
    opacity: 0.65;
    cursor: not-allowed;
}

.btn-outline-primary[b-dsggpuevj7] {
    background: transparent;
    color: var(--color-primary);
    border: var(--border-width-thin) solid var(--color-primary);
}

.btn-outline-primary:hover[b-dsggpuevj7] {
    background-color: var(--color-primary);
    color: var(--text-on-primary);
    text-decoration: none;
}

/* Validation */
[b-dsggpuevj7] .validation-message {
    color: var(--color-danger);
    font-size: var(--font-size-xs);
    margin-top: 2px;
}

/* Responsive */
@media (max-width: 768px) {
    .form-grid[b-dsggpuevj7] {
        grid-template-columns: 1fr;
    }

    .form-group-wide[b-dsggpuevj7] {
        grid-column: span 1;
    }

    .form-actions[b-dsggpuevj7] {
        flex-direction: column-reverse;
    }

    .form-actions .btn[b-dsggpuevj7] {
        justify-content: center;
    }
}
/* /Components/Pages/Warehouse/DocumentTypeEdit.razor.rz.scp.css */
/* ===========================
   DocumentTypeEdit - Scoped Styles
   Flat Industrial Minimal
   =========================== */

/* Page Container */
.page-container[b-u3s3ayb02q] {
    max-width: 900px;
    margin: 0 auto;
    padding: var(--space-6) var(--space-4);
}

/* Header */
.page-header[b-u3s3ayb02q] {
    display: flex;
    align-items: center;
    gap: var(--space-4);
    margin-bottom: var(--space-6);
}

.btn-back[b-u3s3ayb02q] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    color: var(--text-muted);
    border: var(--border-width-thin) solid var(--border-color-light);
    text-decoration: none;
    transition: all var(--transition-fast) var(--transition-ease);
    flex-shrink: 0;
}

.btn-back:hover[b-u3s3ayb02q] {
    color: var(--color-primary);
    border-color: var(--color-primary);
    background-color: var(--color-gray-50);
    text-decoration: none;
}

.page-header-text[b-u3s3ayb02q] {
    flex: 1;
}

.page-title[b-u3s3ayb02q] {
    font-size: var(--font-size-xl);
    font-weight: var(--font-weight-bold);
    color: var(--color-primary);
    display: flex;
    align-items: center;
    gap: var(--space-2);
    margin: 0;
}

.page-title svg[b-u3s3ayb02q] {
    color: var(--color-primary);
    flex-shrink: 0;
}

.page-subtitle[b-u3s3ayb02q] {
    color: var(--text-muted);
    font-size: var(--font-size-sm);
    margin: 2px 0 0 0;
    display: flex;
    align-items: center;
    gap: var(--space-2);
}

.subtitle-code[b-u3s3ayb02q] {
    font-family: var(--font-mono);
    font-size: var(--font-size-xs);
    color: var(--color-primary);
    opacity: 0.6;
    padding: 1px var(--space-2);
    background-color: var(--color-gray-100);
}

/* Alert Bar */
.alert-bar[b-u3s3ayb02q] {
    display: flex;
    align-items: center;
    gap: var(--space-2);
    padding: var(--space-3) var(--space-4);
    margin-bottom: var(--space-4);
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-medium);
    border-left: var(--border-width-thick) solid;
}

.alert-bar-danger[b-u3s3ayb02q] {
    background-color: #fdeded;
    border-left-color: var(--color-danger);
    color: #5f2120;
}

.alert-bar-close[b-u3s3ayb02q] {
    margin-left: auto;
    background: none;
    border: none;
    font-size: var(--font-size-lg);
    cursor: pointer;
    color: inherit;
    opacity: 0.6;
    line-height: 1;
}

.alert-bar-close:hover[b-u3s3ayb02q] {
    opacity: 1;
}

/* Loading / Empty States */
.loading-state[b-u3s3ayb02q] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: var(--space-16) 0;
    color: var(--text-muted);
    gap: var(--space-4);
}

.empty-state[b-u3s3ayb02q] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: var(--space-16) 0;
    color: var(--text-muted);
    gap: var(--space-3);
}

.empty-state svg[b-u3s3ayb02q] {
    opacity: 0.4;
}

.empty-state-text[b-u3s3ayb02q] {
    font-size: var(--font-size-base);
    margin: 0;
}

/* Form Sections */
.form-section[b-u3s3ayb02q] {
    margin-bottom: var(--space-6);
    padding: var(--space-5);
    background-color: var(--color-white);
    border: var(--border-width-thin) solid var(--border-color-light);
}

.section-title[b-u3s3ayb02q] {
    display: flex;
    align-items: center;
    gap: var(--space-2);
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-semibold);
    color: var(--color-primary);
    text-transform: uppercase;
    letter-spacing: 0.5px;
    margin: 0 0 var(--space-4) 0;
    padding-bottom: var(--space-3);
    border-bottom: var(--border-width-thin) solid var(--border-color-light);
}

.section-title svg[b-u3s3ayb02q] {
    color: var(--color-primary);
    opacity: 0.6;
    flex-shrink: 0;
}

/* Form Grid */
.form-grid[b-u3s3ayb02q] {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: var(--space-4);
}

.form-group[b-u3s3ayb02q] {
    display: flex;
    flex-direction: column;
}

.form-group-wide[b-u3s3ayb02q] {
    grid-column: span 2;
}

/* Form Controls */
.form-label[b-u3s3ayb02q] {
    font-size: var(--font-size-xs);
    font-weight: var(--font-weight-medium);
    color: var(--text-secondary);
    text-transform: uppercase;
    letter-spacing: 0.3px;
    margin-bottom: var(--space-1);
}

.form-control[b-u3s3ayb02q] {
    padding: var(--space-2) var(--space-3);
    font-size: var(--font-size-sm);
    color: var(--color-gray-700);
    border: var(--border-width-thin) solid var(--border-color-light);
    background-color: var(--color-white);
    transition: border-color var(--transition-fast) var(--transition-ease);
}

.form-control:focus[b-u3s3ayb02q] {
    border-color: var(--color-primary);
    outline: none;
    box-shadow: none;
}

.form-control[b-u3s3ayb02q]::placeholder {
    color: var(--color-gray-400);
}

.form-control-static[b-u3s3ayb02q] {
    padding: var(--space-2) var(--space-3);
    font-size: var(--font-size-sm);
    color: var(--text-muted);
    background-color: var(--color-gray-50);
    border: var(--border-width-thin) solid var(--border-color-light);
    font-family: var(--font-mono);
}

/* Checkbox */
.form-check-label[b-u3s3ayb02q] {
    display: flex;
    align-items: center;
    gap: var(--space-2);
    font-size: var(--font-size-sm);
    color: var(--color-gray-700);
    cursor: pointer;
    padding: var(--space-2) 0;
}

.form-check-input[b-u3s3ayb02q] {
    width: 16px;
    height: 16px;
    flex-shrink: 0;
}

/* Form Actions */
.form-actions[b-u3s3ayb02q] {
    display: flex;
    justify-content: flex-end;
    gap: var(--space-3);
    padding-top: var(--space-4);
    border-top: var(--border-width-thin) solid var(--border-color-light);
}

.form-actions .btn[b-u3s3ayb02q] {
    display: inline-flex;
    align-items: center;
    gap: var(--space-2);
    padding: var(--space-2) var(--space-5);
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-medium);
    cursor: pointer;
    text-decoration: none;
}

.btn-action[b-u3s3ayb02q] {
    background-color: var(--color-action);
    color: var(--text-on-action);
    border: var(--border-width-thin) solid var(--color-action);
    transition: background-color var(--transition-fast) var(--transition-ease);
}

.btn-action:hover[b-u3s3ayb02q] {
    background-color: var(--color-action-hover);
    border-color: var(--color-action-hover);
    color: var(--text-on-action);
}

.btn-action:disabled[b-u3s3ayb02q] {
    opacity: 0.65;
    cursor: not-allowed;
}

.btn-outline-primary[b-u3s3ayb02q] {
    background: transparent;
    color: var(--color-primary);
    border: var(--border-width-thin) solid var(--color-primary);
}

.btn-outline-primary:hover[b-u3s3ayb02q] {
    background-color: var(--color-primary);
    color: var(--text-on-primary);
    text-decoration: none;
}

/* Validation */
[b-u3s3ayb02q] .validation-message {
    color: var(--color-danger);
    font-size: var(--font-size-xs);
    margin-top: 2px;
}

/* Responsive */
@media (max-width: 768px) {
    .form-grid[b-u3s3ayb02q] {
        grid-template-columns: 1fr;
    }

    .form-group-wide[b-u3s3ayb02q] {
        grid-column: span 1;
    }

    .form-actions[b-u3s3ayb02q] {
        flex-direction: column-reverse;
    }

    .form-actions .btn[b-u3s3ayb02q] {
        justify-content: center;
    }
}
/* /Components/Pages/Warehouse/DocumentTypeFishTraceabilityEdit.razor.rz.scp.css */
/* ===========================
   DocumentTypeFishTraceabilityEdit - Scoped Styles
   Flat Industrial Minimal
   =========================== */

/* Page Container */
.page-container[b-ja55nddz4q] {
    max-width: 900px;
    margin: 0 auto;
    padding: var(--space-6) var(--space-4);
}

/* Header */
.page-header[b-ja55nddz4q] {
    display: flex;
    align-items: center;
    gap: var(--space-4);
    margin-bottom: var(--space-6);
}

.btn-back[b-ja55nddz4q] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    color: var(--text-muted);
    border: var(--border-width-thin) solid var(--border-color-light);
    text-decoration: none;
    transition: all var(--transition-fast) var(--transition-ease);
    flex-shrink: 0;
}

.btn-back:hover[b-ja55nddz4q] {
    color: var(--color-primary);
    border-color: var(--color-primary);
    background-color: var(--color-gray-50);
    text-decoration: none;
}

.page-header-text[b-ja55nddz4q] {
    flex: 1;
}

.page-title[b-ja55nddz4q] {
    font-size: var(--font-size-xl);
    font-weight: var(--font-weight-bold);
    color: var(--color-primary);
    display: flex;
    align-items: center;
    gap: var(--space-2);
    margin: 0;
}

.page-title svg[b-ja55nddz4q] {
    color: var(--color-primary);
    flex-shrink: 0;
}

.page-subtitle[b-ja55nddz4q] {
    color: var(--text-muted);
    font-size: var(--font-size-sm);
    margin: 2px 0 0 0;
    display: flex;
    align-items: center;
    gap: var(--space-2);
}

.subtitle-code[b-ja55nddz4q] {
    font-family: var(--font-mono);
    font-size: var(--font-size-xs);
    color: var(--color-primary);
    opacity: 0.6;
    padding: 1px var(--space-2);
    background-color: var(--color-gray-100);
}

/* Alert Bar */
.alert-bar[b-ja55nddz4q] {
    display: flex;
    align-items: center;
    gap: var(--space-2);
    padding: var(--space-3) var(--space-4);
    margin-bottom: var(--space-4);
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-medium);
    border-left: var(--border-width-thick) solid;
}

.alert-bar-danger[b-ja55nddz4q] {
    background-color: #fdeded;
    border-left-color: var(--color-danger);
    color: #5f2120;
}

.alert-bar-success[b-ja55nddz4q] {
    background-color: #edf7ed;
    border-left-color: var(--color-success);
    color: #1e4620;
}

.alert-bar-close[b-ja55nddz4q] {
    margin-left: auto;
    background: none;
    border: none;
    font-size: var(--font-size-lg);
    cursor: pointer;
    color: inherit;
    opacity: 0.6;
    line-height: 1;
}

.alert-bar-close:hover[b-ja55nddz4q] {
    opacity: 1;
}

/* Loading / Empty States */
.loading-state[b-ja55nddz4q] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: var(--space-16) 0;
    color: var(--text-muted);
    gap: var(--space-4);
}

.empty-state[b-ja55nddz4q] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: var(--space-16) 0;
    color: var(--text-muted);
    gap: var(--space-3);
}

.empty-state svg[b-ja55nddz4q] {
    opacity: 0.4;
}

.empty-state-text[b-ja55nddz4q] {
    font-size: var(--font-size-base);
    margin: 0;
}

/* Form Sections */
.form-section[b-ja55nddz4q] {
    margin-bottom: var(--space-6);
    padding: var(--space-5);
    background-color: var(--color-white);
    border: var(--border-width-thin) solid var(--border-color-light);
}

.section-title[b-ja55nddz4q] {
    display: flex;
    align-items: center;
    gap: var(--space-2);
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-semibold);
    color: var(--color-primary);
    text-transform: uppercase;
    letter-spacing: 0.5px;
    margin: 0 0 var(--space-4) 0;
    padding-bottom: var(--space-3);
    border-bottom: var(--border-width-thin) solid var(--border-color-light);
}

.section-title svg[b-ja55nddz4q] {
    color: var(--color-primary);
    opacity: 0.6;
    flex-shrink: 0;
}

/* Form Grid */
.form-grid[b-ja55nddz4q] {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: var(--space-4);
}

.form-group[b-ja55nddz4q] {
    display: flex;
    flex-direction: column;
}

/* Form Actions */
.form-actions[b-ja55nddz4q] {
    display: flex;
    justify-content: flex-end;
    gap: var(--space-3);
    padding-top: var(--space-4);
    border-top: var(--border-width-thin) solid var(--border-color-light);
}

.form-actions .btn[b-ja55nddz4q] {
    display: inline-flex;
    align-items: center;
    gap: var(--space-2);
    padding: var(--space-2) var(--space-5);
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-medium);
    cursor: pointer;
    text-decoration: none;
}

.btn-action[b-ja55nddz4q] {
    background-color: var(--color-action);
    color: var(--text-on-action);
    border: var(--border-width-thin) solid var(--color-action);
    transition: background-color var(--transition-fast) var(--transition-ease);
}

.btn-action:hover[b-ja55nddz4q] {
    background-color: var(--color-action-hover);
    border-color: var(--color-action-hover);
    color: var(--text-on-action);
}

.btn-action:disabled[b-ja55nddz4q] {
    opacity: 0.65;
    cursor: not-allowed;
}

.btn-outline-primary[b-ja55nddz4q] {
    background: transparent;
    color: var(--color-primary);
    border: var(--border-width-thin) solid var(--color-primary);
}

.btn-outline-primary:hover[b-ja55nddz4q] {
    background-color: var(--color-primary);
    color: var(--text-on-primary);
    text-decoration: none;
}

/* Responsive */
@media (max-width: 768px) {
    .form-grid[b-ja55nddz4q] {
        grid-template-columns: 1fr;
    }

    .form-actions[b-ja55nddz4q] {
        flex-direction: column-reverse;
    }

    .form-actions .btn[b-ja55nddz4q] {
        justify-content: center;
    }
}
/* /Components/Pages/Warehouse/DocumentTypeFruitTraceabilityEdit.razor.rz.scp.css */
/* ===========================
   DocumentTypeFruitTraceabilityEdit - Scoped Styles
   Flat Industrial Minimal
   =========================== */

/* Page Container */
.page-container[b-czc3fyl3v9] {
    max-width: 900px;
    margin: 0 auto;
    padding: var(--space-6) var(--space-4);
}

/* Header */
.page-header[b-czc3fyl3v9] {
    display: flex;
    align-items: center;
    gap: var(--space-4);
    margin-bottom: var(--space-6);
}

.btn-back[b-czc3fyl3v9] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    color: var(--text-muted);
    border: var(--border-width-thin) solid var(--border-color-light);
    text-decoration: none;
    transition: all var(--transition-fast) var(--transition-ease);
    flex-shrink: 0;
}

.btn-back:hover[b-czc3fyl3v9] {
    color: var(--color-primary);
    border-color: var(--color-primary);
    background-color: var(--color-gray-50);
    text-decoration: none;
}

.page-header-text[b-czc3fyl3v9] {
    flex: 1;
}

.page-title[b-czc3fyl3v9] {
    font-size: var(--font-size-xl);
    font-weight: var(--font-weight-bold);
    color: var(--color-primary);
    display: flex;
    align-items: center;
    gap: var(--space-2);
    margin: 0;
}

.page-title svg[b-czc3fyl3v9] {
    color: var(--color-primary);
    flex-shrink: 0;
}

.page-subtitle[b-czc3fyl3v9] {
    color: var(--text-muted);
    font-size: var(--font-size-sm);
    margin: 2px 0 0 0;
    display: flex;
    align-items: center;
    gap: var(--space-2);
}

.subtitle-code[b-czc3fyl3v9] {
    font-family: var(--font-mono);
    font-size: var(--font-size-xs);
    color: var(--color-primary);
    opacity: 0.6;
    padding: 1px var(--space-2);
    background-color: var(--color-gray-100);
}

/* Alert Bar */
.alert-bar[b-czc3fyl3v9] {
    display: flex;
    align-items: center;
    gap: var(--space-2);
    padding: var(--space-3) var(--space-4);
    margin-bottom: var(--space-4);
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-medium);
    border-left: var(--border-width-thick) solid;
}

.alert-bar-danger[b-czc3fyl3v9] {
    background-color: #fdeded;
    border-left-color: var(--color-danger);
    color: #5f2120;
}

.alert-bar-success[b-czc3fyl3v9] {
    background-color: #edf7ed;
    border-left-color: var(--color-success);
    color: #1e4620;
}

.alert-bar-close[b-czc3fyl3v9] {
    margin-left: auto;
    background: none;
    border: none;
    font-size: var(--font-size-lg);
    cursor: pointer;
    color: inherit;
    opacity: 0.6;
    line-height: 1;
}

.alert-bar-close:hover[b-czc3fyl3v9] {
    opacity: 1;
}

/* Loading / Empty States */
.loading-state[b-czc3fyl3v9] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: var(--space-16) 0;
    color: var(--text-muted);
    gap: var(--space-4);
}

.empty-state[b-czc3fyl3v9] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: var(--space-16) 0;
    color: var(--text-muted);
    gap: var(--space-3);
}

.empty-state svg[b-czc3fyl3v9] {
    opacity: 0.4;
}

.empty-state-text[b-czc3fyl3v9] {
    font-size: var(--font-size-base);
    margin: 0;
}

/* Form Sections */
.form-section[b-czc3fyl3v9] {
    margin-bottom: var(--space-6);
    padding: var(--space-5);
    background-color: var(--color-white);
    border: var(--border-width-thin) solid var(--border-color-light);
}

.section-title[b-czc3fyl3v9] {
    display: flex;
    align-items: center;
    gap: var(--space-2);
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-semibold);
    color: var(--color-primary);
    text-transform: uppercase;
    letter-spacing: 0.5px;
    margin: 0 0 var(--space-4) 0;
    padding-bottom: var(--space-3);
    border-bottom: var(--border-width-thin) solid var(--border-color-light);
}

.section-title svg[b-czc3fyl3v9] {
    color: var(--color-primary);
    opacity: 0.6;
    flex-shrink: 0;
}

/* Form Grid */
.form-grid[b-czc3fyl3v9] {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: var(--space-4);
}

.form-group[b-czc3fyl3v9] {
    display: flex;
    flex-direction: column;
}

/* Form Actions */
.form-actions[b-czc3fyl3v9] {
    display: flex;
    justify-content: flex-end;
    gap: var(--space-3);
    padding-top: var(--space-4);
    border-top: var(--border-width-thin) solid var(--border-color-light);
}

.form-actions .btn[b-czc3fyl3v9] {
    display: inline-flex;
    align-items: center;
    gap: var(--space-2);
    padding: var(--space-2) var(--space-5);
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-medium);
    cursor: pointer;
    text-decoration: none;
}

.btn-action[b-czc3fyl3v9] {
    background-color: var(--color-action);
    color: var(--text-on-action);
    border: var(--border-width-thin) solid var(--color-action);
    transition: background-color var(--transition-fast) var(--transition-ease);
}

.btn-action:hover[b-czc3fyl3v9] {
    background-color: var(--color-action-hover);
    border-color: var(--color-action-hover);
    color: var(--text-on-action);
}

.btn-action:disabled[b-czc3fyl3v9] {
    opacity: 0.65;
    cursor: not-allowed;
}

.btn-outline-primary[b-czc3fyl3v9] {
    background: transparent;
    color: var(--color-primary);
    border: var(--border-width-thin) solid var(--color-primary);
}

.btn-outline-primary:hover[b-czc3fyl3v9] {
    background-color: var(--color-primary);
    color: var(--text-on-primary);
    text-decoration: none;
}

/* Responsive */
@media (max-width: 768px) {
    .form-grid[b-czc3fyl3v9] {
        grid-template-columns: 1fr;
    }

    .form-actions[b-czc3fyl3v9] {
        flex-direction: column-reverse;
    }

    .form-actions .btn[b-czc3fyl3v9] {
        justify-content: center;
    }
}
/* /Components/Pages/Warehouse/DocumentTypeGroceryTraceabilityEdit.razor.rz.scp.css */
/* ===========================
   DocumentTypeGroceryTraceabilityEdit - Scoped Styles
   Flat Industrial Minimal
   =========================== */

/* Page Container */
.page-container[b-0x52462u22] {
    max-width: 900px;
    margin: 0 auto;
    padding: var(--space-6) var(--space-4);
}

/* Header */
.page-header[b-0x52462u22] {
    display: flex;
    align-items: center;
    gap: var(--space-4);
    margin-bottom: var(--space-6);
}

.btn-back[b-0x52462u22] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    color: var(--text-muted);
    border: var(--border-width-thin) solid var(--border-color-light);
    text-decoration: none;
    transition: all var(--transition-fast) var(--transition-ease);
    flex-shrink: 0;
}

.btn-back:hover[b-0x52462u22] {
    color: var(--color-primary);
    border-color: var(--color-primary);
    background-color: var(--color-gray-50);
    text-decoration: none;
}

.page-header-text[b-0x52462u22] {
    flex: 1;
}

.page-title[b-0x52462u22] {
    font-size: var(--font-size-xl);
    font-weight: var(--font-weight-bold);
    color: var(--color-primary);
    display: flex;
    align-items: center;
    gap: var(--space-2);
    margin: 0;
}

.page-title svg[b-0x52462u22] {
    color: var(--color-primary);
    flex-shrink: 0;
}

.page-subtitle[b-0x52462u22] {
    color: var(--text-muted);
    font-size: var(--font-size-sm);
    margin: 2px 0 0 0;
    display: flex;
    align-items: center;
    gap: var(--space-2);
}

.subtitle-code[b-0x52462u22] {
    font-family: var(--font-mono);
    font-size: var(--font-size-xs);
    color: var(--color-primary);
    opacity: 0.6;
    padding: 1px var(--space-2);
    background-color: var(--color-gray-100);
}

/* Alert Bar */
.alert-bar[b-0x52462u22] {
    display: flex;
    align-items: center;
    gap: var(--space-2);
    padding: var(--space-3) var(--space-4);
    margin-bottom: var(--space-4);
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-medium);
    border-left: var(--border-width-thick) solid;
}

.alert-bar-danger[b-0x52462u22] {
    background-color: #fdeded;
    border-left-color: var(--color-danger);
    color: #5f2120;
}

.alert-bar-success[b-0x52462u22] {
    background-color: #edf7ed;
    border-left-color: var(--color-success);
    color: #1e4620;
}

.alert-bar-close[b-0x52462u22] {
    margin-left: auto;
    background: none;
    border: none;
    font-size: var(--font-size-lg);
    cursor: pointer;
    color: inherit;
    opacity: 0.6;
    line-height: 1;
}

.alert-bar-close:hover[b-0x52462u22] {
    opacity: 1;
}

/* Loading / Empty States */
.loading-state[b-0x52462u22] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: var(--space-16) 0;
    color: var(--text-muted);
    gap: var(--space-4);
}

.empty-state[b-0x52462u22] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: var(--space-16) 0;
    color: var(--text-muted);
    gap: var(--space-3);
}

.empty-state svg[b-0x52462u22] {
    opacity: 0.4;
}

.empty-state-text[b-0x52462u22] {
    font-size: var(--font-size-base);
    margin: 0;
}

/* Form Sections */
.form-section[b-0x52462u22] {
    margin-bottom: var(--space-6);
    padding: var(--space-5);
    background-color: var(--color-white);
    border: var(--border-width-thin) solid var(--border-color-light);
}

.section-title[b-0x52462u22] {
    display: flex;
    align-items: center;
    gap: var(--space-2);
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-semibold);
    color: var(--color-primary);
    text-transform: uppercase;
    letter-spacing: 0.5px;
    margin: 0 0 var(--space-4) 0;
    padding-bottom: var(--space-3);
    border-bottom: var(--border-width-thin) solid var(--border-color-light);
}

.section-title svg[b-0x52462u22] {
    color: var(--color-primary);
    opacity: 0.6;
    flex-shrink: 0;
}

/* Form Grid */
.form-grid[b-0x52462u22] {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: var(--space-4);
}

.form-group[b-0x52462u22] {
    display: flex;
    flex-direction: column;
}

/* Form Actions */
.form-actions[b-0x52462u22] {
    display: flex;
    justify-content: flex-end;
    gap: var(--space-3);
    padding-top: var(--space-4);
    border-top: var(--border-width-thin) solid var(--border-color-light);
}

.form-actions .btn[b-0x52462u22] {
    display: inline-flex;
    align-items: center;
    gap: var(--space-2);
    padding: var(--space-2) var(--space-5);
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-medium);
    cursor: pointer;
    text-decoration: none;
}

.btn-action[b-0x52462u22] {
    background-color: var(--color-action);
    color: var(--text-on-action);
    border: var(--border-width-thin) solid var(--color-action);
    transition: background-color var(--transition-fast) var(--transition-ease);
}

.btn-action:hover[b-0x52462u22] {
    background-color: var(--color-action-hover);
    border-color: var(--color-action-hover);
    color: var(--text-on-action);
}

.btn-action:disabled[b-0x52462u22] {
    opacity: 0.65;
    cursor: not-allowed;
}

.btn-outline-primary[b-0x52462u22] {
    background: transparent;
    color: var(--color-primary);
    border: var(--border-width-thin) solid var(--color-primary);
}

.btn-outline-primary:hover[b-0x52462u22] {
    background-color: var(--color-primary);
    color: var(--text-on-primary);
    text-decoration: none;
}

/* Responsive */
@media (max-width: 768px) {
    .form-grid[b-0x52462u22] {
        grid-template-columns: 1fr;
    }

    .form-actions[b-0x52462u22] {
        flex-direction: column-reverse;
    }

    .form-actions .btn[b-0x52462u22] {
        justify-content: center;
    }
}
/* /Components/Pages/Warehouse/DocumentTypeList.razor.rz.scp.css */
/* ===========================
   DocumentTypeList - Scoped Styles
   Flat Industrial Minimal
   =========================== */

/* Page Container */
.page-container[b-l6cag2gczd] {
    max-width: 1200px;
    margin: 0 auto;
    padding: var(--space-6) var(--space-4);
}

/* Header */
.page-header[b-l6cag2gczd] {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    margin-bottom: var(--space-6);
    gap: var(--space-4);
}

.page-header-left[b-l6cag2gczd] {
    flex: 1;
}

.page-header-right[b-l6cag2gczd] {
    flex-shrink: 0;
}

.page-title[b-l6cag2gczd] {
    font-size: var(--font-size-2xl);
    font-weight: var(--font-weight-bold);
    color: var(--color-primary);
    display: flex;
    align-items: center;
    gap: var(--space-2);
    margin: 0;
}

.page-title svg[b-l6cag2gczd] {
    color: var(--color-primary);
    flex-shrink: 0;
}

.page-subtitle[b-l6cag2gczd] {
    color: var(--text-muted);
    font-size: var(--font-size-sm);
    margin: var(--space-1) 0 0 0;
}

/* Action Button */
.btn-action[b-l6cag2gczd] {
    display: inline-flex;
    align-items: center;
    gap: var(--space-2);
    padding: var(--space-2) var(--space-4);
    background-color: var(--color-action);
    color: var(--text-on-action);
    border: var(--border-width-thin) solid var(--color-action);
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-medium);
    text-decoration: none;
    cursor: pointer;
    transition: background-color var(--transition-fast) var(--transition-ease),
                box-shadow var(--transition-fast) var(--transition-ease);
}

.btn-action:hover[b-l6cag2gczd] {
    background-color: var(--color-action-hover);
    border-color: var(--color-action-hover);
    color: var(--text-on-action);
    text-decoration: none;
    box-shadow: var(--shadow-sm);
}

.btn-action:active[b-l6cag2gczd] {
    background-color: var(--color-action-active);
}

/* Alert Bars */
.alert-bar[b-l6cag2gczd] {
    display: flex;
    align-items: center;
    gap: var(--space-2);
    padding: var(--space-3) var(--space-4);
    margin-bottom: var(--space-4);
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-medium);
    border-left: var(--border-width-thick) solid;
}

.alert-bar-success[b-l6cag2gczd] {
    background-color: #edf7ed;
    border-left-color: var(--color-success);
    color: #1e4620;
}

.alert-bar-danger[b-l6cag2gczd] {
    background-color: #fdeded;
    border-left-color: var(--color-danger);
    color: #5f2120;
}

.alert-bar-close[b-l6cag2gczd] {
    margin-left: auto;
    background: none;
    border: none;
    font-size: var(--font-size-lg);
    cursor: pointer;
    color: inherit;
    opacity: 0.6;
    line-height: 1;
}

.alert-bar-close:hover[b-l6cag2gczd] {
    opacity: 1;
}

/* Search Bar */
.search-bar[b-l6cag2gczd] {
    display: flex;
    align-items: center;
    gap: var(--space-4);
    margin-bottom: var(--space-4);
    padding: var(--space-3) var(--space-4);
    background-color: var(--bg-secondary);
    border: var(--border-width-thin) solid var(--border-color-light);
}

.search-input-wrapper[b-l6cag2gczd] {
    display: flex;
    align-items: center;
    flex: 1;
    position: relative;
}

.search-icon[b-l6cag2gczd] {
    color: var(--text-muted);
    flex-shrink: 0;
    margin-right: var(--space-2);
}

.search-input[b-l6cag2gczd] {
    flex: 1;
    border: none;
    background: transparent;
    font-size: var(--font-size-sm);
    color: var(--color-gray-700);
    outline: none;
    padding: var(--space-1) 0;
}

.search-input[b-l6cag2gczd]::placeholder {
    color: var(--text-muted);
}

.search-clear[b-l6cag2gczd] {
    background: none;
    border: none;
    cursor: pointer;
    color: var(--text-muted);
    padding: var(--space-1);
    display: flex;
    align-items: center;
}

.search-clear:hover[b-l6cag2gczd] {
    color: var(--color-primary);
}

.search-count[b-l6cag2gczd] {
    flex-shrink: 0;
    font-size: var(--font-size-xs);
    color: var(--text-muted);
    font-weight: var(--font-weight-medium);
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

/* Loading / Empty States */
.loading-state[b-l6cag2gczd] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: var(--space-16) 0;
    color: var(--text-muted);
    gap: var(--space-4);
}

.empty-state[b-l6cag2gczd] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: var(--space-16) 0;
    color: var(--text-muted);
    gap: var(--space-3);
}

.empty-state svg[b-l6cag2gczd] {
    opacity: 0.4;
}

.empty-state-text[b-l6cag2gczd] {
    font-size: var(--font-size-base);
    margin: 0;
}

/* Item List */
.item-list[b-l6cag2gczd] {
    display: flex;
    flex-direction: column;
    border: var(--border-width-thin) solid var(--border-color-light);
}

/* Item Row */
.item-row[b-l6cag2gczd] {
    display: flex;
    align-items: center;
    gap: var(--space-4);
    padding: var(--space-4);
    border-bottom: var(--border-width-thin) solid var(--border-color-light);
    transition: background-color var(--transition-fast) var(--transition-ease);
}

.item-row:last-child[b-l6cag2gczd] {
    border-bottom: none;
}

.item-row:hover[b-l6cag2gczd] {
    background-color: rgba(11, 36, 62, 0.03);
}

/* Avatar */
.item-avatar[b-l6cag2gczd] {
    flex-shrink: 0;
    width: 40px;
    height: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: var(--color-gray-100);
    color: var(--color-primary);
}

/* Item Info */
.item-info[b-l6cag2gczd] {
    flex: 1;
    min-width: 0;
}

.item-name[b-l6cag2gczd] {
    font-size: var(--font-size-base);
    font-weight: var(--font-weight-semibold);
    color: var(--color-primary);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.item-meta[b-l6cag2gczd] {
    display: flex;
    align-items: center;
    gap: var(--space-1);
    flex-wrap: wrap;
    font-size: var(--font-size-xs);
    color: var(--text-secondary);
    margin-top: 2px;
}

.item-code[b-l6cag2gczd] {
    font-family: var(--font-mono);
    font-weight: var(--font-weight-medium);
    color: var(--color-primary);
    opacity: 0.7;
}

.meta-separator[b-l6cag2gczd] {
    color: var(--color-gray-300);
}

/* Action Buttons */
.item-actions[b-l6cag2gczd] {
    flex-shrink: 0;
    display: flex;
    align-items: center;
    gap: var(--space-1);
}

.btn-icon[b-l6cag2gczd] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 36px;
    background: none;
    border: var(--border-width-thin) solid transparent;
    cursor: pointer;
    color: var(--text-muted);
    text-decoration: none;
    transition: all var(--transition-fast) var(--transition-ease);
}

.btn-icon:hover[b-l6cag2gczd] {
    color: var(--color-primary);
    background-color: var(--color-gray-100);
    border-color: var(--border-color-light);
    text-decoration: none;
}

.btn-icon-danger:hover[b-l6cag2gczd] {
    color: var(--color-action);
    background-color: rgba(178, 34, 34, 0.06);
    border-color: rgba(178, 34, 34, 0.2);
}

.btn-icon-sector:hover[b-l6cag2gczd] {
    color: var(--color-success);
    background-color: rgba(30, 70, 32, 0.06);
    border-color: rgba(30, 70, 32, 0.2);
}

.actions-separator[b-l6cag2gczd] {
    width: 1px;
    height: 20px;
    background-color: var(--border-color-light);
    margin: 0 var(--space-1);
}

/* Overlay & Dialog */
.overlay[b-l6cag2gczd] {
    position: fixed;
    inset: 0;
    background-color: rgba(0, 0, 0, 0.4);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: var(--z-modal-backdrop);
}

.confirm-dialog[b-l6cag2gczd] {
    background-color: var(--color-white);
    padding: var(--space-8);
    max-width: 420px;
    width: 90%;
    box-shadow: var(--shadow-xl);
    text-align: center;
    z-index: var(--z-modal);
}

.confirm-icon[b-l6cag2gczd] {
    color: var(--color-action);
    margin-bottom: var(--space-4);
}

.confirm-dialog h3[b-l6cag2gczd] {
    font-size: var(--font-size-lg);
    font-weight: var(--font-weight-semibold);
    color: var(--color-primary);
    margin: 0 0 var(--space-2) 0;
}

.confirm-dialog p[b-l6cag2gczd] {
    font-size: var(--font-size-sm);
    color: var(--text-secondary);
    margin: 0 0 var(--space-2) 0;
}

.confirm-warning[b-l6cag2gczd] {
    font-size: var(--font-size-xs) !important;
    color: var(--color-action) !important;
    font-weight: var(--font-weight-medium);
}

.confirm-actions[b-l6cag2gczd] {
    display: flex;
    gap: var(--space-3);
    justify-content: center;
    margin-top: var(--space-6);
}

.confirm-actions .btn[b-l6cag2gczd] {
    min-width: 100px;
    padding: var(--space-2) var(--space-4);
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-medium);
    cursor: pointer;
}

/* Outline Primary Button */
.btn-outline-primary[b-l6cag2gczd] {
    background: transparent;
    color: var(--color-primary);
    border: var(--border-width-thin) solid var(--color-primary);
}

.btn-outline-primary:hover[b-l6cag2gczd] {
    background-color: var(--color-primary);
    color: var(--text-on-primary);
}

/* Responsive */
@media (max-width: 768px) {
    .page-header[b-l6cag2gczd] {
        flex-direction: column;
        gap: var(--space-3);
    }

    .item-row[b-l6cag2gczd] {
        flex-wrap: wrap;
    }
}
/* /Components/Pages/Warehouse/DocumentTypeMeatTraceabilityEdit.razor.rz.scp.css */
/* ===========================
   DocumentTypeMeatTraceabilityEdit - Scoped Styles
   Flat Industrial Minimal
   =========================== */

/* Page Container */
.page-container[b-qcl3ifs8ph] {
    max-width: 900px;
    margin: 0 auto;
    padding: var(--space-6) var(--space-4);
}

/* Header */
.page-header[b-qcl3ifs8ph] {
    display: flex;
    align-items: center;
    gap: var(--space-4);
    margin-bottom: var(--space-6);
}

.btn-back[b-qcl3ifs8ph] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    color: var(--text-muted);
    border: var(--border-width-thin) solid var(--border-color-light);
    text-decoration: none;
    transition: all var(--transition-fast) var(--transition-ease);
    flex-shrink: 0;
}

.btn-back:hover[b-qcl3ifs8ph] {
    color: var(--color-primary);
    border-color: var(--color-primary);
    background-color: var(--color-gray-50);
    text-decoration: none;
}

.page-header-text[b-qcl3ifs8ph] {
    flex: 1;
}

.page-title[b-qcl3ifs8ph] {
    font-size: var(--font-size-xl);
    font-weight: var(--font-weight-bold);
    color: var(--color-primary);
    display: flex;
    align-items: center;
    gap: var(--space-2);
    margin: 0;
}

.page-title svg[b-qcl3ifs8ph] {
    color: var(--color-primary);
    flex-shrink: 0;
}

.page-subtitle[b-qcl3ifs8ph] {
    color: var(--text-muted);
    font-size: var(--font-size-sm);
    margin: 2px 0 0 0;
    display: flex;
    align-items: center;
    gap: var(--space-2);
}

.subtitle-code[b-qcl3ifs8ph] {
    font-family: var(--font-mono);
    font-size: var(--font-size-xs);
    color: var(--color-primary);
    opacity: 0.6;
    padding: 1px var(--space-2);
    background-color: var(--color-gray-100);
}

/* Alert Bar */
.alert-bar[b-qcl3ifs8ph] {
    display: flex;
    align-items: center;
    gap: var(--space-2);
    padding: var(--space-3) var(--space-4);
    margin-bottom: var(--space-4);
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-medium);
    border-left: var(--border-width-thick) solid;
}

.alert-bar-danger[b-qcl3ifs8ph] {
    background-color: #fdeded;
    border-left-color: var(--color-danger);
    color: #5f2120;
}

.alert-bar-success[b-qcl3ifs8ph] {
    background-color: #edf7ed;
    border-left-color: var(--color-success);
    color: #1e4620;
}

.alert-bar-close[b-qcl3ifs8ph] {
    margin-left: auto;
    background: none;
    border: none;
    font-size: var(--font-size-lg);
    cursor: pointer;
    color: inherit;
    opacity: 0.6;
    line-height: 1;
}

.alert-bar-close:hover[b-qcl3ifs8ph] {
    opacity: 1;
}

/* Loading / Empty States */
.loading-state[b-qcl3ifs8ph] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: var(--space-16) 0;
    color: var(--text-muted);
    gap: var(--space-4);
}

.empty-state[b-qcl3ifs8ph] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: var(--space-16) 0;
    color: var(--text-muted);
    gap: var(--space-3);
}

.empty-state svg[b-qcl3ifs8ph] {
    opacity: 0.4;
}

.empty-state-text[b-qcl3ifs8ph] {
    font-size: var(--font-size-base);
    margin: 0;
}

/* Form Sections */
.form-section[b-qcl3ifs8ph] {
    margin-bottom: var(--space-6);
    padding: var(--space-5);
    background-color: var(--color-white);
    border: var(--border-width-thin) solid var(--border-color-light);
}

.section-title[b-qcl3ifs8ph] {
    display: flex;
    align-items: center;
    gap: var(--space-2);
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-semibold);
    color: var(--color-primary);
    text-transform: uppercase;
    letter-spacing: 0.5px;
    margin: 0 0 var(--space-4) 0;
    padding-bottom: var(--space-3);
    border-bottom: var(--border-width-thin) solid var(--border-color-light);
}

.section-title svg[b-qcl3ifs8ph] {
    color: var(--color-primary);
    opacity: 0.6;
    flex-shrink: 0;
}

/* Form Grid */
.form-grid[b-qcl3ifs8ph] {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: var(--space-4);
}

.form-group[b-qcl3ifs8ph] {
    display: flex;
    flex-direction: column;
}

/* Form Controls */
.form-label[b-qcl3ifs8ph] {
    font-size: var(--font-size-xs);
    font-weight: var(--font-weight-medium);
    color: var(--text-secondary);
    text-transform: uppercase;
    letter-spacing: 0.3px;
    margin-bottom: var(--space-1);
}

.form-control[b-qcl3ifs8ph] {
    padding: var(--space-2) var(--space-3);
    font-size: var(--font-size-sm);
    color: var(--color-gray-700);
    border: var(--border-width-thin) solid var(--border-color-light);
    background-color: var(--color-white);
    transition: border-color var(--transition-fast) var(--transition-ease);
}

.form-control:focus[b-qcl3ifs8ph] {
    border-color: var(--color-primary);
    outline: none;
    box-shadow: none;
}

/* Form Actions */
.form-actions[b-qcl3ifs8ph] {
    display: flex;
    justify-content: flex-end;
    gap: var(--space-3);
    padding-top: var(--space-4);
    border-top: var(--border-width-thin) solid var(--border-color-light);
}

.form-actions .btn[b-qcl3ifs8ph] {
    display: inline-flex;
    align-items: center;
    gap: var(--space-2);
    padding: var(--space-2) var(--space-5);
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-medium);
    cursor: pointer;
    text-decoration: none;
}

.btn-action[b-qcl3ifs8ph] {
    background-color: var(--color-action);
    color: var(--text-on-action);
    border: var(--border-width-thin) solid var(--color-action);
    transition: background-color var(--transition-fast) var(--transition-ease);
}

.btn-action:hover[b-qcl3ifs8ph] {
    background-color: var(--color-action-hover);
    border-color: var(--color-action-hover);
    color: var(--text-on-action);
}

.btn-action:disabled[b-qcl3ifs8ph] {
    opacity: 0.65;
    cursor: not-allowed;
}

.btn-outline-primary[b-qcl3ifs8ph] {
    background: transparent;
    color: var(--color-primary);
    border: var(--border-width-thin) solid var(--color-primary);
}

.btn-outline-primary:hover[b-qcl3ifs8ph] {
    background-color: var(--color-primary);
    color: var(--text-on-primary);
    text-decoration: none;
}

/* Responsive */
@media (max-width: 768px) {
    .form-grid[b-qcl3ifs8ph] {
        grid-template-columns: 1fr;
    }

    .form-actions[b-qcl3ifs8ph] {
        flex-direction: column-reverse;
    }

    .form-actions .btn[b-qcl3ifs8ph] {
        justify-content: center;
    }
}
/* /Components/Pages/Warehouse/ProductAliasCreate.razor.rz.scp.css */
/* ===========================
   ProductAliasCreate - Scoped Styles
   Flat Industrial Minimal
   =========================== */

/* Page Container */
.page-container[b-rg2w6x5d3b] {
    max-width: 900px;
    margin: 0 auto;
    padding: var(--space-6) var(--space-4);
}

/* Header */
.page-header[b-rg2w6x5d3b] {
    display: flex;
    align-items: center;
    gap: var(--space-4);
    margin-bottom: var(--space-6);
}

.btn-back[b-rg2w6x5d3b] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    color: var(--text-muted);
    border: var(--border-width-thin) solid var(--border-color-light);
    text-decoration: none;
    transition: all var(--transition-fast) var(--transition-ease);
    flex-shrink: 0;
}

.btn-back:hover[b-rg2w6x5d3b] {
    color: var(--color-primary);
    border-color: var(--color-primary);
    background-color: var(--color-gray-50);
    text-decoration: none;
}

.page-header-text[b-rg2w6x5d3b] {
    flex: 1;
}

.page-title[b-rg2w6x5d3b] {
    font-size: var(--font-size-xl);
    font-weight: var(--font-weight-bold);
    color: var(--color-primary);
    display: flex;
    align-items: center;
    gap: var(--space-2);
    margin: 0;
}

.page-title svg[b-rg2w6x5d3b] {
    color: var(--color-primary);
    flex-shrink: 0;
}

.page-subtitle[b-rg2w6x5d3b] {
    color: var(--text-muted);
    font-size: var(--font-size-sm);
    margin: 2px 0 0 0;
    display: flex;
    align-items: center;
    gap: var(--space-2);
}

.subtitle-code[b-rg2w6x5d3b] {
    font-family: var(--font-mono);
    font-size: var(--font-size-xs);
    color: var(--color-primary);
    opacity: 0.6;
    padding: 1px var(--space-2);
    background-color: var(--color-gray-100);
}

/* Alert Bar */
.alert-bar[b-rg2w6x5d3b] {
    display: flex;
    align-items: center;
    gap: var(--space-2);
    padding: var(--space-3) var(--space-4);
    margin-bottom: var(--space-4);
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-medium);
    border-left: var(--border-width-thick) solid;
}

.alert-bar-danger[b-rg2w6x5d3b] {
    background-color: #fdeded;
    border-left-color: var(--color-danger);
    color: #5f2120;
}

.alert-bar-close[b-rg2w6x5d3b] {
    margin-left: auto;
    background: none;
    border: none;
    font-size: var(--font-size-lg);
    cursor: pointer;
    color: inherit;
    opacity: 0.6;
    line-height: 1;
}

.alert-bar-close:hover[b-rg2w6x5d3b] {
    opacity: 1;
}

/* Form Sections */
.form-section[b-rg2w6x5d3b] {
    margin-bottom: var(--space-6);
    padding: var(--space-5);
    background-color: var(--color-white);
    border: var(--border-width-thin) solid var(--border-color-light);
}

.section-title[b-rg2w6x5d3b] {
    display: flex;
    align-items: center;
    gap: var(--space-2);
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-semibold);
    color: var(--color-primary);
    text-transform: uppercase;
    letter-spacing: 0.5px;
    margin: 0 0 var(--space-4) 0;
    padding-bottom: var(--space-3);
    border-bottom: var(--border-width-thin) solid var(--border-color-light);
}

.section-title svg[b-rg2w6x5d3b] {
    color: var(--color-primary);
    opacity: 0.6;
    flex-shrink: 0;
}

/* Form Grid */
.form-grid[b-rg2w6x5d3b] {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: var(--space-4);
}

.form-group[b-rg2w6x5d3b] {
    display: flex;
    flex-direction: column;
}

.form-group-wide[b-rg2w6x5d3b] {
    grid-column: span 2;
}

/* Form Controls */
.form-label[b-rg2w6x5d3b] {
    font-size: var(--font-size-xs);
    font-weight: var(--font-weight-medium);
    color: var(--text-secondary);
    text-transform: uppercase;
    letter-spacing: 0.3px;
    margin-bottom: var(--space-1);
}

.form-control[b-rg2w6x5d3b] {
    padding: var(--space-2) var(--space-3);
    font-size: var(--font-size-sm);
    color: var(--color-gray-700);
    border: var(--border-width-thin) solid var(--border-color-light);
    background-color: var(--color-white);
    transition: border-color var(--transition-fast) var(--transition-ease);
}

.form-control:focus[b-rg2w6x5d3b] {
    border-color: var(--color-primary);
    outline: none;
    box-shadow: none;
}

.form-control[b-rg2w6x5d3b]::placeholder {
    color: var(--color-gray-400);
}

.form-control-static[b-rg2w6x5d3b] {
    padding: var(--space-2) var(--space-3);
    font-size: var(--font-size-sm);
    color: var(--text-muted);
    background-color: var(--color-gray-50);
    border: var(--border-width-thin) solid var(--border-color-light);
    font-family: var(--font-mono);
}

/* Form Actions */
.form-actions[b-rg2w6x5d3b] {
    display: flex;
    justify-content: flex-end;
    gap: var(--space-3);
    padding-top: var(--space-4);
    border-top: var(--border-width-thin) solid var(--border-color-light);
}

.form-actions .btn[b-rg2w6x5d3b] {
    display: inline-flex;
    align-items: center;
    gap: var(--space-2);
    padding: var(--space-2) var(--space-5);
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-medium);
    cursor: pointer;
    text-decoration: none;
}

.btn-action[b-rg2w6x5d3b] {
    background-color: var(--color-action);
    color: var(--text-on-action);
    border: var(--border-width-thin) solid var(--color-action);
    transition: background-color var(--transition-fast) var(--transition-ease);
}

.btn-action:hover[b-rg2w6x5d3b] {
    background-color: var(--color-action-hover);
    border-color: var(--color-action-hover);
    color: var(--text-on-action);
}

.btn-action:disabled[b-rg2w6x5d3b] {
    opacity: 0.65;
    cursor: not-allowed;
}

.btn-outline-primary[b-rg2w6x5d3b] {
    background: transparent;
    color: var(--color-primary);
    border: var(--border-width-thin) solid var(--color-primary);
}

.btn-outline-primary:hover[b-rg2w6x5d3b] {
    background-color: var(--color-primary);
    color: var(--text-on-primary);
    text-decoration: none;
}

/* Validation */
[b-rg2w6x5d3b] .validation-message {
    color: var(--color-danger);
    font-size: var(--font-size-xs);
    margin-top: 2px;
}

/* Responsive */
@media (max-width: 768px) {
    .form-grid[b-rg2w6x5d3b] {
        grid-template-columns: 1fr;
    }

    .form-group-wide[b-rg2w6x5d3b] {
        grid-column: span 1;
    }

    .form-actions[b-rg2w6x5d3b] {
        flex-direction: column-reverse;
    }

    .form-actions .btn[b-rg2w6x5d3b] {
        justify-content: center;
    }
}
/* /Components/Pages/Warehouse/ProductAliasEdit.razor.rz.scp.css */
/* ===========================
   ProductAliasEdit - Scoped Styles
   Flat Industrial Minimal
   =========================== */

/* Page Container */
.page-container[b-m3di089qvz] {
    max-width: 900px;
    margin: 0 auto;
    padding: var(--space-6) var(--space-4);
}

/* Header */
.page-header[b-m3di089qvz] {
    display: flex;
    align-items: center;
    gap: var(--space-4);
    margin-bottom: var(--space-6);
}

.btn-back[b-m3di089qvz] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    color: var(--text-muted);
    border: var(--border-width-thin) solid var(--border-color-light);
    text-decoration: none;
    transition: all var(--transition-fast) var(--transition-ease);
    flex-shrink: 0;
}

.btn-back:hover[b-m3di089qvz] {
    color: var(--color-primary);
    border-color: var(--color-primary);
    background-color: var(--color-gray-50);
    text-decoration: none;
}

.page-header-text[b-m3di089qvz] {
    flex: 1;
}

.page-title[b-m3di089qvz] {
    font-size: var(--font-size-xl);
    font-weight: var(--font-weight-bold);
    color: var(--color-primary);
    display: flex;
    align-items: center;
    gap: var(--space-2);
    margin: 0;
}

.page-title svg[b-m3di089qvz] {
    color: var(--color-primary);
    flex-shrink: 0;
}

.page-subtitle[b-m3di089qvz] {
    color: var(--text-muted);
    font-size: var(--font-size-sm);
    margin: 2px 0 0 0;
    display: flex;
    align-items: center;
    gap: var(--space-2);
}

.subtitle-code[b-m3di089qvz] {
    font-family: var(--font-mono);
    font-size: var(--font-size-xs);
    color: var(--color-primary);
    opacity: 0.6;
    padding: 1px var(--space-2);
    background-color: var(--color-gray-100);
}

/* Alert Bar */
.alert-bar[b-m3di089qvz] {
    display: flex;
    align-items: center;
    gap: var(--space-2);
    padding: var(--space-3) var(--space-4);
    margin-bottom: var(--space-4);
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-medium);
    border-left: var(--border-width-thick) solid;
}

.alert-bar-danger[b-m3di089qvz] {
    background-color: #fdeded;
    border-left-color: var(--color-danger);
    color: #5f2120;
}

.alert-bar-close[b-m3di089qvz] {
    margin-left: auto;
    background: none;
    border: none;
    font-size: var(--font-size-lg);
    cursor: pointer;
    color: inherit;
    opacity: 0.6;
    line-height: 1;
}

.alert-bar-close:hover[b-m3di089qvz] {
    opacity: 1;
}

/* Loading / Empty States */
.loading-state[b-m3di089qvz] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: var(--space-16) 0;
    color: var(--text-muted);
    gap: var(--space-4);
}

.empty-state[b-m3di089qvz] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: var(--space-16) 0;
    color: var(--text-muted);
    gap: var(--space-3);
}

.empty-state svg[b-m3di089qvz] {
    opacity: 0.4;
}

.empty-state-text[b-m3di089qvz] {
    font-size: var(--font-size-base);
    margin: 0;
}

/* Form Sections */
.form-section[b-m3di089qvz] {
    margin-bottom: var(--space-6);
    padding: var(--space-5);
    background-color: var(--color-white);
    border: var(--border-width-thin) solid var(--border-color-light);
}

.section-title[b-m3di089qvz] {
    display: flex;
    align-items: center;
    gap: var(--space-2);
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-semibold);
    color: var(--color-primary);
    text-transform: uppercase;
    letter-spacing: 0.5px;
    margin: 0 0 var(--space-4) 0;
    padding-bottom: var(--space-3);
    border-bottom: var(--border-width-thin) solid var(--border-color-light);
}

.section-title svg[b-m3di089qvz] {
    color: var(--color-primary);
    opacity: 0.6;
    flex-shrink: 0;
}

/* Form Grid */
.form-grid[b-m3di089qvz] {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: var(--space-4);
}

.form-group[b-m3di089qvz] {
    display: flex;
    flex-direction: column;
}

.form-group-wide[b-m3di089qvz] {
    grid-column: span 2;
}

/* Form Controls */
.form-label[b-m3di089qvz] {
    font-size: var(--font-size-xs);
    font-weight: var(--font-weight-medium);
    color: var(--text-secondary);
    text-transform: uppercase;
    letter-spacing: 0.3px;
    margin-bottom: var(--space-1);
}

.form-control[b-m3di089qvz] {
    padding: var(--space-2) var(--space-3);
    font-size: var(--font-size-sm);
    color: var(--color-gray-700);
    border: var(--border-width-thin) solid var(--border-color-light);
    background-color: var(--color-white);
    transition: border-color var(--transition-fast) var(--transition-ease);
}

.form-control:focus[b-m3di089qvz] {
    border-color: var(--color-primary);
    outline: none;
    box-shadow: none;
}

.form-control[b-m3di089qvz]::placeholder {
    color: var(--color-gray-400);
}

.form-control-static[b-m3di089qvz] {
    padding: var(--space-2) var(--space-3);
    font-size: var(--font-size-sm);
    color: var(--text-muted);
    background-color: var(--color-gray-50);
    border: var(--border-width-thin) solid var(--border-color-light);
    font-family: var(--font-mono);
}

/* Form Actions */
.form-actions[b-m3di089qvz] {
    display: flex;
    justify-content: flex-end;
    gap: var(--space-3);
    padding-top: var(--space-4);
    border-top: var(--border-width-thin) solid var(--border-color-light);
}

.form-actions .btn[b-m3di089qvz] {
    display: inline-flex;
    align-items: center;
    gap: var(--space-2);
    padding: var(--space-2) var(--space-5);
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-medium);
    cursor: pointer;
    text-decoration: none;
}

.btn-action[b-m3di089qvz] {
    background-color: var(--color-action);
    color: var(--text-on-action);
    border: var(--border-width-thin) solid var(--color-action);
    transition: background-color var(--transition-fast) var(--transition-ease);
}

.btn-action:hover[b-m3di089qvz] {
    background-color: var(--color-action-hover);
    border-color: var(--color-action-hover);
    color: var(--text-on-action);
}

.btn-action:disabled[b-m3di089qvz] {
    opacity: 0.65;
    cursor: not-allowed;
}

.btn-outline-primary[b-m3di089qvz] {
    background: transparent;
    color: var(--color-primary);
    border: var(--border-width-thin) solid var(--color-primary);
}

.btn-outline-primary:hover[b-m3di089qvz] {
    background-color: var(--color-primary);
    color: var(--text-on-primary);
    text-decoration: none;
}

/* Validation */
[b-m3di089qvz] .validation-message {
    color: var(--color-danger);
    font-size: var(--font-size-xs);
    margin-top: 2px;
}

/* Responsive */
@media (max-width: 768px) {
    .form-grid[b-m3di089qvz] {
        grid-template-columns: 1fr;
    }

    .form-group-wide[b-m3di089qvz] {
        grid-column: span 1;
    }

    .form-actions[b-m3di089qvz] {
        flex-direction: column-reverse;
    }

    .form-actions .btn[b-m3di089qvz] {
        justify-content: center;
    }
}
/* /Components/Pages/Warehouse/ProductAliasList.razor.rz.scp.css */
/* ===========================
   ProductAliasList - Scoped Styles
   Flat Industrial Minimal
   =========================== */

/* Page Container */
.page-container[b-gtdjx05jys] {
    max-width: 1200px;
    margin: 0 auto;
    padding: var(--space-6) var(--space-4);
}

/* Header */
.page-header[b-gtdjx05jys] {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    margin-bottom: var(--space-6);
    gap: var(--space-4);
}

.page-header-left[b-gtdjx05jys] {
    flex: 1;
}

.page-header-right[b-gtdjx05jys] {
    flex-shrink: 0;
}

.page-header-nav[b-gtdjx05jys] {
    display: flex;
    align-items: center;
    gap: var(--space-4);
}

.btn-back[b-gtdjx05jys] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    color: var(--text-muted);
    border: var(--border-width-thin) solid var(--border-color-light);
    text-decoration: none;
    transition: all var(--transition-fast) var(--transition-ease);
    flex-shrink: 0;
}

.btn-back:hover[b-gtdjx05jys] {
    color: var(--color-primary);
    border-color: var(--color-primary);
    background-color: var(--color-gray-50);
    text-decoration: none;
}

.page-title[b-gtdjx05jys] {
    font-size: var(--font-size-2xl);
    font-weight: var(--font-weight-bold);
    color: var(--color-primary);
    display: flex;
    align-items: center;
    gap: var(--space-2);
    margin: 0;
}

.page-title svg[b-gtdjx05jys] {
    color: var(--color-primary);
    flex-shrink: 0;
}

.page-subtitle[b-gtdjx05jys] {
    color: var(--text-muted);
    font-size: var(--font-size-sm);
    margin: var(--space-1) 0 0 0;
}

.subtitle-code[b-gtdjx05jys] {
    font-family: var(--font-mono);
    font-size: var(--font-size-xs);
    color: var(--color-primary);
    opacity: 0.6;
    padding: 1px var(--space-2);
    background-color: var(--color-gray-100);
}

/* Action Button */
.btn-action[b-gtdjx05jys] {
    display: inline-flex;
    align-items: center;
    gap: var(--space-2);
    padding: var(--space-2) var(--space-4);
    background-color: var(--color-action);
    color: var(--text-on-action);
    border: var(--border-width-thin) solid var(--color-action);
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-medium);
    text-decoration: none;
    cursor: pointer;
    transition: background-color var(--transition-fast) var(--transition-ease),
                box-shadow var(--transition-fast) var(--transition-ease);
}

.btn-action:hover[b-gtdjx05jys] {
    background-color: var(--color-action-hover);
    border-color: var(--color-action-hover);
    color: var(--text-on-action);
    text-decoration: none;
    box-shadow: var(--shadow-sm);
}

.btn-action:active[b-gtdjx05jys] {
    background-color: var(--color-action-active);
}

.btn-action:disabled[b-gtdjx05jys] {
    opacity: 0.65;
    cursor: not-allowed;
}

/* Alert Bars */
.alert-bar[b-gtdjx05jys] {
    display: flex;
    align-items: center;
    gap: var(--space-2);
    padding: var(--space-3) var(--space-4);
    margin-bottom: var(--space-4);
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-medium);
    border-left: var(--border-width-thick) solid;
}

.alert-bar-success[b-gtdjx05jys] {
    background-color: #edf7ed;
    border-left-color: var(--color-success);
    color: #1e4620;
}

.alert-bar-danger[b-gtdjx05jys] {
    background-color: #fdeded;
    border-left-color: var(--color-danger);
    color: #5f2120;
}

.alert-bar-close[b-gtdjx05jys] {
    margin-left: auto;
    background: none;
    border: none;
    font-size: var(--font-size-lg);
    cursor: pointer;
    color: inherit;
    opacity: 0.6;
    line-height: 1;
}

.alert-bar-close:hover[b-gtdjx05jys] {
    opacity: 1;
}

/* Search Bar */
.search-bar[b-gtdjx05jys] {
    display: flex;
    align-items: center;
    gap: var(--space-4);
    margin-bottom: var(--space-4);
    padding: var(--space-3) var(--space-4);
    background-color: var(--bg-secondary);
    border: var(--border-width-thin) solid var(--border-color-light);
}

.search-input-wrapper[b-gtdjx05jys] {
    display: flex;
    align-items: center;
    flex: 1;
    position: relative;
}

.search-icon[b-gtdjx05jys] {
    color: var(--text-muted);
    flex-shrink: 0;
    margin-right: var(--space-2);
}

.search-input[b-gtdjx05jys] {
    flex: 1;
    border: none;
    background: transparent;
    font-size: var(--font-size-sm);
    color: var(--color-gray-700);
    outline: none;
    padding: var(--space-1) 0;
}

.search-input[b-gtdjx05jys]::placeholder {
    color: var(--text-muted);
}

.search-clear[b-gtdjx05jys] {
    background: none;
    border: none;
    cursor: pointer;
    color: var(--text-muted);
    padding: var(--space-1);
    display: flex;
    align-items: center;
}

.search-clear:hover[b-gtdjx05jys] {
    color: var(--color-primary);
}

.search-count[b-gtdjx05jys] {
    flex-shrink: 0;
    font-size: var(--font-size-xs);
    color: var(--text-muted);
    font-weight: var(--font-weight-medium);
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

/* Loading / Empty States */
.loading-state[b-gtdjx05jys] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: var(--space-16) 0;
    color: var(--text-muted);
    gap: var(--space-4);
}

.empty-state[b-gtdjx05jys] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: var(--space-16) 0;
    color: var(--text-muted);
    gap: var(--space-3);
}

.empty-state svg[b-gtdjx05jys] {
    opacity: 0.4;
}

.empty-state-text[b-gtdjx05jys] {
    font-size: var(--font-size-base);
    margin: 0;
}

/* Contact List */
.contact-list[b-gtdjx05jys] {
    display: flex;
    flex-direction: column;
    border: var(--border-width-thin) solid var(--border-color-light);
}

/* Contact Row */
.contact-row[b-gtdjx05jys] {
    display: flex;
    align-items: center;
    gap: var(--space-4);
    padding: var(--space-4);
    border-bottom: var(--border-width-thin) solid var(--border-color-light);
    transition: background-color var(--transition-fast) var(--transition-ease);
}

.contact-row:last-child[b-gtdjx05jys] {
    border-bottom: none;
}

.contact-row:hover[b-gtdjx05jys] {
    background-color: rgba(11, 36, 62, 0.03);
}

/* Avatar */
.contact-avatar[b-gtdjx05jys] {
    flex-shrink: 0;
    width: 40px;
    height: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: var(--color-gray-100);
    color: var(--color-primary);
}

/* Contact Info */
.contact-info[b-gtdjx05jys] {
    flex: 1;
    min-width: 0;
}

.contact-name[b-gtdjx05jys] {
    font-size: var(--font-size-base);
    font-weight: var(--font-weight-semibold);
    color: var(--color-primary);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.contact-meta[b-gtdjx05jys] {
    display: flex;
    align-items: center;
    gap: var(--space-1);
    flex-wrap: wrap;
    font-size: var(--font-size-xs);
    color: var(--text-secondary);
    margin-top: 2px;
}

.contact-code[b-gtdjx05jys] {
    font-family: var(--font-mono);
    font-weight: var(--font-weight-medium);
    color: var(--color-primary);
    opacity: 0.7;
}

.meta-separator[b-gtdjx05jys] {
    color: var(--color-gray-300);
}

.contact-details[b-gtdjx05jys] {
    display: flex;
    align-items: center;
    gap: var(--space-4);
    margin-top: var(--space-1);
}

.contact-detail-item[b-gtdjx05jys] {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    font-size: var(--font-size-xs);
    color: var(--text-muted);
}

.contact-detail-item svg[b-gtdjx05jys] {
    flex-shrink: 0;
}

/* Badges */
.contact-badges[b-gtdjx05jys] {
    flex-shrink: 0;
    display: flex;
    gap: var(--space-2);
}

.badge[b-gtdjx05jys] {
    display: inline-flex;
    align-items: center;
    padding: 3px var(--space-2);
    font-size: var(--font-size-xs);
    font-weight: var(--font-weight-medium);
    letter-spacing: 0.3px;
    text-transform: uppercase;
}

.badge-primary[b-gtdjx05jys] {
    background-color: rgba(11, 36, 62, 0.1);
    color: var(--color-primary);
}

.badge-info[b-gtdjx05jys] {
    background-color: rgba(23, 162, 184, 0.1);
    color: var(--color-info);
}

/* Action Buttons */
.contact-actions[b-gtdjx05jys] {
    flex-shrink: 0;
    display: flex;
    align-items: center;
    gap: var(--space-1);
}

.btn-icon[b-gtdjx05jys] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 36px;
    background: none;
    border: var(--border-width-thin) solid transparent;
    cursor: pointer;
    color: var(--text-muted);
    text-decoration: none;
    transition: all var(--transition-fast) var(--transition-ease);
}

.btn-icon:hover[b-gtdjx05jys] {
    color: var(--color-primary);
    background-color: var(--color-gray-100);
    border-color: var(--border-color-light);
    text-decoration: none;
}

.btn-icon-danger:hover[b-gtdjx05jys] {
    color: var(--color-action);
    background-color: rgba(178, 34, 34, 0.06);
    border-color: rgba(178, 34, 34, 0.2);
}

/* Overlay & Dialog */
.overlay[b-gtdjx05jys] {
    position: fixed;
    inset: 0;
    background-color: rgba(0, 0, 0, 0.4);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: var(--z-modal-backdrop);
}

.confirm-dialog[b-gtdjx05jys] {
    background-color: var(--color-white);
    padding: var(--space-8);
    max-width: 420px;
    width: 90%;
    box-shadow: var(--shadow-xl);
    text-align: center;
    z-index: var(--z-modal);
}

.confirm-icon[b-gtdjx05jys] {
    color: var(--color-action);
    margin-bottom: var(--space-4);
}

.confirm-dialog h3[b-gtdjx05jys] {
    font-size: var(--font-size-lg);
    font-weight: var(--font-weight-semibold);
    color: var(--color-primary);
    margin: 0 0 var(--space-2) 0;
}

.confirm-dialog p[b-gtdjx05jys] {
    font-size: var(--font-size-sm);
    color: var(--text-secondary);
    margin: 0 0 var(--space-2) 0;
}

.confirm-warning[b-gtdjx05jys] {
    font-size: var(--font-size-xs) !important;
    color: var(--color-action) !important;
    font-weight: var(--font-weight-medium);
}

.confirm-actions[b-gtdjx05jys] {
    display: flex;
    gap: var(--space-3);
    justify-content: center;
    margin-top: var(--space-6);
}

.confirm-actions .btn[b-gtdjx05jys] {
    min-width: 100px;
    padding: var(--space-2) var(--space-4);
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-medium);
    cursor: pointer;
}

/* Outline Primary Button */
.btn-outline-primary[b-gtdjx05jys] {
    background: transparent;
    color: var(--color-primary);
    border: var(--border-width-thin) solid var(--color-primary);
}

.btn-outline-primary:hover[b-gtdjx05jys] {
    background-color: var(--color-primary);
    color: var(--text-on-primary);
}

/* Responsive */
@media (max-width: 768px) {
    .page-header[b-gtdjx05jys] {
        flex-direction: column;
        gap: var(--space-3);
    }

    .contact-row[b-gtdjx05jys] {
        flex-wrap: wrap;
    }

    .contact-badges[b-gtdjx05jys] {
        order: 5;
    }

    .contact-actions[b-gtdjx05jys] {
        order: 6;
        margin-left: auto;
    }

    .contact-details[b-gtdjx05jys] {
        flex-wrap: wrap;
    }
}
/* /Components/Pages/Warehouse/ProductCreate.razor.rz.scp.css */
/* ===========================
   ContactCreate / ContactEdit - Shared Form Styles
   Flat Industrial Minimal
   =========================== */

/* Page Container */
.page-container[b-2pw1yppa6i] {
    max-width: 900px;
    margin: 0 auto;
    padding: var(--space-6) var(--space-4);
}

/* Header */
.page-header[b-2pw1yppa6i] {
    display: flex;
    align-items: center;
    gap: var(--space-4);
    margin-bottom: var(--space-6);
}

.btn-back[b-2pw1yppa6i] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    color: var(--text-muted);
    border: var(--border-width-thin) solid var(--border-color-light);
    text-decoration: none;
    transition: all var(--transition-fast) var(--transition-ease);
    flex-shrink: 0;
}

.btn-back:hover[b-2pw1yppa6i] {
    color: var(--color-primary);
    border-color: var(--color-primary);
    background-color: var(--color-gray-50);
    text-decoration: none;
}

.page-header-text[b-2pw1yppa6i] {
    flex: 1;
}

.page-title[b-2pw1yppa6i] {
    font-size: var(--font-size-xl);
    font-weight: var(--font-weight-bold);
    color: var(--color-primary);
    display: flex;
    align-items: center;
    gap: var(--space-2);
    margin: 0;
}

.page-title svg[b-2pw1yppa6i] {
    color: var(--color-primary);
    flex-shrink: 0;
}

.page-subtitle[b-2pw1yppa6i] {
    color: var(--text-muted);
    font-size: var(--font-size-sm);
    margin: 2px 0 0 0;
}

/* Alert Bar */
.alert-bar[b-2pw1yppa6i] {
    display: flex;
    align-items: center;
    gap: var(--space-2);
    padding: var(--space-3) var(--space-4);
    margin-bottom: var(--space-4);
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-medium);
    border-left: var(--border-width-thick) solid;
}

.alert-bar-danger[b-2pw1yppa6i] {
    background-color: #fdeded;
    border-left-color: var(--color-danger);
    color: #5f2120;
}

.alert-bar-close[b-2pw1yppa6i] {
    margin-left: auto;
    background: none;
    border: none;
    font-size: var(--font-size-lg);
    cursor: pointer;
    color: inherit;
    opacity: 0.6;
    line-height: 1;
}

.alert-bar-close:hover[b-2pw1yppa6i] {
    opacity: 1;
}

/* Form Sections */
.form-section[b-2pw1yppa6i] {
    margin-bottom: var(--space-6);
    padding: var(--space-5);
    background-color: var(--color-white);
    border: var(--border-width-thin) solid var(--border-color-light);
}

.section-title[b-2pw1yppa6i] {
    display: flex;
    align-items: center;
    gap: var(--space-2);
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-semibold);
    color: var(--color-primary);
    text-transform: uppercase;
    letter-spacing: 0.5px;
    margin: 0 0 var(--space-4) 0;
    padding-bottom: var(--space-3);
    border-bottom: var(--border-width-thin) solid var(--border-color-light);
}

.section-title svg[b-2pw1yppa6i] {
    color: var(--color-primary);
    opacity: 0.6;
    flex-shrink: 0;
}

/* Form Grid */
.form-grid[b-2pw1yppa6i] {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: var(--space-4);
}

.form-group[b-2pw1yppa6i] {
    display: flex;
    flex-direction: column;
}

.form-group-wide[b-2pw1yppa6i] {
    grid-column: span 2;
}

.form-group-checkbox[b-2pw1yppa6i] {
    display: flex;
    align-items: center;
    padding-top: var(--space-6);
}

.form-group-checkbox .form-check-label[b-2pw1yppa6i] {
    display: flex;
    align-items: center;
    gap: var(--space-2);
    font-size: var(--font-size-sm);
    color: var(--text-secondary);
    cursor: pointer;
}

.form-group-checkbox .form-check-input[b-2pw1yppa6i] {
    width: 18px;
    height: 18px;
    accent-color: var(--color-primary);
    cursor: pointer;
}

/* Form Controls */
.form-label[b-2pw1yppa6i] {
    font-size: var(--font-size-xs);
    font-weight: var(--font-weight-medium);
    color: var(--text-secondary);
    text-transform: uppercase;
    letter-spacing: 0.3px;
    margin-bottom: var(--space-1);
}

.form-control[b-2pw1yppa6i] {
    padding: var(--space-2) var(--space-3);
    font-size: var(--font-size-sm);
    color: var(--color-gray-700);
    border: var(--border-width-thin) solid var(--border-color-light);
    background-color: var(--color-white);
    transition: border-color var(--transition-fast) var(--transition-ease);
}

.form-control:focus[b-2pw1yppa6i] {
    border-color: var(--color-primary);
    outline: none;
    box-shadow: none;
}

.form-control[b-2pw1yppa6i]::placeholder {
    color: var(--color-gray-400);
}

/* Form Actions */
.form-actions[b-2pw1yppa6i] {
    display: flex;
    justify-content: flex-end;
    gap: var(--space-3);
    padding-top: var(--space-4);
    border-top: var(--border-width-thin) solid var(--border-color-light);
}

.form-actions .btn[b-2pw1yppa6i] {
    display: inline-flex;
    align-items: center;
    gap: var(--space-2);
    padding: var(--space-2) var(--space-5);
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-medium);
    cursor: pointer;
    text-decoration: none;
}

.btn-action[b-2pw1yppa6i] {
    background-color: var(--color-action);
    color: var(--text-on-action);
    border: var(--border-width-thin) solid var(--color-action);
    transition: background-color var(--transition-fast) var(--transition-ease);
}

.btn-action:hover[b-2pw1yppa6i] {
    background-color: var(--color-action-hover);
    border-color: var(--color-action-hover);
    color: var(--text-on-action);
}

.btn-action:disabled[b-2pw1yppa6i] {
    opacity: 0.65;
    cursor: not-allowed;
}

.btn-outline-primary[b-2pw1yppa6i] {
    background: transparent;
    color: var(--color-primary);
    border: var(--border-width-thin) solid var(--color-primary);
}

.btn-outline-primary:hover[b-2pw1yppa6i] {
    background-color: var(--color-primary);
    color: var(--text-on-primary);
    text-decoration: none;
}

/* Validation */
[b-2pw1yppa6i] .validation-message {
    color: var(--color-danger);
    font-size: var(--font-size-xs);
    margin-top: 2px;
}

/* Responsive */
@media (max-width: 768px) {
    .form-grid[b-2pw1yppa6i] {
        grid-template-columns: 1fr;
    }

    .form-group-wide[b-2pw1yppa6i] {
        grid-column: span 1;
    }

    .form-actions[b-2pw1yppa6i] {
        flex-direction: column-reverse;
    }

    .form-actions .btn[b-2pw1yppa6i] {
        justify-content: center;
    }
}
/* /Components/Pages/Warehouse/ProductCustomerSupplierCreate.razor.rz.scp.css */
/* ===========================
   ProductCustomerSupplierCreate - Scoped Styles
   Flat Industrial Minimal
   =========================== */

/* Page Container */
.page-container[b-nq84byrlk1] {
    max-width: 900px;
    margin: 0 auto;
    padding: var(--space-6) var(--space-4);
}

/* Header */
.page-header[b-nq84byrlk1] {
    display: flex;
    align-items: center;
    gap: var(--space-4);
    margin-bottom: var(--space-6);
}

.btn-back[b-nq84byrlk1] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    color: var(--text-muted);
    border: var(--border-width-thin) solid var(--border-color-light);
    text-decoration: none;
    transition: all var(--transition-fast) var(--transition-ease);
    flex-shrink: 0;
}

.btn-back:hover[b-nq84byrlk1] {
    color: var(--color-primary);
    border-color: var(--color-primary);
    background-color: var(--color-gray-50);
    text-decoration: none;
}

.page-header-text[b-nq84byrlk1] {
    flex: 1;
}

.page-title[b-nq84byrlk1] {
    font-size: var(--font-size-xl);
    font-weight: var(--font-weight-bold);
    color: var(--color-primary);
    display: flex;
    align-items: center;
    gap: var(--space-2);
    margin: 0;
}

.page-title svg[b-nq84byrlk1] {
    color: var(--color-primary);
    flex-shrink: 0;
}

.page-subtitle[b-nq84byrlk1] {
    color: var(--text-muted);
    font-size: var(--font-size-sm);
    margin: 2px 0 0 0;
    display: flex;
    align-items: center;
    gap: var(--space-2);
}

.subtitle-code[b-nq84byrlk1] {
    font-family: var(--font-mono);
    font-size: var(--font-size-xs);
    color: var(--color-primary);
    opacity: 0.6;
    padding: 1px var(--space-2);
    background-color: var(--color-gray-100);
}

/* Alert Bar */
.alert-bar[b-nq84byrlk1] {
    display: flex;
    align-items: center;
    gap: var(--space-2);
    padding: var(--space-3) var(--space-4);
    margin-bottom: var(--space-4);
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-medium);
    border-left: var(--border-width-thick) solid;
}

.alert-bar-danger[b-nq84byrlk1] {
    background-color: #fdeded;
    border-left-color: var(--color-danger);
    color: #5f2120;
}

.alert-bar-close[b-nq84byrlk1] {
    margin-left: auto;
    background: none;
    border: none;
    font-size: var(--font-size-lg);
    cursor: pointer;
    color: inherit;
    opacity: 0.6;
    line-height: 1;
}

.alert-bar-close:hover[b-nq84byrlk1] {
    opacity: 1;
}

/* Form Sections */
.form-section[b-nq84byrlk1] {
    margin-bottom: var(--space-6);
    padding: var(--space-5);
    background-color: var(--color-white);
    border: var(--border-width-thin) solid var(--border-color-light);
}

.section-title[b-nq84byrlk1] {
    display: flex;
    align-items: center;
    gap: var(--space-2);
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-semibold);
    color: var(--color-primary);
    text-transform: uppercase;
    letter-spacing: 0.5px;
    margin: 0 0 var(--space-4) 0;
    padding-bottom: var(--space-3);
    border-bottom: var(--border-width-thin) solid var(--border-color-light);
}

.section-title svg[b-nq84byrlk1] {
    color: var(--color-primary);
    opacity: 0.6;
    flex-shrink: 0;
}

/* Form Grid */
.form-grid[b-nq84byrlk1] {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: var(--space-4);
}

.form-group[b-nq84byrlk1] {
    display: flex;
    flex-direction: column;
}

.form-group-wide[b-nq84byrlk1] {
    grid-column: span 2;
}

/* Form Controls */
.form-label[b-nq84byrlk1] {
    font-size: var(--font-size-xs);
    font-weight: var(--font-weight-medium);
    color: var(--text-secondary);
    text-transform: uppercase;
    letter-spacing: 0.3px;
    margin-bottom: var(--space-1);
}

.form-control[b-nq84byrlk1] {
    padding: var(--space-2) var(--space-3);
    font-size: var(--font-size-sm);
    color: var(--color-gray-700);
    border: var(--border-width-thin) solid var(--border-color-light);
    background-color: var(--color-white);
    transition: border-color var(--transition-fast) var(--transition-ease);
}

.form-control:focus[b-nq84byrlk1] {
    border-color: var(--color-primary);
    outline: none;
    box-shadow: none;
}

.form-control[b-nq84byrlk1]::placeholder {
    color: var(--color-gray-400);
}

.form-control-static[b-nq84byrlk1] {
    padding: var(--space-2) var(--space-3);
    font-size: var(--font-size-sm);
    color: var(--text-muted);
    background-color: var(--color-gray-50);
    border: var(--border-width-thin) solid var(--border-color-light);
    font-family: var(--font-mono);
}

/* Form Actions */
.form-actions[b-nq84byrlk1] {
    display: flex;
    justify-content: flex-end;
    gap: var(--space-3);
    padding-top: var(--space-4);
    border-top: var(--border-width-thin) solid var(--border-color-light);
}

.form-actions .btn[b-nq84byrlk1] {
    display: inline-flex;
    align-items: center;
    gap: var(--space-2);
    padding: var(--space-2) var(--space-5);
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-medium);
    cursor: pointer;
    text-decoration: none;
}

.btn-action[b-nq84byrlk1] {
    background-color: var(--color-action);
    color: var(--text-on-action);
    border: var(--border-width-thin) solid var(--color-action);
    transition: background-color var(--transition-fast) var(--transition-ease);
}

.btn-action:hover[b-nq84byrlk1] {
    background-color: var(--color-action-hover);
    border-color: var(--color-action-hover);
    color: var(--text-on-action);
}

.btn-action:disabled[b-nq84byrlk1] {
    opacity: 0.65;
    cursor: not-allowed;
}

.btn-outline-primary[b-nq84byrlk1] {
    background: transparent;
    color: var(--color-primary);
    border: var(--border-width-thin) solid var(--color-primary);
}

.btn-outline-primary:hover[b-nq84byrlk1] {
    background-color: var(--color-primary);
    color: var(--text-on-primary);
    text-decoration: none;
}

/* Validation */
[b-nq84byrlk1] .validation-message {
    color: var(--color-danger);
    font-size: var(--font-size-xs);
    margin-top: 2px;
}

/* Responsive */
@media (max-width: 768px) {
    .form-grid[b-nq84byrlk1] {
        grid-template-columns: 1fr;
    }

    .form-group-wide[b-nq84byrlk1] {
        grid-column: span 1;
    }

    .form-actions[b-nq84byrlk1] {
        flex-direction: column-reverse;
    }

    .form-actions .btn[b-nq84byrlk1] {
        justify-content: center;
    }
}
/* /Components/Pages/Warehouse/ProductCustomerSupplierEdit.razor.rz.scp.css */
/* ===========================
   ProductCustomerSupplierEdit - Scoped Styles
   Flat Industrial Minimal
   =========================== */

/* Page Container */
.page-container[b-sdu1k01opl] {
    max-width: 900px;
    margin: 0 auto;
    padding: var(--space-6) var(--space-4);
}

/* Header */
.page-header[b-sdu1k01opl] {
    display: flex;
    align-items: center;
    gap: var(--space-4);
    margin-bottom: var(--space-6);
}

.btn-back[b-sdu1k01opl] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    color: var(--text-muted);
    border: var(--border-width-thin) solid var(--border-color-light);
    text-decoration: none;
    transition: all var(--transition-fast) var(--transition-ease);
    flex-shrink: 0;
}

.btn-back:hover[b-sdu1k01opl] {
    color: var(--color-primary);
    border-color: var(--color-primary);
    background-color: var(--color-gray-50);
    text-decoration: none;
}

.page-header-text[b-sdu1k01opl] {
    flex: 1;
}

.page-title[b-sdu1k01opl] {
    font-size: var(--font-size-xl);
    font-weight: var(--font-weight-bold);
    color: var(--color-primary);
    display: flex;
    align-items: center;
    gap: var(--space-2);
    margin: 0;
}

.page-title svg[b-sdu1k01opl] {
    color: var(--color-primary);
    flex-shrink: 0;
}

.page-subtitle[b-sdu1k01opl] {
    color: var(--text-muted);
    font-size: var(--font-size-sm);
    margin: 2px 0 0 0;
    display: flex;
    align-items: center;
    gap: var(--space-2);
}

.subtitle-code[b-sdu1k01opl] {
    font-family: var(--font-mono);
    font-size: var(--font-size-xs);
    color: var(--color-primary);
    opacity: 0.6;
    padding: 1px var(--space-2);
    background-color: var(--color-gray-100);
}

/* Alert Bar */
.alert-bar[b-sdu1k01opl] {
    display: flex;
    align-items: center;
    gap: var(--space-2);
    padding: var(--space-3) var(--space-4);
    margin-bottom: var(--space-4);
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-medium);
    border-left: var(--border-width-thick) solid;
}

.alert-bar-danger[b-sdu1k01opl] {
    background-color: #fdeded;
    border-left-color: var(--color-danger);
    color: #5f2120;
}

.alert-bar-close[b-sdu1k01opl] {
    margin-left: auto;
    background: none;
    border: none;
    font-size: var(--font-size-lg);
    cursor: pointer;
    color: inherit;
    opacity: 0.6;
    line-height: 1;
}

.alert-bar-close:hover[b-sdu1k01opl] {
    opacity: 1;
}

/* Loading / Empty States */
.loading-state[b-sdu1k01opl] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: var(--space-16) 0;
    color: var(--text-muted);
    gap: var(--space-4);
}

.empty-state[b-sdu1k01opl] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: var(--space-16) 0;
    color: var(--text-muted);
    gap: var(--space-3);
}

.empty-state svg[b-sdu1k01opl] {
    opacity: 0.4;
}

.empty-state-text[b-sdu1k01opl] {
    font-size: var(--font-size-base);
    margin: 0;
}

/* Form Sections */
.form-section[b-sdu1k01opl] {
    margin-bottom: var(--space-6);
    padding: var(--space-5);
    background-color: var(--color-white);
    border: var(--border-width-thin) solid var(--border-color-light);
}

.section-title[b-sdu1k01opl] {
    display: flex;
    align-items: center;
    gap: var(--space-2);
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-semibold);
    color: var(--color-primary);
    text-transform: uppercase;
    letter-spacing: 0.5px;
    margin: 0 0 var(--space-4) 0;
    padding-bottom: var(--space-3);
    border-bottom: var(--border-width-thin) solid var(--border-color-light);
}

.section-title svg[b-sdu1k01opl] {
    color: var(--color-primary);
    opacity: 0.6;
    flex-shrink: 0;
}

/* Form Grid */
.form-grid[b-sdu1k01opl] {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: var(--space-4);
}

.form-group[b-sdu1k01opl] {
    display: flex;
    flex-direction: column;
}

.form-group-wide[b-sdu1k01opl] {
    grid-column: span 2;
}

/* Form Controls */
.form-label[b-sdu1k01opl] {
    font-size: var(--font-size-xs);
    font-weight: var(--font-weight-medium);
    color: var(--text-secondary);
    text-transform: uppercase;
    letter-spacing: 0.3px;
    margin-bottom: var(--space-1);
}

.form-control[b-sdu1k01opl] {
    padding: var(--space-2) var(--space-3);
    font-size: var(--font-size-sm);
    color: var(--color-gray-700);
    border: var(--border-width-thin) solid var(--border-color-light);
    background-color: var(--color-white);
    transition: border-color var(--transition-fast) var(--transition-ease);
}

.form-control:focus[b-sdu1k01opl] {
    border-color: var(--color-primary);
    outline: none;
    box-shadow: none;
}

.form-control[b-sdu1k01opl]::placeholder {
    color: var(--color-gray-400);
}

.form-control-static[b-sdu1k01opl] {
    padding: var(--space-2) var(--space-3);
    font-size: var(--font-size-sm);
    color: var(--text-muted);
    background-color: var(--color-gray-50);
    border: var(--border-width-thin) solid var(--border-color-light);
    font-family: var(--font-mono);
}

/* Form Actions */
.form-actions[b-sdu1k01opl] {
    display: flex;
    justify-content: flex-end;
    gap: var(--space-3);
    padding-top: var(--space-4);
    border-top: var(--border-width-thin) solid var(--border-color-light);
}

.form-actions .btn[b-sdu1k01opl] {
    display: inline-flex;
    align-items: center;
    gap: var(--space-2);
    padding: var(--space-2) var(--space-5);
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-medium);
    cursor: pointer;
    text-decoration: none;
}

.btn-action[b-sdu1k01opl] {
    background-color: var(--color-action);
    color: var(--text-on-action);
    border: var(--border-width-thin) solid var(--color-action);
    transition: background-color var(--transition-fast) var(--transition-ease);
}

.btn-action:hover[b-sdu1k01opl] {
    background-color: var(--color-action-hover);
    border-color: var(--color-action-hover);
    color: var(--text-on-action);
}

.btn-action:disabled[b-sdu1k01opl] {
    opacity: 0.65;
    cursor: not-allowed;
}

.btn-outline-primary[b-sdu1k01opl] {
    background: transparent;
    color: var(--color-primary);
    border: var(--border-width-thin) solid var(--color-primary);
}

.btn-outline-primary:hover[b-sdu1k01opl] {
    background-color: var(--color-primary);
    color: var(--text-on-primary);
    text-decoration: none;
}

/* Validation */
[b-sdu1k01opl] .validation-message {
    color: var(--color-danger);
    font-size: var(--font-size-xs);
    margin-top: 2px;
}

/* Responsive */
@media (max-width: 768px) {
    .form-grid[b-sdu1k01opl] {
        grid-template-columns: 1fr;
    }

    .form-group-wide[b-sdu1k01opl] {
        grid-column: span 1;
    }

    .form-actions[b-sdu1k01opl] {
        flex-direction: column-reverse;
    }

    .form-actions .btn[b-sdu1k01opl] {
        justify-content: center;
    }
}
/* /Components/Pages/Warehouse/ProductCustomerSupplierList.razor.rz.scp.css */
/* ===========================
   ProductCustomerSupplierList - Scoped Styles
   Flat Industrial Minimal
   =========================== */

/* Page Container */
.page-container[b-wx34x8yd10] {
    max-width: 1200px;
    margin: 0 auto;
    padding: var(--space-6) var(--space-4);
}

/* Header */
.page-header[b-wx34x8yd10] {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    margin-bottom: var(--space-6);
    gap: var(--space-4);
}

.page-header-left[b-wx34x8yd10] {
    flex: 1;
}

.page-header-right[b-wx34x8yd10] {
    flex-shrink: 0;
}

.page-header-nav[b-wx34x8yd10] {
    display: flex;
    align-items: center;
    gap: var(--space-4);
}

.btn-back[b-wx34x8yd10] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    color: var(--text-muted);
    border: var(--border-width-thin) solid var(--border-color-light);
    text-decoration: none;
    transition: all var(--transition-fast) var(--transition-ease);
    flex-shrink: 0;
}

.btn-back:hover[b-wx34x8yd10] {
    color: var(--color-primary);
    border-color: var(--color-primary);
    background-color: var(--color-gray-50);
    text-decoration: none;
}

.page-title[b-wx34x8yd10] {
    font-size: var(--font-size-2xl);
    font-weight: var(--font-weight-bold);
    color: var(--color-primary);
    display: flex;
    align-items: center;
    gap: var(--space-2);
    margin: 0;
}

.page-title svg[b-wx34x8yd10] {
    color: var(--color-primary);
    flex-shrink: 0;
}

.page-subtitle[b-wx34x8yd10] {
    color: var(--text-muted);
    font-size: var(--font-size-sm);
    margin: var(--space-1) 0 0 0;
}

.subtitle-code[b-wx34x8yd10] {
    font-family: var(--font-mono);
    font-size: var(--font-size-xs);
    color: var(--color-primary);
    opacity: 0.6;
    padding: 1px var(--space-2);
    background-color: var(--color-gray-100);
}

/* Action Button */
.btn-action[b-wx34x8yd10] {
    display: inline-flex;
    align-items: center;
    gap: var(--space-2);
    padding: var(--space-2) var(--space-4);
    background-color: var(--color-action);
    color: var(--text-on-action);
    border: var(--border-width-thin) solid var(--color-action);
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-medium);
    text-decoration: none;
    cursor: pointer;
    transition: background-color var(--transition-fast) var(--transition-ease),
                box-shadow var(--transition-fast) var(--transition-ease);
}

.btn-action:hover[b-wx34x8yd10] {
    background-color: var(--color-action-hover);
    border-color: var(--color-action-hover);
    color: var(--text-on-action);
    text-decoration: none;
    box-shadow: var(--shadow-sm);
}

.btn-action:active[b-wx34x8yd10] {
    background-color: var(--color-action-active);
}

.btn-action:disabled[b-wx34x8yd10] {
    opacity: 0.65;
    cursor: not-allowed;
}

/* Alert Bars */
.alert-bar[b-wx34x8yd10] {
    display: flex;
    align-items: center;
    gap: var(--space-2);
    padding: var(--space-3) var(--space-4);
    margin-bottom: var(--space-4);
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-medium);
    border-left: var(--border-width-thick) solid;
}

.alert-bar-success[b-wx34x8yd10] {
    background-color: #edf7ed;
    border-left-color: var(--color-success);
    color: #1e4620;
}

.alert-bar-danger[b-wx34x8yd10] {
    background-color: #fdeded;
    border-left-color: var(--color-danger);
    color: #5f2120;
}

.alert-bar-close[b-wx34x8yd10] {
    margin-left: auto;
    background: none;
    border: none;
    font-size: var(--font-size-lg);
    cursor: pointer;
    color: inherit;
    opacity: 0.6;
    line-height: 1;
}

.alert-bar-close:hover[b-wx34x8yd10] {
    opacity: 1;
}

/* Search Bar */
.search-bar[b-wx34x8yd10] {
    display: flex;
    align-items: center;
    gap: var(--space-4);
    margin-bottom: var(--space-4);
    padding: var(--space-3) var(--space-4);
    background-color: var(--bg-secondary);
    border: var(--border-width-thin) solid var(--border-color-light);
}

.search-input-wrapper[b-wx34x8yd10] {
    display: flex;
    align-items: center;
    flex: 1;
    position: relative;
}

.search-icon[b-wx34x8yd10] {
    color: var(--text-muted);
    flex-shrink: 0;
    margin-right: var(--space-2);
}

.search-input[b-wx34x8yd10] {
    flex: 1;
    border: none;
    background: transparent;
    font-size: var(--font-size-sm);
    color: var(--color-gray-700);
    outline: none;
    padding: var(--space-1) 0;
}

.search-input[b-wx34x8yd10]::placeholder {
    color: var(--text-muted);
}

.search-clear[b-wx34x8yd10] {
    background: none;
    border: none;
    cursor: pointer;
    color: var(--text-muted);
    padding: var(--space-1);
    display: flex;
    align-items: center;
}

.search-clear:hover[b-wx34x8yd10] {
    color: var(--color-primary);
}

.search-count[b-wx34x8yd10] {
    flex-shrink: 0;
    font-size: var(--font-size-xs);
    color: var(--text-muted);
    font-weight: var(--font-weight-medium);
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

/* Loading / Empty States */
.loading-state[b-wx34x8yd10] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: var(--space-16) 0;
    color: var(--text-muted);
    gap: var(--space-4);
}

.empty-state[b-wx34x8yd10] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: var(--space-16) 0;
    color: var(--text-muted);
    gap: var(--space-3);
}

.empty-state svg[b-wx34x8yd10] {
    opacity: 0.4;
}

.empty-state-text[b-wx34x8yd10] {
    font-size: var(--font-size-base);
    margin: 0;
}

/* Contact List */
.contact-list[b-wx34x8yd10] {
    display: flex;
    flex-direction: column;
    border: var(--border-width-thin) solid var(--border-color-light);
}

/* Contact Row */
.contact-row[b-wx34x8yd10] {
    display: flex;
    align-items: center;
    gap: var(--space-4);
    padding: var(--space-4);
    border-bottom: var(--border-width-thin) solid var(--border-color-light);
    transition: background-color var(--transition-fast) var(--transition-ease);
}

.contact-row:last-child[b-wx34x8yd10] {
    border-bottom: none;
}

.contact-row:hover[b-wx34x8yd10] {
    background-color: rgba(11, 36, 62, 0.03);
}

/* Avatar */
.contact-avatar[b-wx34x8yd10] {
    flex-shrink: 0;
    width: 40px;
    height: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: var(--color-gray-100);
    color: var(--color-primary);
}

/* Contact Info */
.contact-info[b-wx34x8yd10] {
    flex: 1;
    min-width: 0;
}

.contact-name[b-wx34x8yd10] {
    font-size: var(--font-size-base);
    font-weight: var(--font-weight-semibold);
    color: var(--color-primary);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.contact-meta[b-wx34x8yd10] {
    display: flex;
    align-items: center;
    gap: var(--space-1);
    flex-wrap: wrap;
    font-size: var(--font-size-xs);
    color: var(--text-secondary);
    margin-top: 2px;
}

.contact-code[b-wx34x8yd10] {
    font-family: var(--font-mono);
    font-weight: var(--font-weight-medium);
    color: var(--color-primary);
    opacity: 0.7;
}

.meta-separator[b-wx34x8yd10] {
    color: var(--color-gray-300);
}

.contact-details[b-wx34x8yd10] {
    display: flex;
    align-items: center;
    gap: var(--space-4);
    margin-top: var(--space-1);
}

.contact-detail-item[b-wx34x8yd10] {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    font-size: var(--font-size-xs);
    color: var(--text-muted);
}

.contact-detail-item svg[b-wx34x8yd10] {
    flex-shrink: 0;
}

/* Badges */
.contact-badges[b-wx34x8yd10] {
    flex-shrink: 0;
    display: flex;
    gap: var(--space-2);
}

.badge[b-wx34x8yd10] {
    display: inline-flex;
    align-items: center;
    padding: 3px var(--space-2);
    font-size: var(--font-size-xs);
    font-weight: var(--font-weight-medium);
    letter-spacing: 0.3px;
    text-transform: uppercase;
}

.badge-primary[b-wx34x8yd10] {
    background-color: rgba(11, 36, 62, 0.1);
    color: var(--color-primary);
}

.badge-info[b-wx34x8yd10] {
    background-color: rgba(23, 162, 184, 0.1);
    color: var(--color-info);
}

.badge-danger[b-wx34x8yd10] {
    background-color: rgba(178, 34, 34, 0.1);
    color: var(--color-action);
}

/* Action Buttons */
.contact-actions[b-wx34x8yd10] {
    flex-shrink: 0;
    display: flex;
    align-items: center;
    gap: var(--space-1);
}

.btn-icon[b-wx34x8yd10] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 36px;
    background: none;
    border: var(--border-width-thin) solid transparent;
    cursor: pointer;
    color: var(--text-muted);
    text-decoration: none;
    transition: all var(--transition-fast) var(--transition-ease);
}

.btn-icon:hover[b-wx34x8yd10] {
    color: var(--color-primary);
    background-color: var(--color-gray-100);
    border-color: var(--border-color-light);
    text-decoration: none;
}

.btn-icon-danger:hover[b-wx34x8yd10] {
    color: var(--color-action);
    background-color: rgba(178, 34, 34, 0.06);
    border-color: rgba(178, 34, 34, 0.2);
}

/* Overlay & Dialog */
.overlay[b-wx34x8yd10] {
    position: fixed;
    inset: 0;
    background-color: rgba(0, 0, 0, 0.4);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: var(--z-modal-backdrop);
}

.confirm-dialog[b-wx34x8yd10] {
    background-color: var(--color-white);
    padding: var(--space-8);
    max-width: 420px;
    width: 90%;
    box-shadow: var(--shadow-xl);
    text-align: center;
    z-index: var(--z-modal);
}

.confirm-icon[b-wx34x8yd10] {
    color: var(--color-action);
    margin-bottom: var(--space-4);
}

.confirm-dialog h3[b-wx34x8yd10] {
    font-size: var(--font-size-lg);
    font-weight: var(--font-weight-semibold);
    color: var(--color-primary);
    margin: 0 0 var(--space-2) 0;
}

.confirm-dialog p[b-wx34x8yd10] {
    font-size: var(--font-size-sm);
    color: var(--text-secondary);
    margin: 0 0 var(--space-2) 0;
}

.confirm-warning[b-wx34x8yd10] {
    font-size: var(--font-size-xs) !important;
    color: var(--color-action) !important;
    font-weight: var(--font-weight-medium);
}

.confirm-actions[b-wx34x8yd10] {
    display: flex;
    gap: var(--space-3);
    justify-content: center;
    margin-top: var(--space-6);
}

.confirm-actions .btn[b-wx34x8yd10] {
    min-width: 100px;
    padding: var(--space-2) var(--space-4);
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-medium);
    cursor: pointer;
}

/* Outline Primary Button */
.btn-outline-primary[b-wx34x8yd10] {
    background: transparent;
    color: var(--color-primary);
    border: var(--border-width-thin) solid var(--color-primary);
}

.btn-outline-primary:hover[b-wx34x8yd10] {
    background-color: var(--color-primary);
    color: var(--text-on-primary);
}

/* Responsive */
@media (max-width: 768px) {
    .page-header[b-wx34x8yd10] {
        flex-direction: column;
        gap: var(--space-3);
    }

    .contact-row[b-wx34x8yd10] {
        flex-wrap: wrap;
    }

    .contact-badges[b-wx34x8yd10] {
        order: 5;
    }

    .contact-actions[b-wx34x8yd10] {
        order: 6;
        margin-left: auto;
    }

    .contact-details[b-wx34x8yd10] {
        flex-wrap: wrap;
    }
}
/* /Components/Pages/Warehouse/ProductEdit.razor.rz.scp.css */
/* ===========================
   ContactEdit - Scoped Styles
   Reuses same patterns as ContactCreate
   =========================== */

/* Page Container */
.page-container[b-q33dan0fo7] {
    max-width: 900px;
    margin: 0 auto;
    padding: var(--space-6) var(--space-4);
}

/* Header */
.page-header[b-q33dan0fo7] {
    display: flex;
    align-items: center;
    gap: var(--space-4);
    margin-bottom: var(--space-6);
}

.btn-back[b-q33dan0fo7] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    color: var(--text-muted);
    border: var(--border-width-thin) solid var(--border-color-light);
    text-decoration: none;
    transition: all var(--transition-fast) var(--transition-ease);
    flex-shrink: 0;
}

.btn-back:hover[b-q33dan0fo7] {
    color: var(--color-primary);
    border-color: var(--color-primary);
    background-color: var(--color-gray-50);
    text-decoration: none;
}

.page-header-text[b-q33dan0fo7] {
    flex: 1;
}

.page-title[b-q33dan0fo7] {
    font-size: var(--font-size-xl);
    font-weight: var(--font-weight-bold);
    color: var(--color-primary);
    display: flex;
    align-items: center;
    gap: var(--space-2);
    margin: 0;
}

.page-title svg[b-q33dan0fo7] {
    color: var(--color-primary);
    flex-shrink: 0;
}

.page-subtitle[b-q33dan0fo7] {
    color: var(--text-muted);
    font-size: var(--font-size-sm);
    margin: 2px 0 0 0;
    display: flex;
    align-items: center;
    gap: var(--space-2);
}

.subtitle-code[b-q33dan0fo7] {
    font-family: var(--font-mono);
    font-size: var(--font-size-xs);
    color: var(--color-primary);
    opacity: 0.6;
    padding: 1px var(--space-2);
    background-color: var(--color-gray-100);
}

/* Alert Bar */
.alert-bar[b-q33dan0fo7] {
    display: flex;
    align-items: center;
    gap: var(--space-2);
    padding: var(--space-3) var(--space-4);
    margin-bottom: var(--space-4);
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-medium);
    border-left: var(--border-width-thick) solid;
}

.alert-bar-danger[b-q33dan0fo7] {
    background-color: #fdeded;
    border-left-color: var(--color-danger);
    color: #5f2120;
}

.alert-bar-close[b-q33dan0fo7] {
    margin-left: auto;
    background: none;
    border: none;
    font-size: var(--font-size-lg);
    cursor: pointer;
    color: inherit;
    opacity: 0.6;
    line-height: 1;
}

.alert-bar-close:hover[b-q33dan0fo7] {
    opacity: 1;
}

/* Loading / Empty States */
.loading-state[b-q33dan0fo7] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: var(--space-16) 0;
    color: var(--text-muted);
    gap: var(--space-4);
}

.empty-state[b-q33dan0fo7] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: var(--space-16) 0;
    color: var(--text-muted);
    gap: var(--space-3);
}

.empty-state svg[b-q33dan0fo7] {
    opacity: 0.4;
}

.empty-state-text[b-q33dan0fo7] {
    font-size: var(--font-size-base);
    margin: 0;
}

/* Form Sections */
.form-section[b-q33dan0fo7] {
    margin-bottom: var(--space-6);
    padding: var(--space-5);
    background-color: var(--color-white);
    border: var(--border-width-thin) solid var(--border-color-light);
}

.section-title[b-q33dan0fo7] {
    display: flex;
    align-items: center;
    gap: var(--space-2);
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-semibold);
    color: var(--color-primary);
    text-transform: uppercase;
    letter-spacing: 0.5px;
    margin: 0 0 var(--space-4) 0;
    padding-bottom: var(--space-3);
    border-bottom: var(--border-width-thin) solid var(--border-color-light);
}

.section-title svg[b-q33dan0fo7] {
    color: var(--color-primary);
    opacity: 0.6;
    flex-shrink: 0;
}

/* Collapsible Sections */
.section-title-collapsible[b-q33dan0fo7] {
    cursor: pointer;
    user-select: none;
}

.section-title-collapsible:hover[b-q33dan0fo7] {
    color: var(--color-primary-dark, var(--color-primary));
}

.section-chevron[b-q33dan0fo7] {
    margin-left: auto;
    transition: transform var(--transition-fast) var(--transition-ease);
    opacity: 0.4;
}

.section-title-collapsible:hover .section-chevron[b-q33dan0fo7] {
    opacity: 0.8;
}

.section-collapsed .section-chevron[b-q33dan0fo7] {
    transform: rotate(-90deg);
}

.section-collapsed .form-grid[b-q33dan0fo7],
.section-collapsed .nav-links[b-q33dan0fo7] {
    display: none;
}

.section-collapsed .section-title[b-q33dan0fo7] {
    margin-bottom: 0;
    padding-bottom: 0;
    border-bottom: none;
}

/* Checkbox Wrapper */
.form-check-wrapper[b-q33dan0fo7] {
    display: flex;
    align-items: center;
    gap: var(--space-2);
    padding: var(--space-2) 0;
}

.form-check-wrapper .form-check-input[b-q33dan0fo7] {
    width: 16px;
    height: 16px;
    cursor: pointer;
    accent-color: var(--color-primary);
}

.form-check-label[b-q33dan0fo7] {
    font-size: var(--font-size-sm);
    color: var(--color-gray-600);
    cursor: pointer;
}

/* Textarea */
.form-control-textarea[b-q33dan0fo7] {
    resize: vertical;
    min-height: 60px;
}

/* Form Grid */
.form-grid[b-q33dan0fo7] {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: var(--space-4);
}

.form-group[b-q33dan0fo7] {
    display: flex;
    flex-direction: column;
}

.form-group-wide[b-q33dan0fo7] {
    grid-column: span 2;
}

.form-group-full[b-q33dan0fo7] {
    grid-column: 1 / -1;
}

/* Form Controls */
.form-label[b-q33dan0fo7] {
    font-size: var(--font-size-xs);
    font-weight: var(--font-weight-medium);
    color: var(--text-secondary);
    text-transform: uppercase;
    letter-spacing: 0.3px;
    margin-bottom: var(--space-1);
}

.form-control[b-q33dan0fo7] {
    padding: var(--space-2) var(--space-3);
    font-size: var(--font-size-sm);
    color: var(--color-gray-700);
    border: var(--border-width-thin) solid var(--border-color-light);
    background-color: var(--color-white);
    transition: border-color var(--transition-fast) var(--transition-ease);
}

.form-control:focus[b-q33dan0fo7] {
    border-color: var(--color-primary);
    outline: none;
    box-shadow: none;
}

.form-control[b-q33dan0fo7]::placeholder {
    color: var(--color-gray-400);
}

.form-control-static[b-q33dan0fo7] {
    padding: var(--space-2) var(--space-3);
    font-size: var(--font-size-sm);
    color: var(--text-muted);
    background-color: var(--color-gray-50);
    border: var(--border-width-thin) solid var(--border-color-light);
    font-family: var(--font-mono);
}

/* Form Actions */
.form-actions[b-q33dan0fo7] {
    display: flex;
    justify-content: flex-end;
    gap: var(--space-3);
    padding-top: var(--space-4);
    border-top: var(--border-width-thin) solid var(--border-color-light);
}

.form-actions .btn[b-q33dan0fo7] {
    display: inline-flex;
    align-items: center;
    gap: var(--space-2);
    padding: var(--space-2) var(--space-5);
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-medium);
    cursor: pointer;
    text-decoration: none;
}

.btn-action[b-q33dan0fo7] {
    background-color: var(--color-action);
    color: var(--text-on-action);
    border: var(--border-width-thin) solid var(--color-action);
    transition: background-color var(--transition-fast) var(--transition-ease);
}

.btn-action:hover[b-q33dan0fo7] {
    background-color: var(--color-action-hover);
    border-color: var(--color-action-hover);
    color: var(--text-on-action);
}

.btn-action:disabled[b-q33dan0fo7] {
    opacity: 0.65;
    cursor: not-allowed;
}

.btn-outline-primary[b-q33dan0fo7] {
    background: transparent;
    color: var(--color-primary);
    border: var(--border-width-thin) solid var(--color-primary);
}

.btn-outline-primary:hover[b-q33dan0fo7] {
    background-color: var(--color-primary);
    color: var(--text-on-primary);
    text-decoration: none;
}

/* Navigation Links */
.nav-links[b-q33dan0fo7] {
    display: flex;
    flex-direction: column;
    gap: var(--space-2);
}

.nav-link-card[b-q33dan0fo7] {
    display: flex;
    align-items: center;
    gap: var(--space-4);
    padding: var(--space-3) var(--space-4);
    border: var(--border-width-thin) solid var(--border-color-light);
    background-color: var(--color-gray-50);
    text-decoration: none;
    color: inherit;
    transition: all var(--transition-fast) var(--transition-ease);
}

.nav-link-card:hover[b-q33dan0fo7] {
    border-color: var(--color-primary);
    background-color: var(--color-white);
    text-decoration: none;
}

.nav-link-icon[b-q33dan0fo7] {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    color: var(--color-primary);
    background-color: var(--color-white);
    border: var(--border-width-thin) solid var(--border-color-light);
    flex-shrink: 0;
}

.nav-link-card:hover .nav-link-icon[b-q33dan0fo7] {
    background-color: var(--color-primary);
    border-color: var(--color-primary);
    color: var(--text-on-primary);
}

.nav-link-text[b-q33dan0fo7] {
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.nav-link-title[b-q33dan0fo7] {
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-semibold);
    color: var(--color-gray-700);
}

.nav-link-description[b-q33dan0fo7] {
    font-size: var(--font-size-xs);
    color: var(--text-muted);
}

.nav-link-arrow[b-q33dan0fo7] {
    color: var(--color-gray-400);
    flex-shrink: 0;
    transition: transform var(--transition-fast) var(--transition-ease);
}

.nav-link-card:hover .nav-link-arrow[b-q33dan0fo7] {
    color: var(--color-primary);
    transform: translateX(2px);
}

/* Validation */
[b-q33dan0fo7] .validation-message {
    color: var(--color-danger);
    font-size: var(--font-size-xs);
    margin-top: 2px;
}

/* Responsive */
@media (max-width: 768px) {
    .form-grid[b-q33dan0fo7] {
        grid-template-columns: 1fr;
    }

    .form-group-wide[b-q33dan0fo7] {
        grid-column: span 1;
    }

    .form-actions[b-q33dan0fo7] {
        flex-direction: column-reverse;
    }

    .form-actions .btn[b-q33dan0fo7] {
        justify-content: center;
    }
}
/* /Components/Pages/Warehouse/ProductGroupCreate.razor.rz.scp.css */
/* ===========================
   ProductGroupCreate - Scoped Styles
   Flat Industrial Minimal
   =========================== */

.page-container[b-bddbhbqohw] { max-width: 900px; margin: 0 auto; padding: var(--space-6) var(--space-4); }
.page-header[b-bddbhbqohw] { display: flex; align-items: center; gap: var(--space-4); margin-bottom: var(--space-6); }
.btn-back[b-bddbhbqohw] { display: inline-flex; align-items: center; justify-content: center; width: 40px; height: 40px; color: var(--text-muted); border: var(--border-width-thin) solid var(--border-color-light); text-decoration: none; transition: all var(--transition-fast) var(--transition-ease); flex-shrink: 0; }
.btn-back:hover[b-bddbhbqohw] { color: var(--color-primary); border-color: var(--color-primary); background-color: var(--color-gray-50); text-decoration: none; }
.page-header-text[b-bddbhbqohw] { flex: 1; }
.page-title[b-bddbhbqohw] { font-size: var(--font-size-xl); font-weight: var(--font-weight-bold); color: var(--color-primary); display: flex; align-items: center; gap: var(--space-2); margin: 0; }
.page-title svg[b-bddbhbqohw] { color: var(--color-primary); flex-shrink: 0; }
.page-subtitle[b-bddbhbqohw] { color: var(--text-muted); font-size: var(--font-size-sm); margin: 2px 0 0 0; }

.alert-bar[b-bddbhbqohw] { display: flex; align-items: center; gap: var(--space-2); padding: var(--space-3) var(--space-4); margin-bottom: var(--space-4); font-size: var(--font-size-sm); font-weight: var(--font-weight-medium); border-left: var(--border-width-thick) solid; }
.alert-bar-danger[b-bddbhbqohw] { background-color: #fdeded; border-left-color: var(--color-danger); color: #5f2120; }
.alert-bar-close[b-bddbhbqohw] { margin-left: auto; background: none; border: none; font-size: var(--font-size-lg); cursor: pointer; color: inherit; opacity: 0.6; line-height: 1; }
.alert-bar-close:hover[b-bddbhbqohw] { opacity: 1; }

.form-section[b-bddbhbqohw] { margin-bottom: var(--space-6); padding: var(--space-5); background-color: var(--color-white); border: var(--border-width-thin) solid var(--border-color-light); }
.section-title[b-bddbhbqohw] { display: flex; align-items: center; gap: var(--space-2); font-size: var(--font-size-sm); font-weight: var(--font-weight-semibold); color: var(--color-primary); text-transform: uppercase; letter-spacing: 0.5px; margin: 0 0 var(--space-4) 0; padding-bottom: var(--space-3); border-bottom: var(--border-width-thin) solid var(--border-color-light); }
.section-title svg[b-bddbhbqohw] { color: var(--color-primary); opacity: 0.6; flex-shrink: 0; }

.form-grid[b-bddbhbqohw] { display: grid; grid-template-columns: repeat(3, 1fr); gap: var(--space-4); }
.form-group[b-bddbhbqohw] { display: flex; flex-direction: column; }
.form-group-wide[b-bddbhbqohw] { grid-column: span 2; }
.form-label[b-bddbhbqohw] { font-size: var(--font-size-xs); font-weight: var(--font-weight-medium); color: var(--text-secondary); text-transform: uppercase; letter-spacing: 0.3px; margin-bottom: var(--space-1); }
.form-control[b-bddbhbqohw] { padding: var(--space-2) var(--space-3); font-size: var(--font-size-sm); color: var(--color-gray-700); border: var(--border-width-thin) solid var(--border-color-light); background-color: var(--color-white); transition: border-color var(--transition-fast) var(--transition-ease); }
.form-control:focus[b-bddbhbqohw] { border-color: var(--color-primary); outline: none; box-shadow: none; }
.form-control[b-bddbhbqohw]::placeholder { color: var(--color-gray-400); }

.form-actions[b-bddbhbqohw] { display: flex; justify-content: flex-end; gap: var(--space-3); padding-top: var(--space-4); border-top: var(--border-width-thin) solid var(--border-color-light); }
.form-actions .btn[b-bddbhbqohw] { display: inline-flex; align-items: center; gap: var(--space-2); padding: var(--space-2) var(--space-5); font-size: var(--font-size-sm); font-weight: var(--font-weight-medium); cursor: pointer; text-decoration: none; }
.btn-action[b-bddbhbqohw] { background-color: var(--color-action); color: var(--text-on-action); border: var(--border-width-thin) solid var(--color-action); transition: background-color var(--transition-fast) var(--transition-ease); }
.btn-action:hover[b-bddbhbqohw] { background-color: var(--color-action-hover); border-color: var(--color-action-hover); color: var(--text-on-action); }
.btn-action:disabled[b-bddbhbqohw] { opacity: 0.65; cursor: not-allowed; }
.btn-outline-primary[b-bddbhbqohw] { background: transparent; color: var(--color-primary); border: var(--border-width-thin) solid var(--color-primary); }
.btn-outline-primary:hover[b-bddbhbqohw] { background-color: var(--color-primary); color: var(--text-on-primary); text-decoration: none; }

[b-bddbhbqohw] .validation-message { color: var(--color-danger); font-size: var(--font-size-xs); margin-top: 2px; }

@media (max-width: 768px) {
    .form-grid[b-bddbhbqohw] { grid-template-columns: 1fr; }
    .form-group-wide[b-bddbhbqohw] { grid-column: span 1; }
    .form-actions[b-bddbhbqohw] { flex-direction: column-reverse; }
    .form-actions .btn[b-bddbhbqohw] { justify-content: center; }
}
/* /Components/Pages/Warehouse/ProductGroupEdit.razor.rz.scp.css */
/* ===========================
   ProductGroupEdit - Scoped Styles
   Flat Industrial Minimal
   =========================== */

.page-container[b-pj5o30hmm3] { max-width: 900px; margin: 0 auto; padding: var(--space-6) var(--space-4); }
.page-header[b-pj5o30hmm3] { display: flex; align-items: center; gap: var(--space-4); margin-bottom: var(--space-6); }
.btn-back[b-pj5o30hmm3] { display: inline-flex; align-items: center; justify-content: center; width: 40px; height: 40px; color: var(--text-muted); border: var(--border-width-thin) solid var(--border-color-light); text-decoration: none; transition: all var(--transition-fast) var(--transition-ease); flex-shrink: 0; }
.btn-back:hover[b-pj5o30hmm3] { color: var(--color-primary); border-color: var(--color-primary); background-color: var(--color-gray-50); text-decoration: none; }
.page-header-text[b-pj5o30hmm3] { flex: 1; }
.page-title[b-pj5o30hmm3] { font-size: var(--font-size-xl); font-weight: var(--font-weight-bold); color: var(--color-primary); display: flex; align-items: center; gap: var(--space-2); margin: 0; }
.page-title svg[b-pj5o30hmm3] { color: var(--color-primary); flex-shrink: 0; }
.page-subtitle[b-pj5o30hmm3] { color: var(--text-muted); font-size: var(--font-size-sm); margin: 2px 0 0 0; display: flex; align-items: center; gap: var(--space-2); }
.subtitle-code[b-pj5o30hmm3] { font-family: var(--font-mono); font-size: var(--font-size-xs); color: var(--color-primary); opacity: 0.6; padding: 1px var(--space-2); background-color: var(--color-gray-100); }

.alert-bar[b-pj5o30hmm3] { display: flex; align-items: center; gap: var(--space-2); padding: var(--space-3) var(--space-4); margin-bottom: var(--space-4); font-size: var(--font-size-sm); font-weight: var(--font-weight-medium); border-left: var(--border-width-thick) solid; }
.alert-bar-danger[b-pj5o30hmm3] { background-color: #fdeded; border-left-color: var(--color-danger); color: #5f2120; }
.alert-bar-close[b-pj5o30hmm3] { margin-left: auto; background: none; border: none; font-size: var(--font-size-lg); cursor: pointer; color: inherit; opacity: 0.6; line-height: 1; }
.alert-bar-close:hover[b-pj5o30hmm3] { opacity: 1; }

.loading-state[b-pj5o30hmm3] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: var(--space-16) 0; color: var(--text-muted); gap: var(--space-4); }
.empty-state[b-pj5o30hmm3] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: var(--space-16) 0; color: var(--text-muted); gap: var(--space-3); }
.empty-state svg[b-pj5o30hmm3] { opacity: 0.4; }
.empty-state-text[b-pj5o30hmm3] { font-size: var(--font-size-base); margin: 0; }

.form-section[b-pj5o30hmm3] { margin-bottom: var(--space-6); padding: var(--space-5); background-color: var(--color-white); border: var(--border-width-thin) solid var(--border-color-light); }
.section-title[b-pj5o30hmm3] { display: flex; align-items: center; gap: var(--space-2); font-size: var(--font-size-sm); font-weight: var(--font-weight-semibold); color: var(--color-primary); text-transform: uppercase; letter-spacing: 0.5px; margin: 0 0 var(--space-4) 0; padding-bottom: var(--space-3); border-bottom: var(--border-width-thin) solid var(--border-color-light); }
.section-title svg[b-pj5o30hmm3] { color: var(--color-primary); opacity: 0.6; flex-shrink: 0; }

.form-grid[b-pj5o30hmm3] { display: grid; grid-template-columns: repeat(3, 1fr); gap: var(--space-4); }
.form-group[b-pj5o30hmm3] { display: flex; flex-direction: column; }
.form-group-wide[b-pj5o30hmm3] { grid-column: span 2; }
.form-label[b-pj5o30hmm3] { font-size: var(--font-size-xs); font-weight: var(--font-weight-medium); color: var(--text-secondary); text-transform: uppercase; letter-spacing: 0.3px; margin-bottom: var(--space-1); }
.form-control[b-pj5o30hmm3] { padding: var(--space-2) var(--space-3); font-size: var(--font-size-sm); color: var(--color-gray-700); border: var(--border-width-thin) solid var(--border-color-light); background-color: var(--color-white); transition: border-color var(--transition-fast) var(--transition-ease); }
.form-control:focus[b-pj5o30hmm3] { border-color: var(--color-primary); outline: none; box-shadow: none; }
.form-control[b-pj5o30hmm3]::placeholder { color: var(--color-gray-400); }
.form-control-static[b-pj5o30hmm3] { padding: var(--space-2) var(--space-3); font-size: var(--font-size-sm); color: var(--text-muted); background-color: var(--color-gray-50); border: var(--border-width-thin) solid var(--border-color-light); font-family: var(--font-mono); }

.form-actions[b-pj5o30hmm3] { display: flex; justify-content: flex-end; gap: var(--space-3); padding-top: var(--space-4); border-top: var(--border-width-thin) solid var(--border-color-light); }
.form-actions .btn[b-pj5o30hmm3] { display: inline-flex; align-items: center; gap: var(--space-2); padding: var(--space-2) var(--space-5); font-size: var(--font-size-sm); font-weight: var(--font-weight-medium); cursor: pointer; text-decoration: none; }
.btn-action[b-pj5o30hmm3] { background-color: var(--color-action); color: var(--text-on-action); border: var(--border-width-thin) solid var(--color-action); transition: background-color var(--transition-fast) var(--transition-ease); }
.btn-action:hover[b-pj5o30hmm3] { background-color: var(--color-action-hover); border-color: var(--color-action-hover); color: var(--text-on-action); }
.btn-action:disabled[b-pj5o30hmm3] { opacity: 0.65; cursor: not-allowed; }
.btn-outline-primary[b-pj5o30hmm3] { background: transparent; color: var(--color-primary); border: var(--border-width-thin) solid var(--color-primary); }
.btn-outline-primary:hover[b-pj5o30hmm3] { background-color: var(--color-primary); color: var(--text-on-primary); text-decoration: none; }

[b-pj5o30hmm3] .validation-message { color: var(--color-danger); font-size: var(--font-size-xs); margin-top: 2px; }

@media (max-width: 768px) {
    .form-grid[b-pj5o30hmm3] { grid-template-columns: 1fr; }
    .form-group-wide[b-pj5o30hmm3] { grid-column: span 1; }
    .form-actions[b-pj5o30hmm3] { flex-direction: column-reverse; }
    .form-actions .btn[b-pj5o30hmm3] { justify-content: center; }
}
/* /Components/Pages/Warehouse/ProductGroupList.razor.rz.scp.css */
/* ===========================
   ProductGroupList - Scoped Styles
   Flat Industrial Minimal
   =========================== */

.page-container[b-caoheg7oqw] { max-width: 1200px; margin: 0 auto; padding: var(--space-6) var(--space-4); }
.page-header[b-caoheg7oqw] { display: flex; justify-content: space-between; align-items: flex-start; margin-bottom: var(--space-6); gap: var(--space-4); }
.page-header-left[b-caoheg7oqw] { flex: 1; }
.page-header-right[b-caoheg7oqw] { flex-shrink: 0; }
.page-title[b-caoheg7oqw] { font-size: var(--font-size-2xl); font-weight: var(--font-weight-bold); color: var(--color-primary); display: flex; align-items: center; gap: var(--space-2); margin: 0; }
.page-title svg[b-caoheg7oqw] { color: var(--color-primary); flex-shrink: 0; }
.page-subtitle[b-caoheg7oqw] { color: var(--text-muted); font-size: var(--font-size-sm); margin: var(--space-1) 0 0 0; }

.btn-action[b-caoheg7oqw] { display: inline-flex; align-items: center; gap: var(--space-2); padding: var(--space-2) var(--space-4); background-color: var(--color-action); color: var(--text-on-action); border: var(--border-width-thin) solid var(--color-action); font-size: var(--font-size-sm); font-weight: var(--font-weight-medium); text-decoration: none; cursor: pointer; transition: background-color var(--transition-fast) var(--transition-ease), box-shadow var(--transition-fast) var(--transition-ease); }
.btn-action:hover[b-caoheg7oqw] { background-color: var(--color-action-hover); border-color: var(--color-action-hover); color: var(--text-on-action); text-decoration: none; box-shadow: var(--shadow-sm); }
.btn-action:active[b-caoheg7oqw] { background-color: var(--color-action-active); }

.alert-bar[b-caoheg7oqw] { display: flex; align-items: center; gap: var(--space-2); padding: var(--space-3) var(--space-4); margin-bottom: var(--space-4); font-size: var(--font-size-sm); font-weight: var(--font-weight-medium); border-left: var(--border-width-thick) solid; }
.alert-bar-success[b-caoheg7oqw] { background-color: #edf7ed; border-left-color: var(--color-success); color: #1e4620; }
.alert-bar-danger[b-caoheg7oqw] { background-color: #fdeded; border-left-color: var(--color-danger); color: #5f2120; }
.alert-bar-close[b-caoheg7oqw] { margin-left: auto; background: none; border: none; font-size: var(--font-size-lg); cursor: pointer; color: inherit; opacity: 0.6; line-height: 1; }
.alert-bar-close:hover[b-caoheg7oqw] { opacity: 1; }

.search-bar[b-caoheg7oqw] { display: flex; align-items: center; gap: var(--space-4); margin-bottom: var(--space-4); padding: var(--space-3) var(--space-4); background-color: var(--bg-secondary); border: var(--border-width-thin) solid var(--border-color-light); }
.search-input-wrapper[b-caoheg7oqw] { display: flex; align-items: center; flex: 1; position: relative; }
.search-icon[b-caoheg7oqw] { color: var(--text-muted); flex-shrink: 0; margin-right: var(--space-2); }
.search-input[b-caoheg7oqw] { flex: 1; border: none; background: transparent; font-size: var(--font-size-sm); color: var(--color-gray-700); outline: none; padding: var(--space-1) 0; }
.search-input[b-caoheg7oqw]::placeholder { color: var(--text-muted); }
.search-clear[b-caoheg7oqw] { background: none; border: none; cursor: pointer; color: var(--text-muted); padding: var(--space-1); display: flex; align-items: center; }
.search-clear:hover[b-caoheg7oqw] { color: var(--color-primary); }
.search-count[b-caoheg7oqw] { flex-shrink: 0; font-size: var(--font-size-xs); color: var(--text-muted); font-weight: var(--font-weight-medium); text-transform: uppercase; letter-spacing: 0.5px; }

.loading-state[b-caoheg7oqw] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: var(--space-16) 0; color: var(--text-muted); gap: var(--space-4); }
.empty-state[b-caoheg7oqw] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: var(--space-16) 0; color: var(--text-muted); gap: var(--space-3); }
.empty-state svg[b-caoheg7oqw] { opacity: 0.4; }
.empty-state-text[b-caoheg7oqw] { font-size: var(--font-size-base); margin: 0; }

.item-list[b-caoheg7oqw] { display: flex; flex-direction: column; border: var(--border-width-thin) solid var(--border-color-light); }
.item-row[b-caoheg7oqw] { display: flex; align-items: center; gap: var(--space-4); padding: var(--space-4); border-bottom: var(--border-width-thin) solid var(--border-color-light); transition: background-color var(--transition-fast) var(--transition-ease); }
.item-row:last-child[b-caoheg7oqw] { border-bottom: none; }
.item-row:hover[b-caoheg7oqw] { background-color: rgba(11, 36, 62, 0.03); }

.item-avatar[b-caoheg7oqw] { flex-shrink: 0; width: 40px; height: 40px; display: flex; align-items: center; justify-content: center; background-color: var(--color-gray-100); color: var(--color-primary); }
.item-info[b-caoheg7oqw] { flex: 1; min-width: 0; }
.item-name[b-caoheg7oqw] { font-size: var(--font-size-base); font-weight: var(--font-weight-semibold); color: var(--color-primary); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.item-meta[b-caoheg7oqw] { display: flex; align-items: center; gap: var(--space-1); flex-wrap: wrap; font-size: var(--font-size-xs); color: var(--text-secondary); margin-top: 2px; }
.item-code[b-caoheg7oqw] { font-family: var(--font-mono); font-weight: var(--font-weight-medium); color: var(--color-primary); opacity: 0.7; }

.item-actions[b-caoheg7oqw] { flex-shrink: 0; display: flex; align-items: center; gap: var(--space-1); }
.btn-icon[b-caoheg7oqw] { display: inline-flex; align-items: center; justify-content: center; width: 36px; height: 36px; background: none; border: var(--border-width-thin) solid transparent; cursor: pointer; color: var(--text-muted); text-decoration: none; transition: all var(--transition-fast) var(--transition-ease); }
.btn-icon:hover[b-caoheg7oqw] { color: var(--color-primary); background-color: var(--color-gray-100); border-color: var(--border-color-light); text-decoration: none; }
.btn-icon-danger:hover[b-caoheg7oqw] { color: var(--color-action); background-color: rgba(178, 34, 34, 0.06); border-color: rgba(178, 34, 34, 0.2); }

.overlay[b-caoheg7oqw] { position: fixed; inset: 0; background-color: rgba(0, 0, 0, 0.4); display: flex; align-items: center; justify-content: center; z-index: var(--z-modal-backdrop); }
.confirm-dialog[b-caoheg7oqw] { background-color: var(--color-white); padding: var(--space-8); max-width: 420px; width: 90%; box-shadow: var(--shadow-xl); text-align: center; z-index: var(--z-modal); }
.confirm-icon[b-caoheg7oqw] { color: var(--color-action); margin-bottom: var(--space-4); }
.confirm-dialog h3[b-caoheg7oqw] { font-size: var(--font-size-lg); font-weight: var(--font-weight-semibold); color: var(--color-primary); margin: 0 0 var(--space-2) 0; }
.confirm-dialog p[b-caoheg7oqw] { font-size: var(--font-size-sm); color: var(--text-secondary); margin: 0 0 var(--space-2) 0; }
.confirm-warning[b-caoheg7oqw] { font-size: var(--font-size-xs) !important; color: var(--color-action) !important; font-weight: var(--font-weight-medium); }
.confirm-actions[b-caoheg7oqw] { display: flex; gap: var(--space-3); justify-content: center; margin-top: var(--space-6); }
.confirm-actions .btn[b-caoheg7oqw] { min-width: 100px; padding: var(--space-2) var(--space-4); font-size: var(--font-size-sm); font-weight: var(--font-weight-medium); cursor: pointer; }
.btn-outline-primary[b-caoheg7oqw] { background: transparent; color: var(--color-primary); border: var(--border-width-thin) solid var(--color-primary); }
.btn-outline-primary:hover[b-caoheg7oqw] { background-color: var(--color-primary); color: var(--text-on-primary); }

@media (max-width: 768px) {
    .page-header[b-caoheg7oqw] { flex-direction: column; gap: var(--space-3); }
    .item-row[b-caoheg7oqw] { flex-wrap: wrap; }
    .item-actions[b-caoheg7oqw] { order: 6; margin-left: auto; }
}
/* /Components/Pages/Warehouse/ProductLineCreate.razor.rz.scp.css */
/* ===========================
   ProductLineCreate - Scoped Styles
   Flat Industrial Minimal
   =========================== */

.page-container[b-yb9vsl4foe] { max-width: 900px; margin: 0 auto; padding: var(--space-6) var(--space-4); }
.page-header[b-yb9vsl4foe] { display: flex; align-items: center; gap: var(--space-4); margin-bottom: var(--space-6); }
.btn-back[b-yb9vsl4foe] { display: inline-flex; align-items: center; justify-content: center; width: 40px; height: 40px; color: var(--text-muted); border: var(--border-width-thin) solid var(--border-color-light); text-decoration: none; transition: all var(--transition-fast) var(--transition-ease); flex-shrink: 0; }
.btn-back:hover[b-yb9vsl4foe] { color: var(--color-primary); border-color: var(--color-primary); background-color: var(--color-gray-50); text-decoration: none; }
.page-header-text[b-yb9vsl4foe] { flex: 1; }
.page-title[b-yb9vsl4foe] { font-size: var(--font-size-xl); font-weight: var(--font-weight-bold); color: var(--color-primary); display: flex; align-items: center; gap: var(--space-2); margin: 0; }
.page-title svg[b-yb9vsl4foe] { color: var(--color-primary); flex-shrink: 0; }
.page-subtitle[b-yb9vsl4foe] { color: var(--text-muted); font-size: var(--font-size-sm); margin: 2px 0 0 0; }

.alert-bar[b-yb9vsl4foe] { display: flex; align-items: center; gap: var(--space-2); padding: var(--space-3) var(--space-4); margin-bottom: var(--space-4); font-size: var(--font-size-sm); font-weight: var(--font-weight-medium); border-left: var(--border-width-thick) solid; }
.alert-bar-danger[b-yb9vsl4foe] { background-color: #fdeded; border-left-color: var(--color-danger); color: #5f2120; }
.alert-bar-close[b-yb9vsl4foe] { margin-left: auto; background: none; border: none; font-size: var(--font-size-lg); cursor: pointer; color: inherit; opacity: 0.6; line-height: 1; }
.alert-bar-close:hover[b-yb9vsl4foe] { opacity: 1; }

.form-section[b-yb9vsl4foe] { margin-bottom: var(--space-6); padding: var(--space-5); background-color: var(--color-white); border: var(--border-width-thin) solid var(--border-color-light); }
.section-title[b-yb9vsl4foe] { display: flex; align-items: center; gap: var(--space-2); font-size: var(--font-size-sm); font-weight: var(--font-weight-semibold); color: var(--color-primary); text-transform: uppercase; letter-spacing: 0.5px; margin: 0 0 var(--space-4) 0; padding-bottom: var(--space-3); border-bottom: var(--border-width-thin) solid var(--border-color-light); }
.section-title svg[b-yb9vsl4foe] { color: var(--color-primary); opacity: 0.6; flex-shrink: 0; }

.form-grid[b-yb9vsl4foe] { display: grid; grid-template-columns: repeat(3, 1fr); gap: var(--space-4); }
.form-group[b-yb9vsl4foe] { display: flex; flex-direction: column; }
.form-group-wide[b-yb9vsl4foe] { grid-column: span 2; }
.form-label[b-yb9vsl4foe] { font-size: var(--font-size-xs); font-weight: var(--font-weight-medium); color: var(--text-secondary); text-transform: uppercase; letter-spacing: 0.3px; margin-bottom: var(--space-1); }
.form-control[b-yb9vsl4foe] { padding: var(--space-2) var(--space-3); font-size: var(--font-size-sm); color: var(--color-gray-700); border: var(--border-width-thin) solid var(--border-color-light); background-color: var(--color-white); transition: border-color var(--transition-fast) var(--transition-ease); }
.form-control:focus[b-yb9vsl4foe] { border-color: var(--color-primary); outline: none; box-shadow: none; }
.form-control[b-yb9vsl4foe]::placeholder { color: var(--color-gray-400); }

.form-actions[b-yb9vsl4foe] { display: flex; justify-content: flex-end; gap: var(--space-3); padding-top: var(--space-4); border-top: var(--border-width-thin) solid var(--border-color-light); }
.form-actions .btn[b-yb9vsl4foe] { display: inline-flex; align-items: center; gap: var(--space-2); padding: var(--space-2) var(--space-5); font-size: var(--font-size-sm); font-weight: var(--font-weight-medium); cursor: pointer; text-decoration: none; }
.btn-action[b-yb9vsl4foe] { background-color: var(--color-action); color: var(--text-on-action); border: var(--border-width-thin) solid var(--color-action); transition: background-color var(--transition-fast) var(--transition-ease); }
.btn-action:hover[b-yb9vsl4foe] { background-color: var(--color-action-hover); border-color: var(--color-action-hover); color: var(--text-on-action); }
.btn-action:disabled[b-yb9vsl4foe] { opacity: 0.65; cursor: not-allowed; }
.btn-outline-primary[b-yb9vsl4foe] { background: transparent; color: var(--color-primary); border: var(--border-width-thin) solid var(--color-primary); }
.btn-outline-primary:hover[b-yb9vsl4foe] { background-color: var(--color-primary); color: var(--text-on-primary); text-decoration: none; }

[b-yb9vsl4foe] .validation-message { color: var(--color-danger); font-size: var(--font-size-xs); margin-top: 2px; }

@media (max-width: 768px) {
    .form-grid[b-yb9vsl4foe] { grid-template-columns: 1fr; }
    .form-group-wide[b-yb9vsl4foe] { grid-column: span 1; }
    .form-actions[b-yb9vsl4foe] { flex-direction: column-reverse; }
    .form-actions .btn[b-yb9vsl4foe] { justify-content: center; }
}
/* /Components/Pages/Warehouse/ProductLineEdit.razor.rz.scp.css */
/* ===========================
   ProductLineEdit - Scoped Styles
   Flat Industrial Minimal
   =========================== */

.page-container[b-zqm44kg4d0] { max-width: 900px; margin: 0 auto; padding: var(--space-6) var(--space-4); }
.page-header[b-zqm44kg4d0] { display: flex; align-items: center; gap: var(--space-4); margin-bottom: var(--space-6); }
.btn-back[b-zqm44kg4d0] { display: inline-flex; align-items: center; justify-content: center; width: 40px; height: 40px; color: var(--text-muted); border: var(--border-width-thin) solid var(--border-color-light); text-decoration: none; transition: all var(--transition-fast) var(--transition-ease); flex-shrink: 0; }
.btn-back:hover[b-zqm44kg4d0] { color: var(--color-primary); border-color: var(--color-primary); background-color: var(--color-gray-50); text-decoration: none; }
.page-header-text[b-zqm44kg4d0] { flex: 1; }
.page-title[b-zqm44kg4d0] { font-size: var(--font-size-xl); font-weight: var(--font-weight-bold); color: var(--color-primary); display: flex; align-items: center; gap: var(--space-2); margin: 0; }
.page-title svg[b-zqm44kg4d0] { color: var(--color-primary); flex-shrink: 0; }
.page-subtitle[b-zqm44kg4d0] { color: var(--text-muted); font-size: var(--font-size-sm); margin: 2px 0 0 0; display: flex; align-items: center; gap: var(--space-2); }
.subtitle-code[b-zqm44kg4d0] { font-family: var(--font-mono); font-size: var(--font-size-xs); color: var(--color-primary); opacity: 0.6; padding: 1px var(--space-2); background-color: var(--color-gray-100); }

.alert-bar[b-zqm44kg4d0] { display: flex; align-items: center; gap: var(--space-2); padding: var(--space-3) var(--space-4); margin-bottom: var(--space-4); font-size: var(--font-size-sm); font-weight: var(--font-weight-medium); border-left: var(--border-width-thick) solid; }
.alert-bar-danger[b-zqm44kg4d0] { background-color: #fdeded; border-left-color: var(--color-danger); color: #5f2120; }
.alert-bar-close[b-zqm44kg4d0] { margin-left: auto; background: none; border: none; font-size: var(--font-size-lg); cursor: pointer; color: inherit; opacity: 0.6; line-height: 1; }
.alert-bar-close:hover[b-zqm44kg4d0] { opacity: 1; }

.loading-state[b-zqm44kg4d0] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: var(--space-16) 0; color: var(--text-muted); gap: var(--space-4); }
.empty-state[b-zqm44kg4d0] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: var(--space-16) 0; color: var(--text-muted); gap: var(--space-3); }
.empty-state svg[b-zqm44kg4d0] { opacity: 0.4; }
.empty-state-text[b-zqm44kg4d0] { font-size: var(--font-size-base); margin: 0; }

.form-section[b-zqm44kg4d0] { margin-bottom: var(--space-6); padding: var(--space-5); background-color: var(--color-white); border: var(--border-width-thin) solid var(--border-color-light); }
.section-title[b-zqm44kg4d0] { display: flex; align-items: center; gap: var(--space-2); font-size: var(--font-size-sm); font-weight: var(--font-weight-semibold); color: var(--color-primary); text-transform: uppercase; letter-spacing: 0.5px; margin: 0 0 var(--space-4) 0; padding-bottom: var(--space-3); border-bottom: var(--border-width-thin) solid var(--border-color-light); }
.section-title svg[b-zqm44kg4d0] { color: var(--color-primary); opacity: 0.6; flex-shrink: 0; }

.form-grid[b-zqm44kg4d0] { display: grid; grid-template-columns: repeat(3, 1fr); gap: var(--space-4); }
.form-group[b-zqm44kg4d0] { display: flex; flex-direction: column; }
.form-group-wide[b-zqm44kg4d0] { grid-column: span 2; }
.form-label[b-zqm44kg4d0] { font-size: var(--font-size-xs); font-weight: var(--font-weight-medium); color: var(--text-secondary); text-transform: uppercase; letter-spacing: 0.3px; margin-bottom: var(--space-1); }
.form-control[b-zqm44kg4d0] { padding: var(--space-2) var(--space-3); font-size: var(--font-size-sm); color: var(--color-gray-700); border: var(--border-width-thin) solid var(--border-color-light); background-color: var(--color-white); transition: border-color var(--transition-fast) var(--transition-ease); }
.form-control:focus[b-zqm44kg4d0] { border-color: var(--color-primary); outline: none; box-shadow: none; }
.form-control[b-zqm44kg4d0]::placeholder { color: var(--color-gray-400); }
.form-control-static[b-zqm44kg4d0] { padding: var(--space-2) var(--space-3); font-size: var(--font-size-sm); color: var(--text-muted); background-color: var(--color-gray-50); border: var(--border-width-thin) solid var(--border-color-light); font-family: var(--font-mono); }

.form-actions[b-zqm44kg4d0] { display: flex; justify-content: flex-end; gap: var(--space-3); padding-top: var(--space-4); border-top: var(--border-width-thin) solid var(--border-color-light); }
.form-actions .btn[b-zqm44kg4d0] { display: inline-flex; align-items: center; gap: var(--space-2); padding: var(--space-2) var(--space-5); font-size: var(--font-size-sm); font-weight: var(--font-weight-medium); cursor: pointer; text-decoration: none; }
.btn-action[b-zqm44kg4d0] { background-color: var(--color-action); color: var(--text-on-action); border: var(--border-width-thin) solid var(--color-action); transition: background-color var(--transition-fast) var(--transition-ease); }
.btn-action:hover[b-zqm44kg4d0] { background-color: var(--color-action-hover); border-color: var(--color-action-hover); color: var(--text-on-action); }
.btn-action:disabled[b-zqm44kg4d0] { opacity: 0.65; cursor: not-allowed; }
.btn-outline-primary[b-zqm44kg4d0] { background: transparent; color: var(--color-primary); border: var(--border-width-thin) solid var(--color-primary); }
.btn-outline-primary:hover[b-zqm44kg4d0] { background-color: var(--color-primary); color: var(--text-on-primary); text-decoration: none; }

[b-zqm44kg4d0] .validation-message { color: var(--color-danger); font-size: var(--font-size-xs); margin-top: 2px; }

@media (max-width: 768px) {
    .form-grid[b-zqm44kg4d0] { grid-template-columns: 1fr; }
    .form-group-wide[b-zqm44kg4d0] { grid-column: span 1; }
    .form-actions[b-zqm44kg4d0] { flex-direction: column-reverse; }
    .form-actions .btn[b-zqm44kg4d0] { justify-content: center; }
}
/* /Components/Pages/Warehouse/ProductLineList.razor.rz.scp.css */
/* ===========================
   ProductLineList - Scoped Styles
   Flat Industrial Minimal
   =========================== */

.page-container[b-nivyd1w3jz] { max-width: 1200px; margin: 0 auto; padding: var(--space-6) var(--space-4); }
.page-header[b-nivyd1w3jz] { display: flex; justify-content: space-between; align-items: flex-start; margin-bottom: var(--space-6); gap: var(--space-4); }
.page-header-left[b-nivyd1w3jz] { flex: 1; }
.page-header-right[b-nivyd1w3jz] { flex-shrink: 0; }
.page-title[b-nivyd1w3jz] { font-size: var(--font-size-2xl); font-weight: var(--font-weight-bold); color: var(--color-primary); display: flex; align-items: center; gap: var(--space-2); margin: 0; }
.page-title svg[b-nivyd1w3jz] { color: var(--color-primary); flex-shrink: 0; }
.page-subtitle[b-nivyd1w3jz] { color: var(--text-muted); font-size: var(--font-size-sm); margin: var(--space-1) 0 0 0; }

.btn-action[b-nivyd1w3jz] { display: inline-flex; align-items: center; gap: var(--space-2); padding: var(--space-2) var(--space-4); background-color: var(--color-action); color: var(--text-on-action); border: var(--border-width-thin) solid var(--color-action); font-size: var(--font-size-sm); font-weight: var(--font-weight-medium); text-decoration: none; cursor: pointer; transition: background-color var(--transition-fast) var(--transition-ease), box-shadow var(--transition-fast) var(--transition-ease); }
.btn-action:hover[b-nivyd1w3jz] { background-color: var(--color-action-hover); border-color: var(--color-action-hover); color: var(--text-on-action); text-decoration: none; box-shadow: var(--shadow-sm); }
.btn-action:active[b-nivyd1w3jz] { background-color: var(--color-action-active); }

.alert-bar[b-nivyd1w3jz] { display: flex; align-items: center; gap: var(--space-2); padding: var(--space-3) var(--space-4); margin-bottom: var(--space-4); font-size: var(--font-size-sm); font-weight: var(--font-weight-medium); border-left: var(--border-width-thick) solid; }
.alert-bar-success[b-nivyd1w3jz] { background-color: #edf7ed; border-left-color: var(--color-success); color: #1e4620; }
.alert-bar-danger[b-nivyd1w3jz] { background-color: #fdeded; border-left-color: var(--color-danger); color: #5f2120; }
.alert-bar-close[b-nivyd1w3jz] { margin-left: auto; background: none; border: none; font-size: var(--font-size-lg); cursor: pointer; color: inherit; opacity: 0.6; line-height: 1; }
.alert-bar-close:hover[b-nivyd1w3jz] { opacity: 1; }

.search-bar[b-nivyd1w3jz] { display: flex; align-items: center; gap: var(--space-4); margin-bottom: var(--space-4); padding: var(--space-3) var(--space-4); background-color: var(--bg-secondary); border: var(--border-width-thin) solid var(--border-color-light); }
.search-input-wrapper[b-nivyd1w3jz] { display: flex; align-items: center; flex: 1; position: relative; }
.search-icon[b-nivyd1w3jz] { color: var(--text-muted); flex-shrink: 0; margin-right: var(--space-2); }
.search-input[b-nivyd1w3jz] { flex: 1; border: none; background: transparent; font-size: var(--font-size-sm); color: var(--color-gray-700); outline: none; padding: var(--space-1) 0; }
.search-input[b-nivyd1w3jz]::placeholder { color: var(--text-muted); }
.search-clear[b-nivyd1w3jz] { background: none; border: none; cursor: pointer; color: var(--text-muted); padding: var(--space-1); display: flex; align-items: center; }
.search-clear:hover[b-nivyd1w3jz] { color: var(--color-primary); }
.search-count[b-nivyd1w3jz] { flex-shrink: 0; font-size: var(--font-size-xs); color: var(--text-muted); font-weight: var(--font-weight-medium); text-transform: uppercase; letter-spacing: 0.5px; }

.loading-state[b-nivyd1w3jz] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: var(--space-16) 0; color: var(--text-muted); gap: var(--space-4); }
.empty-state[b-nivyd1w3jz] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: var(--space-16) 0; color: var(--text-muted); gap: var(--space-3); }
.empty-state svg[b-nivyd1w3jz] { opacity: 0.4; }
.empty-state-text[b-nivyd1w3jz] { font-size: var(--font-size-base); margin: 0; }

.item-list[b-nivyd1w3jz] { display: flex; flex-direction: column; border: var(--border-width-thin) solid var(--border-color-light); }
.item-row[b-nivyd1w3jz] { display: flex; align-items: center; gap: var(--space-4); padding: var(--space-4); border-bottom: var(--border-width-thin) solid var(--border-color-light); transition: background-color var(--transition-fast) var(--transition-ease); }
.item-row:last-child[b-nivyd1w3jz] { border-bottom: none; }
.item-row:hover[b-nivyd1w3jz] { background-color: rgba(11, 36, 62, 0.03); }

.item-avatar[b-nivyd1w3jz] { flex-shrink: 0; width: 40px; height: 40px; display: flex; align-items: center; justify-content: center; background-color: var(--color-gray-100); color: var(--color-primary); }
.item-info[b-nivyd1w3jz] { flex: 1; min-width: 0; }
.item-name[b-nivyd1w3jz] { font-size: var(--font-size-base); font-weight: var(--font-weight-semibold); color: var(--color-primary); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.item-meta[b-nivyd1w3jz] { display: flex; align-items: center; gap: var(--space-1); flex-wrap: wrap; font-size: var(--font-size-xs); color: var(--text-secondary); margin-top: 2px; }
.item-code[b-nivyd1w3jz] { font-family: var(--font-mono); font-weight: var(--font-weight-medium); color: var(--color-primary); opacity: 0.7; }

.item-actions[b-nivyd1w3jz] { flex-shrink: 0; display: flex; align-items: center; gap: var(--space-1); }
.btn-icon[b-nivyd1w3jz] { display: inline-flex; align-items: center; justify-content: center; width: 36px; height: 36px; background: none; border: var(--border-width-thin) solid transparent; cursor: pointer; color: var(--text-muted); text-decoration: none; transition: all var(--transition-fast) var(--transition-ease); }
.btn-icon:hover[b-nivyd1w3jz] { color: var(--color-primary); background-color: var(--color-gray-100); border-color: var(--border-color-light); text-decoration: none; }
.btn-icon-danger:hover[b-nivyd1w3jz] { color: var(--color-action); background-color: rgba(178, 34, 34, 0.06); border-color: rgba(178, 34, 34, 0.2); }

.overlay[b-nivyd1w3jz] { position: fixed; inset: 0; background-color: rgba(0, 0, 0, 0.4); display: flex; align-items: center; justify-content: center; z-index: var(--z-modal-backdrop); }
.confirm-dialog[b-nivyd1w3jz] { background-color: var(--color-white); padding: var(--space-8); max-width: 420px; width: 90%; box-shadow: var(--shadow-xl); text-align: center; z-index: var(--z-modal); }
.confirm-icon[b-nivyd1w3jz] { color: var(--color-action); margin-bottom: var(--space-4); }
.confirm-dialog h3[b-nivyd1w3jz] { font-size: var(--font-size-lg); font-weight: var(--font-weight-semibold); color: var(--color-primary); margin: 0 0 var(--space-2) 0; }
.confirm-dialog p[b-nivyd1w3jz] { font-size: var(--font-size-sm); color: var(--text-secondary); margin: 0 0 var(--space-2) 0; }
.confirm-warning[b-nivyd1w3jz] { font-size: var(--font-size-xs) !important; color: var(--color-action) !important; font-weight: var(--font-weight-medium); }
.confirm-actions[b-nivyd1w3jz] { display: flex; gap: var(--space-3); justify-content: center; margin-top: var(--space-6); }
/* /Components/Pages/Warehouse/ProductList.razor.rz.scp.css */
/* ===========================
   ContactList - Scoped Styles
   Flat Industrial Minimal
   =========================== */

/* Page Container */
.page-container[b-4d5cnavt6w] {
    max-width: 1200px;
    margin: 0 auto;
    padding: var(--space-6) var(--space-4);
}

/* Header */
.page-header[b-4d5cnavt6w] {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    margin-bottom: var(--space-6);
    gap: var(--space-4);
}

.page-header-left[b-4d5cnavt6w] {
    flex: 1;
}

.page-header-right[b-4d5cnavt6w] {
    flex-shrink: 0;
}

.page-title[b-4d5cnavt6w] {
    font-size: var(--font-size-2xl);
    font-weight: var(--font-weight-bold);
    color: var(--color-primary);
    display: flex;
    align-items: center;
    gap: var(--space-2);
    margin: 0;
}

.page-title svg[b-4d5cnavt6w] {
    color: var(--color-primary);
    flex-shrink: 0;
}

.page-subtitle[b-4d5cnavt6w] {
    color: var(--text-muted);
    font-size: var(--font-size-sm);
    margin: var(--space-1) 0 0 0;
}

/* Action Button */
.btn-action[b-4d5cnavt6w] {
    display: inline-flex;
    align-items: center;
    gap: var(--space-2);
    padding: var(--space-2) var(--space-4);
    background-color: var(--color-action);
    color: var(--text-on-action);
    border: var(--border-width-thin) solid var(--color-action);
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-medium);
    text-decoration: none;
    cursor: pointer;
    transition: background-color var(--transition-fast) var(--transition-ease),
                box-shadow var(--transition-fast) var(--transition-ease);
}

.btn-action:hover[b-4d5cnavt6w] {
    background-color: var(--color-action-hover);
    border-color: var(--color-action-hover);
    color: var(--text-on-action);
    text-decoration: none;
    box-shadow: var(--shadow-sm);
}

.btn-action:active[b-4d5cnavt6w] {
    background-color: var(--color-action-active);
}

/* Alert Bars */
.alert-bar[b-4d5cnavt6w] {
    display: flex;
    align-items: center;
    gap: var(--space-2);
    padding: var(--space-3) var(--space-4);
    margin-bottom: var(--space-4);
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-medium);
    border-left: var(--border-width-thick) solid;
}

.alert-bar-success[b-4d5cnavt6w] {
    background-color: #edf7ed;
    border-left-color: var(--color-success);
    color: #1e4620;
}

.alert-bar-danger[b-4d5cnavt6w] {
    background-color: #fdeded;
    border-left-color: var(--color-danger);
    color: #5f2120;
}

.alert-bar-close[b-4d5cnavt6w] {
    margin-left: auto;
    background: none;
    border: none;
    font-size: var(--font-size-lg);
    cursor: pointer;
    color: inherit;
    opacity: 0.6;
    line-height: 1;
}

.alert-bar-close:hover[b-4d5cnavt6w] {
    opacity: 1;
}

/* Search Bar */
.search-bar[b-4d5cnavt6w] {
    display: flex;
    align-items: center;
    gap: var(--space-4);
    margin-bottom: var(--space-4);
    padding: var(--space-3) var(--space-4);
    background-color: var(--bg-secondary);
    border: var(--border-width-thin) solid var(--border-color-light);
}

.search-input-wrapper[b-4d5cnavt6w] {
    display: flex;
    align-items: center;
    flex: 1;
    position: relative;
}

.search-icon[b-4d5cnavt6w] {
    color: var(--text-muted);
    flex-shrink: 0;
    margin-right: var(--space-2);
}

.search-input[b-4d5cnavt6w] {
    flex: 1;
    border: none;
    background: transparent;
    font-size: var(--font-size-sm);
    color: var(--color-gray-700);
    outline: none;
    padding: var(--space-1) 0;
}

.search-input[b-4d5cnavt6w]::placeholder {
    color: var(--text-muted);
}

.search-clear[b-4d5cnavt6w] {
    background: none;
    border: none;
    cursor: pointer;
    color: var(--text-muted);
    padding: var(--space-1);
    display: flex;
    align-items: center;
}

.search-clear:hover[b-4d5cnavt6w] {
    color: var(--color-primary);
}

.search-count[b-4d5cnavt6w] {
    flex-shrink: 0;
    font-size: var(--font-size-xs);
    color: var(--text-muted);
    font-weight: var(--font-weight-medium);
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

/* Loading / Empty States */
.loading-state[b-4d5cnavt6w] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: var(--space-16) 0;
    color: var(--text-muted);
    gap: var(--space-4);
}

.empty-state[b-4d5cnavt6w] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: var(--space-16) 0;
    color: var(--text-muted);
    gap: var(--space-3);
}

.empty-state svg[b-4d5cnavt6w] {
    opacity: 0.4;
}

.empty-state-text[b-4d5cnavt6w] {
    font-size: var(--font-size-base);
    margin: 0;
}

/* Contact List */
.contact-list[b-4d5cnavt6w] {
    display: flex;
    flex-direction: column;
    border: var(--border-width-thin) solid var(--border-color-light);
}

/* Contact Row */
.contact-row[b-4d5cnavt6w] {
    display: flex;
    align-items: center;
    gap: var(--space-4);
    padding: var(--space-4);
    border-bottom: var(--border-width-thin) solid var(--border-color-light);
    transition: background-color var(--transition-fast) var(--transition-ease);
}

.contact-row:last-child[b-4d5cnavt6w] {
    border-bottom: none;
}

.contact-row:hover[b-4d5cnavt6w] {
    background-color: rgba(11, 36, 62, 0.03);
}

/* Avatar */
.contact-avatar[b-4d5cnavt6w] {
    flex-shrink: 0;
    width: 40px;
    height: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: var(--color-gray-100);
    color: var(--color-primary);
}

/* Contact Info */
.contact-info[b-4d5cnavt6w] {
    flex: 1;
    min-width: 0;
}

.contact-name[b-4d5cnavt6w] {
    font-size: var(--font-size-base);
    font-weight: var(--font-weight-semibold);
    color: var(--color-primary);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.contact-meta[b-4d5cnavt6w] {
    display: flex;
    align-items: center;
    gap: var(--space-1);
    flex-wrap: wrap;
    font-size: var(--font-size-xs);
    color: var(--text-secondary);
    margin-top: 2px;
}

.contact-code[b-4d5cnavt6w] {
    font-family: var(--font-mono);
    font-weight: var(--font-weight-medium);
    color: var(--color-primary);
    opacity: 0.7;
}

.meta-separator[b-4d5cnavt6w] {
    color: var(--color-gray-300);
}

.contact-details[b-4d5cnavt6w] {
    display: flex;
    align-items: center;
    gap: var(--space-4);
    margin-top: var(--space-1);
}

.contact-detail-item[b-4d5cnavt6w] {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    font-size: var(--font-size-xs);
    color: var(--text-muted);
}

.contact-detail-item svg[b-4d5cnavt6w] {
    flex-shrink: 0;
}

/* Badges */
.contact-badges[b-4d5cnavt6w] {
    flex-shrink: 0;
    display: flex;
    gap: var(--space-2);
}

.badge[b-4d5cnavt6w] {
    display: inline-flex;
    align-items: center;
    padding: 3px var(--space-2);
    font-size: var(--font-size-xs);
    font-weight: var(--font-weight-medium);
    letter-spacing: 0.3px;
    text-transform: uppercase;
}

.badge-primary[b-4d5cnavt6w] {
    background-color: rgba(11, 36, 62, 0.1);
    color: var(--color-primary);
}

.badge-info[b-4d5cnavt6w] {
    background-color: rgba(23, 162, 184, 0.1);
    color: var(--color-info);
}

.badge-danger[b-4d5cnavt6w] {
    background-color: rgba(178, 34, 34, 0.1);
    color: var(--color-action);
}

/* Action Buttons */
.contact-actions[b-4d5cnavt6w] {
    flex-shrink: 0;
    display: flex;
    align-items: center;
    gap: var(--space-1);
}

.btn-icon[b-4d5cnavt6w] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 36px;
    background: none;
    border: var(--border-width-thin) solid transparent;
    cursor: pointer;
    color: var(--text-muted);
    text-decoration: none;
    transition: all var(--transition-fast) var(--transition-ease);
}

.btn-icon:hover[b-4d5cnavt6w] {
    color: var(--color-primary);
    background-color: var(--color-gray-100);
    border-color: var(--border-color-light);
    text-decoration: none;
}

.btn-icon-danger:hover[b-4d5cnavt6w] {
    color: var(--color-action);
    background-color: rgba(178, 34, 34, 0.06);
    border-color: rgba(178, 34, 34, 0.2);
}

.actions-separator[b-4d5cnavt6w] {
    width: 1px;
    height: 20px;
    background-color: var(--border-color-light);
    margin: 0 var(--space-1);
}

/* Overlay & Dialog */
.overlay[b-4d5cnavt6w] {
    position: fixed;
    inset: 0;
    background-color: rgba(0, 0, 0, 0.4);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: var(--z-modal-backdrop);
}

.confirm-dialog[b-4d5cnavt6w] {
    background-color: var(--color-white);
    padding: var(--space-8);
    max-width: 420px;
    width: 90%;
    box-shadow: var(--shadow-xl);
    text-align: center;
    z-index: var(--z-modal);
}

.confirm-icon[b-4d5cnavt6w] {
    color: var(--color-action);
    margin-bottom: var(--space-4);
}

.confirm-dialog h3[b-4d5cnavt6w] {
    font-size: var(--font-size-lg);
    font-weight: var(--font-weight-semibold);
    color: var(--color-primary);
    margin: 0 0 var(--space-2) 0;
}

.confirm-dialog p[b-4d5cnavt6w] {
    font-size: var(--font-size-sm);
    color: var(--text-secondary);
    margin: 0 0 var(--space-2) 0;
}

.confirm-warning[b-4d5cnavt6w] {
    font-size: var(--font-size-xs) !important;
    color: var(--color-action) !important;
    font-weight: var(--font-weight-medium);
}

.confirm-actions[b-4d5cnavt6w] {
    display: flex;
    gap: var(--space-3);
    justify-content: center;
    margin-top: var(--space-6);
}

.confirm-actions .btn[b-4d5cnavt6w] {
    min-width: 100px;
    padding: var(--space-2) var(--space-4);
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-medium);
    cursor: pointer;
}

/* Outline Primary Button (used in confirm dialog) */
.btn-outline-primary[b-4d5cnavt6w] {
    background: transparent;
    color: var(--color-primary);
    border: var(--border-width-thin) solid var(--color-primary);
}

.btn-outline-primary:hover[b-4d5cnavt6w] {
    background-color: var(--color-primary);
    color: var(--text-on-primary);
}

/* Responsive */
@media (max-width: 768px) {
    .page-header[b-4d5cnavt6w] {
        flex-direction: column;
        gap: var(--space-3);
    }

    .contact-row[b-4d5cnavt6w] {
        flex-wrap: wrap;
    }

    .contact-badges[b-4d5cnavt6w] {
        order: 5;
    }

    .contact-actions[b-4d5cnavt6w] {
        order: 6;
        margin-left: auto;
    }

    .contact-details[b-4d5cnavt6w] {
        flex-wrap: wrap;
    }
}
/* /Components/Pages/Warehouse/ProductSubgroupCreate.razor.rz.scp.css */
/* ===========================
   ProductSubgroupCreate - Scoped Styles
   Flat Industrial Minimal
   =========================== */

.page-container[b-3wmr9ytppi] { max-width: 900px; margin: 0 auto; padding: var(--space-6) var(--space-4); }
.page-header[b-3wmr9ytppi] { display: flex; align-items: center; gap: var(--space-4); margin-bottom: var(--space-6); }
.btn-back[b-3wmr9ytppi] { display: inline-flex; align-items: center; justify-content: center; width: 40px; height: 40px; color: var(--text-muted); border: var(--border-width-thin) solid var(--border-color-light); text-decoration: none; transition: all var(--transition-fast) var(--transition-ease); flex-shrink: 0; }
.btn-back:hover[b-3wmr9ytppi] { color: var(--color-primary); border-color: var(--color-primary); background-color: var(--color-gray-50); text-decoration: none; }
.page-header-text[b-3wmr9ytppi] { flex: 1; }
.page-title[b-3wmr9ytppi] { font-size: var(--font-size-xl); font-weight: var(--font-weight-bold); color: var(--color-primary); display: flex; align-items: center; gap: var(--space-2); margin: 0; }
.page-title svg[b-3wmr9ytppi] { color: var(--color-primary); flex-shrink: 0; }
.page-subtitle[b-3wmr9ytppi] { color: var(--text-muted); font-size: var(--font-size-sm); margin: 2px 0 0 0; display: flex; align-items: center; gap: var(--space-2); }
.subtitle-code[b-3wmr9ytppi] { font-family: var(--font-mono); font-size: var(--font-size-xs); color: var(--color-primary); opacity: 0.6; padding: 1px var(--space-2); background-color: var(--color-gray-100); }

.alert-bar[b-3wmr9ytppi] { display: flex; align-items: center; gap: var(--space-2); padding: var(--space-3) var(--space-4); margin-bottom: var(--space-4); font-size: var(--font-size-sm); font-weight: var(--font-weight-medium); border-left: var(--border-width-thick) solid; }
.alert-bar-danger[b-3wmr9ytppi] { background-color: #fdeded; border-left-color: var(--color-danger); color: #5f2120; }
.alert-bar-close[b-3wmr9ytppi] { margin-left: auto; background: none; border: none; font-size: var(--font-size-lg); cursor: pointer; color: inherit; opacity: 0.6; line-height: 1; }
.alert-bar-close:hover[b-3wmr9ytppi] { opacity: 1; }

.form-section[b-3wmr9ytppi] { margin-bottom: var(--space-6); padding: var(--space-5); background-color: var(--color-white); border: var(--border-width-thin) solid var(--border-color-light); }
.section-title[b-3wmr9ytppi] { display: flex; align-items: center; gap: var(--space-2); font-size: var(--font-size-sm); font-weight: var(--font-weight-semibold); color: var(--color-primary); text-transform: uppercase; letter-spacing: 0.5px; margin: 0 0 var(--space-4) 0; padding-bottom: var(--space-3); border-bottom: var(--border-width-thin) solid var(--border-color-light); }
.section-title svg[b-3wmr9ytppi] { color: var(--color-primary); opacity: 0.6; flex-shrink: 0; }

.form-grid[b-3wmr9ytppi] { display: grid; grid-template-columns: repeat(3, 1fr); gap: var(--space-4); }
.form-group[b-3wmr9ytppi] { display: flex; flex-direction: column; }
.form-label[b-3wmr9ytppi] { font-size: var(--font-size-xs); font-weight: var(--font-weight-medium); color: var(--text-secondary); text-transform: uppercase; letter-spacing: 0.3px; margin-bottom: var(--space-1); }
.form-control[b-3wmr9ytppi] { padding: var(--space-2) var(--space-3); font-size: var(--font-size-sm); color: var(--color-gray-700); border: var(--border-width-thin) solid var(--border-color-light); background-color: var(--color-white); transition: border-color var(--transition-fast) var(--transition-ease); }
.form-control:focus[b-3wmr9ytppi] { border-color: var(--color-primary); outline: none; box-shadow: none; }
.form-control[b-3wmr9ytppi]::placeholder { color: var(--color-gray-400); }
.form-control-static[b-3wmr9ytppi] { padding: var(--space-2) var(--space-3); font-size: var(--font-size-sm); color: var(--text-muted); background-color: var(--color-gray-50); border: var(--border-width-thin) solid var(--border-color-light); font-family: var(--font-mono); }

.form-actions[b-3wmr9ytppi] { display: flex; justify-content: flex-end; gap: var(--space-3); padding-top: var(--space-4); border-top: var(--border-width-thin) solid var(--border-color-light); }
.form-actions .btn[b-3wmr9ytppi] { display: inline-flex; align-items: center; gap: var(--space-2); padding: var(--space-2) var(--space-5); font-size: var(--font-size-sm); font-weight: var(--font-weight-medium); cursor: pointer; text-decoration: none; }
.btn-action[b-3wmr9ytppi] { background-color: var(--color-action); color: var(--text-on-action); border: var(--border-width-thin) solid var(--color-action); transition: background-color var(--transition-fast) var(--transition-ease); }
.btn-action:hover[b-3wmr9ytppi] { background-color: var(--color-action-hover); border-color: var(--color-action-hover); color: var(--text-on-action); }
.btn-action:disabled[b-3wmr9ytppi] { opacity: 0.65; cursor: not-allowed; }
.btn-outline-primary[b-3wmr9ytppi] { background: transparent; color: var(--color-primary); border: var(--border-width-thin) solid var(--color-primary); }
.btn-outline-primary:hover[b-3wmr9ytppi] { background-color: var(--color-primary); color: var(--text-on-primary); text-decoration: none; }

[b-3wmr9ytppi] .validation-message { color: var(--color-danger); font-size: var(--font-size-xs); margin-top: 2px; }

@media (max-width: 768px) {
    .form-grid[b-3wmr9ytppi] { grid-template-columns: 1fr; }
    .form-actions[b-3wmr9ytppi] { flex-direction: column-reverse; }
    .form-actions .btn[b-3wmr9ytppi] { justify-content: center; }
}
/* /Components/Pages/Warehouse/ProductSubgroupEdit.razor.rz.scp.css */
/* ===========================
   ProductSubgroupEdit - Scoped Styles
   Flat Industrial Minimal
   =========================== */

.page-container[b-li0yy5wrn1] { max-width: 900px; margin: 0 auto; padding: var(--space-6) var(--space-4); }
.page-header[b-li0yy5wrn1] { display: flex; align-items: center; gap: var(--space-4); margin-bottom: var(--space-6); }
.btn-back[b-li0yy5wrn1] { display: inline-flex; align-items: center; justify-content: center; width: 40px; height: 40px; color: var(--text-muted); border: var(--border-width-thin) solid var(--border-color-light); text-decoration: none; transition: all var(--transition-fast) var(--transition-ease); flex-shrink: 0; }
.btn-back:hover[b-li0yy5wrn1] { color: var(--color-primary); border-color: var(--color-primary); background-color: var(--color-gray-50); text-decoration: none; }
.page-header-text[b-li0yy5wrn1] { flex: 1; }
.page-title[b-li0yy5wrn1] { font-size: var(--font-size-xl); font-weight: var(--font-weight-bold); color: var(--color-primary); display: flex; align-items: center; gap: var(--space-2); margin: 0; }
.page-title svg[b-li0yy5wrn1] { color: var(--color-primary); flex-shrink: 0; }
.page-subtitle[b-li0yy5wrn1] { color: var(--text-muted); font-size: var(--font-size-sm); margin: 2px 0 0 0; display: flex; align-items: center; gap: var(--space-2); }
.subtitle-code[b-li0yy5wrn1] { font-family: var(--font-mono); font-size: var(--font-size-xs); color: var(--color-primary); opacity: 0.6; padding: 1px var(--space-2); background-color: var(--color-gray-100); }

.alert-bar[b-li0yy5wrn1] { display: flex; align-items: center; gap: var(--space-2); padding: var(--space-3) var(--space-4); margin-bottom: var(--space-4); font-size: var(--font-size-sm); font-weight: var(--font-weight-medium); border-left: var(--border-width-thick) solid; }
.alert-bar-danger[b-li0yy5wrn1] { background-color: #fdeded; border-left-color: var(--color-danger); color: #5f2120; }
.alert-bar-close[b-li0yy5wrn1] { margin-left: auto; background: none; border: none; font-size: var(--font-size-lg); cursor: pointer; color: inherit; opacity: 0.6; line-height: 1; }
.alert-bar-close:hover[b-li0yy5wrn1] { opacity: 1; }

.loading-state[b-li0yy5wrn1] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: var(--space-16) 0; color: var(--text-muted); gap: var(--space-4); }
.empty-state[b-li0yy5wrn1] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: var(--space-16) 0; color: var(--text-muted); gap: var(--space-3); }
.empty-state svg[b-li0yy5wrn1] { opacity: 0.4; }
.empty-state-text[b-li0yy5wrn1] { font-size: var(--font-size-base); margin: 0; }

.form-section[b-li0yy5wrn1] { margin-bottom: var(--space-6); padding: var(--space-5); background-color: var(--color-white); border: var(--border-width-thin) solid var(--border-color-light); }
.section-title[b-li0yy5wrn1] { display: flex; align-items: center; gap: var(--space-2); font-size: var(--font-size-sm); font-weight: var(--font-weight-semibold); color: var(--color-primary); text-transform: uppercase; letter-spacing: 0.5px; margin: 0 0 var(--space-4) 0; padding-bottom: var(--space-3); border-bottom: var(--border-width-thin) solid var(--border-color-light); }
.section-title svg[b-li0yy5wrn1] { color: var(--color-primary); opacity: 0.6; flex-shrink: 0; }

.form-grid[b-li0yy5wrn1] { display: grid; grid-template-columns: repeat(3, 1fr); gap: var(--space-4); }
.form-group[b-li0yy5wrn1] { display: flex; flex-direction: column; }
.form-label[b-li0yy5wrn1] { font-size: var(--font-size-xs); font-weight: var(--font-weight-medium); color: var(--text-secondary); text-transform: uppercase; letter-spacing: 0.3px; margin-bottom: var(--space-1); }
.form-control[b-li0yy5wrn1] { padding: var(--space-2) var(--space-3); font-size: var(--font-size-sm); color: var(--color-gray-700); border: var(--border-width-thin) solid var(--border-color-light); background-color: var(--color-white); transition: border-color var(--transition-fast) var(--transition-ease); }
.form-control:focus[b-li0yy5wrn1] { border-color: var(--color-primary); outline: none; box-shadow: none; }
.form-control[b-li0yy5wrn1]::placeholder { color: var(--color-gray-400); }
.form-control-static[b-li0yy5wrn1] { padding: var(--space-2) var(--space-3); font-size: var(--font-size-sm); color: var(--text-muted); background-color: var(--color-gray-50); border: var(--border-width-thin) solid var(--border-color-light); font-family: var(--font-mono); }

.form-actions[b-li0yy5wrn1] { display: flex; justify-content: flex-end; gap: var(--space-3); padding-top: var(--space-4); border-top: var(--border-width-thin) solid var(--border-color-light); }
.form-actions .btn[b-li0yy5wrn1] { display: inline-flex; align-items: center; gap: var(--space-2); padding: var(--space-2) var(--space-5); font-size: var(--font-size-sm); font-weight: var(--font-weight-medium); cursor: pointer; text-decoration: none; }
.btn-action[b-li0yy5wrn1] { background-color: var(--color-action); color: var(--text-on-action); border: var(--border-width-thin) solid var(--color-action); transition: background-color var(--transition-fast) var(--transition-ease); }
.btn-action:hover[b-li0yy5wrn1] { background-color: var(--color-action-hover); border-color: var(--color-action-hover); color: var(--text-on-action); }
.btn-action:disabled[b-li0yy5wrn1] { opacity: 0.65; cursor: not-allowed; }
.btn-outline-primary[b-li0yy5wrn1] { background: transparent; color: var(--color-primary); border: var(--border-width-thin) solid var(--color-primary); }
.btn-outline-primary:hover[b-li0yy5wrn1] { background-color: var(--color-primary); color: var(--text-on-primary); text-decoration: none; }

[b-li0yy5wrn1] .validation-message { color: var(--color-danger); font-size: var(--font-size-xs); margin-top: 2px; }

@media (max-width: 768px) {
    .form-grid[b-li0yy5wrn1] { grid-template-columns: 1fr; }
    .form-actions[b-li0yy5wrn1] { flex-direction: column-reverse; }
    .form-actions .btn[b-li0yy5wrn1] { justify-content: center; }
}
/* /Components/Pages/Warehouse/ProductSubgroupList.razor.rz.scp.css */
/* ===========================
   ProductSubgroupList - Scoped Styles
   Flat Industrial Minimal
   =========================== */

.page-container[b-jc9ck6p6ry] { max-width: 1200px; margin: 0 auto; padding: var(--space-6) var(--space-4); }
.page-header[b-jc9ck6p6ry] { display: flex; justify-content: space-between; align-items: flex-start; margin-bottom: var(--space-6); gap: var(--space-4); }
.page-header-left[b-jc9ck6p6ry] { flex: 1; }
.page-header-right[b-jc9ck6p6ry] { flex-shrink: 0; }
.page-header-top[b-jc9ck6p6ry] { display: flex; align-items: center; gap: var(--space-4); }
.btn-back[b-jc9ck6p6ry] { display: inline-flex; align-items: center; justify-content: center; width: 40px; height: 40px; color: var(--text-muted); border: var(--border-width-thin) solid var(--border-color-light); text-decoration: none; transition: all var(--transition-fast) var(--transition-ease); flex-shrink: 0; }
.btn-back:hover[b-jc9ck6p6ry] { color: var(--color-primary); border-color: var(--color-primary); background-color: var(--color-gray-50); text-decoration: none; }
.page-title[b-jc9ck6p6ry] { font-size: var(--font-size-2xl); font-weight: var(--font-weight-bold); color: var(--color-primary); display: flex; align-items: center; gap: var(--space-2); margin: 0; }
.page-title svg[b-jc9ck6p6ry] { color: var(--color-primary); flex-shrink: 0; }
.page-subtitle[b-jc9ck6p6ry] { color: var(--text-muted); font-size: var(--font-size-sm); margin: var(--space-1) 0 0 0; display: flex; align-items: center; gap: var(--space-2); }
.subtitle-code[b-jc9ck6p6ry] { font-family: var(--font-mono); font-size: var(--font-size-xs); color: var(--color-primary); opacity: 0.6; padding: 1px var(--space-2); background-color: var(--color-gray-100); }

.btn-action[b-jc9ck6p6ry] { display: inline-flex; align-items: center; gap: var(--space-2); padding: var(--space-2) var(--space-4); background-color: var(--color-action); color: var(--text-on-action); border: var(--border-width-thin) solid var(--color-action); font-size: var(--font-size-sm); font-weight: var(--font-weight-medium); text-decoration: none; cursor: pointer; transition: background-color var(--transition-fast) var(--transition-ease), box-shadow var(--transition-fast) var(--transition-ease); }
.btn-action:hover[b-jc9ck6p6ry] { background-color: var(--color-action-hover); border-color: var(--color-action-hover); color: var(--text-on-action); text-decoration: none; box-shadow: var(--shadow-sm); }
.btn-action:active[b-jc9ck6p6ry] { background-color: var(--color-action-active); }

.alert-bar[b-jc9ck6p6ry] { display: flex; align-items: center; gap: var(--space-2); padding: var(--space-3) var(--space-4); margin-bottom: var(--space-4); font-size: var(--font-size-sm); font-weight: var(--font-weight-medium); border-left: var(--border-width-thick) solid; }
.alert-bar-success[b-jc9ck6p6ry] { background-color: #edf7ed; border-left-color: var(--color-success); color: #1e4620; }
.alert-bar-danger[b-jc9ck6p6ry] { background-color: #fdeded; border-left-color: var(--color-danger); color: #5f2120; }
.alert-bar-close[b-jc9ck6p6ry] { margin-left: auto; background: none; border: none; font-size: var(--font-size-lg); cursor: pointer; color: inherit; opacity: 0.6; line-height: 1; }
.alert-bar-close:hover[b-jc9ck6p6ry] { opacity: 1; }

.search-bar[b-jc9ck6p6ry] { display: flex; align-items: center; gap: var(--space-4); margin-bottom: var(--space-4); padding: var(--space-3) var(--space-4); background-color: var(--bg-secondary); border: var(--border-width-thin) solid var(--border-color-light); }
.search-input-wrapper[b-jc9ck6p6ry] { display: flex; align-items: center; flex: 1; position: relative; }
.search-icon[b-jc9ck6p6ry] { color: var(--text-muted); flex-shrink: 0; margin-right: var(--space-2); }
.search-input[b-jc9ck6p6ry] { flex: 1; border: none; background: transparent; font-size: var(--font-size-sm); color: var(--color-gray-700); outline: none; padding: var(--space-1) 0; }
.search-input[b-jc9ck6p6ry]::placeholder { color: var(--text-muted); }
.search-clear[b-jc9ck6p6ry] { background: none; border: none; cursor: pointer; color: var(--text-muted); padding: var(--space-1); display: flex; align-items: center; }
.search-clear:hover[b-jc9ck6p6ry] { color: var(--color-primary); }
.search-count[b-jc9ck6p6ry] { flex-shrink: 0; font-size: var(--font-size-xs); color: var(--text-muted); font-weight: var(--font-weight-medium); text-transform: uppercase; letter-spacing: 0.5px; }

.loading-state[b-jc9ck6p6ry] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: var(--space-16) 0; color: var(--text-muted); gap: var(--space-4); }
.empty-state[b-jc9ck6p6ry] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: var(--space-16) 0; color: var(--text-muted); gap: var(--space-3); }
.empty-state svg[b-jc9ck6p6ry] { opacity: 0.4; }
.empty-state-text[b-jc9ck6p6ry] { font-size: var(--font-size-base); margin: 0; }

.item-list[b-jc9ck6p6ry] { display: flex; flex-direction: column; border: var(--border-width-thin) solid var(--border-color-light); }
.item-row[b-jc9ck6p6ry] { display: flex; align-items: center; gap: var(--space-4); padding: var(--space-4); border-bottom: var(--border-width-thin) solid var(--border-color-light); transition: background-color var(--transition-fast) var(--transition-ease); }
.item-row:last-child[b-jc9ck6p6ry] { border-bottom: none; }
.item-row:hover[b-jc9ck6p6ry] { background-color: rgba(11, 36, 62, 0.03); }

.item-avatar[b-jc9ck6p6ry] { flex-shrink: 0; width: 40px; height: 40px; display: flex; align-items: center; justify-content: center; background-color: var(--color-gray-100); color: var(--color-primary); }
.item-info[b-jc9ck6p6ry] { flex: 1; min-width: 0; }
.item-name[b-jc9ck6p6ry] { font-size: var(--font-size-base); font-weight: var(--font-weight-semibold); color: var(--color-primary); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.item-meta[b-jc9ck6p6ry] { display: flex; align-items: center; gap: var(--space-1); flex-wrap: wrap; font-size: var(--font-size-xs); color: var(--text-secondary); margin-top: 2px; }
.item-code[b-jc9ck6p6ry] { font-family: var(--font-mono); font-weight: var(--font-weight-medium); color: var(--color-primary); opacity: 0.7; }

.item-actions[b-jc9ck6p6ry] { flex-shrink: 0; display: flex; align-items: center; gap: var(--space-1); }
.btn-icon[b-jc9ck6p6ry] { display: inline-flex; align-items: center; justify-content: center; width: 36px; height: 36px; background: none; border: var(--border-width-thin) solid transparent; cursor: pointer; color: var(--text-muted); text-decoration: none; transition: all var(--transition-fast) var(--transition-ease); }
.btn-icon:hover[b-jc9ck6p6ry] { color: var(--color-primary); background-color: var(--color-gray-100); border-color: var(--border-color-light); text-decoration: none; }
.btn-icon-danger:hover[b-jc9ck6p6ry] { color: var(--color-action); background-color: rgba(178, 34, 34, 0.06); border-color: rgba(178, 34, 34, 0.2); }

.overlay[b-jc9ck6p6ry] { position: fixed; inset: 0; background-color: rgba(0, 0, 0, 0.4); display: flex; align-items: center; justify-content: center; z-index: var(--z-modal-backdrop); }
.confirm-dialog[b-jc9ck6p6ry] { background-color: var(--color-white); padding: var(--space-8); max-width: 420px; width: 90%; box-shadow: var(--shadow-xl); text-align: center; z-index: var(--z-modal); }
.confirm-icon[b-jc9ck6p6ry] { color: var(--color-action); margin-bottom: var(--space-4); }
.confirm-dialog h3[b-jc9ck6p6ry] { font-size: var(--font-size-lg); font-weight: var(--font-weight-semibold); color: var(--color-primary); margin: 0 0 var(--space-2) 0; }
.confirm-dialog p[b-jc9ck6p6ry] { font-size: var(--font-size-sm); color: var(--text-secondary); margin: 0 0 var(--space-2) 0; }
.confirm-warning[b-jc9ck6p6ry] { font-size: var(--font-size-xs) !important; color: var(--color-action) !important; font-weight: var(--font-weight-medium); }
.confirm-actions[b-jc9ck6p6ry] { display: flex; gap: var(--space-3); justify-content: center; margin-top: var(--space-6); }
.confirm-actions .btn[b-jc9ck6p6ry] { min-width: 100px; padding: var(--space-2) var(--space-4); font-size: var(--font-size-sm); font-weight: var(--font-weight-medium); cursor: pointer; }
.btn-outline-primary[b-jc9ck6p6ry] { background: transparent; color: var(--color-primary); border: var(--border-width-thin) solid var(--color-primary); }
.btn-outline-primary:hover[b-jc9ck6p6ry] { background-color: var(--color-primary); color: var(--text-on-primary); }

@media (max-width: 768px) {
    .page-header[b-jc9ck6p6ry] { flex-direction: column; gap: var(--space-3); }
    .item-row[b-jc9ck6p6ry] { flex-wrap: wrap; }
    .item-actions[b-jc9ck6p6ry] { order: 6; margin-left: auto; }
}
/* /Components/Pages/Warehouse/Reports/ArticleBarcodeGroup1MeatReport.razor.rz.scp.css */
/* ===========================
   ArticleBarcodeGroup1MeatReport - Scoped Styles
   Flat Industrial Minimal
   =========================== */

/* Page Container */
.page-container[b-py28rd6xmc] {
    max-width: 1600px;
    margin: 0 auto;
    padding: var(--space-6) var(--space-4);
}

/* Header */
.page-header[b-py28rd6xmc] {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    margin-bottom: var(--space-6);
    gap: var(--space-4);
}

.page-header-left[b-py28rd6xmc] {
    flex: 1;
}

.page-header-right[b-py28rd6xmc] {
    flex-shrink: 0;
}

.page-title[b-py28rd6xmc] {
    font-size: var(--font-size-2xl);
    font-weight: var(--font-weight-bold);
    color: var(--color-primary);
    display: flex;
    align-items: center;
    gap: var(--space-2);
    margin: 0;
}

.page-title svg[b-py28rd6xmc] {
    color: var(--color-primary);
    flex-shrink: 0;
}

.page-subtitle[b-py28rd6xmc] {
    color: var(--text-muted);
    font-size: var(--font-size-sm);
    margin: var(--space-1) 0 0 0;
}

/* Back Button */
.btn-back[b-py28rd6xmc] {
    display: inline-flex;
    align-items: center;
    gap: var(--space-1);
    padding: var(--space-2) var(--space-4);
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-medium);
    border: var(--border-width-thin) solid var(--border-color-light);
    color: var(--text-secondary);
    background-color: var(--bg-primary);
    text-decoration: none;
    transition: all var(--transition-fast) var(--transition-ease);
}

.btn-back:hover[b-py28rd6xmc] {
    border-color: var(--color-primary);
    color: var(--color-primary);
}

/* Alert Bar */
.alert-bar[b-py28rd6xmc] {
    display: flex;
    align-items: center;
    gap: var(--space-2);
    padding: var(--space-3) var(--space-4);
    margin-bottom: var(--space-4);
    font-size: var(--font-size-sm);
}

.alert-bar-danger[b-py28rd6xmc] {
    background-color: var(--color-red-50);
    color: var(--color-red-700);
    border: var(--border-width-thin) solid var(--color-red-200);
}

.alert-bar-close[b-py28rd6xmc] {
    margin-left: auto;
    background: none;
    border: none;
    font-size: var(--font-size-lg);
    cursor: pointer;
    color: inherit;
    opacity: 0.6;
    line-height: 1;
}

.alert-bar-close:hover[b-py28rd6xmc] {
    opacity: 1;
}

/* Search Bar */
.search-bar[b-py28rd6xmc] {
    display: flex;
    align-items: center;
    gap: var(--space-4);
    margin-bottom: var(--space-4);
    padding: var(--space-3) var(--space-4);
    background-color: var(--bg-secondary);
    border: var(--border-width-thin) solid var(--border-color-light);
}

.search-input-wrapper[b-py28rd6xmc] {
    display: flex;
    align-items: center;
    flex: 1;
    position: relative;
}

.search-icon[b-py28rd6xmc] {
    color: var(--text-muted);
    flex-shrink: 0;
    margin-right: var(--space-2);
}

.search-input[b-py28rd6xmc] {
    flex: 1;
    border: none;
    background: transparent;
    font-size: var(--font-size-sm);
    color: var(--color-gray-700);
    outline: none;
    padding: var(--space-1) 0;
}

.search-input[b-py28rd6xmc]::placeholder {
    color: var(--text-muted);
}

.search-clear[b-py28rd6xmc] {
    background: none;
    border: none;
    cursor: pointer;
    color: var(--text-muted);
    padding: var(--space-1);
    display: flex;
    align-items: center;
}

.search-clear:hover[b-py28rd6xmc] {
    color: var(--color-primary);
}

.search-count[b-py28rd6xmc] {
    flex-shrink: 0;
    font-size: var(--font-size-xs);
    color: var(--text-muted);
    font-weight: var(--font-weight-medium);
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

/* Loading / Empty States */
.loading-state[b-py28rd6xmc] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: var(--space-16) 0;
    color: var(--text-muted);
    gap: var(--space-4);
}

.empty-state[b-py28rd6xmc] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: var(--space-16) 0;
    color: var(--text-muted);
    gap: var(--space-3);
}

.empty-state svg[b-py28rd6xmc] {
    opacity: 0.4;
}

.empty-state-text[b-py28rd6xmc] {
    font-size: var(--font-size-base);
    margin: 0;
}

/* Outline Primary Button */
.btn-outline-primary[b-py28rd6xmc] {
    display: inline-flex;
    align-items: center;
    gap: var(--space-1);
    padding: var(--space-1) var(--space-3);
    font-size: var(--font-size-xs);
    font-weight: var(--font-weight-medium);
    border: var(--border-width-thin) solid var(--color-primary);
    color: var(--color-primary);
    background-color: transparent;
    cursor: pointer;
    transition: all var(--transition-fast) var(--transition-ease);
}

.btn-outline-primary:hover[b-py28rd6xmc] {
    background-color: var(--color-primary);
    color: var(--text-on-primary);
}

/* Report Table */
.report-table-wrapper[b-py28rd6xmc] {
    overflow-x: auto;
    border: var(--border-width-thin) solid var(--border-color-light);
}

.report-table[b-py28rd6xmc] {
    width: 100%;
    border-collapse: collapse;
    font-size: var(--font-size-sm);
    white-space: nowrap;
}

.report-table thead[b-py28rd6xmc] {
    background-color: var(--color-primary);
    color: var(--text-on-primary);
}

.report-table thead th[b-py28rd6xmc] {
    padding: var(--space-3) var(--space-3);
    font-weight: var(--font-weight-semibold);
    font-size: var(--font-size-xs);
    text-transform: uppercase;
    letter-spacing: 0.5px;
    border-bottom: 2px solid var(--color-primary);
    position: sticky;
    top: 0;
    z-index: 1;
}

.report-table tbody tr[b-py28rd6xmc] {
    border-bottom: var(--border-width-thin) solid var(--border-color-light);
    transition: background-color var(--transition-fast) var(--transition-ease);
}

.report-table tbody tr:last-child[b-py28rd6xmc] {
    border-bottom: none;
}

.report-table tbody tr:hover[b-py28rd6xmc] {
    background-color: rgba(11, 36, 62, 0.03);
}

.report-table td[b-py28rd6xmc] {
    padding: var(--space-2) var(--space-3);
    color: var(--text-secondary);
}

/* Column Types */
.col-code[b-py28rd6xmc] {
    text-align: left;
}

.col-text[b-py28rd6xmc] {
    text-align: left;
    max-width: 180px;
    overflow: hidden;
    text-overflow: ellipsis;
}

.col-num[b-py28rd6xmc] {
    text-align: right;
    font-family: var(--font-mono);
}

.col-date[b-py28rd6xmc] {
    text-align: center;
    font-family: var(--font-mono);
    font-size: var(--font-size-xs);
}

.col-kpi[b-py28rd6xmc] {
    text-align: center;
    width: 32px;
    padding-left: var(--space-2);
    padding-right: 0;
}

.kpi-dot[b-py28rd6xmc] {
    display: inline-block;
    width: 10px;
    height: 10px;
    border-radius: 50%;
}

.cell-code[b-py28rd6xmc] {
    font-family: var(--font-mono);
    font-weight: var(--font-weight-medium);
    color: var(--color-primary);
    opacity: 0.8;
}

.stock-value[b-py28rd6xmc] {
    font-weight: 800;
    font-size: var(--font-size-base);
    color: var(--text-primary);
    letter-spacing: -0.3px;
}

/* Group Header */
.group-header[b-py28rd6xmc] {
    background-color: rgba(11, 36, 62, 0.06);
    border-bottom: 2px solid rgba(11, 36, 62, 0.12);
    cursor: pointer;
    user-select: none;
}

.group-header:hover[b-py28rd6xmc] {
    background-color: rgba(11, 36, 62, 0.10);
}

.group-header td[b-py28rd6xmc] {
    padding: var(--space-3) var(--space-3);
    font-size: var(--font-size-sm);
    color: var(--color-primary);
}

.group-toggle[b-py28rd6xmc] {
    display: inline-block;
    vertical-align: middle;
    margin-right: var(--space-2);
    transition: transform 0.2s ease;
    flex-shrink: 0;
}

.group-header.collapsed .group-toggle[b-py28rd6xmc] {
    transform: rotate(-90deg);
}

.group-label[b-py28rd6xmc] {
    font-size: var(--font-size-sm);
    letter-spacing: 0.3px;
}

.group-count[b-py28rd6xmc] {
    margin-left: var(--space-4);
    font-size: var(--font-size-xs);
    font-weight: var(--font-weight-medium);
    color: var(--text-muted);
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.group-summary[b-py28rd6xmc] {
    margin-left: var(--space-4);
    font-size: var(--font-size-xs);
    font-family: var(--font-mono);
    color: var(--text-secondary);
    letter-spacing: 0.2px;
}

/* Group Subtotal */
.group-subtotal[b-py28rd6xmc] {
    background-color: rgba(11, 36, 62, 0.04);
    border-bottom: 2px solid rgba(11, 36, 62, 0.10);
}

.group-subtotal td[b-py28rd6xmc] {
    padding: var(--space-2) var(--space-3);
    font-family: var(--font-mono);
    color: var(--text-primary);
}

.subtotal-label[b-py28rd6xmc] {
    text-align: right;
    font-weight: var(--font-weight-semibold);
    font-size: var(--font-size-xs);
    text-transform: uppercase;
    letter-spacing: 0.5px;
    font-family: inherit;
    color: var(--text-muted);
    padding-right: var(--space-4);
}

/* Grand Total */
.grand-total[b-py28rd6xmc] {
    background-color: var(--color-primary);
    color: var(--text-on-primary);
}

.grand-total td[b-py28rd6xmc] {
    padding: var(--space-3) var(--space-3);
    font-family: var(--font-mono);
    color: var(--text-on-primary);
}

.grand-total .subtotal-label[b-py28rd6xmc] {
    color: var(--text-on-primary);
    opacity: 0.85;
}

/* Responsive */
@media (max-width: 768px) {
    .page-header[b-py28rd6xmc] {
        flex-direction: column;
        gap: var(--space-3);
    }

    .page-container[b-py28rd6xmc] {
        padding: var(--space-4) var(--space-2);
    }
}
/* /Components/Pages/Warehouse/Reports/ArticleBarcodeGroup2MeatReport.razor.rz.scp.css */
/* ===========================
   ArticleBarcodeGroup2MeatReport - Scoped Styles
   Flat Industrial Minimal
   =========================== */

/* Page Container */
.page-container[b-j6ohr2yq2k] {
    max-width: 1600px;
    margin: 0 auto;
    padding: var(--space-6) var(--space-4);
}

/* Header */
.page-header[b-j6ohr2yq2k] {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    margin-bottom: var(--space-6);
    gap: var(--space-4);
}

.page-header-left[b-j6ohr2yq2k] {
    flex: 1;
}

.page-header-right[b-j6ohr2yq2k] {
    flex-shrink: 0;
}

.page-title[b-j6ohr2yq2k] {
    font-size: var(--font-size-2xl);
    font-weight: var(--font-weight-bold);
    color: var(--color-primary);
    display: flex;
    align-items: center;
    gap: var(--space-2);
    margin: 0;
}

.page-title svg[b-j6ohr2yq2k] {
    color: var(--color-primary);
    flex-shrink: 0;
}

.page-subtitle[b-j6ohr2yq2k] {
    color: var(--text-muted);
    font-size: var(--font-size-sm);
    margin: var(--space-1) 0 0 0;
}

/* Back Button */
.btn-back[b-j6ohr2yq2k] {
    display: inline-flex;
    align-items: center;
    gap: var(--space-1);
    padding: var(--space-2) var(--space-4);
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-medium);
    border: var(--border-width-thin) solid var(--border-color-light);
    color: var(--text-secondary);
    background-color: var(--bg-primary);
    text-decoration: none;
    transition: all var(--transition-fast) var(--transition-ease);
}

.btn-back:hover[b-j6ohr2yq2k] {
    border-color: var(--color-primary);
    color: var(--color-primary);
}

/* Alert Bar */
.alert-bar[b-j6ohr2yq2k] {
    display: flex;
    align-items: center;
    gap: var(--space-2);
    padding: var(--space-3) var(--space-4);
    margin-bottom: var(--space-4);
    font-size: var(--font-size-sm);
}

.alert-bar-danger[b-j6ohr2yq2k] {
    background-color: var(--color-red-50);
    color: var(--color-red-700);
    border: var(--border-width-thin) solid var(--color-red-200);
}

.alert-bar-close[b-j6ohr2yq2k] {
    margin-left: auto;
    background: none;
    border: none;
    font-size: var(--font-size-lg);
    cursor: pointer;
    color: inherit;
    opacity: 0.6;
    line-height: 1;
}

.alert-bar-close:hover[b-j6ohr2yq2k] {
    opacity: 1;
}

/* Search Bar */
.search-bar[b-j6ohr2yq2k] {
    display: flex;
    align-items: center;
    gap: var(--space-4);
    margin-bottom: var(--space-4);
    padding: var(--space-3) var(--space-4);
    background-color: var(--bg-secondary);
    border: var(--border-width-thin) solid var(--border-color-light);
}

.search-input-wrapper[b-j6ohr2yq2k] {
    display: flex;
    align-items: center;
    flex: 1;
    position: relative;
}

.search-icon[b-j6ohr2yq2k] {
    color: var(--text-muted);
    flex-shrink: 0;
    margin-right: var(--space-2);
}

.search-input[b-j6ohr2yq2k] {
    flex: 1;
    border: none;
    background: transparent;
    font-size: var(--font-size-sm);
    color: var(--color-gray-700);
    outline: none;
    padding: var(--space-1) 0;
}

.search-input[b-j6ohr2yq2k]::placeholder {
    color: var(--text-muted);
}

.search-clear[b-j6ohr2yq2k] {
    background: none;
    border: none;
    cursor: pointer;
    color: var(--text-muted);
    padding: var(--space-1);
    display: flex;
    align-items: center;
}

.search-clear:hover[b-j6ohr2yq2k] {
    color: var(--color-primary);
}

.search-count[b-j6ohr2yq2k] {
    flex-shrink: 0;
    font-size: var(--font-size-xs);
    color: var(--text-muted);
    font-weight: var(--font-weight-medium);
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

/* Loading / Empty States */
.loading-state[b-j6ohr2yq2k] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: var(--space-16) 0;
    color: var(--text-muted);
    gap: var(--space-4);
}

.empty-state[b-j6ohr2yq2k] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: var(--space-16) 0;
    color: var(--text-muted);
    gap: var(--space-3);
}

.empty-state svg[b-j6ohr2yq2k] {
    opacity: 0.4;
}

.empty-state-text[b-j6ohr2yq2k] {
    font-size: var(--font-size-base);
    margin: 0;
}

/* Outline Primary Button */
.btn-outline-primary[b-j6ohr2yq2k] {
    display: inline-flex;
    align-items: center;
    gap: var(--space-1);
    padding: var(--space-1) var(--space-3);
    font-size: var(--font-size-xs);
    font-weight: var(--font-weight-medium);
    border: var(--border-width-thin) solid var(--color-primary);
    color: var(--color-primary);
    background-color: transparent;
    cursor: pointer;
    transition: all var(--transition-fast) var(--transition-ease);
}

.btn-outline-primary:hover[b-j6ohr2yq2k] {
    background-color: var(--color-primary);
    color: var(--text-on-primary);
}

/* Report Table */
.report-table-wrapper[b-j6ohr2yq2k] {
    overflow-x: auto;
    border: var(--border-width-thin) solid var(--border-color-light);
}

.report-table[b-j6ohr2yq2k] {
    width: 100%;
    border-collapse: collapse;
    font-size: var(--font-size-sm);
    white-space: nowrap;
}

.report-table thead[b-j6ohr2yq2k] {
    background-color: var(--color-primary);
    color: var(--text-on-primary);
}

.report-table thead th[b-j6ohr2yq2k] {
    padding: var(--space-3) var(--space-3);
    font-weight: var(--font-weight-semibold);
    font-size: var(--font-size-xs);
    text-transform: uppercase;
    letter-spacing: 0.5px;
    border-bottom: 2px solid var(--color-primary);
    position: sticky;
    top: 0;
    z-index: 1;
}

.report-table tbody tr[b-j6ohr2yq2k] {
    border-bottom: var(--border-width-thin) solid var(--border-color-light);
    transition: background-color var(--transition-fast) var(--transition-ease);
}

.report-table tbody tr:last-child[b-j6ohr2yq2k] {
    border-bottom: none;
}

.report-table tbody tr:hover[b-j6ohr2yq2k] {
    background-color: rgba(11, 36, 62, 0.03);
}

.report-table td[b-j6ohr2yq2k] {
    padding: var(--space-2) var(--space-3);
    color: var(--text-secondary);
}

/* Column Types */
.col-code[b-j6ohr2yq2k] {
    text-align: left;
}

.col-text[b-j6ohr2yq2k] {
    text-align: left;
    max-width: 180px;
    overflow: hidden;
    text-overflow: ellipsis;
}

.col-num[b-j6ohr2yq2k] {
    text-align: right;
    font-family: var(--font-mono);
}

.col-date[b-j6ohr2yq2k] {
    text-align: center;
    font-family: var(--font-mono);
    font-size: var(--font-size-xs);
}

.col-kpi[b-j6ohr2yq2k] {
    text-align: center;
    width: 32px;
    padding-left: var(--space-2);
    padding-right: 0;
}

.kpi-dot[b-j6ohr2yq2k] {
    display: inline-block;
    width: 10px;
    height: 10px;
    border-radius: 50%;
}

.cell-code[b-j6ohr2yq2k] {
    font-family: var(--font-mono);
    font-weight: var(--font-weight-medium);
    color: var(--color-primary);
    opacity: 0.8;
}

.stock-value[b-j6ohr2yq2k] {
    font-weight: 800;
    font-size: var(--font-size-base);
    color: var(--text-primary);
    letter-spacing: -0.3px;
}

/* Group Header */
.group-header[b-j6ohr2yq2k] {
    background-color: rgba(11, 36, 62, 0.06);
    border-bottom: 2px solid rgba(11, 36, 62, 0.12);
    cursor: pointer;
    user-select: none;
}

.group-header:hover[b-j6ohr2yq2k] {
    background-color: rgba(11, 36, 62, 0.10);
}

.group-header td[b-j6ohr2yq2k] {
    padding: var(--space-3) var(--space-3);
    font-size: var(--font-size-sm);
    color: var(--color-primary);
}

.group-toggle[b-j6ohr2yq2k] {
    display: inline-block;
    vertical-align: middle;
    margin-right: var(--space-2);
    transition: transform 0.2s ease;
    flex-shrink: 0;
}

.group-header.collapsed .group-toggle[b-j6ohr2yq2k] {
    transform: rotate(-90deg);
}

.group-label[b-j6ohr2yq2k] {
    font-size: var(--font-size-sm);
    letter-spacing: 0.3px;
}

.group-count[b-j6ohr2yq2k] {
    margin-left: var(--space-4);
    font-size: var(--font-size-xs);
    font-weight: var(--font-weight-medium);
    color: var(--text-muted);
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.group-summary[b-j6ohr2yq2k] {
    margin-left: var(--space-4);
    font-size: var(--font-size-xs);
    font-family: var(--font-mono);
    color: var(--text-secondary);
    letter-spacing: 0.2px;
}

/* Group Subtotal */
.group-subtotal[b-j6ohr2yq2k] {
    background-color: rgba(11, 36, 62, 0.04);
    border-bottom: 2px solid rgba(11, 36, 62, 0.10);
}

.group-subtotal td[b-j6ohr2yq2k] {
    padding: var(--space-2) var(--space-3);
    font-family: var(--font-mono);
    color: var(--text-primary);
}

.subtotal-label[b-j6ohr2yq2k] {
    text-align: right;
    font-weight: var(--font-weight-semibold);
    font-size: var(--font-size-xs);
    text-transform: uppercase;
    letter-spacing: 0.5px;
    font-family: inherit;
    color: var(--text-muted);
    padding-right: var(--space-4);
}

/* Grand Total */
.grand-total[b-j6ohr2yq2k] {
    background-color: var(--color-primary);
    color: var(--text-on-primary);
}

.grand-total td[b-j6ohr2yq2k] {
    padding: var(--space-3) var(--space-3);
    font-family: var(--font-mono);
    color: var(--text-on-primary);
}

.grand-total .subtotal-label[b-j6ohr2yq2k] {
    color: var(--text-on-primary);
    opacity: 0.85;
}

/* Responsive */
@media (max-width: 768px) {
    .page-header[b-j6ohr2yq2k] {
        flex-direction: column;
        gap: var(--space-3);
    }

    .page-container[b-j6ohr2yq2k] {
        padding: var(--space-4) var(--space-2);
    }
}
/* /Components/Pages/Warehouse/Reports/ArticleBarcodeGroup3MeatReport.razor.rz.scp.css */
/* ===========================
   ArticleBarcodeGroup3MeatReport - Scoped Styles
   Flat Industrial Minimal
   =========================== */

/* Page Container */
.page-container[b-6841yti1ce] {
    max-width: 1600px;
    margin: 0 auto;
    padding: var(--space-6) var(--space-4);
}

/* Header */
.page-header[b-6841yti1ce] {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    margin-bottom: var(--space-6);
    gap: var(--space-4);
}

.page-header-left[b-6841yti1ce] {
    flex: 1;
}

.page-header-right[b-6841yti1ce] {
    flex-shrink: 0;
}

.page-title[b-6841yti1ce] {
    font-size: var(--font-size-2xl);
    font-weight: var(--font-weight-bold);
    color: var(--color-primary);
    display: flex;
    align-items: center;
    gap: var(--space-2);
    margin: 0;
}

.page-title svg[b-6841yti1ce] {
    color: var(--color-primary);
    flex-shrink: 0;
}

.page-subtitle[b-6841yti1ce] {
    color: var(--text-muted);
    font-size: var(--font-size-sm);
    margin: var(--space-1) 0 0 0;
}

/* Back Button */
.btn-back[b-6841yti1ce] {
    display: inline-flex;
    align-items: center;
    gap: var(--space-1);
    padding: var(--space-2) var(--space-4);
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-medium);
    border: var(--border-width-thin) solid var(--border-color-light);
    color: var(--text-secondary);
    background-color: var(--bg-primary);
    text-decoration: none;
    transition: all var(--transition-fast) var(--transition-ease);
}

.btn-back:hover[b-6841yti1ce] {
    border-color: var(--color-primary);
    color: var(--color-primary);
}

/* Alert Bar */
.alert-bar[b-6841yti1ce] {
    display: flex;
    align-items: center;
    gap: var(--space-2);
    padding: var(--space-3) var(--space-4);
    margin-bottom: var(--space-4);
    font-size: var(--font-size-sm);
}

.alert-bar-danger[b-6841yti1ce] {
    background-color: var(--color-red-50);
    color: var(--color-red-700);
    border: var(--border-width-thin) solid var(--color-red-200);
}

.alert-bar-close[b-6841yti1ce] {
    margin-left: auto;
    background: none;
    border: none;
    font-size: var(--font-size-lg);
    cursor: pointer;
    color: inherit;
    opacity: 0.6;
    line-height: 1;
}

.alert-bar-close:hover[b-6841yti1ce] {
    opacity: 1;
}

/* Search Bar */
.search-bar[b-6841yti1ce] {
    display: flex;
    align-items: center;
    gap: var(--space-4);
    margin-bottom: var(--space-4);
    padding: var(--space-3) var(--space-4);
    background-color: var(--bg-secondary);
    border: var(--border-width-thin) solid var(--border-color-light);
}

.search-input-wrapper[b-6841yti1ce] {
    display: flex;
    align-items: center;
    flex: 1;
    position: relative;
}

.search-icon[b-6841yti1ce] {
    color: var(--text-muted);
    flex-shrink: 0;
    margin-right: var(--space-2);
}

.search-input[b-6841yti1ce] {
    flex: 1;
    border: none;
    background: transparent;
    font-size: var(--font-size-sm);
    color: var(--color-gray-700);
    outline: none;
    padding: var(--space-1) 0;
}

.search-input[b-6841yti1ce]::placeholder {
    color: var(--text-muted);
}

.search-clear[b-6841yti1ce] {
    background: none;
    border: none;
    cursor: pointer;
    color: var(--text-muted);
    padding: var(--space-1);
    display: flex;
    align-items: center;
}

.search-clear:hover[b-6841yti1ce] {
    color: var(--color-primary);
}

.search-count[b-6841yti1ce] {
    flex-shrink: 0;
    font-size: var(--font-size-xs);
    color: var(--text-muted);
    font-weight: var(--font-weight-medium);
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

/* Loading / Empty States */
.loading-state[b-6841yti1ce] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: var(--space-16) 0;
    color: var(--text-muted);
    gap: var(--space-4);
}

.empty-state[b-6841yti1ce] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: var(--space-16) 0;
    color: var(--text-muted);
    gap: var(--space-3);
}

.empty-state svg[b-6841yti1ce] {
    opacity: 0.4;
}

.empty-state-text[b-6841yti1ce] {
    font-size: var(--font-size-base);
    margin: 0;
}

/* Outline Primary Button */
.btn-outline-primary[b-6841yti1ce] {
    display: inline-flex;
    align-items: center;
    gap: var(--space-1);
    padding: var(--space-1) var(--space-3);
    font-size: var(--font-size-xs);
    font-weight: var(--font-weight-medium);
    border: var(--border-width-thin) solid var(--color-primary);
    color: var(--color-primary);
    background-color: transparent;
    cursor: pointer;
    transition: all var(--transition-fast) var(--transition-ease);
}

.btn-outline-primary:hover[b-6841yti1ce] {
    background-color: var(--color-primary);
    color: var(--text-on-primary);
}

/* Report Table */
.report-table-wrapper[b-6841yti1ce] {
    overflow-x: auto;
    border: var(--border-width-thin) solid var(--border-color-light);
}

.report-table[b-6841yti1ce] {
    width: 100%;
    border-collapse: collapse;
    font-size: var(--font-size-sm);
    white-space: nowrap;
}

.report-table thead[b-6841yti1ce] {
    background-color: var(--color-primary);
    color: var(--text-on-primary);
}

.report-table thead th[b-6841yti1ce] {
    padding: var(--space-3) var(--space-3);
    font-weight: var(--font-weight-semibold);
    font-size: var(--font-size-xs);
    text-transform: uppercase;
    letter-spacing: 0.5px;
    border-bottom: 2px solid var(--color-primary);
    position: sticky;
    top: 0;
    z-index: 1;
}

.report-table tbody tr[b-6841yti1ce] {
    border-bottom: var(--border-width-thin) solid var(--border-color-light);
    transition: background-color var(--transition-fast) var(--transition-ease);
}

.report-table tbody tr:last-child[b-6841yti1ce] {
    border-bottom: none;
}

.report-table tbody tr:hover[b-6841yti1ce] {
    background-color: rgba(11, 36, 62, 0.03);
}

.report-table td[b-6841yti1ce] {
    padding: var(--space-2) var(--space-3);
    color: var(--text-secondary);
}

/* Column Types */
.col-code[b-6841yti1ce] {
    text-align: left;
}

.col-text[b-6841yti1ce] {
    text-align: left;
    max-width: 180px;
    overflow: hidden;
    text-overflow: ellipsis;
}

.col-num[b-6841yti1ce] {
    text-align: right;
    font-family: var(--font-mono);
}

.col-date[b-6841yti1ce] {
    text-align: center;
    font-family: var(--font-mono);
    font-size: var(--font-size-xs);
}

.col-kpi[b-6841yti1ce] {
    text-align: center;
    width: 32px;
    padding-left: var(--space-2);
    padding-right: 0;
}

.kpi-dot[b-6841yti1ce] {
    display: inline-block;
    width: 10px;
    height: 10px;
    border-radius: 50%;
}

.cell-code[b-6841yti1ce] {
    font-family: var(--font-mono);
    font-weight: var(--font-weight-medium);
    color: var(--color-primary);
    opacity: 0.8;
}

.stock-value[b-6841yti1ce] {
    font-weight: 800;
    font-size: var(--font-size-base);
    color: var(--text-primary);
    letter-spacing: -0.3px;
}

/* Group Header */
.group-header[b-6841yti1ce] {
    background-color: rgba(11, 36, 62, 0.06);
    border-bottom: 2px solid rgba(11, 36, 62, 0.12);
    cursor: pointer;
    user-select: none;
}

.group-header:hover[b-6841yti1ce] {
    background-color: rgba(11, 36, 62, 0.10);
}

.group-header td[b-6841yti1ce] {
    padding: var(--space-3) var(--space-3);
    font-size: var(--font-size-sm);
    color: var(--color-primary);
}

.group-toggle[b-6841yti1ce] {
    display: inline-block;
    vertical-align: middle;
    margin-right: var(--space-2);
    transition: transform 0.2s ease;
    flex-shrink: 0;
}

.group-header.collapsed .group-toggle[b-6841yti1ce] {
    transform: rotate(-90deg);
}

.group-label[b-6841yti1ce] {
    font-size: var(--font-size-sm);
    letter-spacing: 0.3px;
}

.group-count[b-6841yti1ce] {
    margin-left: var(--space-4);
    font-size: var(--font-size-xs);
    font-weight: var(--font-weight-medium);
    color: var(--text-muted);
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.group-summary[b-6841yti1ce] {
    margin-left: var(--space-4);
    font-size: var(--font-size-xs);
    font-family: var(--font-mono);
    color: var(--text-secondary);
    letter-spacing: 0.2px;
}

/* Group Subtotal */
.group-subtotal[b-6841yti1ce] {
    background-color: rgba(11, 36, 62, 0.04);
    border-bottom: 2px solid rgba(11, 36, 62, 0.10);
}

.group-subtotal td[b-6841yti1ce] {
    padding: var(--space-2) var(--space-3);
    font-family: var(--font-mono);
    color: var(--text-primary);
}

.subtotal-label[b-6841yti1ce] {
    text-align: right;
    font-weight: var(--font-weight-semibold);
    font-size: var(--font-size-xs);
    text-transform: uppercase;
    letter-spacing: 0.5px;
    font-family: inherit;
    color: var(--text-muted);
    padding-right: var(--space-4);
}

/* Grand Total */
.grand-total[b-6841yti1ce] {
    background-color: var(--color-primary);
    color: var(--text-on-primary);
}

.grand-total td[b-6841yti1ce] {
    padding: var(--space-3) var(--space-3);
    font-family: var(--font-mono);
    color: var(--text-on-primary);
}

.grand-total .subtotal-label[b-6841yti1ce] {
    color: var(--text-on-primary);
    opacity: 0.85;
}

/* Responsive */
@media (max-width: 768px) {
    .page-header[b-6841yti1ce] {
        flex-direction: column;
        gap: var(--space-3);
    }

    .page-container[b-6841yti1ce] {
        padding: var(--space-4) var(--space-2);
    }
}
/* /Components/Pages/Warehouse/Reports/ArticleBarcodeMeatReport.razor.rz.scp.css */
/* ===========================
   ArticleBarcodeMeatReport - Scoped Styles
   Flat Industrial Minimal
   =========================== */

/* Page Container */
.page-container[b-jgertnxsf3] {
    max-width: 1600px;
    margin: 0 auto;
    padding: var(--space-6) var(--space-4);
}

/* Header */
.page-header[b-jgertnxsf3] {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    margin-bottom: var(--space-6);
    gap: var(--space-4);
}

.page-header-left[b-jgertnxsf3] {
    flex: 1;
}

.page-header-right[b-jgertnxsf3] {
    flex-shrink: 0;
}

.page-title[b-jgertnxsf3] {
    font-size: var(--font-size-2xl);
    font-weight: var(--font-weight-bold);
    color: var(--color-primary);
    display: flex;
    align-items: center;
    gap: var(--space-2);
    margin: 0;
}

.page-title svg[b-jgertnxsf3] {
    color: var(--color-primary);
    flex-shrink: 0;
}

/* Page Info (decoded parameters + description) */
.page-info[b-jgertnxsf3] {
    display: flex;
    flex-wrap: wrap;
    gap: var(--space-1) var(--space-6);
    margin-top: var(--space-2);
}

.page-info-row[b-jgertnxsf3] {
    display: flex;
    align-items: baseline;
    gap: var(--space-2);
}

.page-info-label[b-jgertnxsf3] {
    font-size: var(--font-size-xs);
    font-weight: var(--font-weight-medium);
    color: var(--text-muted);
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.page-info-value[b-jgertnxsf3] {
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-semibold);
    color: var(--color-primary);
    font-family: var(--font-mono);
}

.page-info-desc[b-jgertnxsf3] {
    font-family: inherit;
    font-weight: var(--font-weight-medium);
    color: var(--text-secondary);
}

/* Summary Stats */
.summary-stats[b-jgertnxsf3] {
    display: flex;
    flex-wrap: wrap;
    gap: var(--space-3);
    margin-bottom: var(--space-4);
}

.stat-card[b-jgertnxsf3] {
    display: flex;
    flex-direction: column;
    gap: var(--space-1);
    padding: var(--space-3) var(--space-4);
    background-color: var(--bg-secondary);
    border: var(--border-width-thin) solid var(--border-color-light);
    min-width: 130px;
    flex: 1;
}

.stat-label[b-jgertnxsf3] {
    font-size: var(--font-size-xs);
    font-weight: var(--font-weight-medium);
    color: var(--text-muted);
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.stat-value[b-jgertnxsf3] {
    font-size: var(--font-size-lg);
    font-weight: var(--font-weight-bold);
    color: var(--color-primary);
    font-family: var(--font-mono);
}

/* Back Button */
.btn-back[b-jgertnxsf3] {
    display: inline-flex;
    align-items: center;
    gap: var(--space-1);
    padding: var(--space-2) var(--space-4);
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-medium);
    border: var(--border-width-thin) solid var(--border-color-light);
    color: var(--text-secondary);
    background-color: var(--bg-primary);
    text-decoration: none;
    transition: all var(--transition-fast) var(--transition-ease);
}

.btn-back:hover[b-jgertnxsf3] {
    border-color: var(--color-primary);
    color: var(--color-primary);
}

/* Alert Bar */
.alert-bar[b-jgertnxsf3] {
    display: flex;
    align-items: center;
    gap: var(--space-2);
    padding: var(--space-3) var(--space-4);
    margin-bottom: var(--space-4);
    font-size: var(--font-size-sm);
}

.alert-bar-danger[b-jgertnxsf3] {
    background-color: var(--color-red-50);
    color: var(--color-red-700);
    border: var(--border-width-thin) solid var(--color-red-200);
}

.alert-bar-close[b-jgertnxsf3] {
    margin-left: auto;
    background: none;
    border: none;
    font-size: var(--font-size-lg);
    cursor: pointer;
    color: inherit;
    opacity: 0.6;
    line-height: 1;
}

.alert-bar-close:hover[b-jgertnxsf3] {
    opacity: 1;
}

/* View Links */
.view-links[b-jgertnxsf3] {
    display: flex;
    gap: var(--space-3);
    margin-bottom: var(--space-3);
}

.view-link[b-jgertnxsf3] {
    display: inline-flex;
    align-items: center;
    gap: var(--space-1);
    padding: var(--space-1) var(--space-3);
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-medium);
    color: var(--color-primary);
    text-decoration: none;
    border: var(--border-width-thin) solid var(--color-primary);
    background-color: transparent;
    transition: all var(--transition-fast) var(--transition-ease);
}

.view-link:hover[b-jgertnxsf3] {
    background-color: var(--color-primary);
    color: var(--text-on-primary);
}

/* Search Bar */
.search-bar[b-jgertnxsf3] {
    display: flex;
    align-items: center;
    gap: var(--space-4);
    margin-bottom: var(--space-4);
    padding: var(--space-3) var(--space-4);
    background-color: var(--bg-secondary);
    border: var(--border-width-thin) solid var(--border-color-light);
}

.search-input-wrapper[b-jgertnxsf3] {
    display: flex;
    align-items: center;
    flex: 1;
    position: relative;
}

.search-icon[b-jgertnxsf3] {
    color: var(--text-muted);
    flex-shrink: 0;
    margin-right: var(--space-2);
}

.search-input[b-jgertnxsf3] {
    flex: 1;
    border: none;
    background: transparent;
    font-size: var(--font-size-sm);
    color: var(--color-gray-700);
    outline: none;
    padding: var(--space-1) 0;
}

.search-input[b-jgertnxsf3]::placeholder {
    color: var(--text-muted);
}

.search-clear[b-jgertnxsf3] {
    background: none;
    border: none;
    cursor: pointer;
    color: var(--text-muted);
    padding: var(--space-1);
    display: flex;
    align-items: center;
}

.search-clear:hover[b-jgertnxsf3] {
    color: var(--color-primary);
}

.search-count[b-jgertnxsf3] {
    flex-shrink: 0;
    font-size: var(--font-size-xs);
    color: var(--text-muted);
    font-weight: var(--font-weight-medium);
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

/* Loading / Empty States */
.loading-state[b-jgertnxsf3] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: var(--space-16) 0;
    color: var(--text-muted);
    gap: var(--space-4);
}

.empty-state[b-jgertnxsf3] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: var(--space-16) 0;
    color: var(--text-muted);
    gap: var(--space-3);
}

.empty-state svg[b-jgertnxsf3] {
    opacity: 0.4;
}

.empty-state-text[b-jgertnxsf3] {
    font-size: var(--font-size-base);
    margin: 0;
}

/* Outline Primary Button */
.btn-outline-primary[b-jgertnxsf3] {
    display: inline-flex;
    align-items: center;
    gap: var(--space-1);
    padding: var(--space-1) var(--space-3);
    font-size: var(--font-size-xs);
    font-weight: var(--font-weight-medium);
    border: var(--border-width-thin) solid var(--color-primary);
    color: var(--color-primary);
    background-color: transparent;
    cursor: pointer;
    transition: all var(--transition-fast) var(--transition-ease);
}

.btn-outline-primary:hover[b-jgertnxsf3] {
    background-color: var(--color-primary);
    color: var(--text-on-primary);
}

/* Report Table */
.report-table-wrapper[b-jgertnxsf3] {
    overflow-x: auto;
    border: var(--border-width-thin) solid var(--border-color-light);
}

.report-table[b-jgertnxsf3] {
    width: 100%;
    border-collapse: collapse;
    font-size: var(--font-size-sm);
    white-space: nowrap;
}

.report-table thead[b-jgertnxsf3] {
    background-color: var(--color-primary);
    color: var(--text-on-primary);
}

.report-table thead th[b-jgertnxsf3] {
    padding: var(--space-3) var(--space-3);
    font-weight: var(--font-weight-semibold);
    font-size: var(--font-size-xs);
    text-transform: uppercase;
    letter-spacing: 0.5px;
    border-bottom: 2px solid var(--color-primary);
    position: sticky;
    top: 0;
    z-index: 1;
}

.report-table thead th.sortable[b-jgertnxsf3] {
    cursor: pointer;
    user-select: none;
    transition: background-color var(--transition-fast) var(--transition-ease);
}

.report-table thead th.sortable:hover[b-jgertnxsf3] {
    background-color: rgba(255, 255, 255, 0.1);
}

.report-table tbody tr[b-jgertnxsf3] {
    border-bottom: var(--border-width-thin) solid var(--border-color-light);
    transition: background-color var(--transition-fast) var(--transition-ease);
}

.report-table tbody tr:last-child[b-jgertnxsf3] {
    border-bottom: none;
}

.report-table tbody tr:hover[b-jgertnxsf3] {
    background-color: rgba(11, 36, 62, 0.03);
}

.report-table tbody tr:nth-child(even)[b-jgertnxsf3] {
    background-color: var(--bg-secondary);
}

.report-table tbody tr:nth-child(even):hover[b-jgertnxsf3] {
    background-color: rgba(11, 36, 62, 0.05);
}

.report-table td[b-jgertnxsf3] {
    padding: var(--space-2) var(--space-3);
    color: var(--text-secondary);
}

/* Column Types */
.col-id[b-jgertnxsf3] {
    text-align: right;
    font-family: var(--font-mono);
    font-size: var(--font-size-xs);
    color: var(--text-muted);
}

.col-code[b-jgertnxsf3] {
    text-align: left;
}

.col-text[b-jgertnxsf3] {
    text-align: left;
    max-width: 180px;
    overflow: hidden;
    text-overflow: ellipsis;
}

.col-num[b-jgertnxsf3] {
    text-align: right;
    font-family: var(--font-mono);
}

.col-date[b-jgertnxsf3] {
    text-align: center;
    font-family: var(--font-mono);
    font-size: var(--font-size-xs);
}

.col-date.expired[b-jgertnxsf3] {
    color: #b22222;
    font-weight: var(--font-weight-bold);
}

.col-kpi[b-jgertnxsf3] {
    text-align: center;
    width: 32px;
    padding-left: var(--space-2);
    padding-right: 0;
}

.kpi-dot[b-jgertnxsf3] {
    display: inline-block;
    width: 10px;
    height: 10px;
    border-radius: 50%;
}

.cell-code[b-jgertnxsf3] {
    font-family: var(--font-mono);
    font-weight: var(--font-weight-medium);
    color: var(--color-primary);
    opacity: 0.8;
}

.stock-value[b-jgertnxsf3] {
    font-weight: 800;
    font-size: var(--font-size-base);
    color: var(--text-primary);
    letter-spacing: -0.3px;
}

/* Responsive */
@media (max-width: 768px) {
    .page-header[b-jgertnxsf3] {
        flex-direction: column;
        gap: var(--space-3);
    }

    .page-container[b-jgertnxsf3] {
        padding: var(--space-4) var(--space-2);
    }
}
/* /Components/Pages/Warehouse/Reports/ArticleStockReport.razor.rz.scp.css */
/* ===========================
   ArticleStockReport - Scoped Styles
   Flat Industrial Minimal
   =========================== */

/* Page Container */
.page-container[b-4mez8p140f] {
    max-width: 1400px;
    margin: 0 auto;
    padding: var(--space-6) var(--space-4);
}

/* Header */
.page-header[b-4mez8p140f] {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    margin-bottom: var(--space-6);
    gap: var(--space-4);
}

.page-header-left[b-4mez8p140f] {
    flex: 1;
}

.page-header-right[b-4mez8p140f] {
    flex-shrink: 0;
}

.page-title[b-4mez8p140f] {
    font-size: var(--font-size-2xl);
    font-weight: var(--font-weight-bold);
    color: var(--color-primary);
    display: flex;
    align-items: center;
    gap: var(--space-2);
    margin: 0;
}

.page-title svg[b-4mez8p140f] {
    color: var(--color-primary);
    flex-shrink: 0;
}

.page-subtitle[b-4mez8p140f] {
    color: var(--text-muted);
    font-size: var(--font-size-sm);
    margin: var(--space-1) 0 0 0;
}

/* Summary Stats */
.summary-stats[b-4mez8p140f] {
    display: flex;
    flex-wrap: wrap;
    gap: var(--space-3);
    margin-bottom: var(--space-4);
}

.stat-card[b-4mez8p140f] {
    display: flex;
    flex-direction: column;
    gap: var(--space-1);
    padding: var(--space-3) var(--space-4);
    background-color: var(--bg-secondary);
    border: var(--border-width-thin) solid var(--border-color-light);
    min-width: 130px;
    flex: 1;
}

.stat-label[b-4mez8p140f] {
    font-size: var(--font-size-xs);
    font-weight: var(--font-weight-medium);
    color: var(--text-muted);
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.stat-value[b-4mez8p140f] {
    font-size: var(--font-size-lg);
    font-weight: var(--font-weight-bold);
    color: var(--color-primary);
    font-family: var(--font-mono);
}

/* Back Button */
.btn-back[b-4mez8p140f] {
    display: inline-flex;
    align-items: center;
    gap: var(--space-2);
    padding: var(--space-2) var(--space-4);
    background: transparent;
    color: var(--color-primary);
    border: var(--border-width-thin) solid var(--color-primary);
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-medium);
    text-decoration: none;
    cursor: pointer;
    transition: background-color var(--transition-fast) var(--transition-ease),
                color var(--transition-fast) var(--transition-ease);
}

.btn-back:hover[b-4mez8p140f] {
    background-color: var(--color-primary);
    color: var(--text-on-primary);
    text-decoration: none;
    box-shadow: var(--shadow-sm);
}

/* Alert Bars */
.alert-bar[b-4mez8p140f] {
    display: flex;
    align-items: center;
    gap: var(--space-2);
    padding: var(--space-3) var(--space-4);
    margin-bottom: var(--space-4);
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-medium);
    border-left: var(--border-width-thick) solid;
}

.alert-bar-danger[b-4mez8p140f] {
    background-color: #fdeded;
    border-left-color: var(--color-danger);
    color: #5f2120;
}

.alert-bar-close[b-4mez8p140f] {
    margin-left: auto;
    background: none;
    border: none;
    font-size: var(--font-size-lg);
    cursor: pointer;
    color: inherit;
    opacity: 0.6;
    line-height: 1;
}

.alert-bar-close:hover[b-4mez8p140f] {
    opacity: 1;
}

/* Search Bar */
.search-bar[b-4mez8p140f] {
    display: flex;
    align-items: center;
    gap: var(--space-4);
    margin-bottom: var(--space-4);
    padding: var(--space-3) var(--space-4);
    background-color: var(--bg-secondary);
    border: var(--border-width-thin) solid var(--border-color-light);
}

.search-input-wrapper[b-4mez8p140f] {
    display: flex;
    align-items: center;
    flex: 1;
    position: relative;
}

.search-icon[b-4mez8p140f] {
    color: var(--text-muted);
    flex-shrink: 0;
    margin-right: var(--space-2);
}

.search-input[b-4mez8p140f] {
    flex: 1;
    border: none;
    background: transparent;
    font-size: var(--font-size-sm);
    color: var(--color-gray-700);
    outline: none;
    padding: var(--space-1) 0;
}

.search-input[b-4mez8p140f]::placeholder {
    color: var(--text-muted);
}

.search-clear[b-4mez8p140f] {
    background: none;
    border: none;
    cursor: pointer;
    color: var(--text-muted);
    padding: var(--space-1);
    display: flex;
    align-items: center;
}

.search-clear:hover[b-4mez8p140f] {
    color: var(--color-primary);
}

.search-count[b-4mez8p140f] {
    flex-shrink: 0;
    font-size: var(--font-size-xs);
    color: var(--text-muted);
    font-weight: var(--font-weight-medium);
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

/* Stock Quantity Filters */
.stock-filters[b-4mez8p140f] {
    display: flex;
    align-items: center;
    gap: var(--space-2);
    padding: var(--space-2) 0;
}

.stock-filters-label[b-4mez8p140f] {
    font-size: var(--font-size-xs);
    color: var(--text-muted);
    font-weight: var(--font-weight-medium);
    text-transform: uppercase;
    letter-spacing: 0.5px;
    margin-right: var(--space-1);
}

.stock-filter-btn[b-4mez8p140f] {
    display: inline-flex;
    align-items: center;
    gap: var(--space-1);
    padding: var(--space-1) var(--space-3);
    font-size: var(--font-size-xs);
    font-weight: var(--font-weight-medium);
    border: var(--border-width-thin) solid var(--border-color-light);
    border-radius: var(--radius-full);
    background-color: var(--bg-primary);
    color: var(--text-secondary);
    cursor: pointer;
    transition: all var(--transition-fast) var(--transition-ease);
    user-select: none;
}

.stock-filter-btn:hover[b-4mez8p140f] {
    border-color: var(--color-primary);
    color: var(--color-primary);
}

.stock-filter-btn.active[b-4mez8p140f] {
    background-color: var(--color-primary);
    border-color: var(--color-primary);
    color: var(--text-on-primary);
}

.stock-filter-btn.active .kpi-dot[b-4mez8p140f] {
    box-shadow: 0 0 0 2px rgba(255, 255, 255, 0.4);
}

/* Loading / Empty States */
.loading-state[b-4mez8p140f] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: var(--space-16) 0;
    color: var(--text-muted);
    gap: var(--space-4);
}

.empty-state[b-4mez8p140f] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: var(--space-16) 0;
    color: var(--text-muted);
    gap: var(--space-3);
}

.empty-state svg[b-4mez8p140f] {
    opacity: 0.4;
}

.empty-state-text[b-4mez8p140f] {
    font-size: var(--font-size-base);
    margin: 0;
}

/* Outline Primary Button */
.btn-outline-primary[b-4mez8p140f] {
    background: transparent;
    color: var(--color-primary);
    border: var(--border-width-thin) solid var(--color-primary);
}

.btn-outline-primary:hover[b-4mez8p140f] {
    background-color: var(--color-primary);
    color: var(--text-on-primary);
}

/* Report Table */
.report-table-wrapper[b-4mez8p140f] {
    overflow-x: auto;
    border: var(--border-width-thin) solid var(--border-color-light);
}

.report-table[b-4mez8p140f] {
    width: 100%;
    border-collapse: collapse;
    font-size: var(--font-size-sm);
    white-space: nowrap;
}

.report-table thead[b-4mez8p140f] {
    background-color: var(--color-primary);
    color: var(--text-on-primary);
}

.report-table thead th[b-4mez8p140f] {
    padding: var(--space-3) var(--space-3);
    font-weight: var(--font-weight-semibold);
    font-size: var(--font-size-xs);
    text-transform: uppercase;
    letter-spacing: 0.5px;
    border-bottom: 2px solid var(--color-primary);
    position: sticky;
    top: 0;
    z-index: 1;
}

.report-table thead th.sortable[b-4mez8p140f] {
    cursor: pointer;
    user-select: none;
    transition: background-color var(--transition-fast) var(--transition-ease);
}

.report-table thead th.sortable:hover[b-4mez8p140f] {
    background-color: rgba(255, 255, 255, 0.1);
}

.report-table tbody tr[b-4mez8p140f] {
    border-bottom: var(--border-width-thin) solid var(--border-color-light);
    transition: background-color var(--transition-fast) var(--transition-ease);
}

.report-table tbody tr.clickable-row[b-4mez8p140f] {
    cursor: pointer;
}

.report-table tbody tr:last-child[b-4mez8p140f] {
    border-bottom: none;
}

.report-table tbody tr:hover[b-4mez8p140f] {
    background-color: rgba(11, 36, 62, 0.03);
}

.report-table tbody tr:nth-child(even)[b-4mez8p140f] {
    background-color: var(--bg-secondary);
}

.report-table tbody tr:nth-child(even):hover[b-4mez8p140f] {
    background-color: rgba(11, 36, 62, 0.05);
}

.report-table td[b-4mez8p140f] {
    padding: var(--space-2) var(--space-3);
    color: var(--text-secondary);
}

/* Column Types */
.col-code[b-4mez8p140f] {
    text-align: left;
}

.col-desc[b-4mez8p140f] {
    text-align: left;
    min-width: 200px;
    max-width: 300px;
    overflow: hidden;
    text-overflow: ellipsis;
}

.col-um[b-4mez8p140f] {
    text-align: center;
}

.col-num[b-4mez8p140f] {
    text-align: right;
    font-family: var(--font-mono);
}

.col-date[b-4mez8p140f] {
    text-align: center;
    font-family: var(--font-mono);
    font-size: var(--font-size-xs);
}

.col-kpi[b-4mez8p140f] {
    text-align: center;
    width: 32px;
    padding-left: var(--space-2);
    padding-right: 0;
}

.kpi-dot[b-4mez8p140f] {
    display: inline-block;
    width: 10px;
    height: 10px;
    border-radius: 50%;
}

.cell-code[b-4mez8p140f] {
    font-family: var(--font-mono);
    font-weight: var(--font-weight-medium);
    color: var(--color-primary);
    opacity: 0.8;
}

/* Responsive */
@media (max-width: 768px) {
    .page-header[b-4mez8p140f] {
        flex-direction: column;
        gap: var(--space-3);
    }

    .page-container[b-4mez8p140f] {
        padding: var(--space-4) var(--space-2);
    }
}
/* /Components/Pages/Warehouse/UnitOfMeasureCreate.razor.rz.scp.css */
/* ===========================
   UnitOfMeasureCreate - Scoped Styles
   Flat Industrial Minimal
   =========================== */

.page-container[b-e622ib72fy] { max-width: 900px; margin: 0 auto; padding: var(--space-6) var(--space-4); }
.page-header[b-e622ib72fy] { display: flex; align-items: center; gap: var(--space-4); margin-bottom: var(--space-6); }
.btn-back[b-e622ib72fy] { display: inline-flex; align-items: center; justify-content: center; width: 40px; height: 40px; color: var(--text-muted); border: var(--border-width-thin) solid var(--border-color-light); text-decoration: none; transition: all var(--transition-fast) var(--transition-ease); flex-shrink: 0; }
.btn-back:hover[b-e622ib72fy] { color: var(--color-primary); border-color: var(--color-primary); background-color: var(--color-gray-50); text-decoration: none; }
.page-header-text[b-e622ib72fy] { flex: 1; }
.page-title[b-e622ib72fy] { font-size: var(--font-size-xl); font-weight: var(--font-weight-bold); color: var(--color-primary); display: flex; align-items: center; gap: var(--space-2); margin: 0; }
.page-title svg[b-e622ib72fy] { color: var(--color-primary); flex-shrink: 0; }
.page-subtitle[b-e622ib72fy] { color: var(--text-muted); font-size: var(--font-size-sm); margin: 2px 0 0 0; }

.alert-bar[b-e622ib72fy] { display: flex; align-items: center; gap: var(--space-2); padding: var(--space-3) var(--space-4); margin-bottom: var(--space-4); font-size: var(--font-size-sm); font-weight: var(--font-weight-medium); border-left: var(--border-width-thick) solid; }
.alert-bar-danger[b-e622ib72fy] { background-color: #fdeded; border-left-color: var(--color-danger); color: #5f2120; }
.alert-bar-close[b-e622ib72fy] { margin-left: auto; background: none; border: none; font-size: var(--font-size-lg); cursor: pointer; color: inherit; opacity: 0.6; line-height: 1; }
.alert-bar-close:hover[b-e622ib72fy] { opacity: 1; }

.form-section[b-e622ib72fy] { margin-bottom: var(--space-6); padding: var(--space-5); background-color: var(--color-white); border: var(--border-width-thin) solid var(--border-color-light); }
.section-title[b-e622ib72fy] { display: flex; align-items: center; gap: var(--space-2); font-size: var(--font-size-sm); font-weight: var(--font-weight-semibold); color: var(--color-primary); text-transform: uppercase; letter-spacing: 0.5px; margin: 0 0 var(--space-4) 0; padding-bottom: var(--space-3); border-bottom: var(--border-width-thin) solid var(--border-color-light); }
.section-title svg[b-e622ib72fy] { color: var(--color-primary); opacity: 0.6; flex-shrink: 0; }

.form-grid[b-e622ib72fy] { display: grid; grid-template-columns: repeat(3, 1fr); gap: var(--space-4); }
.form-group[b-e622ib72fy] { display: flex; flex-direction: column; }
.form-group-wide[b-e622ib72fy] { grid-column: span 2; }
.form-label[b-e622ib72fy] { font-size: var(--font-size-xs); font-weight: var(--font-weight-medium); color: var(--text-secondary); text-transform: uppercase; letter-spacing: 0.3px; margin-bottom: var(--space-1); }
.form-control[b-e622ib72fy] { padding: var(--space-2) var(--space-3); font-size: var(--font-size-sm); color: var(--color-gray-700); border: var(--border-width-thin) solid var(--border-color-light); background-color: var(--color-white); transition: border-color var(--transition-fast) var(--transition-ease); }
.form-control:focus[b-e622ib72fy] { border-color: var(--color-primary); outline: none; box-shadow: none; }
.form-control[b-e622ib72fy]::placeholder { color: var(--color-gray-400); }

.form-actions[b-e622ib72fy] { display: flex; justify-content: flex-end; gap: var(--space-3); padding-top: var(--space-4); border-top: var(--border-width-thin) solid var(--border-color-light); }
.form-actions .btn[b-e622ib72fy] { display: inline-flex; align-items: center; gap: var(--space-2); padding: var(--space-2) var(--space-5); font-size: var(--font-size-sm); font-weight: var(--font-weight-medium); cursor: pointer; text-decoration: none; }
.btn-action[b-e622ib72fy] { background-color: var(--color-action); color: var(--text-on-action); border: var(--border-width-thin) solid var(--color-action); transition: background-color var(--transition-fast) var(--transition-ease); }
.btn-action:hover[b-e622ib72fy] { background-color: var(--color-action-hover); border-color: var(--color-action-hover); color: var(--text-on-action); }
.btn-action:disabled[b-e622ib72fy] { opacity: 0.65; cursor: not-allowed; }
.btn-outline-primary[b-e622ib72fy] { background: transparent; color: var(--color-primary); border: var(--border-width-thin) solid var(--color-primary); }
.btn-outline-primary:hover[b-e622ib72fy] { background-color: var(--color-primary); color: var(--text-on-primary); text-decoration: none; }

[b-e622ib72fy] .validation-message { color: var(--color-danger); font-size: var(--font-size-xs); margin-top: 2px; }

@media (max-width: 768px) {
    .form-grid[b-e622ib72fy] { grid-template-columns: 1fr; }
    .form-group-wide[b-e622ib72fy] { grid-column: span 1; }
    .form-actions[b-e622ib72fy] { flex-direction: column-reverse; }
    .form-actions .btn[b-e622ib72fy] { justify-content: center; }
}
/* /Components/Pages/Warehouse/UnitOfMeasureEdit.razor.rz.scp.css */
/* ===========================
   UnitOfMeasureEdit - Scoped Styles
   Flat Industrial Minimal
   =========================== */

.page-container[b-ydj22xy4vl] { max-width: 900px; margin: 0 auto; padding: var(--space-6) var(--space-4); }
.page-header[b-ydj22xy4vl] { display: flex; align-items: center; gap: var(--space-4); margin-bottom: var(--space-6); }
.btn-back[b-ydj22xy4vl] { display: inline-flex; align-items: center; justify-content: center; width: 40px; height: 40px; color: var(--text-muted); border: var(--border-width-thin) solid var(--border-color-light); text-decoration: none; transition: all var(--transition-fast) var(--transition-ease); flex-shrink: 0; }
.btn-back:hover[b-ydj22xy4vl] { color: var(--color-primary); border-color: var(--color-primary); background-color: var(--color-gray-50); text-decoration: none; }
.page-header-text[b-ydj22xy4vl] { flex: 1; }
.page-title[b-ydj22xy4vl] { font-size: var(--font-size-xl); font-weight: var(--font-weight-bold); color: var(--color-primary); display: flex; align-items: center; gap: var(--space-2); margin: 0; }
.page-title svg[b-ydj22xy4vl] { color: var(--color-primary); flex-shrink: 0; }
.page-subtitle[b-ydj22xy4vl] { color: var(--text-muted); font-size: var(--font-size-sm); margin: 2px 0 0 0; display: flex; align-items: center; gap: var(--space-2); }
.subtitle-code[b-ydj22xy4vl] { font-family: var(--font-mono); font-size: var(--font-size-xs); color: var(--color-primary); opacity: 0.6; padding: 1px var(--space-2); background-color: var(--color-gray-100); }

.alert-bar[b-ydj22xy4vl] { display: flex; align-items: center; gap: var(--space-2); padding: var(--space-3) var(--space-4); margin-bottom: var(--space-4); font-size: var(--font-size-sm); font-weight: var(--font-weight-medium); border-left: var(--border-width-thick) solid; }
.alert-bar-danger[b-ydj22xy4vl] { background-color: #fdeded; border-left-color: var(--color-danger); color: #5f2120; }
.alert-bar-close[b-ydj22xy4vl] { margin-left: auto; background: none; border: none; font-size: var(--font-size-lg); cursor: pointer; color: inherit; opacity: 0.6; line-height: 1; }
.alert-bar-close:hover[b-ydj22xy4vl] { opacity: 1; }

.loading-state[b-ydj22xy4vl] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: var(--space-16) 0; color: var(--text-muted); gap: var(--space-4); }
.empty-state[b-ydj22xy4vl] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: var(--space-16) 0; color: var(--text-muted); gap: var(--space-3); }
.empty-state svg[b-ydj22xy4vl] { opacity: 0.4; }
.empty-state-text[b-ydj22xy4vl] { font-size: var(--font-size-base); margin: 0; }

.form-section[b-ydj22xy4vl] { margin-bottom: var(--space-6); padding: var(--space-5); background-color: var(--color-white); border: var(--border-width-thin) solid var(--border-color-light); }
.section-title[b-ydj22xy4vl] { display: flex; align-items: center; gap: var(--space-2); font-size: var(--font-size-sm); font-weight: var(--font-weight-semibold); color: var(--color-primary); text-transform: uppercase; letter-spacing: 0.5px; margin: 0 0 var(--space-4) 0; padding-bottom: var(--space-3); border-bottom: var(--border-width-thin) solid var(--border-color-light); }
.section-title svg[b-ydj22xy4vl] { color: var(--color-primary); opacity: 0.6; flex-shrink: 0; }

.form-grid[b-ydj22xy4vl] { display: grid; grid-template-columns: repeat(3, 1fr); gap: var(--space-4); }
.form-group[b-ydj22xy4vl] { display: flex; flex-direction: column; }
.form-group-wide[b-ydj22xy4vl] { grid-column: span 2; }
.form-label[b-ydj22xy4vl] { font-size: var(--font-size-xs); font-weight: var(--font-weight-medium); color: var(--text-secondary); text-transform: uppercase; letter-spacing: 0.3px; margin-bottom: var(--space-1); }
.form-control[b-ydj22xy4vl] { padding: var(--space-2) var(--space-3); font-size: var(--font-size-sm); color: var(--color-gray-700); border: var(--border-width-thin) solid var(--border-color-light); background-color: var(--color-white); transition: border-color var(--transition-fast) var(--transition-ease); }
.form-control:focus[b-ydj22xy4vl] { border-color: var(--color-primary); outline: none; box-shadow: none; }
.form-control[b-ydj22xy4vl]::placeholder { color: var(--color-gray-400); }
.form-control-static[b-ydj22xy4vl] { padding: var(--space-2) var(--space-3); font-size: var(--font-size-sm); color: var(--text-muted); background-color: var(--color-gray-50); border: var(--border-width-thin) solid var(--border-color-light); font-family: var(--font-mono); }

.form-actions[b-ydj22xy4vl] { display: flex; justify-content: flex-end; gap: var(--space-3); padding-top: var(--space-4); border-top: var(--border-width-thin) solid var(--border-color-light); }
.form-actions .btn[b-ydj22xy4vl] { display: inline-flex; align-items: center; gap: var(--space-2); padding: var(--space-2) var(--space-5); font-size: var(--font-size-sm); font-weight: var(--font-weight-medium); cursor: pointer; text-decoration: none; }
.btn-action[b-ydj22xy4vl] { background-color: var(--color-action); color: var(--text-on-action); border: var(--border-width-thin) solid var(--color-action); transition: background-color var(--transition-fast) var(--transition-ease); }
.btn-action:hover[b-ydj22xy4vl] { background-color: var(--color-action-hover); border-color: var(--color-action-hover); color: var(--text-on-action); }
.btn-action:disabled[b-ydj22xy4vl] { opacity: 0.65; cursor: not-allowed; }
.btn-outline-primary[b-ydj22xy4vl] { background: transparent; color: var(--color-primary); border: var(--border-width-thin) solid var(--color-primary); }
.btn-outline-primary:hover[b-ydj22xy4vl] { background-color: var(--color-primary); color: var(--text-on-primary); text-decoration: none; }

[b-ydj22xy4vl] .validation-message { color: var(--color-danger); font-size: var(--font-size-xs); margin-top: 2px; }

@media (max-width: 768px) {
    .form-grid[b-ydj22xy4vl] { grid-template-columns: 1fr; }
    .form-group-wide[b-ydj22xy4vl] { grid-column: span 1; }
    .form-actions[b-ydj22xy4vl] { flex-direction: column-reverse; }
    .form-actions .btn[b-ydj22xy4vl] { justify-content: center; }
}
/* /Components/Pages/Warehouse/UnitOfMeasureList.razor.rz.scp.css */
/* ===========================
   UnitOfMeasureList - Scoped Styles
   Flat Industrial Minimal
   =========================== */

.page-container[b-dlfckvj72l] { max-width: 1200px; margin: 0 auto; padding: var(--space-6) var(--space-4); }
.page-header[b-dlfckvj72l] { display: flex; justify-content: space-between; align-items: flex-start; margin-bottom: var(--space-6); gap: var(--space-4); }
.page-header-left[b-dlfckvj72l] { flex: 1; }
.page-header-right[b-dlfckvj72l] { flex-shrink: 0; }
.page-title[b-dlfckvj72l] { font-size: var(--font-size-2xl); font-weight: var(--font-weight-bold); color: var(--color-primary); display: flex; align-items: center; gap: var(--space-2); margin: 0; }
.page-title svg[b-dlfckvj72l] { color: var(--color-primary); flex-shrink: 0; }
.page-subtitle[b-dlfckvj72l] { color: var(--text-muted); font-size: var(--font-size-sm); margin: var(--space-1) 0 0 0; }

.btn-action[b-dlfckvj72l] { display: inline-flex; align-items: center; gap: var(--space-2); padding: var(--space-2) var(--space-4); background-color: var(--color-action); color: var(--text-on-action); border: var(--border-width-thin) solid var(--color-action); font-size: var(--font-size-sm); font-weight: var(--font-weight-medium); text-decoration: none; cursor: pointer; transition: background-color var(--transition-fast) var(--transition-ease), box-shadow var(--transition-fast) var(--transition-ease); }
.btn-action:hover[b-dlfckvj72l] { background-color: var(--color-action-hover); border-color: var(--color-action-hover); color: var(--text-on-action); text-decoration: none; box-shadow: var(--shadow-sm); }
.btn-action:active[b-dlfckvj72l] { background-color: var(--color-action-active); }

.alert-bar[b-dlfckvj72l] { display: flex; align-items: center; gap: var(--space-2); padding: var(--space-3) var(--space-4); margin-bottom: var(--space-4); font-size: var(--font-size-sm); font-weight: var(--font-weight-medium); border-left: var(--border-width-thick) solid; }
.alert-bar-success[b-dlfckvj72l] { background-color: #edf7ed; border-left-color: var(--color-success); color: #1e4620; }
.alert-bar-danger[b-dlfckvj72l] { background-color: #fdeded; border-left-color: var(--color-danger); color: #5f2120; }
.alert-bar-close[b-dlfckvj72l] { margin-left: auto; background: none; border: none; font-size: var(--font-size-lg); cursor: pointer; color: inherit; opacity: 0.6; line-height: 1; }
.alert-bar-close:hover[b-dlfckvj72l] { opacity: 1; }

.search-bar[b-dlfckvj72l] { display: flex; align-items: center; gap: var(--space-4); margin-bottom: var(--space-4); padding: var(--space-3) var(--space-4); background-color: var(--bg-secondary); border: var(--border-width-thin) solid var(--border-color-light); }
.search-input-wrapper[b-dlfckvj72l] { display: flex; align-items: center; flex: 1; position: relative; }
.search-icon[b-dlfckvj72l] { color: var(--text-muted); flex-shrink: 0; margin-right: var(--space-2); }
.search-input[b-dlfckvj72l] { flex: 1; border: none; background: transparent; font-size: var(--font-size-sm); color: var(--color-gray-700); outline: none; padding: var(--space-1) 0; }
.search-input[b-dlfckvj72l]::placeholder { color: var(--text-muted); }
.search-clear[b-dlfckvj72l] { background: none; border: none; cursor: pointer; color: var(--text-muted); padding: var(--space-1); display: flex; align-items: center; }
.search-clear:hover[b-dlfckvj72l] { color: var(--color-primary); }
.search-count[b-dlfckvj72l] { flex-shrink: 0; font-size: var(--font-size-xs); color: var(--text-muted); font-weight: var(--font-weight-medium); text-transform: uppercase; letter-spacing: 0.5px; }

.loading-state[b-dlfckvj72l] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: var(--space-16) 0; color: var(--text-muted); gap: var(--space-4); }
.empty-state[b-dlfckvj72l] { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: var(--space-16) 0; color: var(--text-muted); gap: var(--space-3); }
.empty-state svg[b-dlfckvj72l] { opacity: 0.4; }
.empty-state-text[b-dlfckvj72l] { font-size: var(--font-size-base); margin: 0; }

.item-list[b-dlfckvj72l] { display: flex; flex-direction: column; border: var(--border-width-thin) solid var(--border-color-light); }
.item-row[b-dlfckvj72l] { display: flex; align-items: center; gap: var(--space-4); padding: var(--space-4); border-bottom: var(--border-width-thin) solid var(--border-color-light); transition: background-color var(--transition-fast) var(--transition-ease); }
.item-row:last-child[b-dlfckvj72l] { border-bottom: none; }
.item-row:hover[b-dlfckvj72l] { background-color: rgba(11, 36, 62, 0.03); }

.item-avatar[b-dlfckvj72l] { flex-shrink: 0; width: 40px; height: 40px; display: flex; align-items: center; justify-content: center; background-color: var(--color-gray-100); color: var(--color-primary); }
.item-info[b-dlfckvj72l] { flex: 1; min-width: 0; }
.item-name[b-dlfckvj72l] { font-size: var(--font-size-base); font-weight: var(--font-weight-semibold); color: var(--color-primary); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.item-meta[b-dlfckvj72l] { display: flex; align-items: center; gap: var(--space-1); flex-wrap: wrap; font-size: var(--font-size-xs); color: var(--text-secondary); margin-top: 2px; }
.item-code[b-dlfckvj72l] { font-family: var(--font-mono); font-weight: var(--font-weight-medium); color: var(--color-primary); opacity: 0.7; }

.item-actions[b-dlfckvj72l] { flex-shrink: 0; display: flex; align-items: center; gap: var(--space-1); }
.btn-icon[b-dlfckvj72l] { display: inline-flex; align-items: center; justify-content: center; width: 36px; height: 36px; background: none; border: var(--border-width-thin) solid transparent; cursor: pointer; color: var(--text-muted); text-decoration: none; transition: all var(--transition-fast) var(--transition-ease); }
.btn-icon:hover[b-dlfckvj72l] { color: var(--color-primary); background-color: var(--color-gray-100); border-color: var(--border-color-light); text-decoration: none; }
.btn-icon-danger:hover[b-dlfckvj72l] { color: var(--color-action); background-color: rgba(178, 34, 34, 0.06); border-color: rgba(178, 34, 34, 0.2); }

.overlay[b-dlfckvj72l] { position: fixed; inset: 0; background-color: rgba(0, 0, 0, 0.4); display: flex; align-items: center; justify-content: center; z-index: var(--z-modal-backdrop); }
.confirm-dialog[b-dlfckvj72l] { background-color: var(--color-white); padding: var(--space-8); max-width: 420px; width: 90%; box-shadow: var(--shadow-xl); text-align: center; z-index: var(--z-modal); }
.confirm-icon[b-dlfckvj72l] { color: var(--color-action); margin-bottom: var(--space-4); }
.confirm-dialog h3[b-dlfckvj72l] { font-size: var(--font-size-lg); font-weight: var(--font-weight-semibold); color: var(--color-primary); margin: 0 0 var(--space-2) 0; }
.confirm-dialog p[b-dlfckvj72l] { font-size: var(--font-size-sm); color: var(--text-secondary); margin: 0 0 var(--space-2) 0; }
.confirm-warning[b-dlfckvj72l] { font-size: var(--font-size-xs) !important; color: var(--color-action) !important; font-weight: var(--font-weight-medium); }
.confirm-actions[b-dlfckvj72l] { display: flex; gap: var(--space-3); justify-content: center; margin-top: var(--space-6); }
/* /Components/Pages/Warehouse/WarehouseCreate.razor.rz.scp.css */
/* ===========================
   WarehouseCreate - Scoped Styles
   Flat Industrial Minimal
   =========================== */

/* Page Container */
.page-container[b-9gvvtdeyhb] {
    max-width: 900px;
    margin: 0 auto;
    padding: var(--space-6) var(--space-4);
}

/* Header */
.page-header[b-9gvvtdeyhb] {
    display: flex;
    align-items: center;
    gap: var(--space-4);
    margin-bottom: var(--space-6);
}

.btn-back[b-9gvvtdeyhb] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    color: var(--text-muted);
    border: var(--border-width-thin) solid var(--border-color-light);
    text-decoration: none;
    transition: all var(--transition-fast) var(--transition-ease);
    flex-shrink: 0;
}

.btn-back:hover[b-9gvvtdeyhb] {
    color: var(--color-primary);
    border-color: var(--color-primary);
    background-color: var(--color-gray-50);
    text-decoration: none;
}

.page-header-text[b-9gvvtdeyhb] {
    flex: 1;
}

.page-title[b-9gvvtdeyhb] {
    font-size: var(--font-size-xl);
    font-weight: var(--font-weight-bold);
    color: var(--color-primary);
    display: flex;
    align-items: center;
    gap: var(--space-2);
    margin: 0;
}

.page-title svg[b-9gvvtdeyhb] {
    color: var(--color-primary);
    flex-shrink: 0;
}

.page-subtitle[b-9gvvtdeyhb] {
    color: var(--text-muted);
    font-size: var(--font-size-sm);
    margin: 2px 0 0 0;
}

/* Alert Bar */
.alert-bar[b-9gvvtdeyhb] {
    display: flex;
    align-items: center;
    gap: var(--space-2);
    padding: var(--space-3) var(--space-4);
    margin-bottom: var(--space-4);
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-medium);
    border-left: var(--border-width-thick) solid;
}

.alert-bar-danger[b-9gvvtdeyhb] {
    background-color: #fdeded;
    border-left-color: var(--color-danger);
    color: #5f2120;
}

.alert-bar-close[b-9gvvtdeyhb] {
    margin-left: auto;
    background: none;
    border: none;
    font-size: var(--font-size-lg);
    cursor: pointer;
    color: inherit;
    opacity: 0.6;
    line-height: 1;
}

.alert-bar-close:hover[b-9gvvtdeyhb] {
    opacity: 1;
}

/* Form Sections */
.form-section[b-9gvvtdeyhb] {
    margin-bottom: var(--space-6);
    padding: var(--space-5);
    background-color: var(--color-white);
    border: var(--border-width-thin) solid var(--border-color-light);
}

.section-title[b-9gvvtdeyhb] {
    display: flex;
    align-items: center;
    gap: var(--space-2);
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-semibold);
    color: var(--color-primary);
    text-transform: uppercase;
    letter-spacing: 0.5px;
    margin: 0 0 var(--space-4) 0;
    padding-bottom: var(--space-3);
    border-bottom: var(--border-width-thin) solid var(--border-color-light);
}

.section-title svg[b-9gvvtdeyhb] {
    color: var(--color-primary);
    opacity: 0.6;
    flex-shrink: 0;
}

/* Form Grid */
.form-grid[b-9gvvtdeyhb] {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: var(--space-4);
}

.form-group[b-9gvvtdeyhb] {
    display: flex;
    flex-direction: column;
}

.form-group-wide[b-9gvvtdeyhb] {
    grid-column: span 2;
}

.form-group-checkbox[b-9gvvtdeyhb] {
    display: flex;
    align-items: center;
    padding-top: var(--space-6);
}

.form-group-checkbox .form-check-label[b-9gvvtdeyhb] {
    display: flex;
    align-items: center;
    gap: var(--space-2);
    font-size: var(--font-size-sm);
    color: var(--text-secondary);
    cursor: pointer;
}

.form-group-checkbox .form-check-input[b-9gvvtdeyhb] {
    width: 18px;
    height: 18px;
    accent-color: var(--color-primary);
    cursor: pointer;
}

/* Form Controls */
.form-label[b-9gvvtdeyhb] {
    font-size: var(--font-size-xs);
    font-weight: var(--font-weight-medium);
    color: var(--text-secondary);
    text-transform: uppercase;
    letter-spacing: 0.3px;
    margin-bottom: var(--space-1);
}

.form-control[b-9gvvtdeyhb] {
    padding: var(--space-2) var(--space-3);
    font-size: var(--font-size-sm);
    color: var(--color-gray-700);
    border: var(--border-width-thin) solid var(--border-color-light);
    background-color: var(--color-white);
    transition: border-color var(--transition-fast) var(--transition-ease);
}

.form-control:focus[b-9gvvtdeyhb] {
    border-color: var(--color-primary);
    outline: none;
    box-shadow: none;
}

.form-control[b-9gvvtdeyhb]::placeholder {
    color: var(--color-gray-400);
}

select.form-control[b-9gvvtdeyhb] {
    appearance: auto;
    cursor: pointer;
    background-color: var(--color-white);
}

/* Form Actions */
.form-actions[b-9gvvtdeyhb] {
    display: flex;
    justify-content: flex-end;
    gap: var(--space-3);
    padding-top: var(--space-4);
    border-top: var(--border-width-thin) solid var(--border-color-light);
}

.form-actions .btn[b-9gvvtdeyhb] {
    display: inline-flex;
    align-items: center;
    gap: var(--space-2);
    padding: var(--space-2) var(--space-5);
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-medium);
    cursor: pointer;
    text-decoration: none;
}

.btn-action[b-9gvvtdeyhb] {
    background-color: var(--color-action);
    color: var(--text-on-action);
    border: var(--border-width-thin) solid var(--color-action);
    transition: background-color var(--transition-fast) var(--transition-ease);
}

.btn-action:hover[b-9gvvtdeyhb] {
    background-color: var(--color-action-hover);
    border-color: var(--color-action-hover);
    color: var(--text-on-action);
}

.btn-action:disabled[b-9gvvtdeyhb] {
    opacity: 0.65;
    cursor: not-allowed;
}

.btn-outline-primary[b-9gvvtdeyhb] {
    background: transparent;
    color: var(--color-primary);
    border: var(--border-width-thin) solid var(--color-primary);
}

.btn-outline-primary:hover[b-9gvvtdeyhb] {
    background-color: var(--color-primary);
    color: var(--text-on-primary);
    text-decoration: none;
}

/* Validation */
[b-9gvvtdeyhb] .validation-message {
    color: var(--color-danger);
    font-size: var(--font-size-xs);
    margin-top: 2px;
}

/* Responsive */
@media (max-width: 768px) {
    .form-grid[b-9gvvtdeyhb] {
        grid-template-columns: 1fr;
    }

    .form-group-wide[b-9gvvtdeyhb] {
        grid-column: span 1;
    }

    .form-actions[b-9gvvtdeyhb] {
        flex-direction: column-reverse;
    }

    .form-actions .btn[b-9gvvtdeyhb] {
        justify-content: center;
    }
}
/* /Components/Pages/Warehouse/WarehouseEdit.razor.rz.scp.css */
/* ===========================
   WarehouseEdit - Scoped Styles
   Reuses same patterns as WarehouseCreate
   =========================== */

/* Page Container */
.page-container[b-2t8x49j7is] {
    max-width: 900px;
    margin: 0 auto;
    padding: var(--space-6) var(--space-4);
}

/* Header */
.page-header[b-2t8x49j7is] {
    display: flex;
    align-items: center;
    gap: var(--space-4);
    margin-bottom: var(--space-6);
}

.btn-back[b-2t8x49j7is] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    color: var(--text-muted);
    border: var(--border-width-thin) solid var(--border-color-light);
    text-decoration: none;
    transition: all var(--transition-fast) var(--transition-ease);
    flex-shrink: 0;
}

.btn-back:hover[b-2t8x49j7is] {
    color: var(--color-primary);
    border-color: var(--color-primary);
    background-color: var(--color-gray-50);
    text-decoration: none;
}

.page-header-text[b-2t8x49j7is] {
    flex: 1;
}

.page-title[b-2t8x49j7is] {
    font-size: var(--font-size-xl);
    font-weight: var(--font-weight-bold);
    color: var(--color-primary);
    display: flex;
    align-items: center;
    gap: var(--space-2);
    margin: 0;
}

.page-title svg[b-2t8x49j7is] {
    color: var(--color-primary);
    flex-shrink: 0;
}

.page-subtitle[b-2t8x49j7is] {
    color: var(--text-muted);
    font-size: var(--font-size-sm);
    margin: 2px 0 0 0;
    display: flex;
    align-items: center;
    gap: var(--space-2);
}

.subtitle-code[b-2t8x49j7is] {
    font-family: var(--font-mono);
    font-size: var(--font-size-xs);
    color: var(--color-primary);
    opacity: 0.6;
    padding: 1px var(--space-2);
    background-color: var(--color-gray-100);
}

/* Alert Bar */
.alert-bar[b-2t8x49j7is] {
    display: flex;
    align-items: center;
    gap: var(--space-2);
    padding: var(--space-3) var(--space-4);
    margin-bottom: var(--space-4);
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-medium);
    border-left: var(--border-width-thick) solid;
}

.alert-bar-danger[b-2t8x49j7is] {
    background-color: #fdeded;
    border-left-color: var(--color-danger);
    color: #5f2120;
}

.alert-bar-close[b-2t8x49j7is] {
    margin-left: auto;
    background: none;
    border: none;
    font-size: var(--font-size-lg);
    cursor: pointer;
    color: inherit;
    opacity: 0.6;
    line-height: 1;
}

.alert-bar-close:hover[b-2t8x49j7is] {
    opacity: 1;
}

/* Loading / Empty States */
.loading-state[b-2t8x49j7is] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: var(--space-16) 0;
    color: var(--text-muted);
    gap: var(--space-4);
}

.empty-state[b-2t8x49j7is] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: var(--space-16) 0;
    color: var(--text-muted);
    gap: var(--space-3);
}

.empty-state svg[b-2t8x49j7is] {
    opacity: 0.4;
}

.empty-state-text[b-2t8x49j7is] {
    font-size: var(--font-size-base);
    margin: 0;
}

/* Form Sections */
.form-section[b-2t8x49j7is] {
    margin-bottom: var(--space-6);
    padding: var(--space-5);
    background-color: var(--color-white);
    border: var(--border-width-thin) solid var(--border-color-light);
}

.section-title[b-2t8x49j7is] {
    display: flex;
    align-items: center;
    gap: var(--space-2);
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-semibold);
    color: var(--color-primary);
    text-transform: uppercase;
    letter-spacing: 0.5px;
    margin: 0 0 var(--space-4) 0;
    padding-bottom: var(--space-3);
    border-bottom: var(--border-width-thin) solid var(--border-color-light);
}

.section-title svg[b-2t8x49j7is] {
    color: var(--color-primary);
    opacity: 0.6;
    flex-shrink: 0;
}

/* Form Grid */
.form-grid[b-2t8x49j7is] {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: var(--space-4);
}

.form-group[b-2t8x49j7is] {
    display: flex;
    flex-direction: column;
}

.form-group-wide[b-2t8x49j7is] {
    grid-column: span 2;
}

.form-group-checkbox[b-2t8x49j7is] {
    display: flex;
    align-items: center;
    padding-top: var(--space-6);
}

.form-group-checkbox .form-check-label[b-2t8x49j7is] {
    display: flex;
    align-items: center;
    gap: var(--space-2);
    font-size: var(--font-size-sm);
    color: var(--text-secondary);
    cursor: pointer;
}

.form-group-checkbox .form-check-input[b-2t8x49j7is] {
    width: 18px;
    height: 18px;
    accent-color: var(--color-primary);
    cursor: pointer;
}

/* Form Controls */
.form-label[b-2t8x49j7is] {
    font-size: var(--font-size-xs);
    font-weight: var(--font-weight-medium);
    color: var(--text-secondary);
    text-transform: uppercase;
    letter-spacing: 0.3px;
    margin-bottom: var(--space-1);
}

.form-control[b-2t8x49j7is] {
    padding: var(--space-2) var(--space-3);
    font-size: var(--font-size-sm);
    color: var(--color-gray-700);
    border: var(--border-width-thin) solid var(--border-color-light);
    background-color: var(--color-white);
    transition: border-color var(--transition-fast) var(--transition-ease);
}

.form-control:focus[b-2t8x49j7is] {
    border-color: var(--color-primary);
    outline: none;
    box-shadow: none;
}

.form-control[b-2t8x49j7is]::placeholder {
    color: var(--color-gray-400);
}

select.form-control[b-2t8x49j7is] {
    appearance: auto;
    cursor: pointer;
    background-color: var(--color-white);
}

.form-control-static[b-2t8x49j7is] {
    padding: var(--space-2) var(--space-3);
    font-size: var(--font-size-sm);
    color: var(--text-muted);
    background-color: var(--color-gray-50);
    border: var(--border-width-thin) solid var(--border-color-light);
    font-family: var(--font-mono);
}

/* Form Actions */
.form-actions[b-2t8x49j7is] {
    display: flex;
    justify-content: flex-end;
    gap: var(--space-3);
    padding-top: var(--space-4);
    border-top: var(--border-width-thin) solid var(--border-color-light);
}

.form-actions .btn[b-2t8x49j7is] {
    display: inline-flex;
    align-items: center;
    gap: var(--space-2);
    padding: var(--space-2) var(--space-5);
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-medium);
    cursor: pointer;
    text-decoration: none;
}

.btn-action[b-2t8x49j7is] {
    background-color: var(--color-action);
    color: var(--text-on-action);
    border: var(--border-width-thin) solid var(--color-action);
    transition: background-color var(--transition-fast) var(--transition-ease);
}

.btn-action:hover[b-2t8x49j7is] {
    background-color: var(--color-action-hover);
    border-color: var(--color-action-hover);
    color: var(--text-on-action);
}

.btn-action:disabled[b-2t8x49j7is] {
    opacity: 0.65;
    cursor: not-allowed;
}

.btn-outline-primary[b-2t8x49j7is] {
    background: transparent;
    color: var(--color-primary);
    border: var(--border-width-thin) solid var(--color-primary);
}

.btn-outline-primary:hover[b-2t8x49j7is] {
    background-color: var(--color-primary);
    color: var(--text-on-primary);
    text-decoration: none;
}

/* Validation */
[b-2t8x49j7is] .validation-message {
    color: var(--color-danger);
    font-size: var(--font-size-xs);
    margin-top: 2px;
}

/* Responsive */
@media (max-width: 768px) {
    .form-grid[b-2t8x49j7is] {
        grid-template-columns: 1fr;
    }

    .form-group-wide[b-2t8x49j7is] {
        grid-column: span 1;
    }

    .form-actions[b-2t8x49j7is] {
        flex-direction: column-reverse;
    }

    .form-actions .btn[b-2t8x49j7is] {
        justify-content: center;
    }
}
/* /Components/Pages/Warehouse/WarehouseList.razor.rz.scp.css */
/* ===========================
   WarehouseList - Scoped Styles
   Flat Industrial Minimal
   =========================== */

/* Page Container */
.page-container[b-2oln05mm9k] {
    max-width: 1200px;
    margin: 0 auto;
    padding: var(--space-6) var(--space-4);
}

/* Header */
.page-header[b-2oln05mm9k] {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    margin-bottom: var(--space-6);
    gap: var(--space-4);
}

.page-header-left[b-2oln05mm9k] {
    flex: 1;
}

.page-header-right[b-2oln05mm9k] {
    flex-shrink: 0;
}

.page-title[b-2oln05mm9k] {
    font-size: var(--font-size-2xl);
    font-weight: var(--font-weight-bold);
    color: var(--color-primary);
    display: flex;
    align-items: center;
    gap: var(--space-2);
    margin: 0;
}

.page-title svg[b-2oln05mm9k] {
    color: var(--color-primary);
    flex-shrink: 0;
}

.page-subtitle[b-2oln05mm9k] {
    color: var(--text-muted);
    font-size: var(--font-size-sm);
    margin: var(--space-1) 0 0 0;
}

/* Action Button */
.btn-action[b-2oln05mm9k] {
    display: inline-flex;
    align-items: center;
    gap: var(--space-2);
    padding: var(--space-2) var(--space-4);
    background-color: var(--color-action);
    color: var(--text-on-action);
    border: var(--border-width-thin) solid var(--color-action);
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-medium);
    text-decoration: none;
    cursor: pointer;
    transition: background-color var(--transition-fast) var(--transition-ease),
                box-shadow var(--transition-fast) var(--transition-ease);
}

.btn-action:hover[b-2oln05mm9k] {
    background-color: var(--color-action-hover);
    border-color: var(--color-action-hover);
    color: var(--text-on-action);
    text-decoration: none;
    box-shadow: var(--shadow-sm);
}

.btn-action:active[b-2oln05mm9k] {
    background-color: var(--color-action-active);
}

/* Alert Bars */
.alert-bar[b-2oln05mm9k] {
    display: flex;
    align-items: center;
    gap: var(--space-2);
    padding: var(--space-3) var(--space-4);
    margin-bottom: var(--space-4);
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-medium);
    border-left: var(--border-width-thick) solid;
}

.alert-bar-success[b-2oln05mm9k] {
    background-color: #edf7ed;
    border-left-color: var(--color-success);
    color: #1e4620;
}

.alert-bar-danger[b-2oln05mm9k] {
    background-color: #fdeded;
    border-left-color: var(--color-danger);
    color: #5f2120;
}

.alert-bar-close[b-2oln05mm9k] {
    margin-left: auto;
    background: none;
    border: none;
    font-size: var(--font-size-lg);
    cursor: pointer;
    color: inherit;
    opacity: 0.6;
    line-height: 1;
}

.alert-bar-close:hover[b-2oln05mm9k] {
    opacity: 1;
}

/* Search Bar */
.search-bar[b-2oln05mm9k] {
    display: flex;
    align-items: center;
    gap: var(--space-4);
    margin-bottom: var(--space-4);
    padding: var(--space-3) var(--space-4);
    background-color: var(--bg-secondary);
    border: var(--border-width-thin) solid var(--border-color-light);
}

.search-input-wrapper[b-2oln05mm9k] {
    display: flex;
    align-items: center;
    flex: 1;
    position: relative;
}

.search-icon[b-2oln05mm9k] {
    color: var(--text-muted);
    flex-shrink: 0;
    margin-right: var(--space-2);
}

.search-input[b-2oln05mm9k] {
    flex: 1;
    border: none;
    background: transparent;
    font-size: var(--font-size-sm);
    color: var(--color-gray-700);
    outline: none;
    padding: var(--space-1) 0;
}

.search-input[b-2oln05mm9k]::placeholder {
    color: var(--text-muted);
}

.search-clear[b-2oln05mm9k] {
    background: none;
    border: none;
    cursor: pointer;
    color: var(--text-muted);
    padding: var(--space-1);
    display: flex;
    align-items: center;
}

.search-clear:hover[b-2oln05mm9k] {
    color: var(--color-primary);
}

.search-count[b-2oln05mm9k] {
    flex-shrink: 0;
    font-size: var(--font-size-xs);
    color: var(--text-muted);
    font-weight: var(--font-weight-medium);
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

/* Loading / Empty States */
.loading-state[b-2oln05mm9k] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: var(--space-16) 0;
    color: var(--text-muted);
    gap: var(--space-4);
}

.empty-state[b-2oln05mm9k] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: var(--space-16) 0;
    color: var(--text-muted);
    gap: var(--space-3);
}

.empty-state svg[b-2oln05mm9k] {
    opacity: 0.4;
}

.empty-state-text[b-2oln05mm9k] {
    font-size: var(--font-size-base);
    margin: 0;
}

/* Contact List */
.contact-list[b-2oln05mm9k] {
    display: flex;
    flex-direction: column;
    border: var(--border-width-thin) solid var(--border-color-light);
}

/* Contact Row */
.contact-row[b-2oln05mm9k] {
    display: flex;
    align-items: center;
    gap: var(--space-4);
    padding: var(--space-4);
    border-bottom: var(--border-width-thin) solid var(--border-color-light);
    transition: background-color var(--transition-fast) var(--transition-ease);
}

.contact-row:last-child[b-2oln05mm9k] {
    border-bottom: none;
}

.contact-row:hover[b-2oln05mm9k] {
    background-color: rgba(11, 36, 62, 0.03);
}

/* Avatar */
.contact-avatar[b-2oln05mm9k] {
    flex-shrink: 0;
    width: 40px;
    height: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: var(--color-gray-100);
    color: var(--color-primary);
}

/* Contact Info */
.contact-info[b-2oln05mm9k] {
    flex: 1;
    min-width: 0;
}

.contact-name[b-2oln05mm9k] {
    font-size: var(--font-size-base);
    font-weight: var(--font-weight-semibold);
    color: var(--color-primary);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.contact-meta[b-2oln05mm9k] {
    display: flex;
    align-items: center;
    gap: var(--space-1);
    flex-wrap: wrap;
    font-size: var(--font-size-xs);
    color: var(--text-secondary);
    margin-top: 2px;
}

.contact-code[b-2oln05mm9k] {
    font-family: var(--font-mono);
    font-weight: var(--font-weight-medium);
    color: var(--color-primary);
    opacity: 0.7;
}

.meta-separator[b-2oln05mm9k] {
    color: var(--color-gray-300);
}

.contact-details[b-2oln05mm9k] {
    display: flex;
    align-items: center;
    gap: var(--space-4);
    margin-top: var(--space-1);
}

.contact-detail-item[b-2oln05mm9k] {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    font-size: var(--font-size-xs);
    color: var(--text-muted);
}

.contact-detail-item svg[b-2oln05mm9k] {
    flex-shrink: 0;
}

/* Badges */
.contact-badges[b-2oln05mm9k] {
    flex-shrink: 0;
    display: flex;
    gap: var(--space-2);
}

.badge[b-2oln05mm9k] {
    display: inline-flex;
    align-items: center;
    padding: 3px var(--space-2);
    font-size: var(--font-size-xs);
    font-weight: var(--font-weight-medium);
    letter-spacing: 0.3px;
    text-transform: uppercase;
}

.badge-primary[b-2oln05mm9k] {
    background-color: rgba(11, 36, 62, 0.1);
    color: var(--color-primary);
}

.badge-info[b-2oln05mm9k] {
    background-color: rgba(23, 162, 184, 0.1);
    color: var(--color-info);
}

.badge-danger[b-2oln05mm9k] {
    background-color: rgba(178, 34, 34, 0.1);
    color: var(--color-action);
}

/* Action Buttons */
.contact-actions[b-2oln05mm9k] {
    flex-shrink: 0;
    display: flex;
    align-items: center;
    gap: var(--space-1);
}

.btn-icon[b-2oln05mm9k] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 36px;
    background: none;
    border: var(--border-width-thin) solid transparent;
    cursor: pointer;
    color: var(--text-muted);
    text-decoration: none;
    transition: all var(--transition-fast) var(--transition-ease);
}

.btn-icon:hover[b-2oln05mm9k] {
    color: var(--color-primary);
    background-color: var(--color-gray-100);
    border-color: var(--border-color-light);
    text-decoration: none;
}

.btn-icon-danger:hover[b-2oln05mm9k] {
    color: var(--color-action);
    background-color: rgba(178, 34, 34, 0.06);
    border-color: rgba(178, 34, 34, 0.2);
}

.actions-separator[b-2oln05mm9k] {
    width: 1px;
    height: 20px;
    background-color: var(--border-color-light);
    margin: 0 var(--space-1);
}

/* Overlay & Dialog */
.overlay[b-2oln05mm9k] {
    position: fixed;
    inset: 0;
    background-color: rgba(0, 0, 0, 0.4);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: var(--z-modal-backdrop);
}

.confirm-dialog[b-2oln05mm9k] {
    background-color: var(--color-white);
    padding: var(--space-8);
    max-width: 420px;
    width: 90%;
    box-shadow: var(--shadow-xl);
    text-align: center;
    z-index: var(--z-modal);
}

.confirm-icon[b-2oln05mm9k] {
    color: var(--color-action);
    margin-bottom: var(--space-4);
}

.confirm-dialog h3[b-2oln05mm9k] {
    font-size: var(--font-size-lg);
    font-weight: var(--font-weight-semibold);
    color: var(--color-primary);
    margin: 0 0 var(--space-2) 0;
}

.confirm-dialog p[b-2oln05mm9k] {
    font-size: var(--font-size-sm);
    color: var(--text-secondary);
    margin: 0 0 var(--space-2) 0;
}

.confirm-warning[b-2oln05mm9k] {
    font-size: var(--font-size-xs) !important;
    color: var(--color-action) !important;
    font-weight: var(--font-weight-medium);
}

.confirm-actions[b-2oln05mm9k] {
    display: flex;
    gap: var(--space-3);
    justify-content: center;
    margin-top: var(--space-6);
}

.confirm-actions .btn[b-2oln05mm9k] {
    min-width: 100px;
    padding: var(--space-2) var(--space-4);
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-medium);
    cursor: pointer;
}

/* Outline Primary Button (used in confirm dialog) */
.btn-outline-primary[b-2oln05mm9k] {
    background: transparent;
    color: var(--color-primary);
    border: var(--border-width-thin) solid var(--color-primary);
}

.btn-outline-primary:hover[b-2oln05mm9k] {
    background-color: var(--color-primary);
    color: var(--text-on-primary);
}

/* Responsive */
@media (max-width: 768px) {
    .page-header[b-2oln05mm9k] {
        flex-direction: column;
        gap: var(--space-3);
    }

    .contact-row[b-2oln05mm9k] {
        flex-wrap: wrap;
    }

    .contact-badges[b-2oln05mm9k] {
        order: 5;
    }

    .contact-actions[b-2oln05mm9k] {
        order: 6;
        margin-left: auto;
    }

    .contact-details[b-2oln05mm9k] {
        flex-wrap: wrap;
    }
}
/* /Components/Pages/Webs/WebsOrderDetail.razor.rz.scp.css */
/* ===========================
   WebsOrderDetail - Scoped Styles
   Flat Industrial Minimal
   =========================== */

.page-container[b-5hf5lxm6ip] {
    max-width: 1400px;
    margin: 0 auto;
    padding: var(--space-6) var(--space-4);
}

/* Header */
.page-header[b-5hf5lxm6ip] {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    margin-bottom: var(--space-6);
    gap: var(--space-4);
}

.page-header-left[b-5hf5lxm6ip] {
    flex: 1;
}

.page-header-right[b-5hf5lxm6ip] {
    flex-shrink: 0;
    display: flex;
    align-items: center;
    gap: var(--space-3);
}

.back-link[b-5hf5lxm6ip] {
    display: inline-flex;
    align-items: center;
    gap: var(--space-1);
    font-size: var(--font-size-sm);
    color: var(--text-muted);
    text-decoration: none;
    margin-bottom: var(--space-2);
}

.back-link:hover[b-5hf5lxm6ip] {
    color: var(--color-primary);
}

.page-title[b-5hf5lxm6ip] {
    font-size: var(--font-size-2xl);
    font-weight: var(--font-weight-bold);
    color: var(--color-primary);
    display: flex;
    align-items: center;
    gap: var(--space-2);
    margin: 0;
}

.page-title svg[b-5hf5lxm6ip] {
    color: var(--color-primary);
    flex-shrink: 0;
}

/* Action Buttons */
.btn-action[b-5hf5lxm6ip] {
    display: inline-flex;
    align-items: center;
    gap: var(--space-2);
    padding: var(--space-2) var(--space-4);
    background-color: var(--color-action);
    color: var(--text-on-action);
    border: var(--border-width-thin) solid var(--color-action);
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-medium);
    text-decoration: none;
    cursor: pointer;
    transition: background-color var(--transition-fast) var(--transition-ease);
}

.btn-action:hover[b-5hf5lxm6ip] {
    background-color: var(--color-action-hover);
    border-color: var(--color-action-hover);
}

.btn-action-secondary[b-5hf5lxm6ip] {
    display: inline-flex;
    align-items: center;
    gap: var(--space-2);
    padding: var(--space-2) var(--space-4);
    background-color: var(--color-success);
    color: white;
    border: var(--border-width-thin) solid var(--color-success);
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-medium);
    cursor: pointer;
    transition: background-color var(--transition-fast) var(--transition-ease);
}

.btn-action-secondary:hover[b-5hf5lxm6ip] {
    opacity: 0.9;
}

/* Alert Bars */
.alert-bar[b-5hf5lxm6ip] {
    display: flex;
    align-items: center;
    gap: var(--space-2);
    padding: var(--space-3) var(--space-4);
    margin-bottom: var(--space-4);
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-medium);
    border-left: var(--border-width-thick) solid;
}

.alert-bar-success[b-5hf5lxm6ip] {
    background-color: #edf7ed;
    border-left-color: var(--color-success);
    color: #1e4620;
}

.alert-bar-danger[b-5hf5lxm6ip] {
    background-color: #fdeded;
    border-left-color: var(--color-danger);
    color: #5f2120;
}

.alert-bar-close[b-5hf5lxm6ip] {
    margin-left: auto;
    background: none;
    border: none;
    font-size: var(--font-size-lg);
    cursor: pointer;
    color: inherit;
    opacity: 0.6;
    line-height: 1;
}

.alert-bar-close:hover[b-5hf5lxm6ip] {
    opacity: 1;
}

/* Badges */
.badge[b-5hf5lxm6ip] {
    display: inline-flex;
    align-items: center;
    padding: 2px var(--space-2);
    font-size: var(--font-size-xs);
    font-weight: var(--font-weight-semibold);
    text-transform: uppercase;
    letter-spacing: 0.5px;
    white-space: nowrap;
}

.badge-lg[b-5hf5lxm6ip] {
    padding: var(--space-1) var(--space-3);
    font-size: var(--font-size-sm);
}

.badge-info[b-5hf5lxm6ip] {
    background-color: #e0f2fe;
    color: #0369a1;
}

.badge-warning[b-5hf5lxm6ip] {
    background-color: #fef3c7;
    color: #92400e;
}

.badge-primary[b-5hf5lxm6ip] {
    background-color: rgba(11, 36, 62, 0.1);
    color: var(--color-primary);
}

.badge-success[b-5hf5lxm6ip] {
    background-color: #dcfce7;
    color: #166534;
}

.badge-secondary[b-5hf5lxm6ip] {
    background-color: var(--color-gray-100);
    color: var(--text-secondary);
}

/* Loading / Empty States */
.loading-state[b-5hf5lxm6ip] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: var(--space-16) 0;
    color: var(--text-muted);
    gap: var(--space-4);
}

.empty-state[b-5hf5lxm6ip] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: var(--space-16) 0;
    color: var(--text-muted);
    gap: var(--space-3);
}

.empty-state-text[b-5hf5lxm6ip] {
    font-size: var(--font-size-base);
    margin: 0;
}

/* Info Card */
.info-card[b-5hf5lxm6ip] {
    padding: var(--space-4);
    margin-bottom: var(--space-4);
    background-color: var(--bg-secondary);
    border: var(--border-width-thin) solid var(--border-color-light);
}

.info-grid[b-5hf5lxm6ip] {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
    gap: var(--space-4);
}

.info-item[b-5hf5lxm6ip] {
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.info-label[b-5hf5lxm6ip] {
    font-size: var(--font-size-xs);
    color: var(--text-muted);
    font-weight: var(--font-weight-medium);
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.info-value[b-5hf5lxm6ip] {
    font-size: var(--font-size-sm);
    color: var(--color-primary);
    font-weight: var(--font-weight-medium);
}

/* Info Separator + Time Gauge */
.info-separator[b-5hf5lxm6ip] {
    height: 1px;
    background-color: var(--border-color-light);
    margin: var(--space-4) 0;
}

.time-gauge-section[b-5hf5lxm6ip] {
    display: flex;
    flex-direction: column;
    gap: var(--space-2);
}

.time-gauge-header[b-5hf5lxm6ip] {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.time-gauge-label[b-5hf5lxm6ip] {
    display: inline-flex;
    align-items: center;
    gap: var(--space-1);
    font-size: var(--font-size-xs);
    font-weight: var(--font-weight-semibold);
    color: var(--text-secondary);
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.time-gauge-remaining[b-5hf5lxm6ip] {
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-bold);
    font-family: var(--font-mono);
}

.time-gauge-remaining.time-ok[b-5hf5lxm6ip] {
    color: var(--color-success, #16a34a);
}

.time-gauge-remaining.time-warning[b-5hf5lxm6ip] {
    color: #d97706;
}

.time-gauge-remaining.time-critical[b-5hf5lxm6ip] {
    color: #dc2626;
}

.time-gauge-remaining.time-expired[b-5hf5lxm6ip] {
    color: #991b1b;
}

.time-gauge-track[b-5hf5lxm6ip] {
    width: 100%;
    height: 8px;
    background-color: var(--color-gray-100, #f1f5f9);
    border-radius: 4px;
    overflow: hidden;
}

.time-gauge-fill[b-5hf5lxm6ip] {
    height: 100%;
    border-radius: 4px;
    transition: width 0.6s ease;
    min-width: 2px;
}

.time-gauge-fill.gauge-ok[b-5hf5lxm6ip] {
    background-color: var(--color-success, #16a34a);
}

.time-gauge-fill.gauge-warning[b-5hf5lxm6ip] {
    background-color: #d97706;
}

.time-gauge-fill.gauge-critical[b-5hf5lxm6ip] {
    background-color: #dc2626;
}

.time-gauge-fill.gauge-expired[b-5hf5lxm6ip] {
    background-color: #991b1b;
}

.time-gauge-footer[b-5hf5lxm6ip] {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.time-gauge-date[b-5hf5lxm6ip] {
    font-size: var(--font-size-xs);
    color: var(--text-muted);
    font-family: var(--font-mono);
}

.time-gauge-percent[b-5hf5lxm6ip] {
    font-size: var(--font-size-xs);
    color: var(--text-secondary);
    font-weight: var(--font-weight-medium);
}

/* Department Tabs */
.department-tabs[b-5hf5lxm6ip] {
    display: flex;
    gap: var(--space-1);
    margin-bottom: var(--space-4);
    flex-wrap: wrap;
}

.dept-tab[b-5hf5lxm6ip] {
    padding: var(--space-2) var(--space-3);
    border: var(--border-width-thin) solid var(--border-color-light);
    background: var(--bg-primary);
    color: var(--text-secondary);
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-medium);
    cursor: pointer;
    transition: all var(--transition-fast) var(--transition-ease);
}

.dept-tab:hover[b-5hf5lxm6ip] {
    background-color: var(--color-gray-100);
}

.dept-tab.active[b-5hf5lxm6ip] {
    background-color: var(--color-primary);
    color: white;
    border-color: var(--color-primary);
}

/* Search Bar */
.search-bar[b-5hf5lxm6ip] {
    display: flex;
    align-items: center;
    gap: var(--space-2);
    margin-bottom: var(--space-3);
    padding: var(--space-2) var(--space-3);
    border: var(--border-width-thin) solid var(--border-color-light);
    background: var(--bg-primary);
    color: var(--text-muted);
}

.search-input[b-5hf5lxm6ip] {
    flex: 1;
    border: none;
    outline: none;
    font-size: var(--font-size-sm);
    background: transparent;
    color: var(--text-primary);
}

.search-input[b-5hf5lxm6ip]::placeholder {
    color: var(--text-muted);
}

.search-clear[b-5hf5lxm6ip] {
    background: none;
    border: none;
    cursor: pointer;
    color: var(--text-muted);
    padding: var(--space-1);
    display: inline-flex;
    align-items: center;
}

.search-clear:hover[b-5hf5lxm6ip] {
    color: var(--color-primary);
}

.search-divider[b-5hf5lxm6ip] {
    width: 1px;
    height: 20px;
    background-color: var(--border-color-light);
    flex-shrink: 0;
}

.toggle-filter[b-5hf5lxm6ip] {
    display: flex;
    align-items: center;
    gap: var(--space-2);
    cursor: pointer;
    flex-shrink: 0;
    white-space: nowrap;
}

.toggle-label[b-5hf5lxm6ip] {
    font-size: var(--font-size-xs);
    color: var(--text-secondary);
    font-weight: var(--font-weight-medium);
}

.toggle-switch[b-5hf5lxm6ip] {
    position: relative;
    display: inline-block;
    width: 36px;
    height: 20px;
    flex-shrink: 0;
}

.toggle-switch input[b-5hf5lxm6ip] {
    opacity: 0;
    width: 0;
    height: 0;
}

.toggle-slider[b-5hf5lxm6ip] {
    position: absolute;
    inset: 0;
    background-color: var(--border-color-light);
    border-radius: 10px;
    transition: background-color var(--transition-fast) var(--transition-ease);
    cursor: pointer;
}

.toggle-slider[b-5hf5lxm6ip]::before {
    content: "";
    position: absolute;
    width: 14px;
    height: 14px;
    left: 3px;
    bottom: 3px;
    background-color: white;
    border-radius: 50%;
    transition: transform var(--transition-fast) var(--transition-ease);
}

.toggle-switch input:checked + .toggle-slider[b-5hf5lxm6ip] {
    background-color: var(--color-primary);
}

.toggle-switch input:checked + .toggle-slider[b-5hf5lxm6ip]::before {
    transform: translateX(16px);
}

/* Rows Table */
.rows-table-container[b-5hf5lxm6ip] {
    border: var(--border-width-thin) solid var(--border-color-light);
    overflow-x: auto;
}

.rows-table[b-5hf5lxm6ip] {
    width: 100%;
    border-collapse: collapse;
    font-size: var(--font-size-sm);
}

.rows-table thead[b-5hf5lxm6ip] {
    background-color: var(--bg-secondary);
}

.rows-table th[b-5hf5lxm6ip] {
    padding: var(--space-2) var(--space-3);
    text-align: left;
    font-weight: var(--font-weight-semibold);
    color: var(--text-secondary);
    font-size: var(--font-size-xs);
    text-transform: uppercase;
    letter-spacing: 0.5px;
    white-space: nowrap;
    border-bottom: var(--border-width-thin) solid var(--border-color-light);
}

.rows-table td[b-5hf5lxm6ip] {
    padding: var(--space-2) var(--space-3);
    vertical-align: middle;
}

/* Two-row layout: description row + data row */
.row-desc td[b-5hf5lxm6ip] {
    padding-bottom: 0;
    border-bottom: none;
}

.row-data td[b-5hf5lxm6ip] {
    padding-top: var(--space-1);
    border-bottom: var(--border-width-thin) solid var(--border-color-light);
}

.col-row[b-5hf5lxm6ip] {
    width: 40px;
    text-align: center;
    vertical-align: middle;
    font-weight: var(--font-weight-semibold);
    color: var(--text-muted);
    border-right: var(--border-width-thin) solid var(--border-color-light);
    border-bottom: var(--border-width-thin) solid var(--border-color-light);
}

.col-desc[b-5hf5lxm6ip] {
    padding: var(--space-2) var(--space-3);
}

/* Hover and state styles apply to both row-desc and row-data */
.rows-table tbody tr.row-editable[b-5hf5lxm6ip] {
    cursor: pointer;
}

.rows-table tbody tr.row-desc.row-editable:hover[b-5hf5lxm6ip],
.rows-table tbody tr.row-data.row-editable:hover[b-5hf5lxm6ip] {
    background-color: rgba(11, 36, 62, 0.04);
}

.rows-table tbody tr.row-desc.row-editing[b-5hf5lxm6ip],
.rows-table tbody tr.row-data.row-editing[b-5hf5lxm6ip] {
    background-color: rgba(11, 36, 62, 0.06);
    cursor: default;
}

.rows-table tbody tr.row-excluded[b-5hf5lxm6ip] {
    opacity: 0.4;
    cursor: default;
}

.rows-table tbody tr.row-data.row-excluded td[b-5hf5lxm6ip] {
    text-decoration: line-through;
}

.text-right[b-5hf5lxm6ip] {
    text-align: right !important;
}

/* Column widths */
.col-article-code[b-5hf5lxm6ip] { width: 120px; }
.col-um[b-5hf5lxm6ip] { width: 50px; }
.col-stock[b-5hf5lxm6ip] { width: 80px; }
.col-proposed[b-5hf5lxm6ip] { width: 70px; }
.col-min[b-5hf5lxm6ip] { width: 70px; }
.col-parcels[b-5hf5lxm6ip] { width: 80px; }
.col-pieces[b-5hf5lxm6ip] { width: 70px; }
.col-pxc[b-5hf5lxm6ip] { width: 70px; }
.col-actions[b-5hf5lxm6ip] { width: 70px; white-space: nowrap; }

/* Article cell */
.article-code[b-5hf5lxm6ip] {
    font-family: var(--font-mono);
    font-weight: var(--font-weight-medium);
    font-size: var(--font-size-xs);
    color: var(--text-secondary);
}

.article-desc[b-5hf5lxm6ip] {
    font-size: var(--font-size-sm);
    color: var(--color-primary);
    font-weight: var(--font-weight-bold);
}

/* Edit Input */
.stepper-group[b-5hf5lxm6ip] {
    display: inline-flex;
    align-items: center;
    gap: 0;
}

.stepper-btn[b-5hf5lxm6ip] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 32px;
    height: 32px;
    border: var(--border-width-thin) solid var(--color-primary);
    background: var(--bg-secondary);
    color: var(--color-primary);
    cursor: pointer;
    padding: 0;
    flex-shrink: 0;
}

.stepper-btn:first-child[b-5hf5lxm6ip] {
    border-radius: var(--border-radius-sm) 0 0 var(--border-radius-sm);
    border-right: none;
}

.stepper-btn:last-child[b-5hf5lxm6ip] {
    border-radius: 0 var(--border-radius-sm) var(--border-radius-sm) 0;
    border-left: none;
}

.stepper-btn:active[b-5hf5lxm6ip] {
    background: var(--color-primary);
    color: white;
}

.edit-input[b-5hf5lxm6ip] {
    width: 56px;
    height: 32px;
    padding: 2px var(--space-1);
    border: var(--border-width-thin) solid var(--color-primary);
    border-radius: 0;
    font-size: var(--font-size-sm);
    text-align: center;
    background: white;
    -moz-appearance: textfield;
}

.edit-input[b-5hf5lxm6ip]::-webkit-inner-spin-button,
.edit-input[b-5hf5lxm6ip]::-webkit-outer-spin-button {
    -webkit-appearance: none;
    margin: 0;
}

.edit-input:focus[b-5hf5lxm6ip] {
    outline: none;
    box-shadow: 0 0 0 2px rgba(11, 36, 62, 0.15);
}

.calc-value[b-5hf5lxm6ip] {
    font-weight: 600;
    color: var(--color-primary);
}

/* Icon Buttons */
.btn-icon[b-5hf5lxm6ip] {
    background: none;
    border: none;
    cursor: pointer;
    color: var(--text-muted);
    padding: var(--space-1);
    display: inline-flex;
    align-items: center;
    transition: color var(--transition-fast) var(--transition-ease);
}

.btn-icon:hover[b-5hf5lxm6ip] {
    color: var(--color-primary);
}

.btn-icon-success:hover[b-5hf5lxm6ip] {
    color: var(--color-success);
}

/* ===========================
   Responsive - Progressive column hiding
   Two-row layout: description always visible full-width.
   Data row hides less important columns progressively.
   Priority (always visible): # → Colli → Pezzi → Actions
   =========================== */

/* Medium screens: hide UM, Giacenza, Proposti, Scorta Min */
@media (max-width: 1024px) {
    .col-um[b-5hf5lxm6ip],
    .col-stock[b-5hf5lxm6ip],
    .col-proposed[b-5hf5lxm6ip],
    .col-min[b-5hf5lxm6ip] {
        display: none;
    }
}

/* Small screens: also hide Pz/Collo */
@media (max-width: 768px) {
    .col-pxc[b-5hf5lxm6ip] {
        display: none;
    }

    .rows-table th[b-5hf5lxm6ip],
    .rows-table td[b-5hf5lxm6ip] {
        padding: var(--space-1) var(--space-2);
    }

    .stepper-btn[b-5hf5lxm6ip] {
        width: 28px;
        height: 28px;
    }

    .edit-input[b-5hf5lxm6ip] {
        width: 46px;
        height: 28px;
        font-size: var(--font-size-xs);
    }
}

/* Extra small: compact */
@media (max-width: 480px) {
    .col-article-code[b-5hf5lxm6ip] {
        display: none;
    }

    .article-desc[b-5hf5lxm6ip] {
        font-size: var(--font-size-xs);
    }

    .col-row[b-5hf5lxm6ip] {
        width: 30px;
    }

    .rows-table th[b-5hf5lxm6ip],
    .rows-table td[b-5hf5lxm6ip] {
        padding: var(--space-1);
    }

    .col-actions[b-5hf5lxm6ip] {
        width: 60px;
    }
}
/* /Components/Pages/Webs/WebsOrderList.razor.rz.scp.css */
/* ===========================
   WebsOrderList - Scoped Styles
   Flat Industrial Minimal
   =========================== */

/* Page Container */
.page-container[b-v8r9ceb1vz] {
    max-width: 1200px;
    margin: 0 auto;
    padding: var(--space-6) var(--space-4);
}

/* Header */
.page-header[b-v8r9ceb1vz] {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    margin-bottom: var(--space-6);
    gap: var(--space-4);
}

.page-header-left[b-v8r9ceb1vz] {
    flex: 1;
}

.page-title[b-v8r9ceb1vz] {
    font-size: var(--font-size-2xl);
    font-weight: var(--font-weight-bold);
    color: var(--color-primary);
    display: flex;
    align-items: center;
    gap: var(--space-2);
    margin: 0;
}

.page-title svg[b-v8r9ceb1vz] {
    color: var(--color-primary);
    flex-shrink: 0;
}

.page-subtitle[b-v8r9ceb1vz] {
    color: var(--text-muted);
    font-size: var(--font-size-sm);
    margin: var(--space-1) 0 0 0;
}

/* Alert Bars */
.alert-bar[b-v8r9ceb1vz] {
    display: flex;
    align-items: center;
    gap: var(--space-2);
    padding: var(--space-3) var(--space-4);
    margin-bottom: var(--space-4);
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-medium);
    border-left: var(--border-width-thick) solid;
}

.alert-bar-success[b-v8r9ceb1vz] {
    background-color: #edf7ed;
    border-left-color: var(--color-success);
    color: #1e4620;
}

.alert-bar-danger[b-v8r9ceb1vz] {
    background-color: #fdeded;
    border-left-color: var(--color-danger);
    color: #5f2120;
}

.alert-bar-close[b-v8r9ceb1vz] {
    margin-left: auto;
    background: none;
    border: none;
    font-size: var(--font-size-lg);
    cursor: pointer;
    color: inherit;
    opacity: 0.6;
    line-height: 1;
}

.alert-bar-close:hover[b-v8r9ceb1vz] {
    opacity: 1;
}

/* Filter Bar */
.filter-bar[b-v8r9ceb1vz] {
    display: flex;
    align-items: center;
    gap: var(--space-4);
    margin-bottom: var(--space-4);
    padding: var(--space-3) var(--space-4);
    background-color: var(--bg-secondary);
    border: var(--border-width-thin) solid var(--border-color-light);
    flex-wrap: wrap;
}

.status-filters[b-v8r9ceb1vz] {
    display: flex;
    gap: var(--space-1);
    flex-shrink: 0;
}

.status-btn[b-v8r9ceb1vz] {
    padding: var(--space-1) var(--space-3);
    border: var(--border-width-thin) solid var(--border-color-light);
    background: var(--bg-primary);
    color: var(--text-secondary);
    font-size: var(--font-size-xs);
    font-weight: var(--font-weight-medium);
    cursor: pointer;
    transition: all var(--transition-fast) var(--transition-ease);
}

.status-btn:hover[b-v8r9ceb1vz] {
    background-color: var(--color-gray-100);
}

.status-btn.active[b-v8r9ceb1vz] {
    background-color: var(--color-primary);
    color: white;
    border-color: var(--color-primary);
}

/* Search */
.search-input-wrapper[b-v8r9ceb1vz] {
    display: flex;
    align-items: center;
    flex: 1;
    min-width: 200px;
}

.search-icon[b-v8r9ceb1vz] {
    color: var(--text-muted);
    flex-shrink: 0;
    margin-right: var(--space-2);
}

.search-input[b-v8r9ceb1vz] {
    flex: 1;
    border: none;
    background: transparent;
    font-size: var(--font-size-sm);
    color: var(--color-gray-700);
    outline: none;
    padding: var(--space-1) 0;
}

.search-input[b-v8r9ceb1vz]::placeholder {
    color: var(--text-muted);
}

.search-clear[b-v8r9ceb1vz] {
    background: none;
    border: none;
    cursor: pointer;
    color: var(--text-muted);
    padding: var(--space-1);
    display: flex;
    align-items: center;
}

.search-clear:hover[b-v8r9ceb1vz] {
    color: var(--color-primary);
}

.search-count[b-v8r9ceb1vz] {
    flex-shrink: 0;
    font-size: var(--font-size-xs);
    color: var(--text-muted);
    font-weight: var(--font-weight-medium);
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

/* Loading / Empty States */
.loading-state[b-v8r9ceb1vz] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: var(--space-16) 0;
    color: var(--text-muted);
    gap: var(--space-4);
}

.empty-state[b-v8r9ceb1vz] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: var(--space-16) 0;
    color: var(--text-muted);
    gap: var(--space-3);
}

.empty-state svg[b-v8r9ceb1vz] {
    opacity: 0.4;
}

.empty-state-text[b-v8r9ceb1vz] {
    font-size: var(--font-size-base);
    margin: 0;
}

/* Order List */
.order-list[b-v8r9ceb1vz] {
    display: flex;
    flex-direction: column;
    border: var(--border-width-thin) solid var(--border-color-light);
}

/* Order Row */
.order-row[b-v8r9ceb1vz] {
    display: flex;
    align-items: center;
    gap: var(--space-4);
    padding: var(--space-4);
    border-bottom: var(--border-width-thin) solid var(--border-color-light);
    transition: background-color var(--transition-fast) var(--transition-ease);
    text-decoration: none;
    color: inherit;
    cursor: pointer;
}

.order-row:last-child[b-v8r9ceb1vz] {
    border-bottom: none;
}

.order-row:hover[b-v8r9ceb1vz] {
    background-color: rgba(11, 36, 62, 0.03);
    text-decoration: none;
    color: inherit;
}

/* Status Indicator */
.order-status-indicator[b-v8r9ceb1vz] {
    flex-shrink: 0;
    width: 4px;
    height: 48px;
    border-radius: 2px;
}

.order-status-indicator.status-new[b-v8r9ceb1vz] {
    background-color: var(--color-info, #0ea5e9);
}

.order-status-indicator.status-active[b-v8r9ceb1vz] {
    background-color: var(--color-warning, #f59e0b);
}

.order-status-indicator.status-sent[b-v8r9ceb1vz] {
    background-color: var(--color-primary);
}

.order-status-indicator.status-confirmed[b-v8r9ceb1vz] {
    background-color: var(--color-success);
}

/* Order Info */
.order-info[b-v8r9ceb1vz] {
    flex: 1;
    min-width: 0;
}

.order-customer[b-v8r9ceb1vz] {
    font-size: var(--font-size-base);
    font-weight: var(--font-weight-semibold);
    color: var(--color-primary);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.order-meta[b-v8r9ceb1vz] {
    display: flex;
    align-items: center;
    gap: var(--space-1);
    flex-wrap: wrap;
    font-size: var(--font-size-xs);
    color: var(--text-secondary);
    margin-top: 2px;
}

.order-code[b-v8r9ceb1vz] {
    font-family: var(--font-mono);
    font-weight: var(--font-weight-medium);
    color: var(--color-primary);
    opacity: 0.7;
}

.meta-separator[b-v8r9ceb1vz] {
    color: var(--color-gray-300);
}

/* Order Dates */
.order-dates[b-v8r9ceb1vz] {
    flex-shrink: 0;
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.order-date-item[b-v8r9ceb1vz] {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    font-size: var(--font-size-xs);
    color: var(--text-muted);
}

.order-date-item svg[b-v8r9ceb1vz] {
    flex-shrink: 0;
}

/* Badges */
.order-badges[b-v8r9ceb1vz] {
    flex-shrink: 0;
}

.badge[b-v8r9ceb1vz] {
    display: inline-flex;
    align-items: center;
    padding: 2px var(--space-2);
    font-size: var(--font-size-xs);
    font-weight: var(--font-weight-semibold);
    text-transform: uppercase;
    letter-spacing: 0.5px;
    white-space: nowrap;
}

.badge-info[b-v8r9ceb1vz] {
    background-color: #e0f2fe;
    color: #0369a1;
}

.badge-warning[b-v8r9ceb1vz] {
    background-color: #fef3c7;
    color: #92400e;
}

.badge-primary[b-v8r9ceb1vz] {
    background-color: rgba(11, 36, 62, 0.1);
    color: var(--color-primary);
}

.badge-success[b-v8r9ceb1vz] {
    background-color: #dcfce7;
    color: #166534;
}

.badge-secondary[b-v8r9ceb1vz] {
    background-color: var(--color-gray-100);
    color: var(--text-secondary);
}

/* Action Icon */
.order-action-icon[b-v8r9ceb1vz] {
    flex-shrink: 0;
    color: var(--text-muted);
    opacity: 0.4;
    transition: opacity var(--transition-fast) var(--transition-ease);
}

.order-row:hover .order-action-icon[b-v8r9ceb1vz] {
    opacity: 1;
    color: var(--color-primary);
}
/* /Components/Shared/AmountField.razor.rz.scp.css */
/* AmountField - Scoped Styles */

.form-group[b-jo8j0b00sc] {
    display: flex;
    flex-direction: column;
}

.form-label[b-jo8j0b00sc] {
    font-size: var(--font-size-xs);
    font-weight: var(--font-weight-medium);
    color: var(--text-secondary);
    margin-bottom: var(--space-1);
}

.amount-input-wrapper[b-jo8j0b00sc] {
    position: relative;
    display: flex;
    align-items: stretch;
}

.amount-input[b-jo8j0b00sc] {
    flex: 1;
    text-align: right;
    font-family: var(--font-mono);
    letter-spacing: 0.3px;
}

.amount-input.form-control-readonly[b-jo8j0b00sc] {
    background-color: var(--color-gray-50);
    color: var(--color-gray-700);
    cursor: default;
}

.amount-input:focus[b-jo8j0b00sc] {
    border-color: var(--color-primary);
    outline: var(--border-width-medium) solid var(--color-primary);
    outline-offset: -1px;
    z-index: 1;
}

.amount-decimals-hint[b-jo8j0b00sc] {
    position: absolute;
    right: var(--space-2);
    top: 50%;
    transform: translateY(-50%);
    font-size: var(--font-size-xs);
    color: var(--text-muted);
    pointer-events: none;
    font-family: var(--font-mono);
    opacity: 0.5;
    padding: 1px var(--space-1);
    background-color: var(--color-gray-100);
    border-radius: 2px;
}

/* When hint is visible, add right padding to input to avoid overlap */
.amount-input-wrapper .amount-input[b-jo8j0b00sc] {
    padding-right: calc(var(--space-2) + 3.5em);
}
/* /Components/Shared/DateField.razor.rz.scp.css */
/* DateField - Scoped Styles */

.form-group[b-vhx0ontkxb] {
    display: flex;
    flex-direction: column;
    max-width: 180px;
}

.form-label[b-vhx0ontkxb] {
    font-size: var(--font-size-xs);
    font-weight: var(--font-weight-medium);
    color: var(--text-secondary);
    margin-bottom: var(--space-1);
}

.date-input-wrapper[b-vhx0ontkxb] {
    position: relative;
    display: flex;
    align-items: stretch;
}

.date-icon[b-vhx0ontkxb] {
    position: absolute;
    left: var(--space-2);
    top: 50%;
    transform: translateY(-50%);
    color: var(--text-muted);
    pointer-events: none;
    display: flex;
    align-items: center;
}

.date-input[b-vhx0ontkxb] {
    flex: 1;
    padding-left: calc(var(--space-2) + 18px + var(--space-2));
    padding-right: calc(var(--space-2) + 32px + var(--space-1));
}

.date-input.form-control-readonly
    background-color: var(--color-gray-50);
    color: var(--color-gray-700);
    cursor: default;[b-vhx0ontkxb]
}

.date-input:focus[b-vhx0ontkxb] {
    border-color: var(--color-primary);
    outline: var(--border-width-medium) solid var(--color-primary);
    outline-offset: -1px;
    z-index: 1;
}

.date-picker-btn[b-vhx0ontkxb] {
    position: absolute;
    right: 1px;
    top: 1px;
    bottom: 1px;
    width: 32px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: var(--color-gray-50);
    border: none;
    border-left: 1px solid var(--color-gray-200);
    border-radius: 0 var(--border-radius) var(--border-radius) 0;
    color: var(--text-muted);
    cursor: pointer;
    padding: 0;
    transition: background-color 0.15s ease, color 0.15s ease;
}

.date-picker-btn:hover[b-vhx0ontkxb] {
    background: var(--color-gray-100);
    color: var(--color-primary);
}

.date-picker-btn:active[b-vhx0ontkxb] {
    background: var(--color-gray-200);
}

.date-picker-hidden[b-vhx0ontkxb] {
    position: absolute;
    width: 0;
    height: 0;
    opacity: 0;
    overflow: hidden;
    pointer-events: none;
    right: 0;
    bottom: 0;
}
/* /Components/Shared/LookupField.razor.rz.scp.css */
/* LookupField - Scoped Styles */

.input-with-lookup[b-9vx0twokyo] {
    display: flex;
    align-items: stretch;
}

.input-with-lookup .form-control[b-9vx0twokyo] {
    flex: 1;
    border-right: none;
}

.input-with-lookup .form-control-readonly[b-9vx0twokyo] {
    background-color: var(--color-gray-50);
    color: var(--color-gray-700);
    cursor: default;
}

.input-with-lookup .form-control:focus[b-9vx0twokyo] {
    border-color: var(--color-primary);
    z-index: 1;
}

.btn-lookup[b-9vx0twokyo] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 38px;
    border: var(--border-width-thin) solid var(--border-color-light);
    background-color: var(--color-gray-50);
    color: var(--text-muted);
    cursor: pointer;
    flex-shrink: 0;
    transition: all var(--transition-fast) var(--transition-ease);
}

.btn-lookup:hover[b-9vx0twokyo] {
    background-color: var(--color-primary);
    border-color: var(--color-primary);
    color: var(--color-white);
}

.lookup-hint[b-9vx0twokyo] {
    font-size: var(--font-size-xs);
    color: var(--text-muted);
    margin-top: 2px;
    font-family: var(--font-mono);
    letter-spacing: 0.3px;
}

/* Form integration */
.form-group[b-9vx0twokyo] {
    display: flex;
    flex-direction: column;
}

.form-label[b-9vx0twokyo] {
    font-size: var(--font-size-xs);
    font-weight: var(--font-weight-medium);
    color: var(--text-secondary);
    text-transform: uppercase;
    letter-spacing: 0.3px;
    margin-bottom: var(--space-1);
}

.form-control[b-9vx0twokyo] {
    padding: var(--space-2) var(--space-3);
    font-size: var(--font-size-sm);
    color: var(--color-gray-700);
    border: var(--border-width-thin) solid var(--border-color-light);
    background-color: var(--color-white);
    transition: border-color var(--transition-fast) var(--transition-ease);
}
/* /Components/Shared/PercentageField.razor.rz.scp.css */
/* PercentageField - Scoped Styles */

.form-group[b-3ze2pfdik3] {
    display: flex;
    flex-direction: column;
}

.form-label[b-3ze2pfdik3] {
    font-size: var(--font-size-xs);
    font-weight: var(--font-weight-medium);
    color: var(--text-secondary);
    margin-bottom: var(--space-1);
}

.percentage-input-wrapper[b-3ze2pfdik3] {
    position: relative;
    display: flex;
    align-items: stretch;
}

.percentage-input[b-3ze2pfdik3] {
    flex: 1;
    text-align: right;
    font-family: var(--font-mono);
    letter-spacing: 0.3px;
    padding-right: calc(var(--space-2) + 1.8em);
}

.percentage-input.form-control-readonly[b-3ze2pfdik3] {
    background-color: var(--color-gray-50);
    color: var(--color-gray-700);
    cursor: default;
}

.percentage-input:focus[b-3ze2pfdik3] {
    border-color: var(--color-primary);
    outline: var(--border-width-medium) solid var(--color-primary);
    outline-offset: -1px;
    z-index: 1;
}

.percentage-symbol[b-3ze2pfdik3] {
    position: absolute;
    right: var(--space-2);
    top: 50%;
    transform: translateY(-50%);
    font-size: var(--font-size-sm);
    color: var(--text-muted);
    pointer-events: none;
    font-family: var(--font-mono);
    font-weight: 600;
}
/* /Components/Shared/PriceField.razor.rz.scp.css */
/* PriceField - Scoped Styles */

.form-group[b-wqncsuvmtc] {
    display: flex;
    flex-direction: column;
}

.form-label[b-wqncsuvmtc] {
    font-size: var(--font-size-xs);
    font-weight: var(--font-weight-medium);
    color: var(--text-secondary);
    margin-bottom: var(--space-1);
}

.price-input-wrapper[b-wqncsuvmtc] {
    position: relative;
    display: flex;
    align-items: stretch;
}

.price-input[b-wqncsuvmtc] {
    flex: 1;
    text-align: right;
    font-family: var(--font-mono);
    letter-spacing: 0.3px;
}

.price-input.form-control-readonly[b-wqncsuvmtc] {
    background-color: var(--color-gray-50);
    color: var(--color-gray-700);
    cursor: default;
}

.price-input:focus[b-wqncsuvmtc] {
    border-color: var(--color-primary);
    outline: var(--border-width-medium) solid var(--color-primary);
    outline-offset: -1px;
    z-index: 1;
}

.price-decimals-hint[b-wqncsuvmtc] {
    position: absolute;
    right: var(--space-2);
    top: 50%;
    transform: translateY(-50%);
    font-size: var(--font-size-xs);
    color: var(--text-muted);
    pointer-events: none;
    font-family: var(--font-mono);
    opacity: 0.5;
    padding: 1px var(--space-1);
    background-color: var(--color-gray-100);
    border-radius: 2px;
}

/* When hint is visible, add right padding to input to avoid overlap */
.price-input-wrapper .price-input[b-wqncsuvmtc] {
    padding-right: calc(var(--space-2) + 3.5em);
}
/* /Components/Shared/QuantityField.razor.rz.scp.css */
/* QuantityField - Scoped Styles */

.form-group[b-eqyg8tn0q5] {
    display: flex;
    flex-direction: column;
}

.form-label[b-eqyg8tn0q5] {
    font-size: var(--font-size-xs);
    font-weight: var(--font-weight-medium);
    color: var(--text-secondary);
    margin-bottom: var(--space-1);
}

.quantity-input-wrapper[b-eqyg8tn0q5] {
    position: relative;
    display: flex;
    align-items: stretch;
}

.quantity-input[b-eqyg8tn0q5] {
    flex: 1;
    text-align: right;
    font-family: var(--font-mono);
    letter-spacing: 0.3px;
}

.quantity-input.form-control-readonly[b-eqyg8tn0q5] {
    background-color: var(--color-gray-50);
    color: var(--color-gray-700);
    cursor: default;
}

.quantity-input:focus[b-eqyg8tn0q5] {
    border-color: var(--color-primary);
    outline: var(--border-width-medium) solid var(--color-primary);
    outline-offset: -1px;
    z-index: 1;
}

.quantity-decimals-hint[b-eqyg8tn0q5] {
    position: absolute;
    right: var(--space-2);
    top: 50%;
    transform: translateY(-50%);
    font-size: var(--font-size-xs);
    color: var(--text-muted);
    pointer-events: none;
    font-family: var(--font-mono);
    opacity: 0.5;
    padding: 1px var(--space-1);
    background-color: var(--color-gray-100);
    border-radius: 2px;
}

/* When hint is visible, add right padding to input to avoid overlap */
.quantity-input-wrapper .quantity-input[b-eqyg8tn0q5] {
    padding-right: calc(var(--space-2) + 3.5em);
}
/* /Components/Shared/ToggleSwitch.razor.rz.scp.css */
/* ===========================
   ToggleSwitch - Shared Scoped Styles
   Flat Industrial Minimal
   =========================== */

.toggle-switch[b-jl6ayj5yw1] {
    display: flex;
    align-items: center;
    gap: var(--space-3);
    cursor: pointer;
    padding: var(--space-2) 0;
    user-select: none;
}

.toggle-switch-disabled[b-jl6ayj5yw1] {
    opacity: 0.5;
    cursor: not-allowed;
}

.toggle-switch-input[b-jl6ayj5yw1] {
    position: absolute;
    opacity: 0;
    width: 0;
    height: 0;
    pointer-events: none;
}

/* Slider track */
.toggle-switch-slider[b-jl6ayj5yw1] {
    position: relative;
    width: 36px;
    height: 20px;
    background-color: var(--color-gray-300);
    border-radius: 10px !important;
    flex-shrink: 0;
    transition: background-color var(--transition-fast) var(--transition-ease);
}

/* Slider knob */
.toggle-switch-slider[b-jl6ayj5yw1]::after {
    content: '';
    position: absolute;
    top: 2px;
    left: 2px;
    width: 16px;
    height: 16px;
    background-color: var(--color-white);
    border-radius: 50% !important;
    transition: transform var(--transition-fast) var(--transition-ease);
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.15);
}

/* Active state */
.toggle-switch-input:checked + .toggle-switch-slider[b-jl6ayj5yw1] {
    background-color: var(--color-primary);
}

.toggle-switch-input:checked + .toggle-switch-slider[b-jl6ayj5yw1]::after {
    transform: translateX(16px);
}

/* Focus ring */
.toggle-switch-input:focus-visible + .toggle-switch-slider[b-jl6ayj5yw1] {
    outline: 2px solid var(--color-primary);
    outline-offset: 2px;
}

/* Label text */
.toggle-switch-label[b-jl6ayj5yw1] {
    font-size: var(--font-size-sm);
    color: var(--color-gray-700);
    line-height: 1.3;
}